/* Steamify Cyberpunk Theme — CSS variables from colors.py */

:root {
    /* Backgrounds */
    --bg-primary: #0f0f12;
    --bg-surface: #1e1e24;
    --bg-elevated: #2a2a32;
    --bg-input: #16161a;

    /* Accents */
    --accent-purple: #8b5cf6;
    --accent-purple-hover: #7c3aed;
    --accent-lime: #d4f658;
    --accent-lime-dark: #a3b53a;
    --accent-red: #ef4444;
    --accent-red-hover: #dc2626;
    --accent-blue: #3b82f6;
    --accent-blue-hover: #2563eb;
    --accent-yellow: #f59e0b;
    --accent-cyan: #06b6d4;

    /* Text */
    --text-primary: #ffffff;
    --text-secondary: #9ca3af;
    --text-tertiary: #6b7280;
    --text-disabled: #4b5563;

    /* Borders */
    --border: #3f3f46;
    --border-light: #52525b;
    --border-focus: #8b5cf6;

    /* Status */
    --status-online: #10b981;
    --status-offline: #6b7280;
    --status-busy: #f59e0b;

    /* Profit */
    --profit-positive: #10b981;
    --profit-negative: #ef4444;
    --profit-neutral: #9ca3af;

    /* Typography */
    --font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', Consolas, monospace;

    /* Font sizes */
    --text-xs: 11px;
    --text-sm: 13px;
    --text-base: 14px;
    --text-lg: 16px;
    --text-xl: 18px;
    --text-2xl: 22px;
    --text-3xl: 28px;

    /* Spacing */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 24px;
    --space-2xl: 32px;

    /* Border radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;

    /* Shadows */
    --glow-purple: 0 0 20px rgba(139, 92, 246, 0.3);
    --glow-lime: 0 0 20px rgba(212, 246, 88, 0.3);

    /* Glass */
    --glass-bg: rgba(30, 30, 36, 0.75);
    --glass-bg-sidebar: rgba(30, 30, 36, 0.6);
    --glass-card: rgba(30, 30, 36, 0.8);
    --glass-logs: rgba(16, 16, 20, 0.9);
}

/* ========== Light Theme ========== */

[data-theme="light"] {
    --bg-primary: #f0f0f5;
    --bg-surface: #ffffff;
    --bg-elevated: #e8e8ef;
    --bg-input: #ffffff;

    --text-primary: #1a1a2e;
    --text-secondary: #555568;
    --text-tertiary: #8888a0;
    --text-disabled: #c0c0cc;

    --border: #c8c8d4;
    --border-light: #dcdce6;
    --border-focus: #7c3aed;

    --accent-purple: #7c3aed;
    --accent-purple-hover: #6d28d9;
    --accent-red: #dc2626;
    --accent-red-hover: #b91c1c;
    --accent-blue: #2563eb;
    --accent-blue-hover: #1d4ed8;
    --accent-yellow: #d97706;
    --accent-cyan: #0891b2;

    --status-online: #059669;
    --status-offline: #9ca3af;
    --status-busy: #d97706;

    --profit-positive: #059669;
    --profit-negative: #dc2626;
    --profit-neutral: #6b7280;

    --glow-purple: 0 0 20px rgba(124, 58, 237, 0.1);
    --glow-lime: 0 0 20px rgba(101, 163, 13, 0.1);

    --glass-bg: rgba(255, 255, 255, 0.88);
    --glass-bg-sidebar: rgba(255, 255, 255, 0.8);
    --glass-card: rgba(255, 255, 255, 0.95);
    --glass-logs: rgba(248, 248, 252, 0.98);

    /* Light theme specific */
    --shadow-card: 0 1px 4px rgba(0, 0, 0, 0.06), 0 2px 12px rgba(0, 0, 0, 0.04);
    --shadow-dropdown: 0 4px 20px rgba(0, 0, 0, 0.12);
    --shadow-toast: 0 2px 12px rgba(0, 0, 0, 0.1);
}