/* Themes for the self-hosted Wikipedia.
 *
 * Injected into every page by nginx (see nginx.conf). Nothing here loads from
 * the internet — this is an OFFLINE encyclopedia, so a webfont or CDN would
 * leave the page half-styled exactly when it matters.
 *
 * Scoping: themes apply only when <html> carries data-wtheme. With no attribute
 * the page renders as stock Wikipedia, so "off" is genuinely untouched rather
 * than a third skin pretending to be the original.
 */

/* ── cyberpunk: matches the j5casey.win dashboard ─────────────────── */
html[data-wtheme="cyber"] {
  --w-bg:      #0a1410;
  --w-surface: #0f1c17;
  --w-border:  rgba(0,255,118,0.13);
  --w-border-hi: rgba(0,255,118,0.55);
  --w-green:   #00ff76;
  --w-cyan:    #0fd4f5;
  --w-teal:    #03f4e0;
  --w-pink:    #ff3e8a;
  --w-text:    #c8e0d4;
  --w-sub:     #a0b8ae;
  --w-mono: 'CaskaydiaCove Nerd Font','Cascadia Code',ui-monospace,'JetBrains Mono',Menlo,Consolas,monospace;
}

html[data-wtheme="cyber"],
html[data-wtheme="cyber"] body {
  background: var(--w-bg) !important;
  color: var(--w-text) !important;
}

html[data-wtheme="cyber"] body,
html[data-wtheme="cyber"] .mw-parser-output,
html[data-wtheme="cyber"] #content,
html[data-wtheme="cyber"] #mw-content-text {
  background: var(--w-bg) !important;
  color: var(--w-text) !important;
}

html[data-wtheme="cyber"] h1,
html[data-wtheme="cyber"] h2,
html[data-wtheme="cyber"] h3,
html[data-wtheme="cyber"] h4,
html[data-wtheme="cyber"] .mw-headline {
  color: var(--w-green) !important;
  font-family: var(--w-mono) !important;
  border-color: var(--w-border-hi) !important;
  text-shadow: 0 0 12px rgba(0,255,118,0.25);
}
html[data-wtheme="cyber"] h1, html[data-wtheme="cyber"] h2 {
  border-bottom: 1px solid var(--w-border-hi) !important;
}

html[data-wtheme="cyber"] a,
html[data-wtheme="cyber"] a.mw-selflink { color: var(--w-cyan) !important; }
html[data-wtheme="cyber"] a:visited { color: var(--w-teal) !important; }
html[data-wtheme="cyber"] a:hover {
  color: var(--w-pink) !important;
  text-shadow: 0 0 10px rgba(255,62,138,0.5);
}
/* red links stay red-ish so "missing article" still reads as missing */
html[data-wtheme="cyber"] a.new { color: var(--w-pink) !important; opacity: .8; }

/* boxes: infoboxes, tables, thumbnails, navboxes, quotes */
html[data-wtheme="cyber"] table,
html[data-wtheme="cyber"] .infobox,
html[data-wtheme="cyber"] .wikitable,
html[data-wtheme="cyber"] .navbox,
html[data-wtheme="cyber"] .thumbinner,
html[data-wtheme="cyber"] .mw-highlight,
html[data-wtheme="cyber"] blockquote,
html[data-wtheme="cyber"] pre {
  background: var(--w-surface) !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border) !important;
}
html[data-wtheme="cyber"] .wikitable > * > tr > th,
html[data-wtheme="cyber"] .infobox th,
html[data-wtheme="cyber"] th {
  background: rgba(0,255,118,0.07) !important;
  color: var(--w-green) !important;
  border-color: var(--w-border) !important;
}
html[data-wtheme="cyber"] td { border-color: var(--w-border) !important; }

html[data-wtheme="cyber"] .thumbcaption,
html[data-wtheme="cyber"] .reference,
html[data-wtheme="cyber"] .references,
html[data-wtheme="cyber"] figcaption,
html[data-wtheme="cyber"] small { color: var(--w-sub) !important; }

/* images: tone down the blinding white cutouts without hiding detail */
html[data-wtheme="cyber"] img {
  filter: brightness(.92) contrast(1.04) saturate(.95);
}

