:root {
    --bg: #0a0a0a;
    --panel: rgba(255, 255, 255, 0.06);
    --panel-2: rgba(255, 255, 255, 0.09);
    --text: #ffffff;
    --muted: rgba(255, 255, 255, 0.72);
    --primary-bg: #ffffff;
    --primary-text: #0a0a0a;
    --input-bg: rgba(255, 255, 255, 0.10);
    --shadow: 0 16px 40px rgba(0,0,0,0.35);
    --radius: 16px;

    --accent: #dc143c;
    --accent-text: #ffffff;

    --sidebar-bg: #242526;
    --sidebar-surface: #3a3b3c;
    --sidebar-text: rgba(255, 255, 255, 0.82);
    --sidebar-muted: rgba(255, 255, 255, 0.66);
    --sidebar-accent: var(--accent);
    --sidebar-accent-text: var(--accent-text);
    --sidebar-width: 250px;
    --sidebar-width-collapsed: 88px;

    --body-color: #e4e9f7;
    --sidebar-color: #fff;
    --primary-color: #dc143c;
    --primary-color-light: #f6f5ff;
    --toggle-color: #ddd;
    --text-color: #707070;
}

body[data-theme="light"] {
    --bg: #ffffff;
    --panel: rgba(0, 0, 0, 0.05);
    --panel-2: rgba(0, 0, 0, 0.08);
    --text: #000000;
    --muted: rgba(0, 0, 0, 0.70);
    --primary-bg: #000000;
    --primary-text: #ffffff;
    --input-bg: rgba(0, 0, 0, 0.06);
    --shadow: 0 16px 40px rgba(0, 0, 0, 0.12);

    --accent: #dc143c;
    --accent-text: #ffffff;

    --sidebar-bg: #ffffff;
    --sidebar-surface: #f6f6f7;
    --sidebar-text: #707070;
    --sidebar-muted: #707070;
    --sidebar-accent: var(--accent);
    --sidebar-accent-text: var(--accent-text);

    --body-color: #e4e9f7;
    --sidebar-color: #fff;
    --primary-color: #dc143c;
    --primary-color-light: #f6f5ff;
    --toggle-color: #ddd;
    --text-color: #707070;
}

body.dark,
body[data-theme="dark"] {
    --body-color: #18191a;
    --sidebar-color: #242526;
    --primary-color: #3a3b3c;
    --primary-color-light: #3a3b3c;
    --toggle-color: #fff;
    --text-color: #ccc;
}