/* ===== SINPC CABO - DESIGN SYSTEM TOKENS ===== */

:root {
    /* Cores de Marca (Brand Colors) */
    --primary-red: #e30613;
    --primary-red-hover: #c4050e;
    --primary-red-glow: rgba(227, 6, 19, 0.15);
    --primary-blue: #1664ac;
    --primary-blue-hover: #104e87;
    --primary-blue-glow: rgba(22, 100, 172, 0.15);

    /* Cores de Status (Feedback Colors) */
    --success: #10b981;
    --success-hover: #059669;
    --success-glow: rgba(16, 185, 129, 0.15);
    
    --warning: #f59e0b;
    --warning-hover: #d97706;
    --warning-glow: rgba(245, 158, 11, 0.15);
    
    --danger: #ef4444;
    --danger-hover: #dc2626;
    --danger-glow: rgba(239, 68, 68, 0.15);
    
    --info: #3b82f6;
    --info-hover: #2563eb;
    --info-glow: rgba(59, 130, 246, 0.15);

    /* Neutros (Escala Slate - Tons Claros Suaves e Premium) */
    --slate-50: #fafbfc;
    --slate-100: #f5f7fa;
    --slate-200: #eaedf2;
    --slate-300: #dbe1e9;
    --slate-400: #a0aec0;
    --slate-500: #718096;
    --slate-600: #475569;
    --slate-700: #334155;
    --slate-800: #1e293b;
    --slate-900: #0f172a;
    --slate-950: #020617;
    --white: #ffffff;

    /* Gradientes Corporativos */
    --gradient-primary: linear-gradient(135deg, #e30613 0%, #990000 100%);
    --gradient-dark: linear-gradient(135deg, #0f172a 0%, #020617 100%);
    --gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%);
    --gradient-glass-border: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.03) 100%);

    /* Transparências e Vidro (Glassmorphism) */
    --glass-bg: rgba(255, 255, 255, 0.45);
    --glass-border: rgba(255, 255, 255, 0.4);
    --glass-shadow: 0 8px 32px 0 rgba(15, 23, 42, 0.05);
    --glass-backdrop-filter: blur(12px);

    /* Sombras Premium (Box Shadows) */
    --shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.06), 0 2px 4px -2px rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.05), 0 4px 6px -4px rgba(15, 23, 42, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.08), 0 8px 10px -6px rgba(15, 23, 42, 0.08);

    /* Border Radius */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 30px;
    --radius-full: 9999px;

    /* Transições Fluidas */
    --transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== RESET & ACESSIBILIDADE DE FOCO ===== */
html {
    scroll-behavior: smooth;
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

/* Foco Acessível (Outline nítido para navegação por teclado) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--primary-red);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px var(--primary-red-glow);
}

/* Customização de Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--slate-100);
}

::-webkit-scrollbar-thumb {
    background: var(--slate-300);
    border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--slate-400);
}