/* Rovify shared theme layer — monochrome duo-theme + theme switcher.
 *
 * Loaded site-wide via web_include_css. Overrides each portal page's
 * inline `:root` dark tokens via higher-specificity html[data-theme=…]
 * selectors (0,1,1 beats :root 0,1,0), so pages flip to light/dark WITHOUT
 * rewriting their bespoke CSS. Default (no data-theme = "System") leaves
 * each page on its own baked theme, so nothing changes unless a user
 * explicitly picks Light/Dark. Brand is black & white — no colour.
 */

/* ── LIGHT ────────────────────────────────────────────────────────────── */
html[data-theme="light"] {
  color-scheme: light;
  --bg:#ffffff; --bg-2:#f7f7f8;
  --panel:#f6f6f7; --panel-2:#efeff1; --panel-3:#e8e8ea;
  --card:#ffffff; --surface:#f6f6f7; --surface-2:#efeff1;
  --text:#18181b; --text-2:#3f3f46; --dim:#52525b;
  --muted:#71717a; --muted-2:#52525b;
  --line:rgba(0,0,0,0.10); --line-2:rgba(0,0,0,0.16); --line-3:rgba(0,0,0,0.06);
  --accent:#18181b; --accent-soft:rgba(0,0,0,0.07); --accent-pressed:#000000;
  --on-accent:#ffffff; --primary:#18181b; --ghost:rgba(0,0,0,0.04);
  --emerald:#18181b; --emerald-soft:rgba(0,0,0,0.07); --emerald-2:#000000;
  --emerald-glow:rgba(0,0,0,0.10); --emerald-pressed:#000000;
  --ring:rgba(0,0,0,0.14);
  --shadow:0 1px 2px rgba(0,0,0,0.06), 0 8px 24px -12px rgba(0,0,0,0.12);
}
/* ── DARK (explicit) — matches the portal's current dark look ─────────── */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg:#0a0a0a; --bg-2:#0f0f10;
  --panel:#141416; --panel-2:#1b1b1e; --panel-3:#222226;
  --card:#0f0f10; --surface:#141416; --surface-2:#1b1b1e;
  --text:#f5f5f7; --text-2:#d4d4d8; --dim:#a1a1aa;
  --muted:#8b9099; --muted-2:#71717a;
  --line:rgba(255,255,255,0.10); --line-2:rgba(255,255,255,0.16); --line-3:rgba(255,255,255,0.06);
  --accent:#f5f5f7; --accent-soft:rgba(255,255,255,0.10); --accent-pressed:#ffffff;
  --on-accent:#0a0a0a; --primary:#f5f5f7; --ghost:rgba(255,255,255,0.05);
  --emerald:#f5f5f7; --emerald-soft:rgba(255,255,255,0.10); --emerald-2:#ffffff;
  --emerald-glow:rgba(255,255,255,0.10); --emerald-pressed:#ffffff;
  --ring:rgba(255,255,255,0.18);
  --shadow:0 1px 2px rgba(0,0,0,0.4), 0 12px 32px -12px rgba(0,0,0,0.6);
}

/* Structural fixes — only when LIGHT is explicitly chosen, so the
 * default-dark pages are never disturbed. Frappe's website shell is dark
 * server-side; neutralise it + lay down a white background. */
