.vue-tel-input[data-v-6d0f6b4a] {
  background-color: var(--vti-bg-color, #fff) !important; 
  color: var(--vti-text-color, #000) !important; 
  border-color: var(--vti-border-color, #ccc) !important;
}
.vue-tel-input .vti__input[data-v-6d0f6b4a] {
  background-color: var(--vti-bg-color, #fff) !important;
  color: var(--vti-text-color, #000) !important;
  border-color: var(--vti-border-color, #ccc) !important;
}
.vue-tel-input .vti__dropdown[data-v-6d0f6b4a] {
  background-color: var(--vti-bg-color, #fff) !important;
  color: var(--vti-text-color, #000) !important;
  border-color: var(--vti-border-color, #ccc) !important;
}
.vue-tel-input .vti__dropdown-list[data-v-6d0f6b4a] {
  background-color: var(--vti-bg-color, #fff) !important;
  color: var(--vti-text-color, #000) !important;
  border-color: var(--vti-border-color, #ccc) !important;
}
.vue-tel-input .vti__dropdown-item[data-v-6d0f6b4a] {
  color: var(--vti-text-color, #000) !important;
}
.vue-tel-input .vti__selected-flag[data-v-6d0f6b4a] {
  background-color: var(--vti-bg-color, #fff) !important;
}
.vue-tel-input.vue-tel-input[data-v-6d0f6b4a] {
  border: 1px solid var(--vti-border-color, #ccc) !important;
}
.vue-tel-input .vti__input[data-v-6d0f6b4a],
.vue-tel-input .vti__dropdown[data-v-6d0f6b4a] {
  border: none !important;
}
.vue-tel-input[data-v-6d0f6b4a] {
  padding: 0 !important;
}
.vue-tel-input .vti__input[data-v-6d0f6b4a] {
  padding: var(--8d2e647a) !important; 
  height: var(--746e0135) !important; 
  line-height: var(--27041f49) !important;
}
.vue-tel-input .vti__dropdown[data-v-6d0f6b4a] {
  padding: var(--8d2e647a) !important;
}
.vue-tel-input .vti__dropdown-arrow[data-v-6d0f6b4a] {
  border-top-color: var(--vti-text-color, #000) !important;
}



/* Global styles applied via CSS variables from useAppearanceSettings */
/* These are default values, they will be overridden by inline styles from computed properties */
/* Ensure these are in sync with useAppearanceSettings.js */
[data-v-0bd9b724]:root {
  /* Use CSS variables from useAppearanceSettings.js for global theme */
  /* These are NOT default values, they are the actual values applied by the composable */
  font-family: var(--font-family-form, 'Inter', sans-serif);
  font-size: var(--base-font-size-form, 1rem);
  --primary-color: var(--primary-color);
  --background-color: var(--background-color);
  --text-color: var(--text-color);
  --header-background-color: var(--header-background-color);
  --header-text-color: var(--header-text-color);
  --border-radius-form: var(--border-radius-form);
  --shadow-form: var(--shadow-form);
}
.schedula {
&[data-v-0bd9b724] {

  /* Base container for the whole form */

  /* Main form container (the "card") */
  /* Apply rounded corners and shadows directly from CSS variables */

  /* Main Form Content Area - NO internal scrolling */

  /* Removed custom scrollbar styles as there's no internal scrollbar */
  /* .custom-scrollbar::-webkit-scrollbar { ... } */

  /* Form Group Styles (labels, inputs, selects, textareas) */

  /* Remove all focus outlines and rings */

  /* Styles for editable labels in preview mode */

  /* For WebKit browsers like Chrome and Safari */

  /* For Firefox */

  /* For IE10+ */

  /* For Edge */

  /* Checkbox/Radio Group */

  /* Color Picker Specifics */

  /* Buttons */

  /* This applies to all buttons globally, including nav buttons */

  /* Cards (e.g., info-card, detail-card, confirmation-summary) */

  /* Aspect Ratio for Service Preview Image */

  /* Time Slot Buttons & Calendar Dates */
  /* No scaling or strong shadows on hover/active for mobile */

  /* Responsive adjustments for smaller screens (Tailwind breakpoints) */



  /* Force grid container consistency */

  /* New styles for select and textarea to match inputStyles */

  /* Ensure the select arrow color matches text color */

  /* Override the default arrow color with the text color */

  /* Force disabled calendar dates to be grey */

  /* Force other month dates to be grey */

  /* Prevent theme from affecting disabled date hovers */
  }
.wp-reservation-form[data-v-0bd9b724] {
    background-color: var(--background-color);
    font-family: var(--font-family-form);
    /* Apply font family */
    font-size: var(--base-font-size-form);
    /* Apply base font size */
    color: var(--text-color);
    /* min-h-screen is already applied via Tailwind in template */
    /* transition-all duration-300 is already applied via Tailwind in template */
}
.relative.rounded-lg.overflow-hidden.shadow-lg.w-full.max-w-xl.mx-auto.flex.flex-col[data-v-0bd9b724] {
    border-radius: var(--border-radius-form);
    /* Apply rounded corners */
    box-shadow: var(--shadow-form);
    /* Apply shadows */
    height: auto;
    max-height: none;
}
.form-body[data-v-0bd9b724] {
    /* Styles are applied via inline styles from computed properties */
    flex-grow: 1;
    /* Allows it to take available space */
    overflow-y: visible;
    /* Prevents internal scrolling */
    -webkit-overflow-scrolling: auto;
    /* Revert to default scrolling behavior */
}
.form-group[data-v-0bd9b724] {
    margin-bottom: 0.75rem;
}
.form-label[data-v-0bd9b724] {
    /* Styles applied via inline styles from computed properties */
    color: inherit;
}
.form-input[data-v-0bd9b724],
  .form-select[data-v-0bd9b724],
  .form-textarea[data-v-0bd9b724] {
    border-radius: var(--border-radius-form);
    /* Apply rounded corners */
    font-size: var(--base-font-size-form);
    /* Apply base font size */
    /* Padding adjusted in JS computed property: inputStyles */
    background-color: var(--background-color);
    color: var(--text-color);
    border-color: var(--text-color);
}
.form-input[data-v-0bd9b724]:focus,
  .form-select[data-v-0bd9b724]:focus,
  .form-textarea[data-v-0bd9b724]:focus,
  button[data-v-0bd9b724]:focus,
  .form-checkbox[data-v-0bd9b724]:focus,
  .form-radio[data-v-0bd9b724]:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: inherit !important;
    --tw-ring-color: transparent !important;
}
.preview-editable-label[data-v-0bd9b724] {
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s ease-in-out;
    font-size: 0.75rem;
    /* Smaller font size */
}
.preview-editable-label[data-v-0bd9b724]:hover {
    opacity: 1;
}
.form-textarea[data-v-0bd9b724]:focus,
  button[data-v-0bd9b724]:focus,
  input[data-v-0bd9b724]:focus,
  select[data-v-0bd9b724]:focus,
  textarea[data-v-0bd9b724]:focus,
  [tabindex][data-v-0bd9b724]:focus,
  a[data-v-0bd9b724]:focus {
    outline: none !important;
    box-shadow: none !important;
    --tw-ring-color: transparent !important;
    --tw-ring-offset-shadow: none !important;
    --tw-ring-shadow: none !important;
    border-color: inherit !important;
}
[data-v-0bd9b724]:focus {
    outline: none !important;
    box-shadow: none !important;
}
[data-v-0bd9b724]::-moz-focus-inner {
    border: 0 !important;
}
[data-v-0bd9b724]:-ms-input-placeholder {
    color: #9CA3AF !important;
}
[data-v-0bd9b724]::-ms-input-placeholder {
    color: #9CA3AF !important;
}
.form-help-text[data-v-0bd9b724] {
    /* Tailwind classes handle this */
    color: inherit;
}
.checkbox-group[data-v-0bd9b724] {
    /* Tailwind classes handle this */
    display: flex;
    flex-direction: column;
}
.form-checkbox[data-v-0bd9b724],
  .form-radio[data-v-0bd9b724] {
    accent-color: var(--primary-color);
}
.color-picker-group[data-v-0bd9b724] {
    /* Tailwind classes handle this */
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.color-input[data-v-0bd9b724] {
    /* Custom styles for color input */
    width: 2.5rem;
    /* w-10 */
    height: 2.5rem;
    /* h-10 */
    border: 1px solid #d1d5db;
    /* border-gray-300 */
    border-radius: 0.375rem;
    /* rounded-md */
    cursor: pointer;
    padding: 0;
    -webkit-appearance: none;
    appearance: none;
}
.color-input[data-v-0bd9b724]::-webkit-color-swatch-wrapper {
    padding: 0;
}
.color-input[data-v-0bd9b724]::-webkit-color-swatch {
    border: none;
    border-radius: 0.25rem;
    /* slightly less rounded than wrapper */
}
.inline-flex.items-center[data-v-0bd9b724] {
    /* Common styles for all buttons, specific styles via :style */
    display: inline-flex;
    align-items: center;
}
button[data-v-0bd9b724]:hover:not(:disabled) {
    box-shadow: var(--shadow-form);
    /* Apply shadows */
}
button[data-v-0bd9b724]:active:not(:disabled) {
    transform: translateY(0);
}
.info-card[data-v-0bd9b724],
  .detail-card[data-v-0bd9b724],
  .confirmation-summary[data-v-0bd9b724] {
    /* Styles applied via inline styles from computed properties */
    border-radius: var(--border-radius-form);
    /* Apply rounded corners */
    box-shadow: var(--shadow-form);
    /* Apply shadows */
}
.relative.rounded-lg.overflow-hidden.shadow-lg>div[style*="padding-bottom"][data-v-0bd9b724] {
    position: relative;
    width: 100%;
}
.relative.rounded-lg.overflow-hidden.shadow-lg img[data-v-0bd9b724] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 639px) {
&[data-v-0bd9b724] {

    /* sm breakpoint */

    /* Ensure selected state still looks good on mobile without scaling */
    }
.calendar-date[data-v-0bd9b724],
    .time-slot-btn[data-v-0bd9b724],
    .time-slot[data-v-0bd9b724] {
      transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out !important;
      /* Keep subtle color transition */
      transform: scale(1.0) !important;
      /* Prevent scaling on mobile */
      box-shadow: none !important;
      /* Remove shadows on mobile */
}
.calendar-date[data-v-0bd9b724]:hover,
    .time-slot-btn[data-v-0bd9b724]:hover,
    .time-slot[data-v-0bd9b724]:hover {
      background-color: var(--background-color) !important;
      /* Revert to normal background on hover */
      border-color: var(--text-color)33 !important;
      /* Revert to normal border on hover */
      color: var(--text-color) !important;
      /* Revert to normal text color on hover */
}
.calendar-date.selected[data-v-0bd9b724],
    .time-slot-btn.selected[data-v-0bd9b724],
    .time-slot.selected[data-v-0bd9b724] {
      transform: scale(1.0) !important;
      /* Override selected scaling for mobile */
      box-shadow: none !important;
      /* Override selected shadow for mobile */
}
}
@media (max-width: 639px) {
&[data-v-0bd9b724] {

    /* sm breakpoint */

    /* Calendar date height reduction on smaller screens */

    /* Adjust padding for the form body on mobile for compactness */

    /* Adjust padding for confirmation summary and its items on mobile */

    /* Adjust padding for navigation buttons container on mobile */
    }
.header-section h1[data-v-0bd9b724] {
      font-size: 1.125rem;
      /* text-lg */
}
.header-section p[data-v-0bd9b724] {
      font-size: 0.75rem;
      /* text-xs */
}
.calendar-date[data-v-0bd9b724] {
      height: 2.5rem;
      /* h-10 */
}
.form-body[data-v-0bd9b724] {
      padding-left: 1rem;
      /* Smaller px-4 */
      padding-right: 1rem;
      /* Smaller px-4 */
      padding-top: 1rem;
      /* Smaller py-4 */
      padding-bottom: 1rem;
      /* Smaller py-4 */
}
.confirmation-summary[data-v-0bd9b724] {
      padding: 1rem;
      /* Smaller p-4 */
}
.confirmation-summary .summary-item[data-v-0bd9b724] {
      padding: 0.75rem;
      /* Smaller p-2 */
}
.flex.flex-col.sm\:flex-row.items-center.py-3.sm\:py-5[data-v-0bd9b724] {
      padding-top: 0.75rem;
      /* py-3 equivalent */
      padding-bottom: 0.75rem;
      /* py-3 equivalent */
}
}
@media (min-width: 640px) and (max-width: 1023px) {
&[data-v-0bd9b724] {

    /* sm to lg breakpoints */
    }
.header-section h1[data-v-0bd9b724] {
      font-size: 1.25rem;
      /* sm:text-xl */
}
.header-section p[data-v-0bd9b724] {
      font-size: 0.875rem;
      /* sm:text-sm */
}
}
.is-preview .desktop-progress[data-v-0bd9b724] {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
.is-preview .desktop-progress .ml-2[data-v-0bd9b724] {
    margin-left: 0.5rem !important;
}
.is-preview .desktop-progress .flex-1[data-v-0bd9b724] {
    flex: 1 1 0% !important;
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
}
.is-preview .header-section h1[data-v-0bd9b724] {
    font-size: 20px !important;
}
.is-preview .header-section p[data-v-0bd9b724] {
    font-size: 14px !important;
}
.is-preview .desktop-progress .text-xs[data-v-0bd9b724] {
    white-space: normal !important;
    word-break: break-word !important;
}
.calendar-grid .calendar-date[data-v-0bd9b724] {
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.25rem;
    box-sizing: border-box;
}
.step-content .schedula-grid.schedula-grid-cols-1.lg\:schedula-grid-cols-2[data-v-0bd9b724] {
    min-height: 500px !important;
    max-height: 500px !important;
}
select[data-v-0bd9b724],
  textarea[data-v-0bd9b724] {
    background-color: var(--65d4341f) !important;
    color: var(--4130bda6) !important;
    border-color: var(--12a7f8e1) !important;
    /* Also apply border color */
}
select[data-v-0bd9b724] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.5em 1.5em;
}
select[data-v-0bd9b724] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27 fill=%27none%27 stroke=%27%23666%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M6 8l4 4 4-4%27/%3E%3C/svg%3E");
}
.calendar-date.disabled[data-v-0bd9b724],
  .calendar-date[disabled][data-v-0bd9b724] {
    color: #9CA3AF !important;
    background-color: transparent !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
}
.calendar-date.isOtherMonth[data-v-0bd9b724] {
    color: #9CA3AF !important;
    background-color: transparent !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
}
.calendar-date.disabled[data-v-0bd9b724]:hover,
  .calendar-date[disabled][data-v-0bd9b724]:hover,
  .calendar-date.isOtherMonth[data-v-0bd9b724]:hover {
    color: #9CA3AF !important;
    background-color: transparent !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
}
}

body,html{margin:0;padding:0;font-family:"Inter",sans-serif}#schesab-frontend-app{display:flex;flex-direction:column;min-height:100vh;width:100%;padding:20px;box-sizing:border-box}.schedula-header{width:calc(100% - 160px) !important}.folded .schedula-header{width:calc(100% - 36px) !important}.schedula-hd-container{width:calc(100% - 100px) !important}.schedula-app{display:flex;flex-direction:column;min-height:100vh}.schedula-main{flex:1;margin-top:0;padding:8px}body.admin-bar header{top:32px !important}body.admin-bar .schedula-main{margin-top:32px}.schedula-navigation-btn{margin:0 !important}.schedula-payment-option-label{padding:.5rem !important}[v-cloak]{display:none}#schesab-frontend-app[v-cloak]{display:none}.calendar-date[disabled]{background-color:#f3f4f6 !important;color:#9ca3af !important;cursor:not-allowed !important;min-width:40px !important}.calendar-date.selected{background-color:var(--primary-color) !important;color:var(--header-text-color) !important}.time-slot.selected,.time-slot-btn.selected{background-color:var(--primary-color) !important;color:var(--header-text-color) !important;border-color:var(--primary-color) !important}.calendar-date:not([disabled]):not(.selected):hover{background-color:#eff6ff !important}.time-slot:not(.selected):hover,.time-slot-btn:not(.selected):hover{border-color:#93c5fd !important;background-color:#eff6ff !important}.calendar-grid{display:grid !important;grid-template-columns:repeat(7, minmax(0, 1fr)) !important}.time-slots-container .schedula-grid{display:grid !important}.schedula-header-section h1{font-size:1rem !important}@media(min-width: 640px){.schedula-header-section h1{font-size:1.125rem !important}}@media(min-width: 1024px){.schedula-header-section h1{font-size:1.25rem !important}}.schedula-header-section p{font-size:.75rem !important}@media(min-width: 640px){.schedula-header-section p{font-size:.875rem !important}}.schedula-header-section{padding-left:1rem !important;padding-right:1rem !important;padding-top:.5rem !important;padding-bottom:.5rem !important}@media(min-width: 640px){.schedula-header-section{padding-left:1.5rem !important;padding-right:1.5rem !important;padding-top:.75rem !important;padding-bottom:.75rem !important}}.schedula-absolute.schedula-bottom-4 h2{font-size:.75rem !important}@media(min-width: 640px){.schedula-absolute.schedula-bottom-4 h2{font-size:1rem !important}}.schedula-skeleton{background:#e5e7eb;border-radius:6px;animation:schedula-pulse 1.5s ease-in-out infinite}@keyframes schedula-pulse{0%,100%{opacity:1}50%{opacity:.5}}.schedula-wrapper{width:100%;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}.schedula-header{height:2.5rem;width:66%;margin:auto}.schedula-progress{height:2rem;width:100%}.schedula-form-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width: 1280px){.schedula-form-grid{grid-template-columns:2fr 1fr}}.schedula-left{display:flex;flex-direction:column;gap:1rem}.schedula-input{height:3rem}.schedula-grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.schedula-box{height:6rem}.schedula-right{height:12rem}.schedula-buttons{display:flex;justify-content:space-between;padding-top:1rem}.schedula-btn{height:2.5rem;width:6rem}html[dir=rtl] #schesab-frontend-app{direction:rtl}html[dir=rtl] .schedula-app{direction:rtl}html[dir=rtl] .schedula-main{direction:rtl;text-align:right}html[dir=rtl] .schedula-header{direction:rtl}html[dir=rtl] .schedula-wrapper{direction:rtl;text-align:right}html[dir=rtl] .schedula-form-grid{direction:rtl}html[dir=rtl] .schedula-left{direction:rtl}html[dir=rtl] .schedula-grid2{direction:rtl}html[dir=rtl] .schedula-buttons{direction:rtl;flex-direction:row-reverse}html[dir=rtl] .schedula-header-section{direction:rtl;text-align:right}html[dir=rtl] .schedula-header-section h1,html[dir=rtl] .schedula-header-section p{text-align:right}html[dir=rtl] input,html[dir=rtl] select,html[dir=rtl] textarea{text-align:right;direction:rtl}html[dir=rtl] label{text-align:right}html[dir=rtl] .calendar-grid{direction:ltr}html[dir=rtl] .schedula-navigation-btn{direction:rtl}html[dir=rtl] .schedula-navigation-btn svg{transform:scaleX(-1)}html[dir=rtl] .schedula-payment-option-label{direction:rtl;text-align:right}