/* Light mode (default) */
:root {
    --bg: #f8f8fb;
    --text: #1a1a2e;
    --card-bg: #fff;
    --card-hover: #eeeef5;
    --card-alt: #f4f4f9;
    --muted: #888;
    --muted2: #999;
    --muted3: #777;
    --muted4: #666;
    --muted5: #555;
    --border: #e0e0e8;
    --border-light: #f0f0f5;
    --border-footer: #e8e8ee;
    --grid-bg: #e0e0e8;
    --grid-header-bg: #eaf2f8;
    --grid-header-today: #d0e4f5;
    --grid-header-color: #2471a3;
    --grid-lesson-bg: #f0f0f5;
    --grid-cell-today: #fffbe6;
    --empty-cell: #ddd;
    --lesson-num-color: #bbb;
    --badge-cancelled-bg: #fde8e8;
    --badge-cancelled-color: #c0392b;
    --badge-sub-bg: #fef9e7;
    --badge-sub-color: #b7950b;
    --badge-room-bg: #eaf2f8;
    --badge-room-color: #2471a3;
    --toggle-bg: #ccc;
    --toggle-active: #5b9bd5;
    --toggle-knob: #fff;
    --link-accent: #5b7bd5;
    --rss-color: #e67e00;
    --vp-note-color: #e74c3c;
    --shadow: rgba(0,0,0,0.06);
}

/* Dark mode via data attribute */
[data-theme="dark"] {
    --bg: #1a1a2e;
    --text: #e0e0e8;
    --card-bg: #2a2a4e;
    --card-hover: #33335a;
    --card-alt: #2a2a4e;
    --muted: #999;
    --muted2: #888;
    --muted3: #aaa;
    --muted4: #bbb;
    --muted5: #ccc;
    --border: #3a3a5e;
    --border-light: #3a3a5e;
    --border-footer: #3a3a5e;
    --grid-bg: #3a3a5e;
    --grid-header-bg: #2a2a4e;
    --grid-header-today: #333360;
    --grid-header-color: #6db3e8;
    --grid-lesson-bg: #252545;
    --grid-cell-today: #33334a;
    --empty-cell: #555;
    --lesson-num-color: #666;
    --badge-cancelled-bg: #3d2020;
    --badge-cancelled-color: #f08080;
    --badge-sub-bg: #3d3520;
    --badge-sub-color: #e8d44d;
    --badge-room-bg: #1e2d40;
    --badge-room-color: #6db3e8;
    --toggle-bg: #555;
    --toggle-active: #4a8cc2;
    --toggle-knob: #e0e0e8;
    --link-accent: #7b9be5;
    --rss-color: #f0a030;
    --vp-note-color: #f08080;
    --shadow: rgba(0,0,0,0.2);
}

/* Auto dark mode (when no data-theme is set) */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --bg: #1a1a2e;
        --text: #e0e0e8;
        --card-bg: #2a2a4e;
        --card-hover: #33335a;
        --card-alt: #2a2a4e;
        --muted: #999;
        --muted2: #888;
        --muted3: #aaa;
        --muted4: #bbb;
        --muted5: #ccc;
        --border: #3a3a5e;
        --border-light: #3a3a5e;
        --border-footer: #3a3a5e;
        --grid-bg: #3a3a5e;
        --grid-header-bg: #2a2a4e;
        --grid-header-today: #333360;
        --grid-header-color: #6db3e8;
        --grid-lesson-bg: #252545;
        --grid-cell-today: #33334a;
        --empty-cell: #555;
        --lesson-num-color: #666;
        --badge-cancelled-bg: #3d2020;
        --badge-cancelled-color: #f08080;
        --badge-sub-bg: #3d3520;
        --badge-sub-color: #e8d44d;
        --badge-room-bg: #1e2d40;
        --badge-room-color: #6db3e8;
        --toggle-bg: #555;
        --toggle-active: #4a8cc2;
        --toggle-knob: #e0e0e8;
        --link-accent: #7b9be5;
        --rss-color: #f0a030;
        --vp-note-color: #f08080;
        --shadow: rgba(0,0,0,0.2);
    }
}

/* Theme toggle button */
.theme-toggle {
    margin-left: auto;
    font-size: 1.1rem;
    background: none;
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
    cursor: pointer;
    color: var(--muted);
    line-height: 1;
}
.theme-toggle:hover {
    background: var(--card-hover);
}