/* =====================================================================
   BharatClinic — day / night
   Day is the bright design. Night keeps the hero, Dr. Sharma, Agni, Urja,
   the menu and the footer exactly as they are (they are already night
   rooms) and turns every light section into its night version: deep
   forest surfaces, ivory text, rose for the maroon accents, mint links.
   html[data-theme] is set before first paint by the inline script in
   <head> (Auto follows the device; Day / Night are remembered).
   ===================================================================== */

html[data-theme="night"] { color-scheme: dark; }
html[data-theme="day"] { color-scheme: light; }

/* ---------- tokens inside the light sections ---------- */
html[data-theme="night"] :is(.page, .callback__sheet, .facts, #facts, .steps, .clinics, .faq, .ask) {
  --paper: #0B1C15; --paper-2: #17322A;
  --forest-100: #153129; --blush: #2A161B;
  --ink: #ECE6DA; --ink-soft: #B6C1B9; --line: rgb(255 255 255 / .12);
  --forest-900: #F0F2EA; --forest-700: #8FD3A9; --forest-500: #8FD3A9;
  --maroon: #EDB9BF;
  --shadow-card: 0 18px 40px -26px rgb(0 0 0 / .8);
}
html[data-theme="night"] .golden :is(.routes, .heritage) {
  --paper: #0B1C15; --paper-2: #17322A; --edge: rgb(255 255 255 / .14);
  --ink: #ECE6DA; --body-ink: #CDD5CE; --muted: #A9B5AD; --maroon: #EDB9BF;
}

