@import url("https://fonts.googleapis.com/css2?family=KoHo:wght@400;500;600;700&display=swap");

/* ---------- Shared KINARA landing-page palette ---------- */
#bsSchedulingPage,
.bs-modal,
.kinara-v582-loader {
  --bg:#fffdfa;
  --surface:rgba(255,255,255,.78);
  --surface-soft:rgba(248,251,248,.76);
  --care:#DDE9E2;
  --joy:#EAF6FB;
  --calm:#EAF6FB;
  --ink:#173f3b;
  --muted:#607a75;
  --line:rgba(12,77,72,.14);
  --wine:#0c4d48;
  --rose:#176a63;
  --leaf:#4f6f63;
  --blue:#0c4d48;
  --amber:#789987;
  --lavender:#B9DCEC;
  --shadow:0 14px 34px rgba(23,63,59,.07);

  --font-ui:"KoHo","Segoe UI",Arial,sans-serif;
  --font-display:"KoHo","Segoe UI",Arial,sans-serif;
  --font-copy:"KoHo","Segoe UI",Arial,sans-serif;
}

html,
body {
  background:#fffdfa !important;
}

#bsSchedulingPage,
#bsSchedulingPage *,
.bs-modal,
.bs-modal *,
.kinara-v582-loader,
.kinara-v582-loader * {
  font-family:"KoHo","Segoe UI",Arial,sans-serif !important;
}


/* ---------- Seamless section background ---------- */
.page-section.kinara-reference-booking-section,
.page-section.kinara-reference-booking-section .section-background {
  background:
    radial-gradient(
      circle at 50% 7%,
      rgba(255,255,255,.99) 0%,
      rgba(255,255,255,.72) 30%,
      rgba(255,255,255,.18) 50%,
      transparent 66%
    ),
    radial-gradient(
      circle at 88% 28%,
      rgba(191,220,227,.22) 0%,
      rgba(191,220,227,.07) 30%,
      transparent 52%
    ),
    radial-gradient(
      circle at 9% 58%,
      rgba(146,176,166,.14) 0%,
      transparent 43%
    ),
    linear-gradient(
      180deg,
      #fffdfa 0%,
      #f8fbf8 38%,
      #edf5f2 72%,
      #e7f0ed 100%
    ) !important;

  border:0 !important;
  box-shadow:none !important;
}

.page-section.kinara-reference-booking-section::before,
.page-section.kinara-reference-booking-section::after,
.page-section.kinara-reference-booking-section .section-background::before,
.page-section.kinara-reference-booking-section .section-background::after {
  content:none !important;
  display:none !important;
}

#bsSchedulingPage {
  background:transparent !important;
}


/* ---------- Booking-type navigation: embedded, not card-like ---------- */
#bsSchedulingPage .bs-view-switch.bs-view-switch--three {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

#bsSchedulingPage .bs-view-switch__link,
#bsSchedulingPage .bs-view-switch__link:not([aria-current="page"]),
#bsSchedulingPage .bs-view-switch__link[aria-current="page"] {
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

#bsSchedulingPage .bs-view-switch__link:hover {
  box-shadow:none !important;
}

#bsSchedulingPage .bs-view-switch__icon {
  background:rgba(221,233,226,.56) !important;
  color:#0c4d48 !important;
}

#bsSchedulingPage .bs-view-switch__link[aria-current="page"] .bs-view-switch__icon {
  background:rgba(221,233,226,.92) !important;
}

#bsSchedulingPage .bs-view-switch__link strong {
  color:#35564f !important;
}

#bsSchedulingPage .bs-view-switch__link[aria-current="page"] strong {
  color:#0c4d48 !important;
}


/* ---------- Filters sit directly on the background ---------- */
#bsSchedulingPage .bs-filter-panel {
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

#bsSchedulingPage .bs-filter-panel select,
#bsSchedulingPage .bs-search-shell input,
#bsSchedulingPage .bs-filter-toggle {
  border-color:rgba(12,77,72,.14) !important;
  background:rgba(255,255,255,.58) !important;
  color:#173f3b !important;
  box-shadow:none !important;

  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

#bsSchedulingPage .bs-filter-panel select:focus,
#bsSchedulingPage .bs-search-shell input:focus {
  border-color:rgba(12,77,72,.38) !important;
  background:rgba(255,255,255,.84) !important;
  outline:none !important;
  box-shadow:0 0 0 3px rgba(12,77,72,.07) !important;
}


/* ---------- Card surfaces only: geometry stays from reference ---------- */
#bsSchedulingPage .bs-professional-card--matrix,
#bsSchedulingPage .bs-provider-card,
#bsSchedulingPage .bs-coordinator-card {
  border-color:rgba(12,77,72,.13) !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.80),
      rgba(248,251,248,.66)
    ) !important;

  box-shadow:0 12px 30px rgba(23,63,59,.065) !important;
}

#bsSchedulingPage .bs-professional-card--matrix:hover,
#bsSchedulingPage .bs-provider-card:hover {
  border-color:rgba(12,77,72,.23) !important;
  box-shadow:0 16px 36px rgba(23,63,59,.09) !important;
}


/* ---------- Text ---------- */
#bsSchedulingPage h1,
#bsSchedulingPage h2,
#bsSchedulingPage h3,
#bsSchedulingPage h4,
.bs-modal h1,
.bs-modal h2,
.bs-modal h3,
.bs-modal h4 {
  color:#173f3b !important;
}

