/* IntEarth dark mode ("candlelit library"). Loaded after each page's own styles.
   html[data-theme="dark"] is set by /assets/theme.js (saved choice, else the device setting). */
html[data-theme="dark"] {
    color-scheme: dark;
    /* main site pages */
    --bg-primary: #1c1510;
    --bg-secondary: #2a2018;
    --bg-card: #3a2c20;
    --text-primary: #ecdcc0;
    --text-secondary: #bfa98a;
    --accent: #c8803f;
    --accent-hover: #d99456;
    --gold: #e0b45a;
    --error: #ff8a80;
    --success: #81c784;
    /* wiki */
    --bg: #1c1510;
    --card: #2a2018;
    --card2: #3a2c20;
    --text: #ecdcc0;
    --muted: #bfa98a;
    --accent2: #d99456;
    /* reader: the book's pages at night */
    --paper: #2b2219;
    --paper-edge: #3a2e22;
    --ink: #e6d6b8;
}
html[data-theme="dark"] body { background-color: var(--bg-primary); }

/* hard-coded light surfaces on individual pages */
html[data-theme="dark"] .margin-comment,
html[data-theme="dark"] .comment-popup { background: var(--bg-secondary); color: var(--text-primary); }
html[data-theme="dark"] .margin-comment-delete:hover { background: rgba(255, 138, 128, 0.15); }
html[data-theme="dark"] .error { background: rgba(255, 138, 128, 0.12); }
html[data-theme="dark"] .search,
html[data-theme="dark"] .book { background: var(--bg-secondary); color: var(--text-primary); border-color: #5a4330; }
html[data-theme="dark"] .card:hover { background: #33271c; }
html[data-theme="dark"] mark { background: #6b5320; color: inherit; }
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-theme="dark"] textarea,
html[data-theme="dark"] select { background-color: #241b14; color: var(--text-primary); border-color: #5a4330; }

/* reader: chapter titles are drawn in the leather color, which vanishes on dark pages */
html[data-theme="dark"] .page .text h2 { color: var(--gold); }

/* the toggle */
.theme-toggle {
    position: fixed; right: 14px; bottom: 14px; z-index: 9999;
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.25); cursor: pointer;
    background: #e8d4a8; color: #2c1810; font-size: 18px; line-height: 1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); opacity: 0.85;
    display: flex; align-items: center; justify-content: center;
}
.theme-toggle:hover, .theme-toggle:focus-visible { opacity: 1; }
html[data-theme="dark"] .theme-toggle { background: #3a2c20; color: #ecdcc0; border-color: #5a4330; }
@media print { .theme-toggle { display: none; } }