/**
 * ════════════════════════════════════════════════════════════════════════
 * SISTEMA DE CORES CENTRALIZADO - PALETA VERDE #00A857
 * ════════════════════════════════════════════════════════════════════════
 */

:root {
    /* ═══════════════════════════════════════════════════════════════════
       CORES PRIMÁRIAS (VERDE)
       ═══════════════════════════════════════════════════════════════════ */
    --cor-primaria: #00A857;              /* Verde principal */
    --cor-primaria-escura: #008F4A;       /* Verde escuro (hover) */
    --cor-primaria-clara: #00C366;        /* Verde claro */
    --cor-primaria-muito-clara: #E6F9F0;  /* Verde muito claro (backgrounds) */
    --cor-primaria-transparente: rgba(0, 168, 87, 0.7); /* Verde com transparência */
    
    /* ═══════════════════════════════════════════════════════════════════
       GRADIENTES PRIMÁRIOS (VERDE)
       ═══════════════════════════════════════════════════════════════════ */
    --gradiente-primario: linear-gradient(135deg, #00A857 0%, #00C366 100%);
    --gradiente-primario-reverso: linear-gradient(135deg, #00C366 0%, #00A857 100%);
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES SECUNDÁRIAS (BOTÕES BRANCOS SOBRE VERDE)
       ═══════════════════════════════════════════════════════════════════ */
    --cor-botao-branco: #ffffff;
    --cor-botao-branco-hover: #f0f0f0;
    --cor-botao-branco-texto: #00A857;
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES DE SUCESSO (VERDE CLARO - para aprovações)
       ═══════════════════════════════════════════════════════════════════ */
    --cor-sucesso: #4CAF50;               /* Verde aprovação */
    --cor-sucesso-escura: #45a049;        /* Verde aprovação escuro */
    --cor-sucesso-clara: #e8f5e9;         /* Verde aprovação claro (backgrounds) */
    --cor-sucesso-transparente: rgba(76, 175, 80, 0.7); /* Verde aprovação transparente */
    --gradiente-sucesso: linear-gradient(135deg, #4CAF50 0%, #45a049 100%);
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES DE ALERTA/AVISO
       ═══════════════════════════════════════════════════════════════════ */
    --cor-alerta: #FF9800;                /* Laranja de alerta */
    --cor-alerta-clara: #fff3e0;          /* Fundo de alerta */
    --cor-alerta-borda: #FFA726;          /* Borda de alerta */
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES DE INFORMAÇÃO
       ═══════════════════════════════════════════════════════════════════ */
    --cor-info: #2196F3;                  /* Azul de informação */
    --cor-info-clara: #e3f2fd;            /* Fundo azul claro */
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES NEUTRAS
       ═══════════════════════════════════════════════════════════════════ */
    --cor-branco: #ffffff;
    --cor-preto: #000000;
    --cor-texto-principal: #1a1a1a;       /* Texto principal (títulos) */
    --cor-texto-secundario: #333;         /* Texto secundário */
    --cor-texto-terciario: #666;          /* Texto terciário (legendas) */
    --cor-texto-claro: #999;              /* Texto muito claro */
    
    /* ═══════════════════════════════════════════════════════════════════
       BACKGROUNDS
       ═══════════════════════════════════════════════════════════════════ */
    --bg-principal: #f5f5f5;              /* Background principal da página */
    --bg-card: #ffffff;                   /* Background de cards */
    --bg-secundario: #f8f8f8;             /* Background secundário */
    
    /* ═══════════════════════════════════════════════════════════════════
       BORDAS
       ═══════════════════════════════════════════════════════════════════ */
    --borda-principal: #e5e5e5;           /* Borda padrão */
    --borda-secundaria: #ddd;             /* Borda secundária */
    --borda-clara: #f0f0f0;               /* Borda muito clara */
    --borda-input: #e0e0e0;               /* Borda de inputs */
    
    /* ═══════════════════════════════════════════════════════════════════
       SOMBRAS
       ═══════════════════════════════════════════════════════════════════ */
    --sombra-leve: 0 2px 4px rgba(0,0,0,0.05);
    --sombra-media: 0 2px 8px rgba(0,0,0,0.08);
    --sombra-forte: 0 4px 12px rgba(0,0,0,0.15);
    --sombra-card: 0 2px 8px rgba(0,0,0,0.2);
    --sombra-hover: 0 4px 12px rgba(0, 168, 87, 0.3);        /* Sombra verde no hover */
    --sombra-sucesso: 0 4px 12px rgba(76, 175, 80, 0.3);     /* Sombra verde aprovação */
    --sombra-card-visual: 0 8px 20px rgba(0, 168, 87, 0.3);  /* Sombra do cartão visual */
    
    /* ═══════════════════════════════════════════════════════════════════
       ANIMAÇÕES DE PULSO (VERDE)
       ═══════════════════════════════════════════════════════════════════ */
    --pulso-primario-inicio: 0 0 0 0 rgba(0, 168, 87, 0.7);
    --pulso-primario-meio: 0 0 0 10px rgba(0, 168, 87, 0);
    --pulso-primario-fim: 0 0 0 0 rgba(0, 168, 87, 0);
        
    --pulso-sucesso-inicio: 0 0 0 0 rgba(76, 175, 80, 0.7);
    --pulso-sucesso-meio: 0 0 0 10px rgba(76, 175, 80, 0);
    --pulso-sucesso-fim: 0 0 0 0 rgba(76, 175, 80, 0);
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES ESPECIAIS
       ═══════════════════════════════════════════════════════════════════ */
    --cor-estrela: #FFC107;               /* Estrelas de avaliação */
    --cor-erro: #ff5252;                  /* Vermelho de erro */
    --cor-erro-clara: #ffeded;            /* Fundo de erro */
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES DOS BADGES/ETIQUETAS
       ═══════════════════════════════════════════════════════════════════ */
    --badge-rapido-bg: var(--cor-primaria);    /* Badge "Mais rápido" */
    --badge-economico-bg: #4CAF50;             /* Badge "Econômico" */
    
    /* ═══════════════════════════════════════════════════════════════════
       OPACIDADES
       ═══════════════════════════════════════════════════════════════════ */
    --opacity-hover: 0.9;
    --opacity-disabled: 0.5;
    --opacity-subtle: 0.95;
    --opacity-badge: 0.2;
    --opacity-badge-border: 0.3;
    
    /* ═══════════════════════════════════════════════════════════════════
       CORES RGBA PARA BACKGROUNDS TRANSPARENTES
       ═══════════════════════════════════════════════════════════════════ */
    --rgba-branco-20: rgba(255, 255, 255, 0.2);
    --rgba-branco-30: rgba(255, 255, 255, 0.3);
    --rgba-preto-50: rgba(0, 0, 0, 0.5);
    --rgba-preto-80: rgba(0, 0, 0, 0.8);
    --rgba-preto-100: rgba(0, 0, 0, 1);
}

/* ═══════════════════════════════════════════════════════════════════
   ANIMAÇÕES GLOBAIS
   ═══════════════════════════════════════════════════════════════════ */

/* Animação de pulso VERDE para botões primários */
@keyframes pulse-primario {
    0% {
        box-shadow: var(--pulso-primario-inicio);
    }
    70% {
        box-shadow: var(--pulso-primario-meio);
    }
    100% {
        box-shadow: var(--pulso-primario-fim);
    }
}

/* Animação de pulso para botões de sucesso/aprovação */
@keyframes pulse-sucesso {
    0% {
        box-shadow: var(--pulso-sucesso-inicio);
    }
    70% {
        box-shadow: var(--pulso-sucesso-meio);
    }
    100% {
        box-shadow: var(--pulso-sucesso-fim);
    }
}

/* Animação de rotação (spinners) */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Animação de pulso para ícones */
@keyframes pulse-icon {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.15); }
}

/* Animação de pulso genérica */
@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Animação de fade para confetes */
@keyframes confetti-fall {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/* ═══════════════════════════════════════════════════════════════════
   CLASSES UTILITÁRIAS
   ═══════════════════════════════════════════════════════════════════ */

/* Cores de texto */
.cor-primaria { color: var(--cor-primaria) !important; }
.cor-sucesso { color: var(--cor-sucesso) !important; }
.cor-alerta { color: var(--cor-alerta) !important; }
.cor-info { color: var(--cor-info) !important; }

/* Backgrounds */
.bg-primaria { background: var(--cor-primaria) !important; }
.bg-sucesso { background: var(--cor-sucesso) !important; }
.bg-gradiente-primario { background: var(--gradiente-primario) !important; }
.bg-gradiente-sucesso { background: var(--gradiente-sucesso) !important; }