.doctor-search-page, .booking-page, .confirmation-page { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 52px 0 90px; }
.doctor-search-intro { max-width: 720px; margin: 0 auto 30px; text-align: center; }
.doctor-search-intro h1, .booking-card h1, .confirmation-card h1 { margin: 18px 0 10px; font-size: clamp(36px, 5vw, 56px); letter-spacing: -2.8px; line-height: 1.05; }
.doctor-search-intro > p, .booking-card > p, .confirmation-card > p { color: var(--muted); line-height: 1.65; }
.doctor-search-intro > .doctor-search-nearby-hint { display: flex; align-items: flex-start; gap: 10px; width: fit-content; max-width: 100%; padding: 11px 15px; margin: 14px auto 0; border: 1px solid rgb(91 224 164 / 30%); border-radius: 12px; color: var(--ink); background: rgb(91 224 164 / 9%); font-size: 13px; line-height: 1.5; text-align: left; }
.doctor-search-nearby-hint strong, .doctor-search-nearby-icon { color: var(--green); }
.doctor-search-nearby-icon { flex: 0 0 auto; font-size: 18px; line-height: 1.2; }
.doctor-search-nearby-link { display: inline-block; padding: 2px 8px; margin: 0 2px; border: 1px solid rgb(91 224 164 / 45%); border-radius: 999px; color: var(--green); background: rgb(91 224 164 / 10%); font-weight: 700; text-decoration: none; white-space: nowrap; }
.doctor-search-nearby-link:hover, .doctor-search-nearby-link:focus-visible { background: rgb(91 224 164 / 20%); text-decoration: underline; }
.doctor-filter-card, .doctor-card, .booking-card, .confirmation-card, .no-doctors { border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: var(--shadow); }
.doctor-filter-card { padding: clamp(20px, 4vw, 34px); }
.doctor-filter-card label, .booking-field label { display: block; margin-bottom: 8px; color: #38413b; font-size: 13px; font-weight: 600; }
.doctor-filter-card input:not([type="checkbox"]):not([type="hidden"]), .doctor-filter-card select, .booking-field input, .booking-field select, .booking-field textarea { width: 100%; min-height: 47px; padding: 11px 13px; border: 1px solid #e1e6e1; border-radius: 11px; color: var(--ink); background: #fff; }
.doctor-filter-card input:focus, .doctor-filter-card select:focus, .booking-field input:focus, .booking-field select:focus, .booking-field textarea:focus { border-color: var(--green); outline: 3px solid rgb(23 181 122 / 15%); }
.search-main-field { max-width: 680px; margin-bottom: 22px; }
.filter-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.location-filter-status { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.pin-code-status { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.pin-code-status.pin-status-match { color: #15803d; }
.pin-code-status.pin-status-mismatch { color: var(--muted); }
.pin-search-notice { padding: 12px 16px; margin: 0 0 16px; border: 1px solid #dbe9df; border-radius: 12px; color: #40574a; background: #f4faf6; font-size: 13px; line-height: 1.5; }
.specialization-filter { position: relative; z-index: 2; min-width: 0; padding: 20px 0 0; margin: 22px 0 0; border: 0; border-top: 1px solid var(--line); overflow: visible; }
.specialization-filter legend { padding: 0; margin-bottom: 12px; font-weight: 600; }
.specialization-filter legend span { color: var(--muted); font-size: 12px; font-weight: 400; }
.specialization-picker { position: relative; min-width: 0; }
.specialization-selected { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 7px; }
.specialization-selected:empty { display: none; }
.specialization-selected-chip { display: inline-flex; max-width: 100%; align-items: center; gap: 5px; padding: 4px 8px 4px 10px; border: 1px solid #b8e8ce; border-radius: 99px; color: #126b49; background: #eaf8f0; font-size: 11px; overflow-wrap: anywhere; }
.specialization-chip-remove { display: grid; width: 19px; height: 19px; flex: 0 0 auto; place-items: center; padding: 0; border: 0; border-radius: 50%; color: inherit; background: transparent; font: inherit; font-size: 16px; line-height: 1; cursor: pointer; }
.specialization-chip-remove:hover { background: rgb(18 107 73 / 12%); }
.specialization-control { position: relative; }
.doctor-filter-card .specialization-control input { min-height: 48px; padding-right: 46px; }
.specialization-control input::-webkit-search-cancel-button { cursor: pointer; }
.specialization-toggle { position: absolute; top: 0; right: 0; width: 43px; height: 48px; border: 0; border-radius: 0 11px 11px 0; color: var(--ink); background: transparent; font: inherit; font-size: 20px; cursor: pointer; }
.specialization-toggle:focus-visible { outline-offset: -4px; }
.specialization-menu { position: absolute; top: calc(100% + 5px); right: 0; left: 0; z-index: 30; padding: 5px; border: 1px solid #dfe8e1; border-radius: 12px; color: #17221c; background: #fff; box-shadow: 0 16px 36px rgb(0 0 0 / 18%); }
.specialization-menu[hidden] { display: none; }
.specialization-option-list { max-height: min(360px, 55vh); overflow-y: auto; overscroll-behavior: contain; }
.specialization-option { display: flex; width: 100%; min-height: 37px; align-items: center; gap: 10px; padding: 7px 10px; border: 0; border-radius: 7px; color: inherit; background: transparent; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.specialization-option[hidden] { display: none; }
.specialization-option:hover,
.specialization-option:focus-visible { color: #17221c; background: #edf5ef; outline: none; }
.specialization-option[aria-selected="true"] { color: #126b49; background: #eaf8f0; }
.specialization-option-check { width: 17px; height: 17px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid #456257; border-radius: 4px; color: transparent; font-size: 12px; line-height: 1; }
.specialization-option[aria-selected="true"] .specialization-option-check { border-color: #5be0a4; color: #092016; background: #5be0a4; }
.specialization-all-option { margin-bottom: 4px; border-bottom: 1px solid #29483c; border-radius: 7px 7px 0 0; }
.specialization-add-option { color: #126b49; }
.specialization-clear { width: 100%; padding: 9px 10px 5px; margin-top: 4px; border: 0; border-top: 1px solid #dfe8e1; color: #536159; background: transparent; font: inherit; font-size: 11px; text-align: left; cursor: pointer; }
.specialization-clear:hover { color: #126b49; }
.specialization-clear[hidden] { display: none; }
.clinic-page .doctor-filter-card .specialization-control input { color: var(--ink); border-color: var(--green); background: #0c2b23; }
.clinic-page .doctor-filter-card .specialization-control input::placeholder { color: #d4e3db; opacity: 1; }
.clinic-page .doctor-filter-card .specialization-control input:focus { outline: 2px solid rgb(91 224 164 / 55%); }
.clinic-page .specialization-selected-chip { border-color: rgb(91 224 164 / 38%); color: #bdebd2; background: rgb(91 224 164 / 10%); }
.clinic-page .specialization-chip-remove:hover { background: rgb(91 224 164 / 14%); }
.clinic-page .specialization-toggle { color: #d4e3db; }
.clinic-page .specialization-menu { border-color: #29483c; color: #eef6f1; background: #0c2b23; }
.clinic-page .specialization-option:hover,
.clinic-page .specialization-option:focus-visible { color: #eef6f1; background: #17463a; }
.clinic-page .specialization-option[aria-selected="true"] { color: #62e1aa; background: rgb(91 224 164 / 12%); }
.clinic-page .specialization-option[aria-selected="true"] .specialization-option-check { color: #092016; background: #5be0a4; }
.clinic-page .specialization-clear { border-color: #29483c; color: #b8d2c5; }
.clinic-page .specialization-clear:hover { color: #62e1aa; }
:root[data-theme="light"] .clinic-page .doctor-filter-card .specialization-control input { color: #26332a; border-color: #17b57a; background: #fff; }
:root[data-theme="light"] .clinic-page .doctor-filter-card .specialization-control input::placeholder { color: #536159; }
:root[data-theme="light"] .clinic-page .specialization-toggle { color: #344139; }
:root[data-theme="light"] .clinic-page .specialization-selected-chip { border-color: #b8e8ce; color: #126b49; background: #eaf8f0; }
:root[data-theme="light"] .clinic-page .specialization-menu { border-color: #dfe8e1; color: #17221c; background: #fff; }
:root[data-theme="light"] .clinic-page .specialization-option:hover,
:root[data-theme="light"] .clinic-page .specialization-option:focus-visible { color: #17221c; background: #edf5ef; }
:root[data-theme="light"] .clinic-page .specialization-option[aria-selected="true"] { color: #126b49; background: #eaf8f0; }
:root[data-theme="light"] .clinic-page .specialization-option[aria-selected="true"] .specialization-option-check { border-color: #17b57a; color: #fff; background: #17b57a; }
:root[data-theme="light"] .clinic-page .specialization-clear { border-color: #dfe8e1; color: #536159; }
:root[data-theme="light"] .clinic-page .specialization-clear:hover { color: #126b49; }
.search-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.search-actions .button { min-height: 44px; }
.search-actions #find-nearby.is-highlighted { color: #06130d; border-color: #5be0a4; background: #5be0a4; box-shadow: 0 0 0 4px rgb(91 224 164 / 18%), 0 0 22px rgb(91 224 164 / 35%); animation: find-nearby-highlight 1.1s ease-in-out 2; }
@keyframes find-nearby-highlight {
  0%, 100% { box-shadow: 0 0 0 0 rgb(91 224 164 / 18%), 0 0 14px rgb(91 224 164 / 25%); }
  50% { box-shadow: 0 0 0 6px rgb(91 224 164 / 18%), 0 0 26px rgb(91 224 164 / 45%); }
}
.location-status, .form-note { min-height: 20px; margin: 12px 0 0; color: var(--muted); font-size: 13px; }
.doctor-results-heading { display: flex; justify-content: space-between; align-items: end; margin: 48px 0 18px; }
.doctor-results-heading h2 { margin: 10px 0 0; font-size: 30px; letter-spacing: -1px; }
.doctor-results-heading > p { margin: 0 0 4px; color: var(--muted); }
.doctor-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.doctor-card { padding: 22px; transition: transform .2s, box-shadow .2s; }
.doctor-card:hover { transform: translateY(-3px); box-shadow: 0 26px 70px rgb(29 42 35 / 12%); }
.doctor-card-top { display: flex; align-items: center; gap: 12px; }
.doctor-avatar { width: 48px; height: 48px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #14764f; background: #e8f7ee; font-size: 20px; font-weight: 600; }
.doctor-card h3 { margin: 0; font-size: 19px; letter-spacing: -.3px; }
.doctor-qualifications { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.distance-chip { padding: 6px 9px; margin-left: auto; border-radius: 99px; color: #16734e; background: #eaf8f0; font-size: 11px; white-space: nowrap; }
.clinic-name { margin: 19px 0 5px; font-weight: 600; }
.doctor-card address { color: var(--muted); font-size: 13px; font-style: normal; line-height: 1.55; }
.clinic-contact { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.clinic-contact a { text-decoration: underline; text-decoration-color: #c8d2cb; text-underline-offset: 2px; }
.doctor-specializations { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 13px; }
.doctor-specializations span { padding: 5px 8px; border-radius: 99px; color: #536159; background: #f3f6f3; font-size: 11px; }
.doctor-bio { margin: 13px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.doctor-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 16px; margin-top: 17px; border-top: 1px solid #edf0ed; }
.doctor-card-bottom p { margin: 0; color: var(--muted); font-size: 12px; }
.doctor-card-bottom strong { display: block; margin-top: 4px; color: var(--ink); }
.doctor-card-bottom .button { min-height: 41px; padding: 0 14px; font-size: 12px; }
.no-availability { color: #727b75 !important; }
.no-doctors { grid-column: 1 / -1; padding: 50px 24px; text-align: center; }
.no-doctors-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto 16px; border-radius: 50%; color: #177b54; background: #eaf8f0; font-size: 24px; }
.no-doctors h3 { margin-bottom: 8px; font-size: 22px; }
.no-doctors p { max-width: 530px; margin: 0 auto 18px; color: var(--muted); line-height: 1.6; }
.booking-page { max-width: 780px; padding-top: 35px; }
.back-link { display: inline-block; margin-bottom: 18px; color: #536159; font-size: 13px; }
.booking-card, .confirmation-card { padding: clamp(24px, 5vw, 48px); }
.booking-card h1 { font-size: clamp(34px, 5vw, 46px); }
.booking-clinic { font-weight: 600; }
.booking-card form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 14px; margin-top: 23px; }
.booking-field { min-width: 0; }
.booking-field:last-of-type { grid-column: 1 / -1; }
.booking-field textarea { min-height: 105px; resize: vertical; }
.booking-card form > button { justify-self: start; }
.booking-field small { display: block; margin-top: 6px; color: var(--muted); }
.field-error, .form-error-summary { display: block; margin-top: 6px; color: #a32d32; font-size: 12px; }
.form-error-summary { padding: 12px; border-radius: 10px; background: #fff1f1; }
.confirmation-page { max-width: 760px; }
.confirmation-card { text-align: center; }
.confirmation-check { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 50%; color: #14764f; background: #e8f7ee; font-size: 25px; }
.confirmation-check.is-cancelled { color: #9f3535; background: #fff0f0; }
.confirmation-card h1 { font-size: clamp(33px, 5vw, 48px); }
.appointment-details { margin: 27px 0; text-align: left; }
.appointment-details > div { display: grid; grid-template-columns: minmax(115px, .7fr) 1.4fr; gap: 14px; padding: 13px 0; border-bottom: 1px solid #edf0ed; }
.appointment-details dt { color: var(--muted); font-size: 13px; }
.appointment-details dd { overflow-wrap: anywhere; margin: 0; font-size: 14px; font-weight: 500; }
.email-note { padding: 13px; border-radius: 12px; color: #48574e !important; background: #f4f8f4; font-size: 13px; }
.cancellation-card { text-align: left; }
.cancellation-card > .section-badge,
.cancellation-card > h1,
.cancellation-card > p { display: block; text-align: center; }
.appointment-cancellation-form { display: grid; gap: 16px; margin-top: 22px; }
.cancellation-confirmation { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.cancellation-confirmation input { width: 18px; height: 18px; accent-color: #c45151; }
.cancellation-confirmation label { color: var(--ink); font-size: 14px; }
.cancellation-submit { min-height: 46px; justify-self: start; border: 1px solid #f0bcbc; color: #9f3535; background: #fff0f0; }
.cancellation-submit:hover,
.cancellation-submit:focus-visible { border-color: #e89c9c; color: #862b2b; background: #ffe3e3; }
@media (max-width: 900px) { .filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 650px) {
  .doctor-search-page, .booking-page, .confirmation-page { width: min(100% - 28px, 1120px); padding-top: 32px; }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doctor-results { grid-template-columns: 1fr; }
  .doctor-results-heading { align-items: center; }
  .doctor-card { padding: 18px; }
  .doctor-card-bottom { align-items: flex-start; flex-direction: column; }
  .booking-card form { grid-template-columns: 1fr; }
  .booking-field:last-of-type { grid-column: auto; }
  .appointment-details > div { grid-template-columns: 1fr; gap: 5px; }
}
@media (max-width: 390px) { .filter-grid { grid-template-columns: 1fr; } .search-actions .button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .doctor-card { transition: none; } }

.clinic-page .doctor-filter-card,
.clinic-page .doctor-card,
.clinic-page .clinic-directory-card,
.clinic-page .clinic-details-panel,
.clinic-page .clinic-details-hero,
.clinic-page .booking-card,
.clinic-page .confirmation-card,
.clinic-page .no-doctors {
  color: var(--ink);
  border-color: var(--line);
  background: #0f1b16;
  box-shadow: var(--shadow);
}
.clinic-page .doctor-filter-card label,
.clinic-page .booking-field label,
.clinic-page .cancellation-confirmation label { color: #c1d0c7; }
.clinic-page .doctor-filter-card input:not([type="checkbox"]):not([type="hidden"]),
.clinic-page .doctor-filter-card select,
.clinic-page .booking-field input,
.clinic-page .booking-field select,
.clinic-page .booking-field textarea {
  color: var(--ink);
  border-color: var(--line);
  background: #09120e;
}
.clinic-page .doctor-filter-card input::placeholder,
.clinic-page .booking-field input::placeholder,
.clinic-page .booking-field textarea::placeholder { color: #81968b; }
.clinic-page .doctor-filter-card input:focus,
.clinic-page .doctor-filter-card select:focus,
.clinic-page .booking-field input:focus,
.clinic-page .booking-field select:focus,
.clinic-page .booking-field textarea:focus { border-color: var(--green); }
.clinic-page .clinic-directory-card-heading h3,
.clinic-page .clinic-directory-schedule h4,
.clinic-page .clinic-directory-doctors h4,
.clinic-page .clinic-directory-hours-row > strong,
.clinic-page .clinic-directory-doctor > div:first-child strong,
.clinic-page .clinic-directory-doctor > strong,
.clinic-page .clinic-directory-today h4,
.clinic-page .clinic-profile-doctor h3,
.clinic-page .clinic-details-panel h2,
.clinic-page .clinic-details-hero h1 { color: var(--ink); }
.clinic-page .clinic-directory-doctor { border-color: var(--line); }
.clinic-page .clinic-directory-today,
.clinic-page .clinic-profile-doctor { border-color: var(--line); }
.clinic-page .clinic-slot-pill { border-color: rgb(91 224 164 / 30%); color: #bdebd2; background: rgb(91 224 164 / 8%); }
.clinic-page .clinic-slot-pill:hover,
.clinic-page .clinic-slot-pill.is-selected { border-color: var(--green); color: var(--ink); background: rgb(91 224 164 / 16%); }
.clinic-page .clinic-slot-pill.is-selected,
.clinic-page .availability-slot.is-available.is-selected { border-color: #145a3f; color: #fff; background: #145a3f; }
.clinic-page .clinic-slot-arrow { border-color: var(--line); color: var(--green); }
.clinic-page .clinic-directory-more-doctors summary,
.clinic-page .clinic-verification { color: var(--green); }
.clinic-page .clinic-directory-today h4 span,
.clinic-page .clinic-doctor-meta { color: var(--muted); }
.clinic-page .doctor-search-intro > p,
.clinic-page .booking-card > p,
.clinic-page .confirmation-card > p,
.clinic-page .doctor-qualifications,
.clinic-page .doctor-card address,
.clinic-page .doctor-card-bottom p,
.clinic-page .no-doctors p,
.clinic-page .location-status,
.clinic-page .form-note,
.clinic-page .clinic-contact { color: var(--muted); }
.clinic-page .specialization-filter { border-color: var(--line); }
.clinic-page .specialization-filter legend span { color: var(--muted); }
.clinic-page .specialization-chip span,
.clinic-page .doctor-specializations span,
.clinic-page .email-note {
  color: #c1d0c7;
  border-color: var(--line);
  background: #14231b;
}
.clinic-page .specialization-chip input:checked + span { color: var(--green); border-color: rgb(91 224 164 / 35%); background: rgb(91 224 164 / 10%); }
.clinic-page .doctor-avatar,
.clinic-page .no-doctors-icon,
.clinic-page .confirmation-check { color: var(--green); background: rgb(91 224 164 / 12%); }
.clinic-page .doctor-card-bottom,
.clinic-page .clinic-directory-schedule,
.clinic-page .clinic-directory-doctors,
.clinic-page .clinic-directory-hours-row,
.clinic-page .clinic-directory-doctor,
.clinic-page .clinic-details-week .clinic-directory-hours-row,
.clinic-page .appointment-details > div { border-color: var(--line); }
.clinic-page .distance-chip { color: var(--green); background: rgb(91 224 164 / 10%); }
.clinic-page .doctor-card-bottom strong,
.clinic-page .appointment-details dd { color: var(--ink); }
.clinic-page .back-link,
.clinic-page .appointment-details dt { color: var(--muted); }
.clinic-page .form-error-summary { color: #ffaaa1; background: #321c1b; }

.clinic-directory-section { margin-top: 26px; }
.clinic-directory-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 24px 0 13px; }
.clinic-directory-heading h2 { margin: 0; font-size: 24px; letter-spacing: -.7px; }
.clinic-directory-heading > span { color: var(--muted); font-size: 12px; }
.doctor-listing-heading { margin-top: 42px; }
.clinic-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 14px; }
.clinic-directory-card, .clinic-details-panel, .clinic-details-hero { min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.clinic-directory-card { display: flex; min-width: 0; flex-direction: column; padding: 16px; border-radius: 16px; transition: transform .2s, box-shadow .2s; }
.clinic-directory-card:hover { transform: translateY(-2px); box-shadow: 0 24px 60px rgb(29 42 35 / 10%); }
.clinic-directory-card-heading { display: flex; min-width: 0; align-items: flex-start; gap: 8px; }
.clinic-directory-card-heading h3 { min-width: 0; margin: 0; flex: 1; overflow: hidden; font-size: 16px; letter-spacing: -.25px; line-height: 1.3; text-overflow: ellipsis; overflow-wrap: anywhere; }
.clinic-directory-card-heading .clinic-verification { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 3px; padding: 4px 6px; border: 1px solid rgb(91 224 164 / 24%); border-radius: 99px; background: rgb(91 224 164 / 9%); font-size: 9px; white-space: nowrap; }
.clinic-directory-closures,
.clinic-upcoming-closures { padding: 8px 10px; border: 1px solid #efdfb7; border-radius: 10px; color: #765319; background: #fff9eb; font-size: 11px; line-height: 1.5; }
.clinic-directory-closures { margin: 8px 0 0; }
.clinic-directory-closures strong,
.clinic-upcoming-closures strong { font-weight: 650; }
.clinic-upcoming-closures { margin: 8px 0 0; }
.clinic-directory-mark { width: 43px; height: 43px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 13px; color: #14764f; background: #e8f7ee; font-size: 18px; font-weight: 650; }
.clinic-directory-card > address, .clinic-details-hero > address { margin-top: 15px; color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.6; }
.clinic-directory-schedule, .clinic-directory-doctors { padding-top: 10px; margin-top: 10px; border-top: 1px solid #edf0ed; }
.clinic-directory-schedule h4, .clinic-directory-doctors h4 { margin: 0 0 9px; color: var(--ink); font-size: 12px; }
.clinic-directory-hours-row { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: start; gap: 8px; padding: 5px 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.clinic-directory-hours-row > strong { color: #425148; font-weight: 600; }
.clinic-directory-periods { display: grid; gap: 3px; }
.clinic-directory-periods small { display: block; color: #89948d; font-size: 9px; }
.clinic-directory-no-hours { margin: 7px 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.clinic-directory-doctors { display: grid; gap: 7px; padding-top: 10px; margin-top: 8px; border-top: 0; }
.clinic-choose-doctor { display: grid; gap: 5px; margin-top: 9px; }
.clinic-choose-doctor label,
.clinic-profile-doctor-select label { color: var(--muted); font-size: 10px; font-weight: 600; }
.clinic-choose-doctor select,
.clinic-profile-doctor-select select { width: 100%; min-width: 0; min-height: 36px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: var(--paper); font: inherit; font-size: 11px; }
.clinic-choose-doctor select:focus-visible,
.clinic-profile-doctor-select select:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.clinic-directory-doctor { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 0; border: 0; }
.clinic-directory-doctor-info { flex: 1; }
.clinic-directory-doctor.is-selected { padding: 7px; border: 1px solid var(--green); border-radius: 12px; background: var(--theme-subtle); }
.clinic-doctor-select { flex: 0 0 auto; padding: 5px 0 5px 6px; border: 0; color: var(--green); background: transparent; font: inherit; font-size: 10px; font-weight: 650; cursor: pointer; white-space: nowrap; }
.clinic-doctor-select:focus-visible { border-radius: 4px; outline: 2px solid var(--green); outline-offset: 2px; }
.clinic-doctor-select.is-selected { cursor: default; }
.clinic-doctor-avatar { width: 36px; height: 36px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid rgb(91 224 164 / 24%); border-radius: 9px; color: var(--green); background: rgb(91 224 164 / 9%); font-size: 12px; font-weight: 700; }
.clinic-directory-doctor-info { min-width: 0; display: grid; gap: 3px; }
.clinic-directory-doctor-info strong { overflow: hidden; color: var(--ink); font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.clinic-directory-doctor-info > span { overflow: hidden; color: var(--muted); font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.clinic-directory-doctor > div:first-child { display: grid; gap: 3px; }
.clinic-directory-doctor > strong { color: var(--ink); font-size: 12px; }
.clinic-directory-doctor > div:first-child strong { color: var(--ink); font-size: 12px; }
.clinic-directory-doctor > div:first-child > span { color: var(--muted); font-size: 10px; }
.clinic-directory-doctor .doctor-specializations { margin-top: 8px; }
.clinic-directory-doctor > p { margin: 8px 0; color: var(--muted); font-size: 10px; }
.clinic-directory-doctor .button { min-height: 36px; padding: 0 11px; font-size: 10px; }
.clinic-verification { color: #168357; font-size: 10px; font-weight: 600; }
.clinic-doctor-meta { display: block; margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.clinic-directory-more-doctors { display: grid; gap: 7px; padding-left: 45px; color: var(--muted); font-size: 10px; line-height: 1.3; }
.clinic-directory-more-doctors summary { width: fit-content; color: var(--green); cursor: pointer; }
.clinic-directory-more-doctors .clinic-directory-doctor { margin-top: 8px; }
.clinic-directory-card > address { overflow-wrap: anywhere; }
.clinic-directory-location { display: flex; min-width: 0; align-items: center; gap: 6px; margin: 9px 0 0; color: var(--muted); font-size: 10px; line-height: 1.35; }
.clinic-directory-location svg { width: 13px; height: 13px; flex: 0 0 auto; fill: var(--green); }
.clinic-directory-location > span { min-width: 0; overflow-wrap: anywhere; }
.clinic-directory-address { margin: 9px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.clinic-choose-doctor .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.clinic-choose-doctor .visually-hidden:focus { position: static; width: 100%; height: auto; padding: 7px 9px; margin: 0; overflow: visible; clip: auto; white-space: normal; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: var(--paper); outline: 2px solid var(--green); outline-offset: 2px; }
.clinic-directory-today { min-width: 0; padding-top: 10px; margin-top: 10px; border-top: 1px solid #edf0ed; }
.clinic-directory-today h4 { margin: 0 0 7px; color: var(--ink); font-size: 11px; font-weight: 650; }
.clinic-directory-today h4 span { margin-left: 3px; color: var(--muted); font-size: 10px; font-weight: 500; }
.clinic-directory-today .clinic-directory-no-hours { margin: 0; font-size: 10px; }
.clinic-directory-no-hours[hidden],
[data-directory-slot-carousel][hidden],
[data-clinic-no-slots][hidden] { display: none; }
.clinic-slot-carousel { min-width: 0; display: flex; align-items: center; gap: 6px; }
.clinic-slot-scroller { width: 100%; max-width: 360px; min-width: 0; display: flex; flex: 1; gap: 6px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: #9ac9ac transparent; padding: 2px 1px 5px; }
.clinic-slot-scroller:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.clinic-slot-pill { min-height: 30px; flex: 0 0 auto; padding: 0 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--green); background: var(--theme-raised); font: inherit; font-size: 10px; cursor: pointer; white-space: nowrap; }
.clinic-slot-pill:hover, .clinic-slot-pill.is-selected { border-color: var(--green); color: var(--theme-text); background: var(--theme-subtle); }
.clinic-slot-pill:focus-visible, .clinic-slot-arrow:focus-visible { outline: 3px solid rgb(23 181 122 / 45%); outline-offset: 2px; }
.clinic-slot-arrow { width: 22px; height: 24px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; color: var(--green); background: transparent; font-size: 16px; line-height: 1; cursor: pointer; }
.clinic-directory-actions { display: flex; gap: 7px; margin-top: auto; padding-top: 13px; }
.clinic-directory-actions .button { min-width: 0; min-height: 36px; flex: 1; justify-content: center; padding: 0 7px; border-radius: 9px; font-size: 10px; line-height: 1.2; text-align: center; }
.clinic-directory-actions .button-light { border: 1px solid var(--line); color: var(--ink); background: transparent; }
.clinic-directory-actions .button-dark { border: 1px solid var(--green); color: #092016; background: var(--green); }
.clinic-directory-pagination { display: flex; align-items: center; justify-content: center; gap: 16px; padding-top: 20px; }
.clinic-page-link { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); font-size: 11px; text-decoration: none; }
.clinic-page-link:hover { border-color: var(--green); color: var(--green); }
.clinic-page-link.is-disabled { opacity: .5; }
.clinic-page-status { color: var(--muted); font-size: 11px; }
.clinic-details-doctors { margin-top: 16px; }
.clinic-profile-doctor { padding: 14px 0; border-bottom: 1px solid #edf0ed; }
.clinic-profile-doctor:last-child { border-bottom: 0; }
.clinic-profile-doctor h3 { margin: 0; font-size: 16px; }
.clinic-profile-doctor > p { margin: 9px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.clinic-profile-doctor > p strong { color: var(--ink); }
.clinic-details-page { width: min(1000px, calc(100% - 40px)); margin: 0 auto; padding: 35px 0 80px; }
.clinic-details-hero h1 { margin: 14px 0 3px; font-size: clamp(34px, 5vw, 52px); letter-spacing: -2px; line-height: 1.05; overflow-wrap: anywhere; }
.clinic-details-hero .clinic-contact { margin-top: 9px; }
.clinic-details-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.clinic-profile-back { min-height: 34px; display: inline-flex; align-items: center; padding: 0 12px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; }
.clinic-profile-back:hover { border-color: var(--green); color: var(--green); }
.clinic-profile-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 16px; }
.clinic-profile-lower { display: grid; grid-template-columns: 1fr; align-items: stretch; gap: 16px; }
.clinic-profile-layout .clinic-details-panel,
.clinic-profile-lower .clinic-details-panel { min-width: 0; margin: 0; padding: 18px; border-radius: 17px; }
.clinic-profile-title-row { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.clinic-profile-title-row h1 { min-width: 0; margin: 0; font-size: clamp(23px, 3vw, 30px); letter-spacing: -.8px; line-height: 1.2; overflow-wrap: anywhere; }
.clinic-profile-title-row .clinic-verification { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgb(91 224 164 / 24%); border-radius: 999px; background: rgb(91 224 164 / 9%); }
.clinic-profile-address-row { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px 12px; margin-top: 9px; }
.clinic-profile-address { min-width: 0; flex: 1 1 260px; margin: 0; color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.5; overflow-wrap: anywhere; }
.clinic-profile-address a { color: inherit; text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.clinic-profile-address a:hover { color: var(--green); text-decoration-color: currentColor; }
.clinic-profile-address span { color: var(--muted); }
.clinic-address-copy { min-height: 31px; flex: 0 0 auto; padding: 5px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--theme-surface); font: inherit; font-size: 11px; cursor: pointer; }
.clinic-address-copy:hover { border-color: var(--green); color: var(--green); }
.clinic-address-copy:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.clinic-address-copy-status { flex-basis: 100%; color: var(--muted); font-size: 11px; }
.clinic-address-copy-status:empty { display: none; }
.clinic-profile-facts { display: grid; gap: 7px; margin: 12px 0; }
.clinic-profile-facts > div { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 9px; font-size: 12px; line-height: 1.45; }
.clinic-profile-facts dt { color: var(--muted); }
.clinic-profile-facts dd { min-width: 0; margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.clinic-profile-facts a { color: inherit; text-decoration: none; }
.clinic-profile-schedule { padding-top: 11px; border-top: 1px solid var(--line); }
.clinic-profile-schedule h2 { margin: 7px 0 9px; font-size: 17px; letter-spacing: -.3px; }
.clinic-profile-schedule .clinic-details-week .clinic-directory-hours-row { grid-template-columns: 75px minmax(0, 1fr); padding: 4px 0; }
.clinic-details-doctors h2 { margin: 0 0 12px; font-size: 20px; letter-spacing: -.4px; }
.clinic-profile-lower { margin-top: 16px; }
.clinic-profile-lower .clinic-profile-doctor { display: flex; gap: 10px; padding: 12px 0; }
.clinic-profile-doctor-avatar { width: 38px; height: 38px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 11px; color: var(--green); background: var(--theme-subtle); font-size: 12px; font-weight: 700; }
.clinic-profile-doctor-content { min-width: 0; flex: 1; }
.clinic-profile-doctor-content h3 { margin: 0; overflow-wrap: anywhere; }
.clinic-profile-doctor-content .doctor-specializations { margin-top: 6px; }
.clinic-profile-doctor-content > p { margin-top: 7px; }
.clinic-profile-doctor-content .doctor-specializations span { overflow-wrap: anywhere; }
.clinic-date-availability > h2 { margin-bottom: 12px; }
.clinic-availability-dates { display: flex; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: var(--green) transparent; padding: 2px 1px 7px; }
.clinic-date-option { min-height: 74px; display: flex; flex: 1 0 68px; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 7px 4px; color: var(--muted); background: var(--theme-surface); cursor: pointer; }
.clinic-date-option strong { color: var(--ink); }
.clinic-date-option > span { color: var(--muted); font-size: 9px; text-align: center; }
.clinic-date-option.is-selected { color: var(--green); border-color: var(--green); background: var(--theme-subtle); }
.clinic-date-option.is-selected strong,
.clinic-date-option.is-selected > span { color: inherit; }
.clinic-date-option:disabled { opacity: .48; cursor: not-allowed; }
.clinic-live-slots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.clinic-live-slots .availability-slot { min-width: 0; justify-content: center; padding: 0 5px; border-radius: 999px; font-size: 10px; white-space: nowrap; }
.clinic-book-slot-form { width: 100%; min-height: 42px; margin-top: 14px; border-radius: 10px; }
.clinic-details-search-link { margin-top: 14px; }
.clinic-details-panel h2 { margin: 11px 0 15px; font-size: 22px; letter-spacing: -.6px; }
.clinic-profile-doctor-select { max-width: 460px; display: grid; gap: 7px; margin-top: 16px; }
.clinic-profile-doctor-select select { min-height: 44px; font-size: 13px; }
.clinic-availability-dates { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; margin: 14px 0 18px; }
.clinic-date-option { min-width: 0; display: grid; justify-items: center; gap: 4px; padding: 9px 4px; border: 1px solid var(--line); border-radius: 10px; color: #536159; background: #fff; font-size: 10px; }
.clinic-date-option strong { color: #17221c; font-size: 11px; }
.clinic-date-option.is-selected { border-color: #70c998; color: #126b49; background: #e5f6eb; }
.clinic-availability-form { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; }
.clinic-availability-form > div { min-width: min(240px, 100%); flex: 1; }
.clinic-availability-form label { display: block; margin-bottom: 7px; color: #38413b; font-size: 13px; font-weight: 600; }
.clinic-availability-form input { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #e1e6e1; border-radius: 11px; color: #17221c; background: #fff; color-scheme: light; }
.clinic-availability-form input:focus { border-color: var(--green); outline: 3px solid rgb(23 181 122 / 15%); }
.clinic-live-slot-doctors { display: grid; gap: 15px; margin-top: 18px; }
.clinic-live-doctor-slots h3 { margin: 0 0 8px; font-size: 14px; }
.clinic-live-slots { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.availability-slot { min-height: 38px; display: inline-flex; align-items: center; padding: 0 11px; border: 1px solid; border-radius: 9px; font: inherit; font-size: 11px; }
button.availability-slot { cursor: pointer; }
.availability-slot.is-available { border-color: #b8e4c8; color: #126b49; background: #eef9f1; }
.availability-slot.is-available:hover, .availability-slot.is-available.is-selected { border-color: #16885b; background: #dff4e6; }
.availability-slot.is-full { border-color: #f0c8c8; color: #a33939; background: #fff1f1; }
.availability-slot.is-unavailable { border-color: #e2e6e2; color: #828a84; background: #f2f4f2; }
.clinic-selected-slot { margin: 15px 0 8px; color: var(--ink); font-size: 12px; font-weight: 600; }
.clinic-book-slot-form { margin-top: 12px; }
.clinic-book-slot-form:disabled { opacity: .55; cursor: not-allowed; }
.clinic-booking-dialog { width: min(660px, calc(100% - 28px)); max-height: min(90vh, 780px); padding: clamp(20px, 4vw, 32px); overflow-y: auto; border: 1px solid #345143; border-radius: 20px; color: #eef6f1; background: #0f1b16; box-shadow: 0 24px 90px rgb(0 0 0 / 45%); }
.clinic-booking-dialog::backdrop { background: rgb(3 10 7 / 72%); backdrop-filter: blur(3px); }
.clinic-booking-dialog-header { display: flex; justify-content: space-between; align-items: start; gap: 16px; }
.clinic-booking-dialog-header h3 { margin: 10px 0 0; font-size: clamp(23px, 4vw, 30px); letter-spacing: -.7px; }
.clinic-booking-close { width: 38px; height: 38px; flex: 0 0 auto; border: 1px solid #345143; border-radius: 50%; color: #eef6f1; background: #14231b; font-size: 24px; cursor: pointer; }
.clinic-booking-details { margin: 18px 0; }
.clinic-booking-details > div { grid-template-columns: 100px minmax(0, 1fr); padding: 9px 0; border-color: #1f3128; }
.clinic-booking-dialog .clinic-booking-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.clinic-booking-dialog .booking-field { min-width: 0; }
.clinic-booking-dialog .booking-field label { display: block; margin-bottom: 7px; color: #c1d0c7; font-size: 12px; font-weight: 600; }
.clinic-booking-dialog .booking-field input,
.clinic-booking-dialog .booking-field textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #345143; border-radius: 10px; color: #eef6f1; background: #09120e; font: inherit; }
.clinic-booking-dialog .booking-field textarea { min-height: 88px; resize: vertical; }
.clinic-booking-dialog .booking-field input:focus,
.clinic-booking-dialog .booking-field textarea:focus { border-color: #5be0a4; outline: 3px solid rgb(91 224 164 / 18%); }
.clinic-booking-reason { grid-column: 1 / -1; }
.clinic-booking-submit { min-height: 44px; margin-top: 18px; }
.clinic-booking-submit:disabled { opacity: .6; cursor: wait; }
.clinic-page .clinic-date-availability .clinic-availability-form label { color: #c1d0c7; }
.clinic-page .clinic-date-option { border-color: #d5dfd8; color: #536159; background: #fff; }
.clinic-page .clinic-date-option strong { color: #17221c; }
.clinic-page .clinic-date-option.is-selected { border-color: #70c998; color: #126b49; background: #e5f6eb; }
.doctor-available-slots { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0; }
.doctor-available-slots .button { min-height: 34px; padding: 0 10px; font-size: 11px; }
.clinic-details-week { display: grid; }
.clinic-details-week .clinic-directory-hours-row { grid-template-columns: 80px minmax(0, 1fr); padding: 8px 0; border-bottom: 1px solid #edf0ed; }
.clinic-details-week .clinic-directory-hours-row:last-child { border-bottom: 0; }
.clinic-details-note { margin: 18px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.clinic-details-doctors { margin-top: 34px; }
.clinic-details-doctors .doctor-results-heading { margin-top: 0; }
.clinic-details-search-link { margin-top: 20px; }
.clinic-details-page { width: min(1210px, calc(100% - 48px)); }
.clinic-profile-layout .clinic-details-panel,
.clinic-profile-lower .clinic-details-panel { margin: 0; }
.clinic-details-doctors h2 { margin: 0 0 12px; font-size: 20px; }
.clinic-details-doctors { margin-top: 0; }
.clinic-profile-lower .clinic-profile-doctor { display: flex; gap: 10px; padding: 12px 0; }
.clinic-profile-doctor-avatar { width: 38px; height: 38px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 11px; color: var(--green); background: var(--theme-subtle); font-size: 12px; font-weight: 700; }
.clinic-profile-doctor-content { min-width: 0; flex: 1; }
.clinic-profile-doctor-content h3 { margin: 0; overflow-wrap: anywhere; }
.clinic-profile-doctor-content .doctor-specializations { margin-top: 6px; }
.clinic-profile-doctor-content > p { margin-top: 7px; }
.clinic-availability-dates { display: flex; grid-template-columns: none; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: var(--green) transparent; padding: 2px 1px 7px; }
.clinic-date-option { min-height: 74px; display: flex; flex: 1 0 68px; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 7px 4px; color: var(--muted); background: var(--theme-surface); cursor: pointer; }
.clinic-date-option strong { color: var(--ink); }
.clinic-date-option > span { color: var(--muted); font-size: 9px; text-align: center; }
.clinic-date-option.is-selected { border-color: var(--green); color: var(--green); background: var(--theme-subtle); }
.clinic-date-option.is-selected strong,
.clinic-date-option.is-selected > span { color: inherit; }
.clinic-date-option:disabled { opacity: .48; cursor: not-allowed; }
.clinic-live-slots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin-top: 14px; }
.clinic-live-slots .availability-slot { min-width: 0; justify-content: center; padding: 0 5px; border-radius: 999px; font-size: 10px; white-space: nowrap; }
.clinic-book-slot-form { width: 100%; min-height: 42px; margin-top: 14px; border-radius: 10px; }
.clinic-profile-back { min-height: 34px; display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; }
.clinic-profile-back:hover { border-color: var(--green); color: var(--green); }
@media (max-width: 900px) {
  .clinic-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clinic-details-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .clinic-directory-card, .clinic-details-panel, .clinic-details-hero { padding: 17px; border-radius: 16px; }
  .clinic-directory-grid { grid-template-columns: 1fr; }
  .clinic-details-page { width: min(1000px, calc(100% - 28px)); padding-top: 25px; }
  .clinic-profile-layout { grid-template-columns: 1fr; }
  .clinic-profile-lower { grid-template-columns: 1fr; }
  .clinic-profile-facts > div { grid-template-columns: 82px minmax(0, 1fr); }
  .clinic-live-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .clinic-directory-hours-row { grid-template-columns: 68px minmax(0, 1fr); }
  .clinic-availability-dates { gap: 4px; }
  .clinic-date-option { padding: 8px 2px; font-size: 9px; }
  .clinic-date-option strong { font-size: 10px; }
  .clinic-booking-dialog .clinic-booking-fields { grid-template-columns: 1fr; }
  .clinic-booking-reason { grid-column: auto; }
  .clinic-booking-details > div { grid-template-columns: 1fr; gap: 5px; }
}

.clinic-page .confirmation-check.is-cancelled { color: #ffd7d7; background: #3a2020; }
.clinic-page .cancellation-submit { border-color: #f0bcbc; color: #9f3535; background: #fff0f0; }
.clinic-page .cancellation-submit:hover,
.clinic-page .cancellation-submit:focus-visible { border-color: #e89c9c; color: #862b2b; background: #ffe3e3; }
:root[data-theme="light"] .clinic-page .confirmation-check.is-cancelled { color: #9f3535; background: #fff0f0; }

/* Find Near Me summary and Find from Map results */
.results-subtitle { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.location-status.is-loading::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 8px; border: 2px solid var(--line); border-top-color: var(--green); border-radius: 50%; vertical-align: -2px; animation: location-spin .8s linear infinite; }
.nearby-search-progress { padding: 18px; margin-top: 16px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: var(--theme-surface); transition: opacity .2s ease, transform .2s ease; }
.nearby-search-progress[hidden] { display: none; }
.nearby-search-progress-heading { display: flex; align-items: center; gap: 12px; }
.nearby-progress-icon { width: 38px; height: 38px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 12px; color: var(--green); background: var(--theme-subtle); font-size: 24px; }
.nearby-search-progress-heading > div { min-width: 0; flex: 1; }
.nearby-search-progress-heading h2 { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.4; }
.nearby-search-progress-heading h2.is-changing { animation: nearby-status-change .18s ease-out; }
.nearby-search-progress-heading p { margin: 3px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.nearby-progress-spinner { width: 18px; height: 18px; display: block; flex: 0 0 auto; border: 2px solid var(--line); border-top-color: var(--green); border-radius: 50%; animation: location-spin .8s linear infinite; }
.nearby-progress-spinner[hidden] { display: none; }
.nearby-progress-steps { display: grid; gap: 10px; padding: 14px 0 0; margin: 14px 0 0; border-top: 1px solid var(--line); list-style: none; }
.nearby-progress-steps li { min-width: 0; display: grid; grid-template-columns: 18px minmax(0, 1fr) minmax(0, auto); align-items: center; gap: 8px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.nearby-step-icon { width: 16px; height: 16px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font-size: 11px; font-weight: 700; }
.nearby-progress-steps [data-state="in-progress"] .nearby-step-icon { border: 2px solid var(--line); border-top-color: var(--green); color: transparent; animation: location-spin .8s linear infinite; }
.nearby-progress-steps [data-state="completed"] .nearby-step-icon { border-color: var(--green); color: var(--green); }
.nearby-progress-steps [data-state="failed"] .nearby-step-icon { border-color: #c65a5a; color: #c65a5a; }
.nearby-progress-steps [data-state="in-progress"] > span:nth-child(2),
.nearby-progress-steps [data-state="completed"] > span:nth-child(2) { color: var(--ink); }
.nearby-step-detail { color: var(--muted); text-align: right; overflow-wrap: anywhere; }
.nearby-location-retry { min-height: 36px; margin-top: 14px; }
.nearby-location-retry[hidden] { display: none; }
.search-actions #find-nearby.is-loading::before { content: ""; width: 12px; height: 12px; margin-right: 8px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; display: inline-block; vertical-align: -2px; animation: location-spin .8s linear infinite; }
.location-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 12px 16px; margin: 18px 0 0; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: var(--theme-subtle); font-size: 13px; line-height: 1.5; }
.location-summary[hidden] { display: none; }
.location-summary strong { color: var(--green); font-weight: 650; }
.clinic-directory-contact { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 0; font-size: 12px; }
.clinic-directory-contact a { color: var(--green); text-underline-offset: 3px; }
.map-results-section { margin-top: 12px; }
.map-results-note { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.map-results-state { min-height: 20px; margin: 0 0 12px; color: var(--muted); font-size: 13px; }
.map-results-state:empty { display: none; }
.map-results-section [data-map-results-retry] { margin-top: 12px; }
.map-results-section [data-map-results-retry][hidden] { display: none; }
.map-result-label { flex: 0 0 auto; padding: 4px 8px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); font-size: 9px; white-space: nowrap; }
.map-result-address { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.map-result-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 8px 0 0; color: var(--green); font-size: 12px; }
.map-result-card .clinic-directory-actions { margin-top: auto; padding-top: 14px; }
.map-result-skeleton { min-height: 132px; background: linear-gradient(90deg, var(--theme-subtle), var(--theme-raised), var(--theme-subtle)); background-size: 200% 100%; animation: location-shimmer 1.4s ease-in-out infinite; }
@keyframes location-spin { to { transform: rotate(360deg); } }
@keyframes location-shimmer { to { background-position: -200% 0; } }
@keyframes nearby-status-change { from { opacity: .35; transform: translateY(2px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .location-status.is-loading::before, .nearby-progress-spinner, .nearby-progress-steps [data-state="in-progress"] .nearby-step-icon, .search-actions #find-nearby.is-loading::before, .search-actions #find-nearby.is-highlighted, .map-result-skeleton, .nearby-search-progress-heading h2.is-changing { animation: none; }
  .nearby-search-progress { transition: none; }
}
@media (max-width: 520px) {
  .nearby-search-progress { padding: 15px; }
  .nearby-progress-steps li { grid-template-columns: 18px minmax(0, 1fr); }
  .nearby-step-detail { grid-column: 2; text-align: left; }
}