/*
 * Descripción: Definición de variables de diseño (colores, espaciado, tipografía).
 */

/* ==========================================================================
   TOKENS — Design tokens (custom properties only)
   Layer 1 of 7 — ITCSS Settings
   ========================================================================== */

:root, [data-theme="light"] {
    /* Apple Light Mode (Default) - Contrast Optimized */
    --bg: #f2f2f7;
    --text: #1d1d1f;
    --text-rgb: 29, 29, 31;
    --text-dim: #5c5c61; /* Apple System Gray - Contrast Optimized (>4.5:1) */
    --glass-bg: rgba(255, 255, 255, 0.7);
    --glass-border: rgba(0, 0, 0, 0.08);
    --card-bg: #ffffff;
    --primary: #0071e3;
    --primary-rgb: 0, 113, 227;
    --primary-dark: #005bb7;
    --primary-light: #5856d6;
    --accent: #ff9500;
    --success: #1d9d3f;
    --success-rgb: 29, 157, 63;
    --error: #d70015;
    --error-rgb: 215, 0, 21;
    --warning: #cc7a00;
    
    /* Translucent utility colors for badges & pills */
    --primary-05: rgba(var(--primary-rgb), 0.05);
    --primary-20: rgba(var(--primary-rgb), 0.20);
    --success-05: rgba(var(--success-rgb), 0.05);

    --btn-radius: 14px;
    --card-radius: 28px;
    --shadow-soft: 0 8px 30px rgba(0, 0, 0, 0.04);
    --shadow-elevated: 0 20px 80px rgba(0, 0, 0, 0.08);
    --font-main: 'Atkinson Hyperlegible Next', sans-serif;
    --font-code: 'JetBrains Mono', monospace;
    --stat-xp: #008a70;
    --logo-text: #1d1d1f;
    --code-bg: #000000;
    --code-bg-deep: #050505;
    --code-text: #e0e0e0;
    --code-line-even: rgba(255, 255, 255, 0.08);
    --code-line-hover: rgba(255, 255, 255, 0.15);
    --code-line-border: rgba(255, 255, 255, 0.05);
    --white-fixed: #f0f6fc;
}


[data-theme="dark"] {
    /* Apple Dark Mode - Softer Grey */
    --bg: #0d0d0f;
    --text: #f5f5f7;
    --text-rgb: 245, 245, 247;
    --text-dim: #98989d; /* Apple System Gray (Dark Mode) - Highly accessible */
    --glass-bg: rgba(22, 22, 23, 0.8);
    --glass-border: rgba(255, 255, 255, 0.1);
    --card-bg: #1c1c1e;
    --primary: #0a84ff;
    --primary-rgb: 10, 132, 255;
    --primary-dark: #0066cc;
    --accent: #ffd60a;
    --success-rgb: 48, 209, 88; /* Apple Dark Green */

    /* Stats Colors (Dark Mode) */
    --stat-xp: #00ffcc;

    /* Brand Assets */
    --logo-text: #ffffff;
}

[data-theme="rosa"] {
    /* Apple Pink Mode */
    --primary: #ff2d55;
    --primary-rgb: 255, 45, 85;
    --primary-dark: #d01d44;
    --bg: #fff0f3;
    --text: #590d22;
    --text-rgb: 89, 13, 34;
    --text-dim: #a4133c; /* Excellent contrast on #fff0f3 */
    --glass-bg: rgba(255, 255, 255, 0.6);
    --glass-border: rgba(255, 133, 161, 0.3);
    --card-bg: #ffffff;
    --success-rgb: 29, 157, 63;

    /* Brand Assets */
    --logo-text: #333333;
}

[data-theme="cielo"] {
    /* Apple Blue Mode (Cuqui) */
    --primary: #007aff;
    --primary-rgb: 0, 122, 255;
    --primary-dark: #0056b3;
    --bg: #f0f7ff;
    --text: #003a75;
    --text-rgb: 0, 58, 117;
    --text-dim: #0056b3; /* Dark blue with excellent >4.5:1 contrast ratio */
    --glass-bg: rgba(255, 255, 255, 0.7);
    --glass-border: rgba(0, 122, 255, 0.2);
    --card-bg: #ffffff;
    --success-rgb: 29, 157, 63;

    /* Brand Assets */
    --logo-text: #003a75;
}

[data-theme="solarized-light"] {
    /* Solarized Light Theme */
    --bg: #fdf6e3;
    --text: #657b83;
    --text-rgb: 101, 123, 131;
    --text-dim: #586e75; /* base01 - meets WCAG AA 4.5:1 on Solarized Light */
    --glass-bg: rgba(238, 232, 213, 0.8);
    --glass-border: rgba(147, 161, 161, 0.2);
    --card-bg: #eee8d5;
    --primary: #268bd2;
    --primary-rgb: 38, 139, 210;
    --primary-dark: #2176b3;
    --accent: #b58900;
    --success: #859900;
    --success-rgb: 133, 153, 0;
    --error: #dc322f;
    --warning: #cb4b16;

    /* Brand Assets */
    --logo-text: #586e75;
}

[data-theme="solarized-dark"] {
    /* Solarized Dark Theme */
    --bg: #002b36;
    --text: #93a1a1; /* base1 - significantly higher contrast for readability */
    --text-rgb: 147, 161, 161;
    --text-dim: #839496; /* base0 - highly readable secondary text */
    --glass-bg: rgba(7, 54, 66, 0.85);
    --glass-border: rgba(88, 110, 117, 0.3);
    --card-bg: #073642;
    --primary: #268bd2;
    --primary-rgb: 38, 139, 210;
    --primary-dark: #2176b3;
    --accent: #b58900;
    --success: #859900;
    --success-rgb: 133, 153, 0;
    --error: #dc322f;
    --warning: #cb4b16;

    /* Brand Assets */
    --logo-text: #93a1a1;
}