/* Theme System with CSS Custom Properties */
:root {
    /* Light theme colors - Blue tones to match WNP logo */
    --primary-color: #2563eb;        /* Rich blue */
    --primary-color-rgb: 37, 99, 235; /* RGB values for rgba() usage */
    --primary-hover: #1d4ed8;
    --secondary-color: #1e293b;      /* Dark slate */
    --accent-color: #3b82f6;         /* Bright blue accent */

    --bg-primary: #ffffff;
    --bg-secondary: #f8fafc;
    --bg-gradient: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);

    --text-primary: #2c3e50;
    --text-secondary: #666666;
    --text-muted: #ffffff;
    --text-inverse: #ffffff;

    --border-color: #e0e0e0;
    --shadow-color: rgba(0,0,0,0.1);
    --shadow-strong: rgba(0,0,0,0.3);

    /* Platform colors */
    --twitch-color: #9146ff;
    --kick-color: #53fc18;
    --discord-color: #5865f2;
    --youtube-color: #ff0000;

    /* Semantic colors */
    --success-color: #28a745;
    --warning-color: #ffc107;
    --danger-color: #dc3545;
    --muted-color: #999999;
}

/* Dark theme colors */
[data-theme="dark"] {
    --primary-color: #3b82f6;
    --primary-color-rgb: 59, 130, 246; /* RGB values for rgba() usage */
    --primary-hover: #2563eb;
    --secondary-color: #475569;
    --accent-color: #60a5fa;

    --bg-primary: #0f172a;
    --bg-secondary: #1e293b;
    --bg-gradient: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);

    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --text-inverse: #0f172a;

    --border-color: #334155;
    --shadow-color: rgba(0,0,0,0.3);
    --shadow-strong: rgba(0,0,0,0.6);
}

/* Auto theme detection */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --primary-color: #3b82f6;
        --primary-color-rgb: 59, 130, 246; /* RGB values for rgba() usage */
        --primary-hover: #2563eb;
        --secondary-color: #475569;
        --accent-color: #60a5fa;

        --bg-primary: #0f172a;
        --bg-secondary: #1e293b;
        --bg-gradient: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);

        --text-primary: #f1f5f9;
        --text-secondary: #cbd5e1;
        --text-muted: #94a3b8;
        --text-inverse: #0f172a;

        --border-color: #334155;
        --shadow-color: rgba(0,0,0,0.3);
        --shadow-strong: rgba(0,0,0,0.6);
    }
}