/**
 * Configuração Global de Cores - Sistema MeuControle
 * 
 * Este arquivo define todas as cores padrão do sistema usando CSS Custom Properties.
 * Para usar uma cor, utilize: var(--color-primary) ou var(--primary)
 */

:root {
    /* === CORES PRINCIPAIS === */
    --primary: #4ECDC4;           /* Turquesa principal */
    --secondary: #2D3748;         /* Cinza escuro */
    --accent: #FFE66D;            /* Amarelo */
    
    /* === VARIAÇÕES DO PRIMARY === */
    --primary-dark: #3DB8B0;      /* Turquesa mais escuro para hover */
    --primary-light: #E0F7F5;     /* Turquesa claro para backgrounds */
    --primary-50: #F0FDFC;        /* Turquesa muito claro */
    --primary-100: #CCFBF1;       /* Turquesa claro */
    --primary-200: #99F6E4;       /* Turquesa médio claro */
    --primary-300: #5EEAD4;       /* Turquesa médio */
    --primary-400: #2DD4BF;       /* Turquesa médio escuro */
    --primary-500: #14B8A6;       /* Turquesa base */
    --primary-600: #0D9488;       /* Turquesa escuro */
    --primary-700: #0F766E;       /* Turquesa muito escuro */
    --primary-800: #115E59;       /* Turquesa super escuro */
    --primary-900: #134E4A;       /* Turquesa máximo */
    
    /* === CORES DE SISTEMA === */
    --success: #10B981;           /* Verde para sucesso */
    --success-light: #D1FAE5;     /* Verde claro */
    --success-dark: #059669;      /* Verde escuro */
    
    --error: #EF4444;             /* Vermelho para erro */
    --error-light: #FEE2E2;       /* Vermelho claro */
    --error-dark: #DC2626;        /* Vermelho escuro */
    
    --warning: #F59E0B;           /* Laranja para aviso */
    --warning-light: #FEF3C7;     /* Laranja claro */
    --warning-dark: #D97706;      /* Laranja escuro */
    
    --info: #3B82F6;              /* Azul para informação */
    --info-light: #DBEAFE;        /* Azul claro */
    --info-dark: #2563EB;         /* Azul escuro */
    
    /* === CORES NEUTRAS === */
    --gray-light: #F9F9F9;        /* Cinza claro do template */
    --gray-dark: #666666;         /* Cinza escuro do template */
    --gray-50: #F9FAFB;
    --gray-100: #F3F4F6;
    --gray-200: #E5E7EB;
    --gray-300: #D1D5DB;
    --gray-400: #9CA3AF;
    --gray-500: #6B7280;
    --gray-600: #4B5563;
    --gray-700: #374151;
    --gray-800: #1F2937;
    --gray-900: #111827;
    
    /* === CORES DE TEXTO === */
    --text-primary: #1F2937;      /* Texto principal */
    --text-secondary: #6B7280;    /* Texto secundário */
    --text-muted: #9CA3AF;        /* Texto esmaecido */
    --text-white: #FFFFFF;        /* Texto branco */
    
    /* === CORES DE BACKGROUND === */
    --bg-primary: #FFFFFF;        /* Background principal */
    --bg-secondary: #F9FAFB;      /* Background secundário */
    --bg-tertiary: #F3F4F6;       /* Background terciário */
    --bg-dark: #1F2937;           /* Background escuro */
    
    /* === CORES DE BORDA === */
    --border-light: #E5E7EB;      /* Borda clara */
    --border-medium: #D1D5DB;     /* Borda média */
    --border-dark: #9CA3AF;       /* Borda escura */
    
    /* === SOMBRAS === */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    
    /* === GRADIENTES === */
    --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    --gradient-success: linear-gradient(135deg, var(--success) 0%, var(--success-dark) 100%);
    --gradient-error: linear-gradient(135deg, var(--error) 0%, var(--error-dark) 100%);
    --gradient-warning: linear-gradient(135deg, var(--warning) 0%, var(--warning-dark) 100%);
    --gradient-info: linear-gradient(135deg, var(--info) 0%, var(--info-dark) 100%);
    
    /* === TRANSIÇÕES === */
    --transition-fast: 0.15s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
    --transition-slow: 0.5s ease-in-out;
    
    /* === BORDAS ARREDONDADAS === */
    --radius-sm: 0.25rem;         /* 4px */
    --radius: 0.375rem;           /* 6px */
    --radius-md: 0.5rem;          /* 8px */
    --radius-lg: 0.75rem;         /* 12px */
    --radius-xl: 1rem;            /* 16px */
    --radius-full: 9999px;        /* Circular */
}