/* ---------- section backgrounds ---------- */
html[data-theme="night"] .page { background: #0B1C15; }
html[data-theme="night"] .facts { background: #0B1C15; }
html[data-theme="night"] #facts.nidaan { background: radial-gradient(60% 50% at 100% 0%, rgb(47 125 85 / .18), transparent 70%), radial-gradient(50% 40% at 0% 100%, rgb(111 38 49 / .16), transparent 70%), #0B1C15; }
html[data-theme="night"] .steps { background: #0B1C15; }
html[data-theme="night"] .clinics { background: linear-gradient(180deg, #0B1C15, #0E241B); }
html[data-theme="night"] .faq { background: #0E241B; }
html[data-theme="night"] .ask { background: radial-gradient(50% 50% at 90% 10%, rgb(47 125 85 / .2), transparent 70%), radial-gradient(45% 40% at 5% 95%, rgb(111 38 49 / .18), transparent 70%), #0B1C15; }
html[data-theme="night"] .golden .routes { background: radial-gradient(70% 50% at 100% 0%, rgb(182 147 87 / .1), transparent 70%), #0B1C15; }
html[data-theme="night"] .golden .heritage { background: radial-gradient(60% 50% at 50% 30%, #16302A, #0B1C15 70%); }

/* ---------- glass, cards and tiles ---------- */
html[data-theme="night"] .glass { background: linear-gradient(155deg, rgb(255 255 255 / .07), rgb(255 255 255 / .03)); border-color: rgb(255 255 255 / .12); box-shadow: inset 0 1px 0 rgb(255 255 255 / .08), 0 20px 44px -30px rgb(0 0 0 / .8); }
html[data-theme="night"] .glass::before { opacity: .35; }
html[data-theme="night"] .facts__list li { background: linear-gradient(155deg, #16302A, #112720); border-color: rgb(255 255 255 / .1); box-shadow: none; }
html[data-theme="night"] .facts__list strong { color: #F0F2EA; }
html[data-theme="night"] .steps__card { background: #132B23; border-color: rgb(255 255 255 / .1); box-shadow: 0 -12px 30px -18px rgb(0 0 0 / .7); }
html[data-theme="night"] .steps__card--sage { background: #142F26; }
html[data-theme="night"] .steps__card--ivory { background: #17302A; }
html[data-theme="night"] .steps__card--blush { background: #2A171C; }
html[data-theme="night"] .steps__card--sand { background: #2A2416; }
html[data-theme="night"] .steps__card--mint { background: #132E27; }
html[data-theme="night"] .steps__num { background: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] .steps__art { filter: brightness(.9) saturate(.9); }
html[data-theme="night"] .nidaan__brand, html[data-theme="night"] .nidaan__bring { background: #17322A; border-color: rgb(217 193 144 / .35); }
html[data-theme="night"] .nidaan__qs button, html[data-theme="night"] .nidaan__nav button { background: rgb(255 255 255 / .05); }
html[data-theme="night"] .nidaan__qs button:hover, html[data-theme="night"] .nidaan__nav button:hover { background: rgb(255 255 255 / .1); }
html[data-theme="night"] .nidaan__email-preview, html[data-theme="night"] .nidaan__email-form input:not([type="checkbox"]), html[data-theme="night"] .nidaan__email-open { background: #112720; color: var(--ink); }
html[data-theme="night"] .clinic-card__actions a { background: rgb(143 211 169 / .12); color: #CFEAD9; }
html[data-theme="night"] .clinic-card--video { background: linear-gradient(160deg, #6F2631, #4E1822); }
html[data-theme="night"] .clinic-card--video .clinic-card__actions a { background: #FBF8F1; color: #521A24; }
html[data-theme="night"] .rv--t2 { background: linear-gradient(160deg, #17322A, #112720); color: #F0F2EA; border-color: rgb(255 255 255 / .12); }
html[data-theme="night"] .rv--t2 .rv__tag { background: rgb(143 211 169 / .14); color: #CFEAD9; }
html[data-theme="night"] .rv--end { color: #F0F2EA; border-color: rgb(217 193 144 / .45); }
html[data-theme="night"] .rv__end-links a { background: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] .reviews__btn { background: rgb(255 255 255 / .06); color: #F0F2EA; }
html[data-theme="night"] .reviews__btn:hover { background: rgb(255 255 255 / .12); }
html[data-theme="night"] .reviews__dots i { background: rgb(255 255 255 / .14); }
html[data-theme="night"] .reviews__dots i::after { background: #8FD3A9; }

/* ---------- care tiles (golden) ---------- */
html[data-theme="night"] .golden .mcard, html[data-theme="night"] .golden .dir-links a, html[data-theme="night"] .golden .tc-arrow { background: #132B23; color: #ECE6DA; border-color: rgb(255 255 255 / .12); }
html[data-theme="night"] .golden .mcard b { color: #F0F2EA; }
html[data-theme="night"] .golden .dir-links a:hover { background: #1A3A30; border-color: var(--gold); }
html[data-theme="night"] .golden .routes h2, html[data-theme="night"] .golden .heritage h2, html[data-theme="night"] .golden .more-h h3 { color: #F0F2EA; }
html[data-theme="night"] .golden .tc-progress button::before { background: rgb(255 255 255 / .16); }
html[data-theme="night"] .golden .tc-progress button::after { background: #8FD3A9; }
html[data-theme="night"] .golden .tstage { box-shadow: 0 0 0 1px rgb(217 193 144 / .35), 0 30px 60px -36px rgb(0 0 0 / .9); }

/* ---------- WhatsApp composer ---------- */
html[data-theme="night"] .ask__step { background: linear-gradient(155deg, rgb(255 255 255 / .07), rgb(255 255 255 / .03)); border-color: rgb(255 255 255 / .12); box-shadow: inset 0 1px 0 rgb(255 255 255 / .06), 0 18px 40px -30px rgb(0 0 0 / .8); }
html[data-theme="night"] .ask__no { background: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] .chip { background: rgb(255 255 255 / .06); border-color: rgb(255 255 255 / .16); color: #F0F2EA; box-shadow: none; }
html[data-theme="night"] .chip[aria-pressed="true"] { background: #8FD3A9; border-color: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] .ask__switch { background: #17322A; }
html[data-theme="night"] .ask__ready { background: rgb(143 211 169 / .14); }
/* the phone mock-up switches to WhatsApp's own dark theme */
html[data-theme="night"] .phone__chat { background: radial-gradient(rgb(255 255 255 / .04) 1px, transparent 1.4px) 0 0 / 14px 14px, #0B141A; }
html[data-theme="night"] .phone__bubble { background: #005C4B; }
html[data-theme="night"] .phone__bubble textarea { color: #E9EDEF; }
html[data-theme="night"] .phone__day, html[data-theme="night"] .phone__update { background: #1F2C34; color: #8696A0; border-color: transparent; }
html[data-theme="night"] .ask__live { background: linear-gradient(155deg, rgb(0 92 75 / .96), rgb(0 92 75 / .9)); border-color: rgb(143 211 169 / .3); }
html[data-theme="night"] .ask__live-text { color: #E9EDEF; }

/* ---------- call-back sheet ---------- */
html[data-theme="night"] .callback__sheet { background: linear-gradient(170deg, #132B23, #0E2119); box-shadow: 0 -20px 60px -20px rgb(0 0 0 / .8); }
html[data-theme="night"] .callback__x, html[data-theme="night"] .cb-chip span, html[data-theme="night"] .callback__field input, html[data-theme="night"] .callback__tel { background: rgb(255 255 255 / .06); color: #F0F2EA; border-color: rgb(255 255 255 / .16); }
html[data-theme="night"] .callback__tel input { color: #F0F2EA; }
html[data-theme="night"] .callback__tel b { background: rgb(255 255 255 / .08); color: #B6C1B9; }
html[data-theme="night"] .cb-chip input:checked + span { background: #8FD3A9; border-color: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] .callback__wa-text { background: #005C4B; color: #E9EDEF; }

/* ---------- buttons that sit on light sections ---------- */
html[data-theme="night"] :is(.steps, .clinics, .faq, .ask, #facts, .callback__sheet, .reviews) .site-cta--forest { background: #8FD3A9; color: #0B1C15; }
html[data-theme="night"] :is(.steps, .clinics, .faq, .ask, #facts) .site-cta--outline { border-color: rgb(255 255 255 / .3); color: #F0F2EA; }
html[data-theme="night"] .action-bar { background: linear-gradient(155deg, rgb(19 43 35 / .92), rgb(14 33 25 / .8)); border-color: rgb(255 255 255 / .12); box-shadow: inset 0 1px 0 rgb(255 255 255 / .06), 0 14px 40px -12px rgb(0 0 0 / .7); }
html[data-theme="night"] .action-bar__icon { background: rgb(143 211 169 / .16); color: #CFEAD9; }
html[data-theme="night"] .action-bar__icon--maroon { background: #6F2631; color: #fff; }

/* ---------- the switch itself ---------- */
.bar__theme { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgb(255 255 255 / .22); background: rgb(255 255 255 / .08); color: var(--fg, #FBF8F1); cursor: pointer; transition: background .25s ease, transform .3s var(--ease-out); }
.bar__theme:hover { background: rgb(255 255 255 / .16); }
.bar__theme svg { position: absolute; width: 18px; height: 18px; transition: opacity .35s ease, transform .5s var(--ease-out); }
.bar__theme .i-moon { opacity: 1; transform: none; }
.bar__theme .i-sun { opacity: 0; transform: rotate(-60deg) scale(.6); }
html[data-theme="night"] .bar__theme .i-moon { opacity: 0; transform: rotate(60deg) scale(.6); }
html[data-theme="night"] .bar__theme .i-sun { opacity: 1; transform: none; }
.theme-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; background: rgb(255 255 255 / .08); border: 1px solid rgb(255 255 255 / .16); }
.theme-seg button { min-height: 36px; padding: 0 .85rem; border: 0; border-radius: 999px; background: none; color: rgb(251 248 241 / .8); font: inherit; font-size: .875rem; font-weight: 600; cursor: pointer; }
.theme-seg button[aria-checked="true"] { background: var(--gold, #B69357); color: #0A2419; }
@media (max-width: 749px) { .bar__theme { width: 44px; height: 44px; } }

/* a soft cross-fade when the theme changes (browsers with view transitions) */
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; }
@media (prefers-reduced-motion: reduce) { ::view-transition-old(root), ::view-transition-new(root) { animation: none; } }
html[data-theme="night"] .clinic-card__phone { color: #F0F2EA; }
html[data-theme="night"] .area__n { background: rgb(143 211 169 / .14); color: #CFEAD9; }
html[data-theme="night"] .area[aria-pressed="true"] .area__n { background: var(--gold); color: #0A2419; }
/* plain text inherits from <body>; give the night sections their own text colour */
html[data-theme="night"] :is(.page, .callback__sheet) { color: var(--ink); }
html[data-theme="night"] .nidaan__free { background: #6F2631; color: #FFFFFF; }
.bar[data-header-fg="dark"] .bar__theme { border-color: rgb(15 48 34 / .18); background: rgb(255 255 255 / .55); color: var(--forest-900); }