/* kiwix's own chrome */
html[data-wtheme="cyber"] #kiwixtoolbar,
html[data-wtheme="cyber"] .kiwix-header,
html[data-wtheme="cyber"] #kiwix_serve_taskbar,
html[data-wtheme="cyber"] header,
html[data-wtheme="cyber"] .navbar {
  background: var(--w-surface) !important;
  border-bottom: 1px solid var(--w-border-hi) !important;
}
html[data-wtheme="cyber"] input[type="text"],
html[data-wtheme="cyber"] input[type="search"],
html[data-wtheme="cyber"] select {
  background: #08100d !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border-hi) !important;
  font-family: var(--w-mono) !important;
}

/* ── amber: monochrome terminal ───────────────────────────────────── */
html[data-wtheme="amber"] { --w-a: #ffb000; --w-a-dim: #b37b00; }
html[data-wtheme="amber"], html[data-wtheme="amber"] body,
html[data-wtheme="amber"] #content, html[data-wtheme="amber"] .mw-parser-output {
  background: #120d00 !important; color: var(--w-a) !important;
}
html[data-wtheme="amber"] h1, html[data-wtheme="amber"] h2,
html[data-wtheme="amber"] h3, html[data-wtheme="amber"] .mw-headline {
  color: #ffd070 !important;
  font-family: ui-monospace,Menlo,Consolas,monospace !important;
  border-bottom: 1px solid var(--w-a-dim) !important;
}
html[data-wtheme="amber"] a { color: #ffd070 !important; text-decoration: underline; }
html[data-wtheme="amber"] a:hover { background: var(--w-a); color: #120d00 !important; }
html[data-wtheme="amber"] table, html[data-wtheme="amber"] .infobox,
html[data-wtheme="amber"] .wikitable, html[data-wtheme="amber"] pre,
html[data-wtheme="amber"] .thumbinner {
  background: #1a1200 !important; color: var(--w-a) !important;
  border: 1px solid var(--w-a-dim) !important;
}
html[data-wtheme="amber"] th { background: #241900 !important; color: #ffd070 !important; }
html[data-wtheme="amber"] img { filter: sepia(1) hue-rotate(-18deg) saturate(2.4) brightness(.85); }

/* ── plain dark: for long reading, no neon ────────────────────────── */
html[data-wtheme="dark"], html[data-wtheme="dark"] body,
html[data-wtheme="dark"] #content, html[data-wtheme="dark"] .mw-parser-output {
  background: #16181d !important; color: #d6d9df !important;
}
html[data-wtheme="dark"] h1, html[data-wtheme="dark"] h2,
html[data-wtheme="dark"] h3, html[data-wtheme="dark"] .mw-headline {
  color: #f0f2f5 !important; border-bottom-color: #2c3038 !important;
}
html[data-wtheme="dark"] a { color: #7aa7ff !important; }
html[data-wtheme="dark"] a:visited { color: #b28dff !important; }
html[data-wtheme="dark"] table, html[data-wtheme="dark"] .infobox,
html[data-wtheme="dark"] .wikitable, html[data-wtheme="dark"] pre,
html[data-wtheme="dark"] .thumbinner {
  background: #1d2027 !important; color: #d6d9df !important; border: 1px solid #2c3038 !important;
}
html[data-wtheme="dark"] th { background: #242831 !important; }
html[data-wtheme="dark"] img { filter: brightness(.9); }

/* ── the switcher itself ──────────────────────────────────────────── */
#wtheme-fab {
  position: fixed; right: 14px; bottom: 14px; z-index: 2147483000;
  display: flex; gap: 6px; align-items: center;
  padding: 7px 9px; border-radius: 9px;
  background: rgba(15,28,23,.94); border: 1px solid rgba(0,255,118,.45);
  box-shadow: 0 4px 18px rgba(0,0,0,.5);
  font: 12px/1 ui-monospace, Menlo, Consolas, monospace;
  backdrop-filter: blur(6px);
}
#wtheme-fab button {
  cursor: pointer; padding: 5px 8px; border-radius: 6px;
  background: transparent; color: #a0b8ae;
  border: 1px solid rgba(0,255,118,.2);
  font: inherit;
}
#wtheme-fab button:hover { color: #00ff76; border-color: rgba(0,255,118,.6); }
#wtheme-fab button[aria-pressed="true"] {
  background: rgba(0,255,118,.14); color: #00ff76; border-color: rgba(0,255,118,.7);
}
@media print { #wtheme-fab { display: none; } }