/* Sistema Central de Cores */
:root {
    /* Cor Principal Unificada (Header, Footer e Card Headers) */
    --main-gradient: linear-gradient(135deg, #1e293b 0%, #1e293b 100%);
    --main-solid: #6366f1;
    --main-dark: #4f46e5;
    --main-light: #a5b4fc;
    
    /* Paleta de Neutros */
    --bg-primary: #1e293b;
    --bg-secondary: #334155;
    --bg-tertiary: #475569;
    --surface: #263041;
    --surface-elevated: #263041;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #ffffff;
    --text-light: #ffffff;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #f59e0b;
    --accent-success: #10b981;
    --accent-warning: #f97316;
    --accent-error: #ef4444;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(99, 102, 241, 0.05);
    --main-transparent-10: rgba(99, 102, 241, 0.1);
    --main-transparent-20: rgba(99, 102, 241, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.16);
    --shadow-main: 0 4px 20px rgba(99, 102, 241, 0.25);
    
    /* Transições */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.4s ease;
    
    /* Espaçamentos - Paddings */
    --padding-xs: 4px;
    --padding-sm: 8px;
    --padding-md: 12px;
    --padding-lg: 16px;
    --padding-xl: 20px;
    --padding-xxl: 24px;
    
    /* Espaçamentos - Margins */
    --margin-xs: 4px;
    --margin-sm: 8px;
    --margin-md: 12px;
    --margin-lg: 16px;
    --margin-xl: 20px;
    --margin-xxl: 24px;
    
    /* Espaçamentos - Gaps */
    --gap-xs: 4px;
    --gap-sm: 8px;
    --gap-md: 12px;
    --gap-lg: 16px;
    --gap-xl: 20px;
    
    /* Bordas e Arredondamentos */
    --border-radius-sm: 6px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-xl: 16px;
    --border-radius-circle: 50%;
}

/* Temas Alternativos */
[data-theme="ocean"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
    --main-solid: #06b6d4;
    --main-dark: #0e7490;
    --main-light: #67e8f9;
    
    /* Paleta de Neutros */
    --bg-primary: #082f49;
    --bg-secondary: #0c4a6e;
    --bg-tertiary: #0369a1;
    --surface: #0c4a6e;
    --surface-elevated: #0c4a6e;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #e0f2fe;
    --text-light: #f0f9ff;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #10b981;
    --accent-warning: #fb923c;
    --accent-error: #ef4444;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(6, 182, 212, 0.05);
    --main-transparent-10: rgba(6, 182, 212, 0.1);
    --main-transparent-20: rgba(6, 182, 212, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(6, 182, 212, 0.25);
}

[data-theme="sunset"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    --main-solid: #f97316;
    --main-dark: #c2410c;
    --main-light: #fed7aa;
    
    /* Paleta de Neutros */
    --bg-primary: #431407;
    --bg-secondary: #7c2d12;
    --bg-tertiary: #9a3412;
    --surface: #7c2d12;
    --surface-elevated: #7c2d12;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #ffedd5;
    --text-light: #fff7ed;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #22c55e;
    --accent-warning: #fb923c;
    --accent-error: #ef4444;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(249, 115, 22, 0.05);
    --main-transparent-10: rgba(249, 115, 22, 0.1);
    --main-transparent-20: rgba(249, 115, 22, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(249, 115, 22, 0.25);
}

[data-theme="forest"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
    --main-solid: #16a34a;
    --main-dark: #15803d;
    --main-light: #86efac;
    
    /* Paleta de Neutros */
    --bg-primary: #14532d;
    --bg-secondary: #166534;
    --bg-tertiary: #15803d;
    --surface: #166534;
    --surface-elevated: #166534;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #dcfce7;
    --text-light: #f0fdf4;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #4ade80;
    --accent-warning: #fb923c;
    --accent-error: #ef4444;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(22, 163, 74, 0.05);
    --main-transparent-10: rgba(22, 163, 74, 0.1);
    --main-transparent-20: rgba(22, 163, 74, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(22, 163, 74, 0.25);
}

/* Novos Temas */
[data-theme="black"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #000000 0%, #111111 100%);
    --main-solid: #333333;
    --main-dark: #000000;
    --main-light: #666666;
    
    /* Paleta de Neutros */
    --bg-primary: #000000;
    --bg-secondary: #111111;
    --bg-tertiary: #222222;
    --surface: #0a0a0a;
    --surface-elevated: #0a0a0a;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #cccccc;
    --text-light: #eeeeee;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #ffd700;
    --accent-success: #00ff00;
    --accent-warning: #ff9900;
    --accent-error: #ff0000;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(51, 51, 51, 0.05);
    --main-transparent-10: rgba(51, 51, 51, 0.1);
    --main-transparent-20: rgba(51, 51, 51, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
    --shadow-main: 0 4px 20px rgba(0, 0, 0, 0.5);
}

[data-theme="green"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #15803d 0%, #166534 100%);
    --main-solid: #15803d;
    --main-dark: #166534;
    --main-light: #86efac;
    
    /* Paleta de Neutros */
    --bg-primary: #052e16;
    --bg-secondary: #064e3b;
    --bg-tertiary: #065f46;
    --surface: #053a20;
    --surface-elevated: #053a20;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #d1fae5;
    --text-light: #ecfdf5;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #4ade80;
    --accent-warning: #fb923c;
    --accent-error: #f87171;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(21, 128, 61, 0.05);
    --main-transparent-10: rgba(21, 128, 61, 0.1);
    --main-transparent-20: rgba(21, 128, 61, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(21, 128, 61, 0.25);
}

[data-theme="blue"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
    --main-solid: #1d4ed8;
    --main-dark: #1e40af;
    --main-light: #93c5fd;
    
    /* Paleta de Neutros */
    --bg-primary: #0c1c36;
    --bg-secondary: #172554;
    --bg-tertiary: #1e3a8a;
    --surface: #0f2344;
    --surface-elevated: #0f2344;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #dbeafe;
    --text-light: #eff6ff;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #4ade80;
    --accent-warning: #fb923c;
    --accent-error: #f87171;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(29, 78, 216, 0.05);
    --main-transparent-10: rgba(29, 78, 216, 0.1);
    --main-transparent-20: rgba(29, 78, 216, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(29, 78, 216, 0.25);
}

[data-theme="fuchsia"] {
    /* Cor Principal Unificada */
    --main-gradient: linear-gradient(135deg, #c026d3 0%, #a21caf 100%);
    --main-solid: #c026d3;
    --main-dark: #a21caf;
    --main-light: #f5d0fe;
    
    /* Paleta de Neutros */
    --bg-primary: #3b0764;
    --bg-secondary: #4a044e;
    --bg-tertiary: #701a75;
    --surface: #4a0568;
    --surface-elevated: #4a0568;
    
    /* Texto */
    --text-primary: #ffffff;
    --text-secondary: #fae8ff;
    --text-light: #fdf4ff;
    --text-on-dark: #ffffff;
    --text-on-main: #ffffff;
    
    /* Acentos */
    --accent-gold: #fbbf24;
    --accent-success: #4ade80;
    --accent-warning: #fb923c;
    --accent-error: #f87171;
    
    /* Transparências */
    --white-transparent-10: rgba(255, 255, 255, 0.1);
    --white-transparent-20: rgba(255, 255, 255, 0.2);
    --white-transparent-30: rgba(255, 255, 255, 0.3);
    --white-transparent-70: rgba(255, 255, 255, 0.7);
    --main-transparent-05: rgba(192, 38, 211, 0.05);
    --main-transparent-10: rgba(192, 38, 211, 0.1);
    --main-transparent-20: rgba(192, 38, 211, 0.2);
    
    /* Sombras */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --shadow-main: 0 4px 20px rgba(192, 38, 211, 0.25);
}