MediaWiki:Common.css: Difference between revisions

Revision as of 18:36, 23 September 2026

/* ═══════════════════════════════════════════════════════════════════
   MediaWiki:Common.css — Anandamakaranda
   Clean rebuild — works on Vector (desktop) + Minerva (mobile)
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. CSS VARIABLES ──────────────────────────────────────────── */
:root {
  --maroon:       #be100e;
  --orange:       #e65100;
  --light-orange: #f57c00;
  --dark-gray:    #555;
  --light-gray:   #eee;
  --muted-gray:   #888;
  --text:         #1a1a1a;
  --brown:        #a07040;
  --light-brown:  #e8d4a0;

  /* Font stacks. --font-indic is the one to use for anything the reader
     can transliterate. Every face in it is served from this site (§2a), so
     a transliterated page looks the same on every machine instead of
     falling back to whatever the visitor happens to have installed.

     Order matters, not just membership: each face is limited by
     unicode-range to the characters it should own, so the browser walks
     the list and the first face that claims the character wins.
       Gentium Book Plus  → Latin only, i.e. the IAST reading
       AdishilaDev        → Devanagari, danda, and everything unclaimed
       Noto Serif Tamil / Kannada / Telugu → their own blocks
     Gentium sits first because IAST is Latin throughout: if Adishila led,
     plain letters would come from Adishila and only the accented ones
     (ā ī ṛ ṣ …) from Gentium, and the line would look patched together. */
  --font-deva:  'AdishilaDev', 'Adishila', 'Noto Serif Devanagari', serif;
  --font-indic: 'Gentium Book Plus',
                'AdishilaDev', 'Adishila', 'Noto Serif Devanagari',
                'Noto Serif Tamil', 'Noto Sans Tamil',
                'Noto Serif Kannada', 'Noto Sans Kannada',
                'Noto Serif Telugu', 'Noto Sans Telugu',
                'Noto Serif Malayalam', 'Noto Sans Malayalam',
                'Noto Serif Gujarati', 'Noto Sans Gujarati',
                'Noto Serif Bengali', 'Noto Sans Bengali',
                'Noto Serif Gurmukhi', 'Noto Sans Gurmukhi',
                'Noto Serif Oriya', 'Noto Sans Oriya', serif;
  --font-ui:    system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ── 2. FONTS ──────────────────────────────────────────────────── */
@font-face {
  font-family: "Adishila";
  src: url("/resources/fonts/adishila/Adishila.ttf") format("truetype");
  font-weight: normal; font-style: normal;
}
@font-face {
  font-family: "AdishilaBold";
  src: url("/resources/fonts/adishila/AdishilaBold.ttf") format("truetype");
  font-weight: bold; font-style: normal;
}
@font-face {
  font-family: "AdishilaItalic";
  src: url("/resources/fonts/adishila/AdishilaBoldItalic.ttf") format("truetype");
  font-weight: bold; font-style: italic;
}
@font-face {
  font-family: "AdishilaDev";
  src: url("/resources/fonts/AdishilaDev.ttf") format("truetype");
  font-weight: normal; font-style: normal;
}
@font-face {
  font-family: "AdishilaDev";
  src: url("/resources/fonts/AdishilaDev.ttf") format("truetype");
  font-weight: bold; font-style: normal;
}
@font-face {
  font-family: "AdishilaDevGuru";
  src: url("/resources/fonts/AdishilaDevGuru.ttf") format("truetype");
  font-weight: bold; font-style: normal;
}
@font-face {
  font-family: "Noto Sans Devanagari";
  src: url("/resources/fonts/Noto_Sans_Devanagari/NotoSansDevanagari.ttf") format("truetype");
  font-weight: normal; font-style: normal;
}
@font-face {
  font-family: "AdishilaVedic";
  src: url("/resources/fonts/AdishilaVedicSemiBold.ttf") format("truetype");
  font-weight: normal; font-style: normal;
}

/* ── 2a. TRANSLITERATION FONTS ─────────────────────────────────── */
/* One face per script the reader can switch to, served from this site so
   the page reads the same everywhere. Subset to the script's own block and
   compressed to woff2, so each file is 30–110 KB and only the file for the
   script actually on screen is ever downloaded.

   Two numbers do the work of making the scripts sit together:

   size-adjust      scales the face so its letters look the same size as
                    Devanagari at the same font-size. Kannada and Telugu
                    draw taller letters than Devanagari, Gentium draws
                    shorter ones, which is why a switched page used to look
                    like the type size had changed. THIS IS THE KNOB: if a
                    script still reads a shade large or small next to
                    Adishila, move it a percent or two, nothing else.

   ascent/descent   fix where the baseline sits inside the line box. Every
                    face here reports the same 105% above / 40% below, so
                    lines land on the same rhythm in all five scripts and a
                    heading no longer jumps a few pixels when switched.
                    These are written pre-divided by that face's
                    size-adjust, because the browser multiplies the two —
                    change one and the other has to follow.

   Install: put the nine .woff2 files in  /resources/fonts/translit/ . */

/* Tamil — Noto Serif Tamil (SIL OFL) */
@font-face {
  font-family: "Noto Serif Tamil";
  src: url("/resources/fonts/translit/NotoSerifTamil-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0B80-0BFF, U+200C-200D;
  size-adjust: 90%; ascent-override: 116.7%; descent-override: 44.4%; line-gap-override: 0%;
}
@font-face {
  font-family: "Noto Serif Tamil";
  src: url("/resources/fonts/translit/NotoSerifTamil-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0B80-0BFF, U+200C-200D;
  size-adjust: 90%; ascent-override: 116.7%; descent-override: 44.4%; line-gap-override: 0%;
}

/* Kannada — Noto Serif Kannada (SIL OFL) */
@font-face {
  font-family: "Noto Serif Kannada";
  src: url("/resources/fonts/translit/NotoSerifKannada-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0C80-0CFF, U+200C-200D;
  size-adjust: 88%; ascent-override: 119.3%; descent-override: 45.5%; line-gap-override: 0%;
}
@font-face {
  font-family: "Noto Serif Kannada";
  src: url("/resources/fonts/translit/NotoSerifKannada-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0C80-0CFF, U+200C-200D;
  size-adjust: 88%; ascent-override: 119.3%; descent-override: 45.5%; line-gap-override: 0%;
}

/* Telugu — Noto Serif Telugu (SIL OFL) */
@font-face {
  font-family: "Noto Serif Telugu";
  src: url("/resources/fonts/translit/NotoSerifTelugu-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0C00-0C7F, U+200C-200D;
  size-adjust: 92%; ascent-override: 114.1%; descent-override: 43.5%; line-gap-override: 0%;
}
@font-face {
  font-family: "Noto Serif Telugu";
  src: url("/resources/fonts/translit/NotoSerifTelugu-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0C00-0C7F, U+200C-200D;
  size-adjust: 92%; ascent-override: 114.1%; descent-override: 43.5%; line-gap-override: 0%;
}

/* IAST — Gentium Book Plus (SIL OFL). Chosen over a general-purpose serif
   because it draws ṛ ṝ ḷ ḹ ṅ ñ ṭ ḍ ṇ ś ṣ ṃ ḥ m̐ as designed letters rather
   than stacking a loose accent on a Latin one, which is what made the
   romanised reading look ragged. The range stops short of U+0964-0965 on
   purpose: the danda then always comes from the Devanagari face, so it is
   one shape in every script. */
@font-face {
  font-family: "Gentium Book Plus";
  src: url("/resources/fonts/translit/GentiumBookPlus-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0000-024F, U+0259, U+0300-036F, U+1E00-1EFF, U+2000-206F, U+20A0-20BF, U+2122;
  size-adjust: 112%; ascent-override: 93.8%; descent-override: 35.7%; line-gap-override: 0%;
}
@font-face {
  font-family: "Gentium Book Plus";
  src: url("/resources/fonts/translit/GentiumBookPlus-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0000-024F, U+0259, U+0300-036F, U+1E00-1EFF, U+2000-206F, U+20A0-20BF, U+2122;
  size-adjust: 112%; ascent-override: 93.8%; descent-override: 35.7%; line-gap-override: 0%;
}
@font-face {
  font-family: "Gentium Book Plus";
  src: url("/resources/fonts/translit/GentiumBookPlus-Italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
  unicode-range: U+0000-024F, U+0259, U+0300-036F, U+1E00-1EFF, U+2000-206F, U+20A0-20BF, U+2122;
  size-adjust: 112%; ascent-override: 93.8%; descent-override: 35.7%; line-gap-override: 0%;
}

/* ── 2b. APPLYING THEM ─────────────────────────────────────────── */
/* Most rules below name an Adishila face directly, which is right for
   Devanagari and useless for anything else: Adishila has no Tamil, Kannada
   or Telugu letters, so a switched page fell through to the visitor's
   default serif — a different font per machine, and often a different one
   per line. common.js puts the chosen script on <html data-gr-script="…">,
   so while a transliteration is showing, every span the switcher rewrote
   moves onto --font-indic and picks up the faces above. Devanagari is the
   no-attribute case and is left exactly as it was. */
html[data-gr-script]:not([data-gr-script="deva"]) [data-deva],
html[data-gr-script]:not([data-gr-script="deva"]) .gr-sticky-title,
html[data-gr-script]:not([data-gr-script="deva"]) .gr-sr-section-title,
html[data-gr-script]:not([data-gr-script="deva"]) .gr-sr-snippet,
html[data-gr-script]:not([data-gr-script="deva"]) .gr-sr-group-name {
  font-family: var(--font-indic) !important;
}
/* The bold and italic Adishila faces are separate families rather than
   weights, so a transliterated prateeka or quotation has to ask for the
   weight it wants instead. */
html[data-gr-script]:not([data-gr-script="deva"]) .gr-prateeka         { font-weight: 700; }
html[data-gr-script]:not([data-gr-script="deva"]) .gr-mulaprateeka-block { font-style: italic; }

body {
 background-color: #fff;
}

/* ── Icon base ──────────────────────────────────────────────────── */
.gra-icon {
  display: inline-block;
  width:  20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}
/* comment.svg → Feedback (flag/report)  */
.gra-icon-feedback { background-image: url('/images/feedback.svg'); }
/* notes.svg   → Notes                  */
.gra-icon-note     { background-image: url('/images/notes.svg'); }
.gra-icon-bookmark { background-image: url('/images/bookmark.svg'); }
.gra-icon-copy     { background-image: url('/images/copy.svg'); }
.gra-icon-search { background-image: url('/images/search.svg'); }
.gra-icon-dismiss { background-image: url('/images/close.svg'); }
.gra-icon-prev { background-image: url('/images/prev.svg'); }
.gra-icon-next { background-image: url('/images/next.svg'); }
.gra-icon-footnote { background-image: url('/images/footnote.svg'); }
.gra-icon-sandarbha { background-image: url('/images/reference.svg'); }


#mw-content-text {
  font-family: 'Adishila';
}

.mw-parser-output {
  font-size: 22px;
  line-height: 1.7;
  color: #555;
  max-width: 100%;
  width: 100%;
  margin: 0; padding: 0;
  box-sizing: border-box;
}

// Danda marks wrap issue
.mw-parser-output { overflow-wrap: anywhere; }

/* ── 4. HIDE ELEMENTS (both skins) ────────────────────────────── */
/* Page title */
h1.firstHeading, #firstHeading, .mw-page-title-main { display: none !important; }
/* Footer */
#footer, .mw-footer, .vector-footer, .vector-footer-container,
footer, .minerva-footer { display: none !important; }
/* Categories */
.catlinks, #catlinks, .mw-normal-catlinks, .mw-hidden-catlinks { display: none !important; }
/* Edit section links */
.mw-editsection, .mw-editsection-bracket { display: none !important; }
/* Site notice */
#siteNotice { display: none !important; }
/* Watchlist */
li#pt-watchlist, li#pt-watchlist-kbd { display: none !important; }
/* Appearance panel */
#vector-appearance, #vector-appearance-pinned-container,
#vector-appearance-unpinned-container, .mw-portlet-appearance,
#p-appearance, [aria-controls="vector-appearance"] { display: none !important; }
/* Vector hamburger + sidebar */
#mw-sidebar-button, .vector-main-menu, .vector-main-menu-container,
.vector-main-menu-landmark, #vector-main-menu-dropdown { display: none !important; }
/* Vector search box (we use our own) */
#p-search, .vector-search-box, .vector-search-box-vue,
.vector-search-box-collapses { display: none !important; }
/* Vector page toolbar */
.vector-page-toolbar, .vector-page-toolbar-container { display: none !important; }
/* Vector page tools */
.vector-page-tools { display: none !important; }
/* Empty paragraphs */
.mw-parser-output p:empty,
.mw-parser-output > div > p:empty,
.mw-heading + p:empty,
.adhyaya-block + p:empty,
.verse-block + p:empty { display: none !important; margin: 0 !important; }
/* Empty divs */
.adhyaya-block:empty, .mw-parser-output div:empty { display: none !important; }
/* Cargo hidden */
.cargo-store-only { display: none !important; }

/* ── 5. VECTOR HEADER (desktop only) ──────────────────────────── */
.vector-header-container {
  background: #b5451b !important;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.vector-header {
  background: transparent !important;
  max-width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.vector-header-start {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px;
}
.vector-header-end {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px;
  margin-left: auto;
}
.mw-logo { display: flex !important; align-items: center; opacity: 1 !important; }
.mw-logo-icon { width: 24px; height: 24px; }

/* Site name */
.mw-logo-wordmark {
  font-size: 0 !important;
  white-space: nowrap;
  display: flex !important;
  flex-direction: column !important;
}
.mw-logo-wordmark::before {
  content: 'Anandamakaranda';
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  font-family: system-ui, -apple-system, sans-serif;
  letter-spacing: -0.01em;
}
.mw-logo-wordmark::after {
  content: "A Digital Archive of Dvaita Vedanta Literature";
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: rgba(255,255,255,0.85);
  letter-spacing: 0.3px;
  margin-top: 1px;
  font-family: sans-serif;
}

/* Header right links */
.vector-header-end > *:not(#p-search) { color: rgba(255,255,255,0.9) !important; }
.vector-user-links a { color: rgba(255,255,255,0.9) !important; }

/* User icon white */
.vector-user-menu-container .vector-icon svg,
.vector-user-menu-container .vector-icon svg path,
.vector-user-menu-container .vector-icon svg circle {
  fill: #fff !important; stroke: #fff !important;
}
.vector-user-links .vector-user-menu-chevron .vector-icon svg,
.vector-user-links .vector-user-menu-chevron .vector-icon svg path {
  fill: rgba(255,255,255,0.9) !important;
}

/* User dropdown — dark text on white card */
.vector-user-menu .mw-list-item a,
.vector-user-menu .vector-menu-content-list a,
#p-personal .vector-menu-content a,
.mw-portlet-personal .vector-menu-content a { color: #202122 !important; }
.vector-user-menu .mw-list-item a:hover { color: var(--light-orange) !important; }

/* Suppress Vector sticky header clone */
.vector-sticky-header { display: none !important; }

/* Suppress body top padding that Vector adds */
.mw-body { margin-top: 0 !important; padding-top: 0 !important; }

/* ── 6. VECTOR TOC (desktop sidebar) ──────────────────────────── */
/* Levels are told apart by size, weight and colour; nesting is shown by
   indentation and a guide line. Every rule below uses the child
   combinator (>), so highlighting an entry never spills onto the
   sub-entries underneath it. */
.vector-toc .vector-toc-numb { display: none !important; }
.vector-toc .vector-toc-title {
  font-size: 15px !important; font-weight: 700 !important;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--text) !important;
  font-family: var(--font-indic) !important;
}
.vector-toc .vector-toc-text {
  white-space: normal !important; word-break: break-word !important;
  overflow-wrap: anywhere !important; display: inline !important;
  font-family: var(--font-indic) !important;
}
/* :not() keeps this off the मूलम् / उल्लेख buttons that sit in the same
   panel — otherwise this rule reshaped them into flat contents links. */
.vector-toc a:not(.toc-main-link-item), .vector-toc .vector-toc-link {
  display: block;
  font-family: var(--font-indic) !important;
  font-size: 20px; color: var(--text) !important; text-decoration: none !important;
  padding: 4px 8px; border-radius: 5px; line-height: 1.45;
  transition: background 0.12s, color 0.12s;
}

/* Level 1 = section heading, level 2+ = sub-sections. Sizes are in px so
   they stay readable next to the 22-24px body text; the levels are told
   apart by weight and colour as much as by size. */
.vector-toc .vector-toc-level-1 > .vector-toc-link {
  font-size: 21px !important; font-weight: 600 !important; color: var(--text) !important;
}
.vector-toc .vector-toc-level-2 > .vector-toc-link {
  font-size: 19px !important; font-weight: 400 !important; color: #4d4d4d !important;
}
.vector-toc .vector-toc-level-3 > .vector-toc-link,
.vector-toc .vector-toc-level-4 > .vector-toc-link,
.vector-toc .vector-toc-level-5 > .vector-toc-link {
  font-size: 18px !important; font-weight: 400 !important; color: #6b6b6b !important;
}

/* Nesting: indent each level and run a guide line down it */
.vector-toc .vector-toc-contents,
.vector-toc .vector-toc-list { list-style: none !important; }
.vector-toc .vector-toc-contents { margin: 0 !important; padding: 0 !important; }
.vector-toc .vector-toc-list-item .vector-toc-list {
  margin: 0 0 0 9px !important; padding-left: 10px !important;
  border-left: 1px solid #ece0da;
}
.vector-toc .vector-toc-list-item { margin: 1px 0 !important; list-style: none !important; }

.vector-toc .vector-toc-link:hover { background: #fbf1ec; color: var(--orange) !important; }

/* The one entry the reader is actually on */
.vector-toc .vector-toc-link.gr-toc-current,
.vector-toc .vector-toc-link.gr-toc-current .vector-toc-text {
  color: var(--orange) !important; font-weight: 700 !important;
}
.vector-toc .vector-toc-link.gr-toc-current {
  background: #fdf1e9; box-shadow: inset 2px 0 0 var(--orange);
}
/* Its parent sections: darker text only, so the path is readable without
   the whole branch lighting up */
.vector-toc .vector-toc-list-item.gr-toc-in-path > .vector-toc-link {
  color: var(--text) !important; font-weight: 600 !important;
}
/* Vector's own active class can sit on a parent as well as the current
   item, which is what made whole branches highlight — neutralised here;
   the gr-toc- classes above are the ones that carry the state. */
.vector-toc .vector-toc-list-item-active > .vector-toc-link,
.vector-toc .vector-toc-list-item-active > .vector-toc-link * {
  color: inherit; font-weight: inherit;
}
.vector-toc .cdx-button.vector-toc-toggle {
  background: none !important; border: none !important;
  box-shadow: none !important; color: var(--text) !important;
}

/* ── 7. HEADINGS ───────────────────────────────────────────────── */
.mw-parser-output h1, .mw-parser-output h2, .mw-parser-output h3, .mw-parser-output h4,
.mw-parser-output .mw-heading h1, .mw-parser-output .mw-heading h2,
.mw-parser-output .mw-heading h3 {
  font-family: var(--font-indic);
  border: none !important; padding: 0 !important; background: none !important;
}
.mw-parser-output .mw-heading { border: none !important; margin: 0; padding: 0; }

.mw-heading, .mw-heading2, .mw-heading3 { text-align:center; }
.mw-parser-output h2, .mw-parser-output .mw-heading2 h2 {
  font-size: 1.2em !important; font-weight: 500 !important;
  color: var(--maroon) !important; line-height: 1.8;
  margin: 24px 0 4px !important;
  border-bottom: 2px dotted var(--maroon) !important;
  width: 75%; font-family: var(--font-indic); text-align: center;
}
.mw-parser-output h3, .mw-parser-output .mw-heading3 h3 {
  font-size: 1em !important; font-weight: 500 !important;
  color: var(--orange) !important; line-height: 1.5;
  margin: 24px 0 8px !important;
  border-bottom: 1px dotted var(--orange) !important;
  width: 55%; font-family: var(--font-indic); text-align: center;
}

/* ── 8. PARAGRAPHS ─────────────────────────────────────────────── */
.mw-parser-output p { margin: 0 0 0.35rem !important; }

/* ── 9. DOCUMENT TITLE ─────────────────────────────────────────── */
.gr-doc-title {
  font-size: 2em; font-weight: 500; color: var(--maroon);
  line-height: 1.4; margin: 0 0 16px; border: none !important;
  text-align:center; font-family: var(--font-indic);
}

/* ── 10. VERSE BLOCKS ──────────────────────────────────────────── */
.shloka-block { display: block; text-align: left; margin: 3px 0 0; padding-bottom: 0.5em; }
.shloka-line { display: block; font-style: normal; color: #333; line-height: 1.35; margin: 0; }
.verse-block { display: block; margin: 6px 0 0; text-align: left; }
.verse-block .shloka-block { text-align: left; margin: 0; }
.verse-block .shloka-line {
  display: block; font-weight: 500; line-height: 1.35; margin: 0; color: var(--maroon);
}
.verse-block.normal .shloka-line { color: #555; }
.verse-block + p { display: none !important; margin: 0 !important; }
.mw-parser-output .verse-block,
.mw-parser-output .shloka-block { margin-top: 2px !important; margin-bottom: 2px !important; }

.gr-verse-text, .verse-line, .verse-text {
  color: #b5451b; line-height: 1.5; display: block; margin: 0.1em 0;
}
.gr-verse-type-sutra .gr-verse-text,
.verse-block[data-type="sutra"] .verse-line { font-style: normal; font-weight: 600; color: #b5451b; }

/* ── 11. UVACHA ────────────────────────────────────────────────── */
.uvacha-block {
  display: block; font-weight: bold; color: #c65;
  margin: 0.5rem 0 0; padding: 2px 0 2px 12px;
  border-left: 3px solid #c65; font-style: normal;
}
.uvacha-block + .verse-block { margin-top: 2px; }
.gr-uvaaca, .uvaaca {
  color: #b5451b; font-weight: 600; font-size: 0.92em; margin: 0.5em 0 0.2em 0; display: block;
}

/* ── 12. BHASHYAM ──────────────────────────────────────────────── */
.bhashyam-block {
  display: block; font-size: 1em; line-height: 1.6; color: #555;
  padding: 0; border: none; background: transparent;
}
.gr-bhashyam, .commentary-bhashyam {
  color: #222; font-style: normal; line-height: 1.75; margin: 0.3em 0 0.5em 0;
}
.gr-leading-bhashya { color: #555; }

/* ── 13. PADYA ─────────────────────────────────────────────────── */
.padya-block {
  display: block; font-size: 1em; line-height: 1.75; color: #c65 !important;
  font-weight: 500; margin: 0.4em 0 0.6em 60px;
}
.gr-padapatha { font-size: 0.9em; color: #555; margin: 0.2em 0 0.3em 0.8em; }

/* ── 14. TEEKA ─────────────────────────────────────────────────── */
.teeka-block {
  padding: 6px 10px 8px; margin: 0.3em 0; line-height: 1.6; color: #555; background: #fcf5f3;
    border-radius: 12px;
}
.teeka-title {
  font-family: 'AdishilaDev';, sans-serif !important;
  font-size: 0.75em; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  margin-bottom: 4px; padding-bottom: 3px;
}
.teeka-body .shloka-block {
  margin: 0.4em 0; padding: 0.3em 0.6em; font-family: 'AdishilaDev';
}
.teeka-body .shloka-line { font-size: 0.97em; font-family: 'AdishilaDev'; }

/* ── 15. PRATEEKA / MOOLA ──────────────────────────────────────── */
.gr-prateeka { font-weight: bold; font-style: normal; color: #333; font-family: 'AdishilaBold' }
.gr-mulaprateeka-block {
  font-family: 'AdishilaItalic';
  text-align: center; color: #333; margin: 0.7em 0 0.3em; line-height: 1.5;
}
.gr-moola { font-weight: bold; color: #c65; }

/* ── 16. ADHYAYA ───────────────────────────────────────────────── */
.adhyaya-block { margin: 0 0 4px; }
.adhyaya-trans { font-size: 0.9em; color: #666; margin: 2px 0 0; }
.adhyaya-intro { margin-top: 8px; line-height: 1.75; color: #555; }
.introduction p { color: var(--dark-gray); font-weight: 400; margin: 0 !important; padding: 0 !important; }
.introduction { padding-bottom: 0.5em; text-align: justify; }

/* ── 17. NYAYA / PRASNA ────────────────────────────────────────── */
.nyaya-block { margin: 32px 0; padding-top: 12px; border-top: 1px solid #eee; }
.nyaya-title {
  font-size: 1em; font-weight: 500; color: var(--orange);
  margin-bottom: 0.4rem; border-bottom: 1px dotted var(--orange); width: 50%;
}
.nyaya-body { color: #555; line-height: 1.75; margin-top: 0.5rem; }
.prasna-block { margin: 32px 0; padding-top: 12px; border-top: 1px solid #eee; }
.prasna-title {
  font-size: 1em; font-weight: 500; color: var(--orange);
  margin-bottom: 0.4rem; border-bottom: 1px dotted var(--orange); width: 50%;
}
.prasna-question, .prasna-answer { color: #555; line-height: 1.75; margin-top: 0.5rem; }
.prasna-answer { margin-left: 60px; }

/* ── 18. VYAKHYA ELEMENTS ──────────────────────────────────────── */
.gr-vyakhya-head, .gr-section-head {
  font-size: 0.9em; font-weight: 700; color: var(--orange);
  margin: 0.35em 0 0.15em; font-family: inherit; border: none; padding: 0;
}
.gr-avataranika {
  color: #444; margin: 0.2em 0 0.5em 0.5em;
  padding-left: 0.6em; border-left: 2px solid #c9a96e; line-height: 1.6;
}
.gr-vyakhya-pada {
  font-size: 0.88em; color: #555; background: #fafafa;
  border: 1px solid #e8e0d0; border-radius: 4px; padding: 0.5em 0.8em;
  margin: 0.5em 0; line-height: 1.5; white-space: pre-wrap;
}
.gr-vyakhya-gadya {
  font-weight: bold;
}
.gr-vyakhya-para { margin: 0 0 0.5em 0; line-height: 1.65; color: #444; }
.gr-embedded-bhashya { margin: 0.2em 0 0.2em 1em; line-height: 1.6; }
.gr-gadya {
 font-family: 'Adishila';font-weight: bold; display: block !important; margin-left: 0.2em;}
.gr-author-note {
  font-style: italic; color: var(--maroon); text-align: center; font-size: 0.9em;
  margin: 0.8em 0 0.4em 0; border-top: 1px solid #ddd; padding-top: 0.4em; font-family: 'AdishilaDev'
}
.gr-devatachandas {     
    font-size: 1em;
    color: #f77628;
    font-weight: 500;
    margin-top: 10px;
    text-align: center; }
.gr-vargikarana   {     
    font-size: 1em;
    color: #f77628;
    font-weight: 500;
    margin-top: 10px;
    text-align: center; }
.gr-veda {
 font-family: "AdishilaVedic";
}

/* ── 20. BHASHYA COLLECTION ────────────────────────────────────── */
.mw-parser-output .bhashya-collection { margin: 0; padding: 0; }
.mw-parser-output .bhashya + p:empty,
.mw-parser-output .verse + p:empty,
.mw-parser-output .bhashya-collection + p:empty,
.mw-parser-output .pramana + p:empty,
.mw-parser-output .author-note + p:empty { display: none !important; margin: 0 !important; height: 0 !important; }

/* ── 21. VERSE ACTIONS ─────────────────────────────────────────── */
.verse-actions {
  display: flex; flex-direction: row; align-items: center;
  gap: 6px; margin-top: 4px; justify-content: center;
}
.verse-action-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 4px; border-radius: 6px; cursor: pointer; opacity: 0.75; transition: all 0.2s;
}
.verse-action-btn:hover { opacity: 1; background-color: rgba(0,0,0,0.05); }
.icon { display: inline-block; width: 18px; height: 18px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.icon-copy       { background-image: url('/images/copy.svg'); }
.icon-commentary { background-image: url('/images/commentary.svg'); }
.copy-tooltip {
  position: absolute; bottom: calc(100% + 8px); left: 50%;
  transform: translateX(-50%) translateY(4px);
  white-space: nowrap; pointer-events: none; z-index: 9999;
  display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px;
  font-size: 0.75rem; font-weight: 500; background: rgba(30,30,30,0.82); color: #fff;
  opacity: 0; transition: opacity 0.2s, transform 0.2s;
}
.copy-tooltip.copy-tooltip-visible { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ── 22. CODE / PRE ────────────────────────────────────────────── */
pre, code, .mw-code, tt, kbd {
  font-family: 'Adishila', 'Noto Serif Devanagari', serif ;
  background-color: transparent !important; border: none !important; padding: 0.3em 0 !important;
}
.mw-collapsible, .mw-collapsible-content, blockquote, .quotebox {
  background-color: transparent !important; border: none !important;
  font-style: normal !important; padding: 0 !important; margin-left: 0 !important;
}

/* ── 23. INLINE TOC BOX (wikitext __TOC__) ─────────────────────── */
.toc {
  display: block !important; background: #fffdf5; border: 1px solid #e8c88a;
  border-radius: 8px; padding: 12px 16px; margin: 0 0 24px 0;
  width: fit-content; min-width: 220px; max-width: 420px;
  font-size: 0.9em; line-height: 2;
}
.toc h2, .toc .toctitle {
  font-size: 0.85em !important; font-weight: 600 !important; color: var(--text) !important;
  border: none !important; margin: 0 0 6px !important; text-transform: uppercase; letter-spacing: 0.05em;
}
.toc ul { margin: 0 !important; padding-left: 1.2em !important; list-style: none !important; }
.toc li { margin: 0; padding: 0; }
.toc a { color: var(--text) !important; text-decoration: none !important; }
.toc a:hover { color: var(--light-orange) !important; }
.toc .toclevel-1 > a { font-weight: 600; }
.tocnumber { display: none; }

/* ── 24. DOC TEEKAS + TOC NAV ──────────────────────────────────── */
.gr-doc-teekas { margin-bottom: 1em; }
.gr-doc-teekas + p:empty { display: none !important; margin: 0 !important; height: 0 !important; }
/* मूलम् / उल्लेख — real buttons, not grey chips: they are how a reader
   moves between the text and its commentaries, so they read as actions.
   Used by the desktop TOC and the mobile document nav alike. */
.toc-main-links {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; align-items: center;
  margin: 6px 0 18px; padding: 0 0 16px; border-bottom: 1px solid #f1e3dc;
}
/* Sitting under the document title in the page, not in the panel */
#gr-toc-doc-nav.toc-main-links { margin: 10px auto 22px; max-width: 640px; }
.toc-main-link-item {
  flex: 0 1 auto; min-width: 92px; text-align: center;
  font-family: var(--font-indic); font-size: 18px; font-weight: 600; line-height: 1.4;
  color: #fff !important; background: #b5451b; border: 0; border-radius: 999px;
  padding: 9px 18px; text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(60, 20, 10, 0.22);
  transition: background 0.15s, box-shadow 0.15s;
}
.toc-main-link-item:visited { color: #fff !important; }
.toc-main-link-item:hover,
.toc-main-link-item:focus-visible { background: #97370f !important; color: #fff !important; box-shadow: 0 2px 6px rgba(60, 20, 10, 0.26); }
/* Phone: the same buttons as a pill row under the document title, shaped
   like the reader toolbar's controls. White on the brand colour, stated
   with !important because the skin colours links on its own. */
.skin-minerva #gr-mob-doc-nav {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  margin: 4px 0 14px; padding: 0 12px 14px; border-bottom: 1px solid #f0e0d6;
}
.skin-minerva #gr-mob-doc-nav .toc-main-link-item { font-size: 17px; padding: 11px 26px; min-width: 116px; }
.skin-minerva .toc-main-link-item,
.skin-minerva .toc-main-link-item:visited,
.skin-minerva .toc-main-link-item:active { color: #fff !important; }

/* ── 25. MAIN PAGE ─────────────────────────────────────────────── */
body.page-Main_Page #mw-panel,
body.page-Main_Page .vector-sidebar-container { display: none !important; }

.gr-home { max-width: 1140px; margin: 0 auto; padding: 0 0 40px; }
.gr-home-page-title {
  font-family: 'Adishila', 'Noto Serif Devanagari', serif !important;
  text-align: center; font-size: 1.8em; font-weight: 500; color: #1a2e40; margin: 24px 0 32px;
}

/* Section label: centred, with a rule running out on each side */
.gr-home-group-label {
  display: flex; align-items: center; gap: 16px;
  font-family: 'Adishila', 'Noto Serif Devanagari', serif !important;
  font-size: 1.1em; font-weight: 600; color: #1a2e40;
  margin: 40px 0 18px; padding: 0; border: 0;
}
.gr-home-group-label::before,
.gr-home-group-label::after {
  content: ""; flex: 1; height: 1px;
}
.gr-home-group-label::before { background: linear-gradient(90deg, transparent, #e2c3b9); }
.gr-home-group-label::after  { background: linear-gradient(90deg, #e2c3b9, transparent); }
#gr-view-grantha > .gr-home-group-label:first-child { margin-top: 8px; }

/* Cards sit on a grid, so every row lines up */
.gr-home-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px; align-items: start; margin-bottom: 12px;
}
.gr-home-card {
  background: #fff; border: 1px solid #efe4df; border-top: 3px solid #c0392b; border-radius: 10px;
  box-shadow: 0 1px 3px rgba(60, 20, 10, 0.06);
  padding: 0; min-width: 0; overflow: hidden;
}
.gr-home-card-title {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  font-family: 'Adishila', 'Noto Serif Devanagari', serif !important;
  font-size: 1em; font-weight: 600; color: #1a2e40; text-align: center; line-height: 1.4;
  margin: 0; padding: 12px 16px; background: #fcf6f3; border-bottom: 1px solid #f1e2dc;
}
.gr-home-card-count {
  flex: none; padding: 0 8px; border-radius: 999px; background: #fff; border: 1px solid #ecd3ca;
  color: #c0392b; font: 600 11px/1.7 system-ui, sans-serif;
}

/* Numbered rows: number in a soft circle, a hairline between rows */
.gr-home-card ol { margin: 0; padding: 6px 0 8px; list-style: none; counter-reset: gr-item; }
/* Each row is a two-column grid: number | title. The number sits in the
   title's own row and is centred on it, so it lines up whatever the font. */
.gr-home-card li {
  counter-increment: gr-item; list-style: none;
  display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 12px; align-items: center;
  margin: 0; padding: 8px 16px; border-top: 1px solid #f6efec;
  font-size: 0.95em; line-height: 1.6; color: #333; overflow-wrap: anywhere;
}
.gr-home-card li:first-child { border-top: 0; }
.gr-home-card li::before {
  content: counter(gr-item);
  grid-column: 1; grid-row: 1; justify-self: center;
  min-width: 22px; height: 22px; padding: 0 4px; box-sizing: border-box; border-radius: 11px;
  background: #fbece8; color: #c0392b; text-align: center; font: 600 11px/22px system-ui, sans-serif;
}
.gr-home-card li > * { grid-column: 2; }
.gr-home-card li > a:first-child, .gr-home-card li > a:first-of-type { grid-row: 1; }
.gr-home-card li:hover { background: #fdf8f6; }
.gr-home-card li a { color: #c0392b; text-decoration: none; }
.gr-home-card li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.gr-home-card li a.new { color: #c08080; }
.gr-home-note { display: block; font-size: 0.82em; color: #888; line-height: 1.4; }

/* A card with a long list (Madhvacharya's 38 works) spans two columns */
@media (min-width: 900px) {
  .gr-home-card.gr-home-card-wide { grid-column: span 2; }
  .gr-home-card.gr-home-card-wide ol { column-count: 2; column-gap: 0; column-rule: 1px solid #f3e9e5; }
  .gr-home-card.gr-home-card-wide li { break-inside: avoid; }
}

/* ── 26. TOGGLE BUTTONS ────────────────────────────────────────── */
/* One segmented control instead of two separate buttons */
.gr-home-toggle {
  display: flex; gap: 4px; width: max-content; max-width: 100%; box-sizing: border-box;
  margin: 4px auto 28px; padding: 4px;
  background: #f7ece8; border: 1px solid #efd9d1; border-radius: 999px;
}
.gr-toggle-btn {
  font-family: 'Adishila', 'Noto Serif Devanagari', serif;
  font-size: 0.88em; padding: 7px 24px; border: 0; border-radius: 999px; text-align: center;
  background: transparent; color: #a0402f; cursor: pointer; user-select: none;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.gr-toggle-btn:hover { background: rgba(255, 255, 255, 0.7); color: #c0392b; }
.gr-toggle-btn.gr-toggle-active { background: #c0392b; color: #fff; box-shadow: 0 1px 4px rgba(192, 57, 43, 0.35); }
.gr-toggle-btn:focus-visible { outline: 2px solid #c0392b; outline-offset: 2px; }

/* ── 27. SCRIPT BAR ────────────────────────────────────────────── */
.gr-script-bar { margin: 0 0 20px; font-size: 0.8em; color: #888; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.gr-script-label { font-family: system-ui, sans-serif; color: #aaa; }
.gr-script-btn { font-family: 'Adishila', 'Noto Serif Devanagari', serif; color: #c0392b !important; text-decoration: underline dotted !important; cursor: pointer; }
.gr-script-btn.active { color: #888 !important; text-decoration: none !important; cursor: default; }

/* ── 28. MODALS ────────────────────────────────────────────────── */
.grantha-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.35); display: flex; align-items: center; justify-content: center; z-index: 10000; }
.grantha-modal-box { background: white; padding: 20px; border-radius: 10px; width: 300px; }
.gm-title { font-weight: bold; margin-bottom: 10px; }
.gm-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 12px; }

/* ── 29. LOGIN PAGE ────────────────────────────────────────────── */
body.page-Special_UserLogin .vector-search-box,
body.page-Special_UserLogin #p-search { display: none !important; }
body.page-Special_UserLogin #content { max-width: 420px; margin: 40px auto !important; }

/* ── 30. SPECIAL PAGES ─────────────────────────────────────────── */
body.ns-special #footer, body.ns-special .mw-footer,
body.ns-special .vector-footer { display: none !important; }
body.ns-special .vector-page-tools { display: none !important; }

/* ── 31. MINERVA (mobile) ──────────────────────────────────────── */
.skin-minerva .mw-parser-output {
  font-size: 18px !important;
  line-height: 1.8 !important;
}
.skin-minerva .mw-parser-output h2,
.skin-minerva .mw-parser-output .mw-heading2 h2 {
  width: 100% !important;
}
.skin-minerva .mw-parser-output h3,
.skin-minerva .mw-parser-output .mw-heading3 h3 {
  width: 100% !important;
}
/* Home grid single column on Minerva */
.skin-minerva .gr-home-grid { grid-template-columns: 1fr; gap: 14px; }
.skin-minerva .gr-home-toggle { width: 100%; margin: 4px 0 20px; }
.skin-minerva .gr-toggle-btn { flex: 1; padding: 8px 10px; }
.skin-minerva .gr-home-group-label { margin: 28px 0 14px; }
/* Hide things that should be hidden on mobile too */
.skin-minerva .catlinks,
.skin-minerva #catlinks { display: none !important; }
.skin-minerva .mw-editsection { display: none !important; }
/* Minerva already has its own TOC — hide our inline .toc */
.skin-minerva .toc { display: none !important; }
/* ReaderToolbar on Minerva */
.skin-minerva #gr-static-bar {
  height: auto !important;
  min-height: 52px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
.skin-minerva #gr-static-bar::-webkit-scrollbar { display: none !important; }
.skin-minerva .gr-controls .gr-btn {
  height: 44px !important;
  min-width: 44px !important;
  font-size: 14px !important;
}
.skin-minerva .gr-btn-staging { display: none !important; }
.skin-minerva .gr-controls .gr-sep { display: none !important; }
/* Minerva already shows page title — don't double-hide */
.skin-minerva h1.firstHeading { display: block !important; }

/* ── 32. PRINT ─────────────────────────────────────────────────── */
@media print {
  #gr-static-bar, .gr-controls, .vector-header-container { display: none !important; }
  .mw-parser-output { font-size: 11pt !important; }
}

/* ── 33. TYPOGRAPHY CLASSES ────────────────────────────────────── */

/* Heading — center, maroon, AdishilaDevGuru */
.gr-heading {
  display: block;
  text-align: center;
  font-size: 1.09em;
  font-weight: 500;
  color: #be100e;
  font-family: 'AdishilaDevGuru', 'Adishila', 'Noto Serif Devanagari', serif;
  line-height: 1.4;
  margin: 0.45em 0;
}

/* Sub-heading — center, orange, AdishilaDevGuru */
.gr-sub-heading {
  display: block;
  text-align: center;
  font-size: 0.73em;
  font-weight: 500;
  color: #e65100;
  font-family: 'AdishilaDevGuru', 'Adishila', 'Noto Serif Devanagari', serif;
  line-height: 1.5;
  margin: 0.5em 0;
}

/* Chapter Heading — center, maroon, AdishilaDevGuru */
.gr-chapter-heading {
  display: block;
  text-align: center;
  font-size: 0.82em;
  font-weight: 500;
  color: #be100e;
  font-family: 'AdishilaDevGuru', 'Adishila', 'Noto Serif Devanagari', serif;
  line-height: 1.5;
  margin: 0.5em 0;
}

/* M.Veda Shloka — left, bold, maroon, AdishilaVed, 5mm indent */
.gr-mv-shloka {
  display: block;
  text-align: left;
  font-size: 0.82em;
  font-weight: bold;
  color: #be100e;
  font-family: 'AdishilaVed', 'Adishila', 'Noto Serif Devanagari', serif;
  padding-left: 0.86em;
  margin: 0;
  line-height: 1.75;
}

/* M.Veda Gadya — justify, bold, maroon, AdishilaVed */
.gr-mv-gadya {
  display: block;
  text-align: justify;
  font-size: 0.82em;
  font-weight: bold;
  color: #be100e;
  font-family: 'AdishilaVed', 'Adishila', 'Noto Serif Devanagari', serif;
  text-indent: 1.18em;
  padding-left: 0.36em;
  margin: 0;
  line-height: 1.75;
}

/* M.Shloka — left, bold, orange, AdishilaDev, 5mm indent */
.gr-m-shloka {
  display: block;
  text-align: left;
  font-weight: bold;
  color: var(--maroon);
  font-family: 'AdishilaDev', 'Adishila', 'Noto Serif Devanagari', serif;
  margin: 0;
}

/* B.Shloka / TK.Shloka / TP.Shloka — left, black, AdishilaDev */
.gr-b-shloka,
.gr-tp-shloka {
  display: block;
  text-align: left;
  font-weight: normal;
  color: #1a1a1a;
  font-family: 'AdishilaDev', 'Adishila', 'Noto Serif Devanagari', serif;
  margin: 0;
}

/* Reference — orange, AdishilaDev */
.gr-reference {
  font-family: 'AdishilaDev', 'Adishila', 'Noto Serif Devanagari', serif; color: var(--maroon);
}

/* Custom tag span — subtle dashed underline only */
.gr-custom {
  border-bottom: 1px dashed #b5451b;
  padding-bottom: 1px;
}

.gr-crosslink {
	color: #1a73e8;
	text-decoration: underline;
	cursor: pointer;
}
.gr-crosslink:hover {
	color: #0b57cf;
}

/* ── 34. MINERVA HEADER — orange theme + sticky ────────────────── */

/* Kill space above header */
.skin-minerva body { margin-top: 0 !important; padding-top: 0 !important; }
.skin-minerva #mw-mf-viewport,
.skin-minerva #mw-mf-page-center { margin-top: 0 !important; padding-top: 0 !important; }

/* Header — orange, sticky */
.skin-minerva header.header-container {
  background: #b5451b !important;
  position: fixed !important;
  top: 0 !important;
  z-index: 200 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff;
}
.skin-minerva .minerva-header {
  background: #b5451b !important;
  display: flex !important;
  align-items: center !important;
  min-height: 54px !important;
  padding: 0 12px !important;
  margin: 0 !important;
}

.minerva-icon {
 
 filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(1%) hue-rotate(296deg) brightness(104%) contrast(100%);
}

/* Site name text */
.skin-minerva .branding-box { background: transparent !important; }
.skin-minerva .branding-box a {
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
}
.skin-minerva .branding-box a span {
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  white-space: nowrap !important;
}

/* Hamburger + search icons — white */
.skin-minerva .minerva-header label,
.skin-minerva .minerva-header .search-toggle {
  color: #fff !important;
}
.skin-minerva .minerva-header svg path,
.skin-minerva .minerva-header svg rect,
.skin-minerva .minerva-header svg circle {
  fill: #fff !important;
}
.skin-minerva .minerva-header .mw-ui-icon:before {
  color: #fff !important;
  filter: brightness(10) !important;
}

/* Reader toolbar below Minerva header */
.skin-minerva #gr-static-bar {
  position: sticky !important;
  top: 54px !important;
  z-index: 100 !important;
}

/* ── 35. MINERVA — auto-expand sections ────────────────────────── */
.skin-minerva .collapsible-block,
.skin-minerva .collapsible-heading + .collapsible-block {
  display: block !important;
}
.skin-minerva .mf-section-0,
.skin-minerva .mf-section-1,
.skin-minerva .mf-section-2,
.skin-minerva .mf-section-3,
.skin-minerva .mf-section-4,
.skin-minerva .mf-section-5,
.skin-minerva .mf-section-6,
.skin-minerva .mf-section-7,
.skin-minerva .mf-section-8,
.skin-minerva .mf-section-9 {
  display: block !important;
}
.skin-minerva .section-heading {
  pointer-events: none !important;
}
.skin-minerva .section-heading .indicator {
  display: none !important;
}
/* ── Hide MediaWiki default header user/account controls (desktop) ── */
#pt-userpage-2,
#p-vector-user-menu-userpage,
/* Hide the right-side person-icon dropdown */
#vector-user-links-dropdown,
.vector-user-links-dropdown,
#p-personal-more,
.vector-user-menu,
.mw-portlet-vector-user-menu-overflow,
#pt-watchlist-2, #pt-watchlist {
    display: none !important;
}
/* Hide original userpage text link */
#p-vector-user-menu-userpage { display: none !important; }

/* Hide the right-side person-icon user menu dropdown */
#vector-user-links-dropdown { display: none !important; }

/* ── Custom username dropdown ── */
#gr-user-dropdown {
    position: relative;
    display: inline-block;
    font-family: system-ui, sans-serif;
}
#gr-user-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,0.12);
    border: none;
    color: #fff;
    font-size: 0.9em;
    font-weight: 500;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
}
#gr-user-trigger:hover { background: rgba(255,255,255,0.2); }
#gr-user-trigger .gr-caret { font-size: 0.7em; opacity: 0.8; }

#gr-user-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 180px;
    background: #fff;
    border: 1px solid #e0d8d2;
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.14);
    padding: 6px;
    z-index: 1000;
    display: none;
}
#gr-user-menu.gr-open { display: block; }
#gr-user-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    color: #2c1810;
    text-decoration: none;
    font-size: 0.92em;
    border-radius: 6px;
    white-space: nowrap;
}
#gr-user-menu a:hover { background: #f7f1ed; }
.vector-user-links a {
    color: #1C1A17 !important;
}
.vector-user-links-main  {
 display: none !important;
}
.gr-phone-row { margin-bottom: 12px; }
.gr-phone-label {
    display: block;
    font-weight: 700;
    font-size: 0.875rem;
    margin-bottom: 6px;
}
.gr-phone-inputs {
    display: flex;
    gap: 8px;
    align-items: stretch;
    height: 48px;
    position: relative;
    font-family: "Noto Sans Devanagari", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
.gr-phone-country { width: 101px; border-radius: 12px; padding: 12px; gap: 8px; border: 1px solid #CED4DA;}
.gr-phone-national { flex: 1; border-radius: 12px; padding: 12px; border: 1px solid #CED4DA;}

/* ── Country trigger button ── */
.gr-country-trigger {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 101px;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #CED4DA;
    white-space: nowrap;
    background: #fff;
}
.gr-country-trigger:hover { border-color: #72777d; }
.gr-trigger-flag { font-size: 1.3rem; line-height: 1; }
.gr-trigger-dial { font-size: 0.9rem; color: #54595d; }
.gr-trigger-caret { font-size: 0.7rem; color: #54595d; }

/* ── Dropdown ── */
.gr-country-dropdown {
    position: absolute;
    top: calc(100% + 4px); left: 0;
    z-index: 9999;
    width: 280px;
    background: #fff;
    border: 1px solid #a2a9b1;
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.gr-country-search {
    width: 100%; box-sizing: border-box;
    padding: 8px 12px;
    border: none; border-bottom: 1px solid #eee;
    font-size: 0.9rem; outline: none;
}
.gr-country-list { max-height: 240px; overflow-y: auto; }
.gr-country-option {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; cursor: pointer; font-size: 0.9rem;
}
.gr-country-option:hover { background: #f8f9fa; }
.gr-country-flag { font-size: 1.2rem; flex-shrink: 0; }
.gr-country-name { flex: 1; color: #202122; }
.gr-country-dial { color: #54595d; font-size: 0.85rem; }

.gr-phone-national:focus {
    outline: none; border-color: #4A433A;
}
/* Search Results Bar styles */
.gr-search-hl-mobile {
    position: fixed;
    top: 105px;
    left: 0px;
    right: 0px;
    z-index: 10200;
    background: rgb(181, 69, 27);
    color: rgb(255, 255, 255);   display: flex;
    align-items: center;
    justify-content: space-around;
    font-family: "Noto Sans Devanagari", system-ui, sans-serif;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.08) !important;
    height: 52px;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.08) !important;
    padding: 5px 4px !important;
    gap: 20px !important;
}
.gr-search-hl-mobile .gr-search-bar-btn { 
  height: 48px;
  width: 48px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: background 0.15s;
  color: #fff;
  font-size: 12px;
  font-family: "Noto Sans Devanagari";
  gap: 8px;
  white-space: nowrap;
}

/* Hide Notes FAB, doc nav FAB and Reader toolbar on Updates/Help/About pages */
body.page-My_wiki_Updates #gra-toggle,
body.page-My_wiki_Updates #se-docnav-btn,
body.page-My_wiki_Updates #gr-static-bar,
body.page-My_wiki_Help #gra-toggle,
body.page-My_wiki_Help #se-docnav-btn,
body.page-My_wiki_Help #gr-static-bar,
body.page-My_wiki_About #gra-toggle,
body.page-My_wiki_About #se-docnav-btn,
body.page-My_wiki_About #gr-static-bar { display: none; }

/* Welcome Page */
/* Hide all chrome on Welcome */
body.page-Welcome #mw-navigation,
body.page-Welcome #mw-panel,
body.page-Welcome #footer,
body.page-Welcome .mw-footer,
body.page-Welcome #siteSub,
body.page-Welcome #contentSub,
body.page-Welcome #firstHeading,
body.page-Welcome .mw-page-title-main,
body.page-Welcome .mw-indicators,
body.page-Welcome .vector-header,
body.page-Welcome .vector-page-toolbar,
body.page-Welcome .vector-sticky-header,
body.page-Welcome .mw-page-container,
body.page-Welcome #gr-static-bar, 
body.page-Welcome #se-docnav-btn, 
body.page-Welcome #gra-toggle,
body.page-Welcome #se-scrolltop {
  display: none !important;
}
body.page-Welcome .mw-page-container

/* Put the banner directly on the body of the Welcome page */
body.page-Welcome {
  background-image: url('/images/banner.jpeg') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-attachment: fixed !important;
  background-color: #3a0d0d !important;
  cursor: pointer;
}

/* Make the content area transparent so the body banner shows through */
body.page-Welcome #content,
body.page-Welcome .mw-body,
body.page-Welcome #mw-content-text,
body.page-Welcome .mw-parser-output,
body.page-Welcome #bodyContent {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 100vh;
}
/* Kill the white everywhere it's painted */
body.page-Welcome,
body.page-Welcome .mw-page-container,
body.page-Welcome .mw-page-container-inner,
body.page-Welcome .mw-content-container,
body.page-Welcome #content,
body.page-Welcome .mw-body,
body.page-Welcome #mw-content-text,
body.page-Welcome .mw-parser-output,
body.page-Welcome #bodyContent {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Put the banner on the body and force it full height */
body.page-Welcome {
  background-image: url('/images/banner.jpeg') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-attachment: fixed !important;
  background-color: #3a0d0d !important;
  min-height: 100vh !important;
  cursor: pointer;
}
/* ---- Minerva (mobile) splash for Welcome ---- */

/* Hide all chrome on Welcome */
body.skin-minerva.page-Welcome .header-container,
body.skin-minerva.page-Welcome .minerva-header,
body.skin-minerva.page-Welcome #mw-mf-page-center > .header-container,
body.skin-minerva.page-Welcome .banner-container,
body.skin-minerva.page-Welcome .pre-content,
body.skin-minerva.page-Welcome #page-actions,
body.skin-minerva.page-Welcome .page-actions-menu,
body.skin-minerva.page-Welcome .last-modified-bar,
body.skin-minerva.page-Welcome .post-content,
body.skin-minerva.page-Welcome #footer,
body.skin-minerva.page-Welcome .minerva-footer,
body.skin-minerva.page-Welcome .navigation-drawer,
body.skin-minerva.page-Welcome .mw-page-title-main,
body.skin-minerva.page-Welcome #section_0,
body.skin-minerva.page-Welcome .pre-content .mw-ui-icon,
body.skin-minerva.page-Welcome h1.mw-first-heading {
  display: none !important;
}

/* Kill white on all Minerva container surfaces */
body.skin-minerva.page-Welcome,
body.skin-minerva.page-Welcome #mw-mf-viewport,
body.skin-minerva.page-Welcome #mw-mf-page-center,
body.skin-minerva.page-Welcome #content,
body.skin-minerva.page-Welcome .mw-body,
body.skin-minerva.page-Welcome #mw-content-text,
body.skin-minerva.page-Welcome .mw-parser-output,
body.skin-minerva.page-Welcome #bodyContent {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Put the banner on the body, full height */
body.skin-minerva.page-Welcome {
  background-image: url('/images/banner.jpeg') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #3a0d0d !important;
  min-height: 100vh !important;
  cursor: pointer;
}
/* from LocalSettings line 393 */
/* ===== HAMBURGER / SIDEBAR ===== */
#mw-sidebar-button,
.vector-main-menu,
.vector-main-menu-container,
.vector-main-menu-landmark,
#vector-main-menu-dropdown {
    display:none !important;
}

/* ===== FOOTER ===== */
#footer,
.mw-footer,
footer {
    display:none !important;
}

/* ===== LOGIN / SIGNUP PAGE CLEANUP ===== */
body.page-Special_UserLogin #mw-sidebar-button,
body.page-Special_UserLogin .vector-main-menu,
body.page-Special_UserLogin .vector-page-toolbar,
body.page-Special_UserLogin .vector-page-tools,
body.page-Special_CreateAccount #mw-sidebar-button,
body.page-Special_CreateAccount .vector-main-menu,
body.page-Special_CreateAccount .vector-page-toolbar,
body.page-Special_CreateAccount .vector-page-tools,
body.page-Special_PasswordReset #mw-sidebar-button,
body.page-Special_PasswordReset .vector-main-menu,
body.page-Special_PasswordReset .vector-page-toolbar,
body.page-Special_PasswordReset .vector-page-tools {
    display:none !important;
}

/* from LocalSettings line 436 */
/* Kill every possible appearance container */
#vector-appearance,
#vector-appearance-dropdown,
#vector-appearance-pinned-container,
#vector-appearance-unpinned-container,
[id*="appearance-dropdown"],
[id*="appearance"][class*="vector"],
.vector-dropdown[title*="Appearance"],
.vector-dropdown[title*="appearance"] {
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
}

/* Remove empty slot in header */
.vector-page-tools,
.vector-page-toolbar,
.vector-header-end {
    gap:0 !important;
}

/* from LocalSettings line 469 */
/* Login page only */
body.page-Special_UserLogin .vector-search-box,
body.page-Special_UserLogin #p-search,
body.page-Special_UserLogin .search-toggle,
body.page-Special_UserLogin .vector-search-box-vue {
    display:none !important;
}

/* Show site wordmark/logo if hidden */
body.page-Special_UserLogin .mw-logo,
body.page-Special_UserLogin .vector-logo,
body.page-Special_UserLogin .vector-header-start {
    display:flex !important;
    visibility:visible !important;
}

/* Cleaner top bar */
body.page-Special_UserLogin .vector-header {
    justify-content:space-between !important;
    padding:0 16px !important;
}

/* Match Main_Page branded header bar */
body.page-Special_UserLogin .vector-header-container .mw-header {
    background: #b5451b !important;
}
body.page-Special_UserLogin .mw-logo-wordmark,
body.page-Special_UserLogin .mw-logo-wordmark strong {
    color: #fff !important;
}
body.page-Special_UserLogin .mw-logo-container {
    color: #fff !important;
}

/* Single logo: favicon only (no quill gr-header-icon) */
body.page-Special_UserLogin .gr-header-icon {
    display: none !important;
}
body.page-Special_UserLogin .mw-logo-icon {
    display: inline-block !important;
    width: 36px !important;
    height: 36px !important;
    object-fit: contain !important;
}

/* Hide Create Account and Login Links in header starts */
body.page-Special_UserLogin .vector-header-end {
    display: none !important;
}
/* Hide Create Account and Login Links in header end */

/* from LocalSettings line 530 */
body.page-Special_PasswordReset .vector-search-box,
body.page-Special_PasswordReset #p-search,
body.page-Special_PasswordReset .search-toggle,
body.page-Special_PasswordReset .vector-search-box-vue {
    display:none !important;
}
body.page-Special_PasswordReset .mw-logo,
body.page-Special_PasswordReset .vector-logo,
body.page-Special_PasswordReset .vector-header-start {
    display:flex !important;
    visibility:visible !important;
}
body.page-Special_PasswordReset .vector-header {
    justify-content:space-between !important;
    padding:0 16px !important;
}
body.page-Special_PasswordReset .vector-header-container .mw-header {
    background: #b5451b !important;
}
body.page-Special_PasswordReset .mw-logo-wordmark,
body.page-Special_PasswordReset .mw-logo-wordmark strong {
    color: #fff !important;
}
body.page-Special_PasswordReset .mw-logo-container {
    color: #fff !important;
}
body.page-Special_PasswordReset .gr-header-icon {
    display: none !important;
}
body.page-Special_PasswordReset .mw-logo-icon {
    display: inline-block !important;
    width: 36px !important;
    height: 36px !important;
    object-fit: contain !important;
}
body.page-Special_PasswordReset .vector-header-end {
    display: none !important;
}
body.page-Special_PasswordReset .vector-page-toolbar {
    display: none !important;
}

/* from LocalSettings line 584 */
body.page-Special_CreateAccount .vector-search-box,
body.page-Special_CreateAccount #p-search,
body.page-Special_CreateAccount .search-toggle,
body.page-Special_CreateAccount .vector-search-box-vue {
    display:none !important;
}
body.page-Special_CreateAccount .mw-logo,
body.page-Special_CreateAccount .vector-logo,
body.page-Special_CreateAccount .vector-header-start {
    display:flex !important;
    visibility:visible !important;
}
body.page-Special_CreateAccount .vector-header {
    justify-content:space-between !important;
    padding:0 16px !important;
}
body.page-Special_CreateAccount .vector-header-container .mw-header {
    background: #b5451b !important;
}
body.page-Special_CreateAccount .mw-logo-wordmark,
body.page-Special_CreateAccount .mw-logo-wordmark strong {
    color: #fff !important;
}
body.page-Special_CreateAccount .mw-logo-container {
    color: #fff !important;
}
body.page-Special_CreateAccount .gr-header-icon {
    display: none !important;
}
body.page-Special_CreateAccount .mw-logo-icon {
    display: inline-block !important;
    width: 36px !important;
    height: 36px !important;
    object-fit: contain !important;
}
body.page-Special_CreateAccount .vector-header-end {
    display: none !important;
}

/* from LocalSettings line 635 */
body.page-Special_UserLogin {
    background: #FAF6EE !important;
}
body.page-Special_UserLogin .mw-page-container,
body.page-Special_UserLogin .mw-page-container-inner,
body.page-Special_UserLogin .mw-body {
    background: transparent !important;
}
body.page-Special_UserLogin .mw-body-header,
body.page-Special_UserLogin .vector-page-titlebar,
body.page-Special_UserLogin #firstHeading {
    display: none !important;
}
body.page-Special_UserLogin #content {
    max-width: 440px !important;
    margin: 28px auto 48px !important;
    padding: 0 16px !important;
    float: none !important;
}
body.page-Special_UserLogin #bodyContent,
body.page-Special_UserLogin .mw-body-content {
    margin: 0 !important;
    padding: 0 !important;
}
body.page-Special_UserLogin #userloginprompt:empty {
    display: none !important;
}
body.page-Special_UserLogin .mw-body-content > .mw-ui-container {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(45, 35, 72, 0.1);
    padding: 32px 32px 28px;
    box-sizing: border-box;
}
body.page-Special_UserLogin .mw-body-content > .mw-ui-container::before {
    content: "Login/Signup";
    display: block;
    text-align: center;
    font-size: 24px;
    color: #1C1A17;
    margin-bottom: 22px;
    font-family: "Noto Sans Devanagari", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
body.page-Special_UserLogin #userloginForm,
body.page-Special_UserLogin #userloginForm form {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_UserLogin .mw-htmlform {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_UserLogin .mw-htmlform-field {
    margin-bottom: 18px;
}
body.page-Special_UserLogin .cdx-label,
body.page-Special_UserLogin .mw-htmlform-field > label {
    display: block;
    font-size: 0.875rem;
    color: #1C1A17;
    margin-bottom: 6px;
    font-family: Noto Sans Devanagari UI, system-ui, -apple-system, sans-serif;
}
/* Codex: border on wrapper only (inner input has its own border = double line) */
body.page-Special_UserLogin .cdx-text-input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    border: 1px solid #e5e7eb !important;
    background: #fff !important;
    min-height: 46px;
}
body.page-Special_UserLogin .cdx-text-input__input {
    width: 100% !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    background: transparent !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    min-height: 44px;
}
body.page-Special_UserLogin .cdx-text-input:focus-within {
    border-color: #ffffff !important;
    box-shadow: rgba(177, 74, 46, 0.1) !important;
}
body.page-Special_UserLogin .cdx-text-input__input:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}
/* Fallback if inputs are not wrapped in Codex */
body.page-Special_UserLogin input#wpName1,
body.page-Special_UserLogin input#wpPassword1 {
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    border: 1px solid #e5e7eb !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    min-height: 46px;
}
body.page-Special_UserLogin input#wpName1:focus,
body.page-Special_UserLogin input#wpPassword1:focus {
    outline: none !important;
    border-color: #b5451b !important;
    box-shadow: rgba(177, 74, 46, 0.1) !important;
}
body.page-Special_UserLogin .mw-userlogin-rememberme {
    display: none !important;
}
body.page-Special_UserLogin .gr-login-forgot-password {
    text-align: left;
    margin: 2px 0 14px;
    padding: 0;
}
body.page-Special_UserLogin .gr-login-forgot-password a {
    color: #b5451b !important;
    font-weight: 600 !important;
    font-size: 0.9rem;
    text-decoration: none !important;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_UserLogin .gr-login-forgot-password a:hover {
    text-decoration: underline !important;
}
body.page-Special_UserLogin .mw-htmlform-field:has(#wpLoginAttempt),
body.page-Special_UserLogin .mw-htmlform-submit {
    margin-top: 8px;
    margin-bottom: 0;
}
body.page-Special_UserLogin #wpLoginAttempt,
body.page-Special_UserLogin #wpLoginAttempt.cdx-button {
    width: 100% !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background: #b5451b !important;
    border: none !important;
    border-radius: 10px !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 14px 20px !important;
    min-height: 48px;
    cursor: pointer;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_UserLogin #wpLoginAttempt:hover {
    background: #A33C20 !important;
}
body.page-Special_UserLogin .mw-userlogin-help,
body.page-Special_UserLogin .mw-form-related-link-container,
body.page-Special_UserLogin #mw-createaccount,
body.page-Special_UserLogin #mw-createaccount-cta {
    font-size: 0.9rem;
    margin-top: 12px;
}
body.page-Special_UserLogin .mw-userlogin-help a,
body.page-Special_UserLogin .mw-form-related-link-container a,
body.page-Special_UserLogin #mw-createaccount a,
body.page-Special_UserLogin #mw-createaccount-cta a {
    color: #b5451b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}
body.page-Special_UserLogin .mw-userlogin-help a:hover,
body.page-Special_UserLogin .mw-form-related-link-container a:hover,
body.page-Special_UserLogin #mw-createaccount a:hover,
body.page-Special_UserLogin #mw-createaccount-cta a:hover {
    text-decoration: underline !important;
}
body.page-Special_UserLogin .cdx-message,
body.page-Special_UserLogin .mw-message-box {
    border-radius: 10px;
    margin-bottom: 16px;
}
body.page-Special_UserLogin .gr-google-login {
    margin: 20px 0 4px;
    padding: 0;
}
body.page-Special_UserLogin .gr-google-login-icon {
    display: inline-flex;
    flex-shrink: 0;
    line-height: 0;
    margin-top: -3px;
}
body.page-Special_UserLogin .gr-google-login-icon svg {
    display: block;
}
body.page-Special_UserLogin .gr-google-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
    padding: 12px;
    min-height: 44px;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    background: #F3F4F6;
    color: #1C1A17;
    font-size: 14px;
    text-decoration: none !important;
    font-family: "Noto Sans Devanagari", system-ui, -apple-system, sans-serif;
}
body.page-Special_UserLogin .gr-google-login-btn:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}
body.page-Special_UserLogin .gr-google-login-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0 16px;
    color: #F4ECDF;
    font-size: 14px;
    font-family: "Noto Sans Devanagari", system-ui, -apple-system, sans-serif;
}
body.page-Special_UserLogin .gr-google-login-divider::before,
body.page-Special_UserLogin .gr-google-login-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #F4ECDF;
}
.gr-phone-row { margin-bottom: 12px; }
.gr-phone-label {
    display: block;
    font-weight: 700;
    font-size: 0.875rem;
    margin-bottom: 6px;
}
.gr-phone-inputs {
    display: flex;
    gap: 8px;
    align-items: stretch;
    height: 48px;
    position: relative;
    font-family: "Noto Sans Devanagari", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
.gr-phone-country { width: 101px; border-radius: 12px; padding: 12px; gap: 8px; border: 1px solid #CED4DA;}
.gr-phone-national { flex: 1; border-radius: 12px; padding: 12px; border: 1px solid #CED4DA;}

/* ── Country trigger button ── */
.gr-country-trigger {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 101px;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #CED4DA;
    white-space: nowrap;
    background: #fff;
}
.gr-country-trigger:hover { border-color: #72777d; }
.gr-trigger-flag { font-size: 1.3rem; line-height: 1; }
.gr-trigger-dial { font-size: 0.9rem; color: #54595d; }
.gr-trigger-caret { font-size: 0.7rem; color: #54595d; }

/* ── Dropdown ── */
.gr-country-dropdown {
    position: absolute;
    top: calc(100% + 4px); left: 0;
    z-index: 9999;
    width: 280px;
    background: #fff;
    border: 1px solid #a2a9b1;
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.gr-country-search {
    width: 100%; box-sizing: border-box;
    padding: 8px 12px;
    border: none; border-bottom: 1px solid #eee;
    font-size: 0.9rem; outline: none;
}
.gr-country-list { max-height: 240px; overflow-y: auto; }
.gr-country-option {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; cursor: pointer; font-size: 0.9rem;
}
.gr-country-option:hover { background: #f8f9fa; }
.gr-country-flag { font-size: 1.2rem; flex-shrink: 0; }
.gr-country-name { flex: 1; color: #202122; }
.gr-country-dial { color: #54595d; font-size: 0.85rem; }

.gr-phone-national:focus {
    outline: none; border-color: #4A433A;
}

/* OTP verification screen */
#gr-otp-screen { padding: 8px 0; }
.gr-otp-title { font-size: 24px; font-family: "Noto Sans Devanagari", system-ui, -apple-system, sans-serif; text-align: center; margin-bottom: 12px; color: #1C1A17}
.gr-otp-desc { font-size: 16px; text-align: center; color: #1C1A17; margin-bottom: 20px; line-height: 1.5; font-family: "Noto Sans Devanagari" }
.gr-otp-label { display: block; font-size: 16px; margin-bottom: 8px;  font-family: "Noto Sans Devanagari"; color: #1C1A17}
.gr-otp-boxes {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    justify-content: center;
}
.gr-otp-box {
    flex: 1;
    min-width: 0;
    max-width: 52px;
    width: 52px;
    height: 52px;
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    border: 1px solid #CED4DA;
    border-radius: 12px;
    outline: none;
    padding: 0;
    box-sizing: border-box;
}
.gr-otp-box:focus { border-color: #4A433A; }

.gr-continue-btn:not(:disabled):hover { background: #B14A2E; }
.gr-continue-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.gr-resend-row { text-align: center; font-size: 14px; color: #54595d; }
.gr-link-btn {
    background: none; border: none; padding: 0;
    color: #B14A2E; cursor: pointer; font-size: inherit;
    text-decoration: none;
}
.gr-link-btn:hover { text-decoration: underline; }

/* Login button on phone screen */
.gr-login-btn, .gr-continue-btn {
    width: 100%; padding: 16px 8px; border: none; gap: 8px;
    border-radius: 12px; background: #B14A2E;
    color: #fff; font-size: 16px; font-weight: 500;
    cursor: pointer; font-family: "Noto Sans Devanagari", system-ui, -apple-system, sans-serif;
}
.gr-login-btn:hover { background: #993C1D; }
.gr-otp-hidden-field {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
}
.gr-otp-error {
    background: #fce8e8;
    border: 1px solid #e57373;
    border-radius: 6px;
    color: #b71c1c;
    padding: 10px 14px;
    margin-bottom: 12px;
    font-size: 14px;
    text-align: center;
}
    .gr-login-checks{display:flex;justify-content: space-between; gap:8px;margin:12px 0;}
.gr-check-label{display:flex;align-items:center;gap:8px;font-size:14px;color:#1C1A17;cursor:pointer; font-family: "Noto Sans Devanagari"}
.gr-check-label input{width:16px;height:16px;accent-color:#B14A2E;cursor:pointer; font-family: "Noto Sans Devanagari"}
    
@media (max-width: 480px) {
    body.page-Special_UserLogin .mw-body-content > .mw-ui-container {
        padding: 24px 20px 20px;
        border-radius: 12px;
    }
    body.page-Special_UserLogin #content {
        margin: 16px auto 32px !important;
        padding: 0 12px !important;
    }
}

/* from LocalSettings line 1021 */
body.page-Special_PasswordReset {
    background: #FAF6EE !important;
}
body.page-Special_PasswordReset .mw-page-container,
body.page-Special_PasswordReset .mw-page-container-inner,
body.page-Special_PasswordReset .mw-body {
    background: transparent !important;
}
body.page-Special_PasswordReset .mw-body-header,
body.page-Special_PasswordReset .vector-page-titlebar,
body.page-Special_PasswordReset #firstHeading {
    display: none !important;
}
body.page-Special_PasswordReset #content {
    max-width: 440px !important;
    margin: 28px auto 48px !important;
    padding: 0 16px !important;
    float: none !important;
}
body.page-Special_PasswordReset #bodyContent,
body.page-Special_PasswordReset .mw-body-content {
    margin: 0 !important;
    padding: 0 !important;
}
body.page-Special_PasswordReset .mw-body-content > .mw-htmlform-ooui-wrapper {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(45, 35, 72, 0.1);
    padding: 32px 32px 28px;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_PasswordReset .mw-body-content > .mw-htmlform-ooui-wrapper::before {
    content: "Reset password";
    display: block;
    text-align: center;
    font-size: 1.65rem;
    font-weight: 700;
    color: #2d2348;
    margin-bottom: 16px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
body.page-Special_PasswordReset .mw-htmlform-ooui-header {
    margin-bottom: 18px;
    font-size: 0.9rem;
    color: #6b7280;
    line-height: 1.5;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_PasswordReset .mw-htmlform-ooui-header p {
    margin: 0;
}
body.page-Special_PasswordReset .mw-htmlform-ooui-wrapper .oo-ui-fieldLayout {
    margin-bottom: 18px;
}
body.page-Special_PasswordReset .oo-ui-fieldLayout-header .oo-ui-labelElement-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_PasswordReset .oo-ui-textInputWidget .oo-ui-inputWidget-input {
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    border: 1px solid #e5e7eb !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    min-height: 46px;
    background: #fff !important;
}
body.page-Special_PasswordReset .oo-ui-textInputWidget.oo-ui-widget-focus .oo-ui-inputWidget-input {
    border-color: #b5451b !important;
    box-shadow: rgba(177, 74, 46, 0.1) !important;
}
body.page-Special_PasswordReset .oo-ui-fieldLayout-field {
    width: 100% !important;
}
body.page-Special_PasswordReset .oo-ui-textInputWidget {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_PasswordReset .mw-htmlform-submit-buttons {
    margin-top: 8px;
    width: 100% !important;
}
body.page-Special_PasswordReset .mw-htmlform-submit-buttons .oo-ui-buttonElement,
body.page-Special_PasswordReset .mw-htmlform-submit-buttons .oo-ui-buttonInputWidget {
    width: 100% !important;
    display: block !important;
}
body.page-Special_PasswordReset .mw-htmlform-submit-buttons .oo-ui-buttonElement-button {
    width: 100% !important;
    justify-content: center;
    background: #b5451b !important;
    border-color: #b5451b !important;
    border-radius: 10px !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 14px 20px !important;
    min-height: 48px;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_PasswordReset .mw-htmlform-submit-buttons .oo-ui-buttonElement-button:hover {
    background: #A33C20 !important;
    border-color: #A33C20 !important;
}
body.page-Special_PasswordReset .gr-passwordreset-footer {
    text-align: center;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #f0eef5;
    font-size: 0.9rem;
    color: #6b7280;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_PasswordReset .gr-passwordreset-footer a {
    color: #b5451b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}
body.page-Special_PasswordReset .gr-passwordreset-footer a:hover {
    text-decoration: underline !important;
}
body.page-Special_PasswordReset .cdx-message,
body.page-Special_PasswordReset .mw-message-box,
body.page-Special_PasswordReset .successbox,
body.page-Special_PasswordReset .warningbox,
body.page-Special_PasswordReset .errorbox {
    border-radius: 10px;
    margin-bottom: 16px;
}
@media (max-width: 480px) {
    body.page-Special_PasswordReset .mw-body-content > .mw-htmlform-ooui-wrapper {
        padding: 24px 20px 20px;
        border-radius: 12px;
    }
    body.page-Special_PasswordReset #content {
        margin: 16px auto 32px !important;
        padding: 0 12px !important;
    }
}

/* from LocalSettings line 1197 */
body.page-Special_CreateAccount {
    background: #FAF6EE !important;
}
body.page-Special_CreateAccount .mw-page-container,
body.page-Special_CreateAccount .mw-page-container-inner,
body.page-Special_CreateAccount .mw-body {
    background: transparent !important;
}
body.page-Special_CreateAccount .mw-body-header,
body.page-Special_CreateAccount .vector-page-titlebar,
body.page-Special_CreateAccount #firstHeading {
    display: none !important;
}
body.page-Special_CreateAccount #content {
    max-width: 440px !important;
    margin: 28px auto 48px !important;
    padding: 0 16px !important;
    float: none !important;
}
body.page-Special_CreateAccount #bodyContent,
body.page-Special_CreateAccount .mw-body-content {
    margin: 0 !important;
    padding: 0 !important;
}
body.page-Special_CreateAccount .vector-page-toolbar {
    display: none !important;
}
body.page-Special_CreateAccount .mw-body-content > .mw-ui-container {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(45, 35, 72, 0.1);
    padding: 32px 32px 28px;
    box-sizing: border-box;
}
body.page-Special_CreateAccount .mw-body-content > .mw-ui-container::before {
    content: "Create account";
    display: block;
    text-align: center;
    font-size: 1.65rem;
    font-weight: 700;
    color: #2d2348;
    margin-bottom: 22px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
body.page-Special_CreateAccount #signupstart {
    font-size: 0.9rem;
    color: #6b7280;
    margin-bottom: 16px;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount .mw-createacct-benefits-container {
    display: none !important;
}
body.page-Special_CreateAccount #userloginForm,
body.page-Special_CreateAccount #userloginForm form {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_CreateAccount .mw-htmlform {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-Special_CreateAccount .mw-htmlform-field {
    margin-bottom: 18px;
}
body.page-Special_CreateAccount .cdx-label,
body.page-Special_CreateAccount .mw-htmlform-field > label {
    display: block;
    font-size: 0.875rem;
    color: #1C1A17;
    margin-bottom: 6px;
    font-family: Noto Sans Devanagari UI, system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount .cdx-text-input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    border: 1px solid #e5e7eb !important;
    background: #fff !important;
    min-height: 46px;
}
body.page-Special_CreateAccount .cdx-text-input__input {
    width: 100% !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    background: transparent !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    min-height: 44px;
}
body.page-Special_CreateAccount .cdx-field__help-text,
body.page-Special_CreateAccount .htmlform-tip {
    font-size: 0.8rem;
    color: #9ca3af;
    margin-top: 6px;
    line-height: 1.4;
}
body.page-Special_CreateAccount .cdx-text-input:focus-within {
    border-color: #b5451b !important;
    box-shadow: rgba(177, 74, 46, 0.1) !important;
}
body.page-Special_CreateAccount .cdx-text-input__input:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}
body.page-Special_CreateAccount input#wpName2,
body.page-Special_CreateAccount input#wpPassword2,
body.page-Special_CreateAccount input#wpRetype,
body.page-Special_CreateAccount input#wpEmail {
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    border: 1px solid #e5e7eb !important;
    padding: 12px 14px !important;
    font-size: 1rem !important;
    min-height: 46px;
}
body.page-Special_CreateAccount input#wpName2:focus,
body.page-Special_CreateAccount input#wpPassword2:focus,
body.page-Special_CreateAccount input#wpRetype:focus,
body.page-Special_CreateAccount input#wpEmail:focus {
    outline: none !important;
    border-color: #b5451b !important;
    box-shadow: rgba(177, 74, 46, 0.1) !important;
}
body.page-Special_CreateAccount .mw-htmlform-field:has(#wpCreateaccount),
body.page-Special_CreateAccount .mw-htmlform-submit {
    margin-top: 8px;
    margin-bottom: 0;
}
body.page-Special_CreateAccount #wpCreateaccount,
body.page-Special_CreateAccount #wpCreateaccount.cdx-button {
    width: 100% !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background: #b5451b !important;
    border: none !important;
    border-radius: 10px !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 14px 20px !important;
    min-height: 48px;
    cursor: pointer;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount #wpCreateaccount:hover {
    background: #A33C20 !important;
}
body.page-Special_CreateAccount .gr-login-signup-footer {
    text-align: center;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #f0eef5;
}
body.page-Special_CreateAccount .gr-login-signup-text {
    font-size: 0.9rem;
    color: #6b7280;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount .gr-login-signup-link {
    color: #b5451b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}
body.page-Special_CreateAccount .gr-login-signup-link:hover {
    text-decoration: underline !important;
}
body.page-Special_CreateAccount #signupend,
body.page-Special_CreateAccount .mw-form-related-link-container {
    font-size: 0.9rem;
    color: #6b7280;
    margin-top: 14px;
    line-height: 1.5;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount #signupend a,
body.page-Special_CreateAccount .mw-form-related-link-container a {
    color: #b5451b !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}
body.page-Special_CreateAccount #signupend a:hover,
body.page-Special_CreateAccount .mw-form-related-link-container a:hover {
    text-decoration: underline !important;
}
body.page-Special_CreateAccount .cdx-message,
body.page-Special_CreateAccount .mw-message-box {
    border-radius: 10px;
    margin-bottom: 16px;
}
body.page-Special_CreateAccount .gr-google-login {
    margin: 20px 0 4px;
    padding: 0;
}
body.page-Special_CreateAccount .gr-google-login-icon {
    display: inline-flex;
    flex-shrink: 0;
    line-height: 0;
}
body.page-Special_CreateAccount .gr-google-login-icon svg {
    display: block;
}
body.page-Special_CreateAccount .gr-google-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 16px;
    min-height: 48px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #2d2348;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none !important;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount .gr-google-login-btn:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}
body.page-Special_CreateAccount .gr-google-login-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0 16px;
    color: #9ca3af;
    font-size: 0.85rem;
    font-family: system-ui, -apple-system, sans-serif;
}
body.page-Special_CreateAccount .gr-google-login-divider::before,
body.page-Special_CreateAccount .gr-google-login-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

    .page-Special_UserLogin #mw-mf-page-center,
.page-Special_UserLogin .mw-mf-page-center {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh !important;
    padding: 16px !important;
    box-sizing: border-box !important;
}

.page-Special_UserLogin .mw-ui-container {
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 auto !important;
}
    
@media (max-width: 480px) {

    body.page-Special_CreateAccount .mw-body-content > .mw-ui-container {
        padding: 24px 20px 20px;
        border-radius: 12px;
    }
    body.page-Special_CreateAccount #content {
        margin: 16px auto 32px !important;
        padding: 0 12px !important;
    }
}

/* from LocalSettings line 1484 */
.vector-page-toolbar,
        .vector-page-toolbar-container,
        .mw-page-container {
            border-top: 0 !important;
            box-shadow: none !important;
        }

        .vector-page-toolbar {
            display:none !important;
        }

        .mw-body {
            margin-top:0 !important;
            padding-top:0 !important;
        }

/* from LocalSettings line 1525 */
.mw-logo-wordmark,
.vector-header-start a.mw-wiki-title {
    display: flex !important;
    flex-direction: column !important;
}

.mw-logo-wordmark::after,
.vector-header-start a.mw-wiki-title::after {
    content: "A Digital Archive of Dvaita Vedanta Literature";
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: #ffffff;
    letter-spacing: 0.3px;
    margin-top: 1px;
    font-family: sans-serif;
}

/* ===== namespace toolbar hiding (was BeforePageDisplay line 1484) =====
   Original: hide top toolbar on all namespaces EXCEPT Special, Template, MediaWiki.
   MediaWiki adds body classes ns-0, ns-10 (Template), ns-8 (MediaWiki), ns--1 (Special).
   So: hide globally, then re-show on the allowed namespaces. */
.vector-page-toolbar,
.vector-page-toolbar-container,
.mw-page-container { border-top: 0 !important; box-shadow: none !important; }
.vector-page-toolbar { display: none !important; }
.mw-body { margin-top: 0 !important; padding-top: 0 !important; }

/* re-show toolbar on Special / Template / MediaWiki namespaces */
body.ns--1 .vector-page-toolbar,
body.ns-10 .vector-page-toolbar,
body.ns-8  .vector-page-toolbar { display: block !important; }

/* Style overrides for QuickEdit */
.mw-body-content[contenteditable="true"]:focus-visible {
 outline: 0;
}
/* ── 36. COMMENTARY INTERLEAVING (Show/hide teeka in moola) ─────── */
.gr-injected-teeka-group { margin: 0 0 6px 0; }

/* Inline checkbox placed directly before an existing commentary link
   wherever it appears on the page (e.g. a "वादावली" list) - same maroon
   accent as the toolbar dropdown's own checkboxes, for visual
   consistency between the two places a reader can toggle a commentary.

   CHANGED: was relying on vertical-align + a plain width/height on the
   bare <input> - confirmed directly (screenshot) this rendered
   noticeably oversized and misaligned with the surrounding text, since
   native checkbox rendering size/baseline varies significantly across
   browsers/OS (especially mobile Safari) and isn't reliably constrained
   by width/height alone without also resetting the native appearance.
   Now wrapped in an inline-flex span the checkbox sits inside, which
   centers it against the line's actual content height regardless of
   the checkbox's own native box quirks - a more robust fix than tuning
   vertical-align offsets by hand. */
.gr-teeka-cb-wrap {
  display: inline-flex; align-items: center; gap: 6px;
  vertical-align: middle;
}
.gr-teeka-inline-checkbox {
  -webkit-appearance: none; appearance: none;
  width: 15px !important; height: 15px !important;
  min-width: 15px; min-height: 15px;
  margin: 0; padding: 0; cursor: pointer;
  border: 1.5px solid #b5451b; border-radius: 3px;
  background: #fff; position: relative; flex-shrink: 0;
  box-sizing: border-box;
}
.gr-teeka-inline-checkbox:checked {
  background: #b5451b; border-color: #b5451b;
}
.gr-teeka-inline-checkbox:checked::after {
  content: ''; position: absolute; left: 4px; top: 1px;
  width: 4px; height: 8px;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
/* CHANGED: bullets removed from any <li> this feature attaches a
   checkbox to - the checkbox itself is now the visual marker, so the
   original bullet point is redundant clutter, not a second marker. */
.gr-teeka-list-item { list-style: none !important; }

/* Toolbar "Commentaries" dropdown button - matches .gr-btn-edit /
   .gr-btn-settings exactly (border #f0cfc4, maroon text, cream hover). */
/* CHANGED: pill shape + soft shadow, matching the toolbar-wide "soft
   rounded pill" redesign - consistent with .gr-btn's own border-radius
   and box-shadow treatment in readerToolbar.js rather than this one
   button keeping the old sharp-cornered bordered look on its own. */
/* CHANGED: was styled for a text label + caret ("टीका ▾") - now an
   icon-only eye.svg button, so font-size and the caret rule are no
   longer relevant and removed; border-radius reduced to match the
   toolbar-wide radius reduction (see readerToolbar.js). */
.gr-teeka-dropdown-btn { border: none; border-radius: 12px; box-shadow: 0 2px 6px rgba(181,69,27,0.22); transition: box-shadow .15s, transform .15s; }
.gr-teeka-dropdown-btn:hover { background: #fdf0eb; box-shadow: 0 4px 14px rgba(181,69,27,0.34); transform: translateY(-1px); }

.gr-teeka-dropdown-panel {
  background: #fff; border: 1px solid #f0cfc4; border-radius: 10px;
  box-shadow: 0 4px 16px rgba(181,69,27,0.16); max-height: 60vh; overflow-y: auto;
}
.gr-teeka-dropdown-header {
  font-family: 'Adishila', 'Noto Serif Devanagari', system-ui, sans-serif;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: #b5451b; padding: 10px 14px 6px; border-bottom: 1px solid #f7e4da; margin-bottom: 2px;
}
.gr-teeka-dropdown-list { padding: 4px 0; }
.gr-teeka-dropdown-item {
  display: flex; align-items: center; gap: 9px; padding: 8px 14px;
  font-size: 14px; color: #3a2a20; cursor: pointer; white-space: nowrap;
  transition: background .12s;
}
.gr-teeka-dropdown-item:hover { background: #fdf0eb; }
/* CHANGED: matches the same robust custom-checkbox approach as
   .gr-teeka-inline-checkbox above, rather than accent-color alone,
   which doesn't reliably constrain native checkbox SIZE across
   browsers even though it does control the checked-state color. */
.gr-teeka-dropdown-checkbox {
  -webkit-appearance: none; appearance: none;
  width: 16px !important; height: 16px !important;
  min-width: 16px; min-height: 16px; flex-shrink: 0;
  margin: 0; padding: 0; cursor: pointer;
  border: 1.5px solid #b5451b; border-radius: 3px;
  background: #fff; position: relative; box-sizing: border-box;
}
.gr-teeka-dropdown-checkbox:checked { background: #b5451b; border-color: #b5451b; }
.gr-teeka-dropdown-checkbox:checked::after {
  content: ''; position: absolute; left: 4.5px; top: 1.5px;
  width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
/* Sub-commentaries (tippanis) nested under their parent teeka - shown
   only once the parent is checked (see readerToolbar.js), indented to
   read as a sub-category rather than a peer option. */
.gr-teeka-dropdown-subitem { padding-left: 34px !important; }
.gr-teeka-dropdown-sublist { display: none; }
.gr-teeka-dropdown-sublist.gr-open { display: block; }
.gr-teeka-dropdown-item-label {
  overflow: hidden; text-overflow: ellipsis;
  font-family: 'Adishila', 'Noto Serif Devanagari', system-ui, sans-serif;
}

/* Toolbar control only needs to be shown as a fallback once the inline
   checkbox list scrolls out of view - hidden by default, toggled by
   readerToolbar.js listening to window.grTeekaInterleave.onVisibilityChange. */
.gr-teeka-dropdown-wrap { display: none; }
.gr-teeka-dropdown-wrap.gr-visible { display: inline-block; }

/* ── 37. HEADER LINKS + UPDATES PAGE ───────────────────────────── */
/* Desktop header links (Help, About, Login, Library, Updates) */
.gr-header-link {
  display: inline-flex; align-items: center;
  color: rgba(255, 255, 255, 0.88) !important; font-size: 0.88em; font-family: system-ui, sans-serif; font-weight: 500;
  line-height: inherit; text-decoration: none !important; white-space: nowrap;
  padding: 4px 10px; margin: 0 4px 0 0; border: 0; border-radius: 4px; background: transparent; cursor: pointer;
  transition: color 0.15s, background 0.15s;
}
.gr-header-link:hover,
.gr-header-link:focus-visible,
.gr-header-link.is-current { color: #fff !important; background: rgba(255, 255, 255, 0.12); }

/* Mobile menu panel items (Library, Updates) — same look as Home/Help */
.gr-mob-item {
  display: flex; align-items: center; width: 100%; box-sizing: border-box; margin: 0;
  padding: 15px 20px; border-bottom: 1px solid #f0ebe6; border-left: 3px solid transparent; background: #fff;
  font-size: 16px; font-family: system-ui, sans-serif; color: #2c1810 !important;
  text-decoration: none !important;
}
.gr-mob-item.is-current { border-left-color: #c0392b; background: #fdf8f5; color: #c0392b !important; font-weight: 600; }
#gr-header-user-menu a.is-current { background: #f5efe9; font-weight: 600; }

/* Updates page (My_wiki:Updates) */
.gr-updates-page { max-width: 1140px; margin: 0 auto; padding: 0 0 40px; }
.gr-updates-intro { margin: 0 0 24px; font-family: system-ui, sans-serif; font-size: 15px; color: #666; line-height: 1.6; }
.gr-updates-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.gr-updates-layout.gr-no-bulletin { grid-template-columns: minmax(0, 1fr); }
.gr-updates-heading,
.gr-bulletin-heading {
  font-family: system-ui, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: #b5451b;
}
.gr-updates-heading { margin: 0 0 6px; }

/* What's new: grouped list */
.gr-updates-feed { min-height: 120px; }
.gr-upd-group { margin: 22px 0 8px; font: 600 14px system-ui, sans-serif; color: #1a2e40; }
.gr-upd-group:first-child { margin-top: 8px; }
.gr-upd-list {
  margin: 0; padding: 0;
  background: #fff; border: 1px solid #efe4df; border-radius: 10px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(60, 20, 10, 0.06);
}
.gr-upd-item {
  display: flex; align-items: baseline; gap: 16px;
  margin: 0; padding: 12px 18px; border-top: 1px solid #f6efec; border-left: 3px solid transparent;
}
.gr-upd-item:first-child { border-top: 0; }
.gr-upd-item:hover { background: #fdf8f6; }
.gr-upd-item.gr-upd-unseen { border-left-color: #c0392b; background: #fffaf8; }
.gr-upd-main { flex: 1; min-width: 0; }
.gr-upd-title {
  font-family: 'Adishila', 'Noto Serif Devanagari', serif; font-size: 1em; font-weight: 600; line-height: 1.45;
  color: #c0392b !important; text-decoration: none !important; overflow-wrap: anywhere;
}
.gr-upd-title:hover { text-decoration: underline !important; text-underline-offset: 3px; }
.gr-upd-sub { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 3px; font-size: 13px; color: #777; }
.gr-upd-work { font-family: 'Adishila', 'Noto Serif Devanagari', serif; font-size: 14px; }
.gr-upd-tag { flex: none; padding: 1px 8px; border-radius: 9px; font: 600 11px/1.6 system-ui, sans-serif; }
.gr-upd-tag.gr-upd-new    { background: #fbece8; color: #c0392b; }
.gr-upd-tag.gr-upd-update { background: #eaf1fb; color: #2a5aa8; }
.gr-upd-date { flex: none; font: 13px system-ui, sans-serif; color: #888; white-space: nowrap; }
.gr-upd-empty { margin: 12px 0; padding: 24px; text-align: center; font: 14px system-ui, sans-serif; color: #888;
  background: #fff; border: 1px dashed #e6d6cf; border-radius: 10px; }

/* Announcements & events card */
.gr-bulletin {
  background: #fff; border: 1px solid #efe4df; border-top: 3px solid #c0392b; border-radius: 10px;
  box-shadow: 0 1px 3px rgba(60, 20, 10, 0.06); overflow: hidden;
}
.gr-bulletin.gr-bulletin-is-empty { display: none; }
.gr-bulletin-heading { padding: 12px 18px; background: #fcf6f3; border-bottom: 1px solid #f1e2dc; }
.gr-bulletin-item { padding: 14px 18px; border-top: 1px solid #f6efec; }
.gr-bulletin-item:first-child { border-top: 0; }
.gr-bulletin-item.gr-bulletin-expired { display: none; }
.gr-bulletin-item.gr-bulletin-past { opacity: 0.55; }
.gr-bulletin-meta { display: flex; align-items: center; gap: 8px; font: 12px system-ui, sans-serif; color: #888; }
.gr-bulletin-type { padding: 1px 8px; border-radius: 9px; font-weight: 600; font-size: 11px; background: #eaf1fb; color: #2a5aa8; }
.gr-bulletin-type::before { content: "Announcement"; }
.gr-bulletin-item[data-type="event"] .gr-bulletin-type { background: #fdf1dc; color: #9a5b00; }
.gr-bulletin-item[data-type="event"] .gr-bulletin-type::before { content: "Event"; }
.gr-bulletin-item.gr-bulletin-past .gr-bulletin-type::before { content: "Past event"; }
.gr-bulletin-item-title {
  margin-top: 6px; font-family: 'Adishila', 'Noto Serif Devanagari', serif; font-size: 1.05em; font-weight: 600;
  line-height: 1.45; color: #1a2e40;
}
.gr-bulletin-item-title a { color: #c0392b; }
.gr-bulletin-where { display: block; margin-top: 2px; font: 13px system-ui, sans-serif; color: #666; }
.gr-bulletin-item-text { margin-top: 4px; font-size: 0.92em; line-height: 1.6; color: #444; }
.gr-bulletin-item-text p { margin: 0; }
.gr-bulletin-where:empty, .gr-bulletin-item-text:empty, .gr-bulletin-date:empty { display: none; }

@media (max-width: 900px) {
  .gr-updates-layout { grid-template-columns: minmax(0, 1fr); }
  .gr-bulletin { order: -1; }   /* announcements first on small screens */
}
/* Phones: title on its own line, tag + date underneath */
@media (max-width: 600px) {
  .gr-updates-intro { font-size: 14px; margin-bottom: 18px; }
  .gr-upd-item { flex-direction: column; align-items: stretch; gap: 2px; padding: 11px 14px; }
  .gr-upd-title { font-size: 0.9em; }
  .gr-upd-date { font-size: 12px; }
  .gr-bulletin-heading { padding: 10px 14px; }
  .gr-bulletin-item { padding: 12px 14px; }
}

/* Minerva menu panel: our list replaces the skin's; the skin's lists are
   kept (hidden) because Minerva's own script looks them up. */
#mw-mf-page-left > .gr-mf-native-menu { display: none !important; }
.gr-mob-menu { width: 100%; margin-top: 8px; background: #fff; }