/* * Bohémian Kéa — dark mode * Applied via [data-theme="dark"] on * Toggled by initThemeToggle() in scripts.js */ [data-theme="dark"] { --bg: #161310; --bg-2: #1e1b17; --paper: #201d19; --ink: #ede8de; --ink-2: #cec8bc; --muted: #7a7468; --muted-2: #514c44; --hair: rgba(240, 235, 224, 0.11); --hair-soft: rgba(240, 235, 224, 0.06); --accent: #c99468; --accent-2: #b8865a; } /* Nav — frosted dark when scrolled */ [data-theme="dark"] .nav--solid { background: rgba(22, 19, 16, 0.88); border-bottom-color: rgba(240, 235, 224, 0.08); } /* Image placeholder fallback */ [data-theme="dark"] .img-ph { background-color: #2a2520; } /* Logo — invert logic flips in dark mode */ [data-theme="dark"] #main-nav .logo .nav__symbol img { filter: invert(1); } [data-theme="dark"] #main-nav.nav--solid .logo .nav__symbol img { filter: invert(1); } /* Book sheet & calendar surfaces */ [data-theme="dark"] .book-sheet__inner { background: var(--bg); } /* Stripe placeholder */ [data-theme="dark"] .img-ph--stripe { background-image: repeating-linear-gradient( -45deg, transparent, transparent 6px, rgba(255,255,255,0.03) 6px, rgba(255,255,255,0.03) 12px ); } /* Theme toggle button */ .theme-toggle { display: flex; align-items: center; justify-content: center; /* width: 32px; */ /* height: 32px; */ background: transparent; border: 0; cursor: pointer; color: inherit; opacity: 0.75; transition: opacity 0.2s; flex-shrink: 0; padding: 0; margin: 0 -6px; } .theme-toggle:hover { opacity: 1; } .theme-toggle svg {display: block;width: 27px;height: 26px;} /* Sun icon — shown in dark mode */ .theme-toggle__moon { display: block; } .theme-toggle__sun { display: none; } [data-theme="dark"] .theme-toggle__moon { display: none; } [data-theme="dark"] .theme-toggle__sun { display: block; } .theme-toggle svg.theme-toggle__sun {display:none;} [data-theme="dark"] .theme-toggle svg.theme-toggle__sun {display:block;}