/* lang-switch.css
 *
 * Full-page language switch (English  <->  हिंदी), added as a layer on top of the
 * site's existing bilingual markup. It drives off body[data-prose] (the same flag
 * the reading-language logic and main.js already use). Instead of showing both
 * scripts at once, the page commits fully to one language.
 *
 * The site has three bilingual patterns:
 *   .bl            -> <span class="dv">देव</span><span class="en">English</span>   (headings, buttons)
 *   .sc-side-link  -> <span class="dv">…</span><span class="en">…</span>           (nav)
 *   .dvi           -> <span class="dvi">देव</span> · English                       (inline captions;
 *                     the English half is raw text, so lang-switch.js wraps it in
 *                     <span class="dvi-en"> and tags the .dvi with .dvi--paired)
 */

/* ---- the header toggle (injected into the masthead by lang-switch.js) ---- */
.sc-lang-toggle {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--sc-hair-strong, #d8cfc4);
  border-radius: 999px;
  overflow: hidden;
  background: var(--sc-paper, #fdfaf6);
}
.sc-lang-toggle button {
  border: 0;
  background: transparent;
  padding: 6px 15px;
  font-family: var(--sc-sans, "DM Sans", system-ui, sans-serif);
  font-size: 13px;
  color: var(--sc-soft, #8a7e70);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.sc-lang-toggle button .deva {
  font-family: var(--sc-deva-sans, "Noto Sans Devanagari", sans-serif);
}
.sc-lang-toggle button.active {
  background: var(--sc-teal-deep, #3cc0c5);
  color: #fff;
}

/* the old in-form reading-language toggle is replaced by the header one */
.sc-prose-row {
  display: none !important;
}

/* ============================ the full switch ============================ */

/* HINDI mode: hide every English half (echoes and wrapped .dvi echoes) */
body[data-prose="hi"] .bl .en,
body[data-prose="hi"] .sc-side-link .en,
body[data-prose="hi"] .dvi-en {
  display: none !important;
}

/* ENGLISH mode (default): hide every Devanagari half ... */
body:not([data-prose="hi"]) .bl .dv,
body:not([data-prose="hi"]) .sc-side-link .dv,
body:not([data-prose="hi"]) .dvi--paired {
  display: none !important;
}

/* ... and promote the English half from a small italic echo to the primary line. */
body:not([data-prose="hi"]) .bl .en {
  display: block;
  font-style: normal;
  font-weight: 500;
  opacity: 1;
  margin-top: 0;
  font-size: 1em;
}
body:not([data-prose="hi"]) .bl .en em {
  font-style: normal;
}
body:not([data-prose="hi"]) h1.bl .en {
  font-size: 0.82em;
}
body:not([data-prose="hi"]) .sc-chapter h2.bl .en {
  font-size: 0.88em;
  font-weight: 400;
}
body:not([data-prose="hi"]) .sc-panel-head h3.bl .en {
  font-size: 0.95em;
}
body:not([data-prose="hi"]) .sc-chart-head h3.bl .en {
  font-size: 0.92em;
}
body:not([data-prose="hi"]) .sc-form-head h2.bl .en {
  font-size: 0.9em;
}
body:not([data-prose="hi"]) .sc-btn.bl .en,
body:not([data-prose="hi"]) .advanced-toggle.bl .en {
  font-size: 1em;
  opacity: 1;
  margin-top: 0;
}
body:not([data-prose="hi"]) .sc-side-link .en {
  display: block;
  font-style: normal;
  font-size: 1em;
  font-weight: 500;
  opacity: 1;
}