/* wiserwork-theme-v1 Part 1: navbar extras (theme toggle + language selector) — both modes. Part 2: light-mode overrides. Dark mode is the site default and untouched: light mode activates only when is set (persisted in localStorage by /assets/ww-ui.js; applied pre-paint by an inline snippet in each page's ). */ /* ---------- Part 1: navbar extras ---------- */ .ww-nav-extras { display: flex; align-items: center; gap: 0.5rem; order: 98; margin-left: 0.6rem; } .navbar-toggler { order: 99; margin-left: 0.5rem; } .ww-theme-toggle { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border, #2e3642); background: var(--surface-light, #252b35); color: #fbbf24; cursor: pointer; font-size: 0.95rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: border-color 0.2s, transform 0.2s, background 0.2s; padding: 0; } .ww-theme-toggle:hover { border-color: #a78bfa; transform: rotate(15deg); } .ww-lang { position: relative; } .ww-lang-btn { display: flex; align-items: center; gap: 0.4rem; height: 38px; padding: 0 0.8rem; border-radius: 2rem; border: 1px solid var(--border, #2e3642); background: var(--surface-light, #252b35); color: var(--text-primary, #e8edf2); cursor: pointer; font-size: 0.8rem; font-weight: 600; font-family: inherit; transition: border-color 0.2s; } .ww-lang-btn:hover { border-color: #a78bfa; } .ww-lang-caret { font-size: 0.6rem; opacity: 0.7; transition: transform 0.2s; } .ww-lang.open .ww-lang-caret { transform: rotate(180deg); } .ww-lang-menu { position: absolute; right: 0; top: calc(100% + 0.5rem); background: var(--surface, #1a1e26); border: 1px solid var(--border, #2e3642); border-radius: 1rem; padding: 0.4rem; min-width: 205px; max-height: min(70vh, 430px); overflow-y: auto; display: none; z-index: 1000; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45); } .ww-lang.open .ww-lang-menu { display: block; } .ww-lang-item { display: flex; align-items: center; gap: 0.6rem; width: 100%; padding: 0.48rem 0.7rem; border: none; border-radius: 0.7rem; background: transparent; text-align: left; text-decoration: none; color: var(--text-primary, #e8edf2); font-size: 0.85rem; font-family: inherit; white-space: nowrap; cursor: pointer; } .ww-lang-item:hover { background: var(--surface-light, #252b35); color: var(--text-primary, #e8edf2); } .ww-flag, .ww-lang-flag { width: 20px; height: 14px; border-radius: 2px; overflow: hidden; flex-shrink: 0; display: inline-flex; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18); } .ww-flag svg, .ww-lang-flag svg { width: 100%; height: 100%; display: block; } .ww-lang-flag i { font-size: 0.85rem; margin: auto; } .ww-lang-current { margin-left: auto; font-size: 0.7rem; color: #4ade80; } @media (max-width: 420px) { .ww-lang-btn .ww-lang-code { display: none; } .ww-nav-extras { gap: 0.4rem; margin-left: 0.4rem; } } /* ---------- Part 3: layout, fields & tables (added 2026-07-16) ---------- These rules are global on purpose: every page loads this file AFTER its own inline