/* === CLASSES UTILITÁRIAS === */

/* Cores de background */
.bg-primary { background-color: var(--primary) !important; }
.bg-primary-light { background-color: var(--primary-light) !important; }
.bg-primary-dark { background-color: var(--primary-dark) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-accent { background-color: var(--accent) !important; }

.bg-success { background-color: var(--success) !important; }
.bg-success-light { background-color: var(--success-light) !important; }
.bg-error { background-color: var(--error) !important; }
.bg-error-light { background-color: var(--error-light) !important; }
.bg-warning { background-color: var(--warning) !important; }
.bg-warning-light { background-color: var(--warning-light) !important; }
.bg-info { background-color: var(--info) !important; }
.bg-info-light { background-color: var(--info-light) !important; }

/* Cores de texto */
.text-primary { color: var(--primary) !important; }
.text-primary-dark { color: var(--primary-dark) !important; }
.text-secondary { color: var(--secondary) !important; }
.text-accent { color: var(--accent) !important; }

.text-success { color: var(--success) !important; }
.text-error { color: var(--error) !important; }
.text-warning { color: var(--warning) !important; }
.text-info { color: var(--info) !important; }

/* Cores de borda */
.border-primary { border-color: var(--primary) !important; }
.border-primary-light { border-color: var(--primary-light) !important; }
.border-success { border-color: var(--success) !important; }
.border-error { border-color: var(--error) !important; }
.border-warning { border-color: var(--warning) !important; }
.border-info { border-color: var(--info) !important; }

/* Botões com cores do sistema */
.btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: white !important;
    transition: var(--transition-normal);
}

.btn-primary:hover {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
    transform: translateY(-1px);
}

.btn-success {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
    color: white !important;
    transition: var(--transition-normal);
}

.btn-success:hover {
    background-color: var(--success-dark) !important;
    border-color: var(--success-dark) !important;
}

.btn-error {
    background-color: var(--error) !important;
    border-color: var(--error) !important;
    color: white !important;
    transition: var(--transition-normal);
}

.btn-error:hover {
    background-color: var(--error-dark) !important;
    border-color: var(--error-dark) !important;
}

.btn-warning {
    background-color: var(--warning) !important;
    border-color: var(--warning) !important;
    color: white !important;
    transition: var(--transition-normal);
}

.btn-warning:hover {
    background-color: var(--warning-dark) !important;
    border-color: var(--warning-dark) !important;
}

/* Cards com cores do sistema */
.card-primary {
    border-left: 4px solid var(--primary);
    background: linear-gradient(135deg, var(--primary-50) 0%, white 100%);
}

.card-success {
    border-left: 4px solid var(--success);
    background: linear-gradient(135deg, var(--success-light) 0%, white 100%);
}

.card-error {
    border-left: 4px solid var(--error);
    background: linear-gradient(135deg, var(--error-light) 0%, white 100%);
}

.card-warning {
    border-left: 4px solid var(--warning);
    background: linear-gradient(135deg, var(--warning-light) 0%, white 100%);
}

.card-info {
    border-left: 4px solid var(--info);
    background: linear-gradient(135deg, var(--info-light) 0%, white 100%);
}

/* Links com cores do sistema */
.link-primary {
    color: var(--primary) !important;
    transition: var(--transition-normal);
}

.link-primary:hover {
    color: var(--primary-dark) !important;
    text-decoration: none;
}

/* Badges/Tags */
.badge-primary {
    background-color: var(--primary);
    color: white;
}

.badge-success {
    background-color: var(--success);
    color: white;
}

.badge-error {
    background-color: var(--error);
    color: white;
}

.badge-warning {
    background-color: var(--warning);
    color: white;
}

.badge-info {
    background-color: var(--info);
    color: white;
}

/* Alertas */
.alert-primary {
    background-color: var(--primary-light);
    border-color: var(--primary);
    color: var(--primary-dark);
}

.alert-success {
    background-color: var(--success-light);
    border-color: var(--success);
    color: var(--success-dark);
}

.alert-error {
    background-color: var(--error-light);
    border-color: var(--error);
    color: var(--error-dark);
}

.alert-warning {
    background-color: var(--warning-light);
    border-color: var(--warning);
    color: var(--warning-dark);
}

.alert-info {
    background-color: var(--info-light);
    border-color: var(--info);
    color: var(--info-dark);
}