html[data-theme="light"] body { background:#ffffff !important; color:#18181b; }
html[data-theme="light"] [id^="page-"],
html[data-theme="light"] .main-section,
html[data-theme="light"] .page_content,
html[data-theme="light"] .page-content-wrapper,
html[data-theme="light"] main.container { background:transparent !important; }
html[data-theme="light"] body::before { content:""; position:fixed; inset:0; background:#ffffff; z-index:-1; }
html[data-theme="dark"] body { background:#0a0a0a !important; }

/* Hardcoded-dark container/topbar classes that don't use tokens — flip
 * them to the light surface so there are no dark islands in Light mode. */
html[data-theme="light"] .rvf-pg-root,
html[data-theme="light"] .rvf-me { background:var(--bg) !important; color:var(--text) !important; }
html[data-theme="light"] .rvf-pg-topbar,
html[data-theme="light"] .rvf-me-bar,
html[data-theme="light"] [class*="__bar"],
html[data-theme="light"] [class$="-topbar"] {
  background:var(--surface) !important; color:var(--text) !important;
  border-bottom:1px solid var(--line) !important; }
html[data-theme="light"] .rvf-footer {
  background:var(--bg) !important; color:var(--muted) !important;
  border-top:1px solid var(--line) !important; }
/* Bars often carry hardcoded white text — re-tone child text/icons to the token. */
html[data-theme="light"] .rvf-pg-topbar *, html[data-theme="light"] [class*="__bar"] *,
html[data-theme="light"] .rvf-me-bar * { color:var(--text-2); }

/* Shared dark cards/containers + Frappe default chrome (pages that don't
 * opt out of navbar/footer, e.g. my-tickets). */
html[data-theme="light"] .rovify-card,
html[data-theme="light"] .rvf-legal,
html[data-theme="light"] .page-card {
  background:var(--card) !important; color:var(--text) !important; border-color:var(--line) !important; }
html[data-theme="light"] .navbar, html[data-theme="light"] .web-footer,
html[data-theme="light"] .footer-logo-extension, html[data-theme="light"] .footer-info {
  background:var(--bg) !important; border-color:var(--line) !important; }
html[data-theme="light"] .navbar a, html[data-theme="light"] .navbar .nav-link,
html[data-theme="light"] .web-footer, html[data-theme="light"] .web-footer a,
html[data-theme="light"] .footer-info { color:var(--text-2) !important; }
html[data-theme="light"] .footer-logo-extension img { filter:none; }

/* ── Shared app bar (injected by rovify_theme.js where a page doesn't
 *    already host its own header, e.g. /manage) ──────────────────────────── */
.rvf-appbar { position:sticky; top:0; z-index:9998; background:var(--bg, #0a0a0a);
  border-bottom:1px solid var(--line, rgba(255,255,255,0.10));
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; }
.rvf-appbar__inner { max-width:1100px; margin:0 auto; padding:11px 18px; display:flex; align-items:center; gap:12px; }
.rvf-appbar__brand { display:inline-flex; align-items:center; gap:9px; text-decoration:none !important; }
.rvf-appbar__logo { height:22px; width:auto; display:block; filter:none; }
html[data-theme="dark"] .rvf-appbar__logo { filter:invert(1) hue-rotate(180deg); }
.rvf-appbar__name { font-size:15.5px; font-weight:720; letter-spacing:-0.02em; color:var(--text, #f5f5f7); }
.rvf-appbar__spacer { margin-left:auto; }
.rvf-appbar__actions { display:flex; align-items:center; gap:9px; }
.rvf-appbar__desk { display:inline-flex; align-items:center; gap:6px; text-decoration:none !important;
  color:var(--text-2, #d4d4d8); font-size:13px; font-weight:560; padding:8px 13px;
  border:1px solid var(--line-2, rgba(255,255,255,0.16)); border-radius:999px; background:transparent;
  transition:border-color .14s, background .14s, color .14s; white-space:nowrap; }
.rvf-appbar__desk:hover { color:var(--text, #f5f5f7); border-color:var(--text-2, #d4d4d8); background:var(--surface, #141416); }
.rvf-theme { position:relative; }
/* Floating variant — for pages that already have their own nav bar. */
.rvf-theme--float { position:fixed; bottom:18px; right:18px; z-index:9998; }
.rvf-theme--float .rvf-theme__btn { background:var(--card, #0f0f10); box-shadow:0 6px 20px rgba(0,0,0,0.28); width:42px; height:42px; }
.rvf-theme--float .rvf-theme-menu { top:auto; bottom:52px; }
.rvf-theme--float .rvf-theme-menu__desk { display:flex; align-items:center; gap:8px; width:100%;
  border:none; background:transparent; color:var(--text,#f5f5f7); font:inherit; font-size:13.5px; font-weight:540;
  padding:9px 10px; border-radius:9px; cursor:pointer; text-align:left; text-decoration:none !important;
  border-top:1px solid var(--line,rgba(255,255,255,0.1)); margin-top:4px; }
.rvf-theme--float .rvf-theme-menu__desk:hover { background:var(--surface,#141416); }
.rvf-theme__btn { width:38px; height:38px; border-radius:999px;
  border:1px solid var(--line-2, rgba(255,255,255,0.16)); background:transparent;
  color:var(--text-2, #d4d4d8); display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:color .14s, border-color .14s, background .14s; }
.rvf-theme__btn:hover { color:var(--text, #f5f5f7); border-color:var(--text-2, #d4d4d8); background:var(--surface, #141416); }
.rvf-theme-menu { position:absolute; right:0; top:46px; min-width:174px; background:var(--card,#0f0f10);
  border:1px solid var(--line-2,rgba(255,255,255,0.16)); border-radius:14px; padding:6px;
  box-shadow:0 16px 44px rgba(0,0,0,0.45); opacity:0; transform:translateY(6px); pointer-events:none;
  transition:opacity .16s, transform .16s; }
.rvf-theme-menu.open { opacity:1; transform:none; pointer-events:auto; }
.rvf-theme-menu__label { font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted,#8b9099); padding:8px 10px 4px; }
.rvf-theme-menu__opt { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  border:none; background:transparent; color:var(--text,#f5f5f7); font:inherit; font-size:13.5px; font-weight:540;
  padding:9px 10px; border-radius:9px; cursor:pointer; text-align:left; }
.rvf-theme-menu__opt:hover { background:var(--surface,#141416); }
.rvf-theme-menu__opt .tick { opacity:0; }
.rvf-theme-menu__opt[aria-checked="true"] .tick { opacity:1; }