/**
 * Bookly booking form — theme overrides (desktop + mobile).
 *
 * Bookly markup/classes vary slightly by version; selectors are intentionally broad.
 */

.booking-embed-content,
.booking-embed-content .bookly-form,
.page-default-content .entry-content .bookly-form {
  max-width: 100%;
  min-width: 0;
}

.booking-embed-content .bookly-form,
.page-default-content .entry-content .bookly-form {
  font-family: 'DM Sans', sans-serif;
}

.booking-embed-content .bookly-form select,
.booking-embed-content .bookly-form input[type='text'],
.booking-embed-content .bookly-form input[type='email'],
.booking-embed-content .bookly-form input[type='tel'],
.page-default-content .entry-content .bookly-form select,
.page-default-content .entry-content .bookly-form input[type='text'],
.page-default-content .entry-content .bookly-form input[type='email'],
.page-default-content .entry-content .bookly-form input[type='tel'] {
  max-width: 100%;
  border-radius: 8px;
  border-color: var(--grey-200);
  font-family: inherit;
}

.booking-embed-content .bookly-form .bookly-form-group > label,
.page-default-content .entry-content .bookly-form .bookly-form-group > label {
  color: var(--teal);
  font-weight: 600;
  font-size: 13px;
}

.booking-embed-content .bookly-form .bookly-progress-tracker,
.page-default-content .entry-content .bookly-form .bookly-progress-tracker {
  max-width: 100%;
}

.booking-embed-content .bookly-form .bookly-btn,
.page-default-content .entry-content .bookly-form .bookly-btn {
  border-radius: var(--radius-pill);
  font-weight: 600;
}

@media (max-width: 767px) {
  .page-default-content .entry-content:has(.bookly-form) {
    padding: 24px 16px;
  }

  .booking-embed-card {
    padding: 20px 16px;
    border-radius: var(--radius);
  }

  .booking-embed-content .bookly-form,
  .page-default-content .entry-content .bookly-form {
    overflow-x: hidden;
  }

  /* Progress steps — allow horizontal scroll instead of clipping */
  .booking-embed-content .bookly-form .bookly-progress-tracker,
  .page-default-content .entry-content .bookly-form .bookly-progress-tracker {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-bottom: 20px;
    padding-bottom: 4px;
  }

  .booking-embed-content .bookly-form .bookly-progress-tracker::-webkit-scrollbar,
  .page-default-content .entry-content .bookly-form .bookly-progress-tracker::-webkit-scrollbar {
    display: none;
  }

  .booking-embed-content .bookly-form .bookly-progress-tracker ol,
  .booking-embed-content .bookly-form .bookly-progress-tracker ul,
  .page-default-content .entry-content .bookly-form .bookly-progress-tracker ol,
  .page-default-content .entry-content .bookly-form .bookly-progress-tracker ul {
    flex-wrap: nowrap;
    min-width: max-content;
    gap: 8px;
  }

  .booking-embed-content .bookly-form .bookly-progress-tracker .step,
  .page-default-content .entry-content .bookly-form .bookly-progress-tracker .step {
    white-space: nowrap;
    font-size: 11px;
  }

  /* Stack Category / Service / Pharmacy (and similar rows) */
  .booking-embed-content .bookly-form .bookly-box,
  .booking-embed-content .bookly-form .bookly-table-wrap,
  .booking-embed-content .bookly-form .bookly-row,
  .page-default-content .entry-content .bookly-form .bookly-box,
  .page-default-content .entry-content .bookly-form .bookly-table-wrap,
  .page-default-content .entry-content .bookly-form .bookly-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px;
    width: 100% !important;
  }

  .booking-embed-content .bookly-form .bookly-form-group,
  .booking-embed-content .bookly-form [class*='bookly-column'],
  .booking-embed-content .bookly-form .bookly-col,
  .page-default-content .entry-content .bookly-form .bookly-form-group,
  .page-default-content .entry-content .bookly-form [class*='bookly-column'],
  .page-default-content .entry-content .bookly-form .bookly-col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    float: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .booking-embed-content .bookly-form select,
  .booking-embed-content .bookly-form input[type='text'],
  .booking-embed-content .bookly-form input[type='email'],
  .booking-embed-content .bookly-form input[type='tel'],
  .page-default-content .entry-content .bookly-form select,
  .page-default-content .entry-content .bookly-form input[type='text'],
  .page-default-content .entry-content .bookly-form input[type='email'],
  .page-default-content .entry-content .bookly-form input[type='tel'] {
    width: 100% !important;
    box-sizing: border-box;
  }

  .booking-embed-content .bookly-form .bookly-footer,
  .page-default-content .entry-content .bookly-form .bookly-footer {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }

  .booking-embed-content .bookly-form .bookly-btn,
  .booking-embed-content .bookly-form .bookly-next-step,
  .booking-embed-content .bookly-form .bookly-mobile-next-step,
  .page-default-content .entry-content .bookly-form .bookly-btn,
  .page-default-content .entry-content .bookly-form .bookly-next-step,
  .page-default-content .entry-content .bookly-form .bookly-mobile-next-step {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  /* Calendar / time slots */
  .booking-embed-content .bookly-form .bookly-columnizer,
  .page-default-content .entry-content .bookly-form .bookly-columnizer {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
}