#bsSchedulingPage .bs-provider-meta,
#bsSchedulingPage .bs-provider-note,
#bsSchedulingPage .bs-service-summary,
#bsSchedulingPage .bs-professional-experience,
#bsSchedulingPage .bs-professional-specialities,
#bsSchedulingPage .bs-browse-head p,
#bsSchedulingPage .bs-section-head p {
  color:#607a75 !important;
}


/* ---------- Details/fact areas ---------- */
#bsSchedulingPage .bs-service-facts,
#bsSchedulingPage .bs-professional-facts,
#bsSchedulingPage .bs-programme-booking-box,
#bsSchedulingPage .bs-service-coordinators,
#bsSchedulingPage .bs-selected-facts {
  border-color:rgba(12,77,72,.10) !important;
  background:rgba(255,255,255,.42) !important;
  box-shadow:none !important;
}

#bsSchedulingPage .bs-service-fact,
#bsSchedulingPage .bs-professional-facts span,
#bsSchedulingPage .bs-selected-fact {
  border-color:rgba(12,77,72,.09) !important;
  background:rgba(255,255,255,.38) !important;
}


/* ---------- Primary / secondary actions ---------- */
#bsSchedulingPage .bs-primary-btn,
#bsSchedulingPage .bs-kpay-book-action,
.bs-modal .bs-primary-btn,
.bs-modal .bs-kpay-book-action {
  border-color:#0c4d48 !important;
  background:#0c4d48 !important;
  color:#fff !important;

  box-shadow:0 10px 24px rgba(12,77,72,.16) !important;
}

#bsSchedulingPage .bs-primary-btn:hover,
#bsSchedulingPage .bs-kpay-book-action:hover,
.bs-modal .bs-primary-btn:hover,
.bs-modal .bs-kpay-book-action:hover {
  background:#176a63 !important;
}

#bsSchedulingPage .bs-secondary-btn,
#bsSchedulingPage .bs-know-more,
#bsSchedulingPage .bs-view-more-link,
.bs-modal .bs-secondary-btn {
  border-color:rgba(12,77,72,.16) !important;
  background:rgba(255,255,255,.68) !important;
  color:#0c4d48 !important;
  box-shadow:none !important;
}


/* ---------- K-Pay ---------- */
#bsSchedulingPage .bs-kpay-info-label,
#bsSchedulingPage .bs-kpay-available-chip,
.bs-modal .bs-kpay-info-label {
  border-color:rgba(12,77,72,.17) !important;

  background:
    linear-gradient(
      145deg,
      rgba(221,233,226,.88),
      rgba(234,246,251,.84)
    ) !important;

  color:#0c4d48 !important;
}

#bsSchedulingPage .bs-kpay-info-btn,
.bs-modal .bs-kpay-info-btn {
  border-color:rgba(12,77,72,.18) !important;
  background:rgba(255,255,255,.88) !important;
  color:#0c4d48 !important;
}


/* ---------- Callback/status areas ---------- */
#bsSchedulingPage .bs-status {
  border-color:rgba(12,77,72,.11) !important;
  background:rgba(255,255,255,.48) !important;
  color:#607a75 !important;
  box-shadow:none !important;
}

#bsSchedulingPage .bs-help-callback {
  border-color:rgba(12,77,72,.10) !important;
  background:rgba(255,255,255,.34) !important;
  box-shadow:none !important;
}


/* ---------- Modals ---------- */
.bs-modal {
  background:rgba(23,63,59,.36) !important;

  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.bs-modal__panel {
  border-color:rgba(12,77,72,.13) !important;

  background:
    linear-gradient(
      180deg,
      #fffdfa 0%,
      #f8fbf8 100%
    ) !important;

  box-shadow:0 28px 78px rgba(23,63,59,.22) !important;
}

.bs-modal__header {
  border-bottom-color:rgba(12,77,72,.10) !important;
  background:rgba(255,253,250,.96) !important;
}

.bs-modal__close {
  border-color:rgba(12,77,72,.14) !important;
  background:rgba(255,255,255,.88) !important;
  color:#0c4d48 !important;
}


/* ---------- Calendar / fields ---------- */
.bs-tool-panel,
.bs-timezone-line,
.bs-selected-provider,
.bs-selected-slot,
.bs-custom-request,
.bs-minor-section,
.bs-credential-row,
.bs-credential-option {
  border-color:rgba(12,77,72,.11) !important;
  background:rgba(255,255,255,.56) !important;
  box-shadow:none !important;
}

.bs-day,
.bs-time-btn,
.bs-field input,
.bs-field select,
.bs-field textarea,
.bs-timezone-line select {
  border-color:rgba(12,77,72,.13) !important;
  background:rgba(255,255,255,.78) !important;
  color:#173f3b !important;
}

.bs-day.is-selected,
.bs-time-btn.is-selected {
  border-color:#0c4d48 !important;
  background:#0c4d48 !important;
  color:#fff !important;
}


/* ---------- No decorative/wavy separators ---------- */
#bsSchedulingPage::before,
#bsSchedulingPage::after,
#bsSchedulingPage .bs-service-section::before,
#bsSchedulingPage .bs-service-section::after {
  content:none !important;
  display:none !important;
}


/* ---------- Phone safety; DO NOT alter reference carousel geometry ---------- */
@media(max-width:760px) {
  #bsSchedulingPage .bs-filter-panel input,
  #bsSchedulingPage .bs-filter-panel select,
  .bs-form input,
  .bs-form select,
  .bs-form textarea {
    font-size:16px !important;
  }

  .bs-modal {
    padding:8px !important;
  }

  .bs-modal__panel {
    width:100% !important;
    max-height:calc(100dvh - 16px) !important;
  }
}