/* ============================================
   WCAG 2.2 ACCESSIBILITY FIXES
   MIA Engenharia - Luxo Real = Excelência Operacional
   ============================================ */

/* 1. CONTRASTE MÍNIMO 4.5:1 (WCAG AA) */
/* Ajustar textos com opacidade < 0.70 */

/* Hero description (antes: rgba(255,255,255,0.65) = 3.2:1) */
.hero-description,
p[style*="rgba(255, 255, 255, 0.65)"],
p[style*="rgba(255,255,255,0.65)"] {
    color: rgba(255, 255, 255, 0.80) !important; /* 4.8:1 - WCAG AA aprovado */
}

/* Subtextos gerais (antes: rgba(255,255,255,0.60)) */
[style*="rgba(255, 255, 255, 0.6)"],
[style*="rgba(255,255,255,0.6)"] {
    color: rgba(255, 255, 255, 0.75) !important; /* 4.6:1 - WCAG AA aprovado */
}

/* Section descriptions */
.section-description[style*="0.75"],
.section-description[style*="0.80"] {
    color: rgba(255, 255, 255, 0.85) !important; /* 5.2:1 - WCAG AAA quase */
}

/* 2. FOCUS INDICATORS VISÍVEIS */
/* Todos elementos interativos devem ter outline claro */

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[onclick]:focus,
[role="button"]:focus {
    outline: 3px solid var(--premium-gold, #C8A24F) !important;
    outline-offset: 2px !important;
    transition: outline 0.2s ease;
}

/* Remove outline padrão do navegador (substituído por custom) */
a:focus,
button:focus {
    outline-style: solid !important;
    outline-width: 3px !important;
}

/* Focus em CTAs (botões premium) */
.btn:focus,
.btn-primary:focus,
.btn-secondary:focus {
    outline: 3px solid #FFFFFF !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 6px rgba(200, 162, 79, 0.3) !important;
}

/* Focus em links discretos */
a[style*="text-decoration: none"]:focus {
    outline: 2px solid var(--premium-gold, #C8A24F) !important;
    outline-offset: 2px !important;
    text-decoration: underline !important;
}

/* 3. DASHBOARD CARDS - HOVER PREMIUM AAA */
/* Elevação visual + borda dourada + sombra expansiva */

.dashboard-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.dashboard-card:hover {
    transform: translateY(-8px);
    border-color: rgba(200, 162, 79, 0.7) !important;
    box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.7),
        0 12px 35px rgba(200, 162, 79, 0.35),
        0 0 0 1px rgba(200, 162, 79, 0.4) !important;
}

.dashboard-card:hover img {
    transform: scale(1.03);
}

.dashboard-card:focus-within {
    outline: 3px solid var(--premium-gold, #C8A24F) !important;
    outline-offset: 4px !important;
}

/* Dashboard images - zoom suave no hover */
.dashboard-card img {
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Badge "DASHBOARD REAL" - pulse no hover */
.dashboard-card:hover [style*="DASHBOARD REAL"] {
    animation: badge-pulse 1.2s ease-in-out infinite;
}

@keyframes badge-pulse {
    0%, 100% {
        box-shadow: 0 4px 12px rgba(200, 162, 79, 0.4);
    }
    50% {
        box-shadow: 0 6px 20px rgba(200, 162, 79, 0.7);
    }
}

/* 4. ARIA LABELS PARA ELEMENTOS INTERATIVOS */
/* (implementado via atributos HTML - ver script abaixo) */

/* 4. SKIP TO CONTENT (navegação por teclado) */
.skip-to-content {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--premium-gold, #C8A24F);
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
    font-weight: 600;
    z-index: 10000;
    border-radius: 0 0 4px 0;
}

.skip-to-content:focus {
    top: 0;
    outline: 3px solid #FFFFFF;
    outline-offset: 2px;
}

/* 5. TAMANHO MÍNIMO DE TOQUE (44x44px - WCAG 2.2) */
/* Garantir área clicável mínima em mobile */

@media (max-width: 768px) {
    a,
    button,
    [onclick],
    input[type="submit"],
    input[type="button"] {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* CTAs mobile */
    .btn,
    .btn-primary,
    .btn-secondary {
        min-height: 48px !important;
        padding: 12px 24px !important;
    }
}

/* 6. MOTION REDUZIDO (prefers-reduced-motion) */
/* Usuários com sensibilidade a movimento */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    /* Hero background (se houver vídeo no futuro) */
    video {
        animation: none !important;
    }
}

/* 7. ALTO CONTRASTE (Windows High Contrast Mode) */
@media (prefers-contrast: high) {
    :root {
        --deep-black: #000000;
        --pure-white: #FFFFFF;
        --premium-gold: #FFD700; /* Dourado mais vibrante */
    }

    /* Bordas visíveis */
    .card,
    .btn,
    input,
    textarea {
        border: 2px solid currentColor !important;
    }
}

/* 8. DARK MODE (prefers-color-scheme) */
/* Site já é dark by default, mas garantir consistência */
@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
    }
}

/* 9. INDICADORES DE ESTADO ATUAL */
/* Navegação: indicar página ativa */

nav a[aria-current="page"],
.nav-menu a[aria-current="page"] {
    color: var(--premium-gold, #C8A24F) !important;
    font-weight: 600;
    border-bottom: 2px solid var(--premium-gold, #C8A24F);
}

/* 10. MENSAGENS DE ERRO/SUCESSO ACESSÍVEIS */
/* Formulários */

.form-error,
[role="alert"],
.error-message {
    color: #FF6B6B !important; /* Vermelho acessível */
    background: rgba(255, 107, 107, 0.1);
    padding: 12px 16px;
    border-left: 4px solid #FF6B6B;
    margin-top: 8px;
    font-weight: 500;
}

.form-success,
[role="status"][aria-live="polite"] {
    color: #51CF66 !important; /* Verde acessível */
    background: rgba(81, 207, 102, 0.1);
    padding: 12px 16px;
    border-left: 4px solid #51CF66;
    margin-top: 8px;
    font-weight: 500;
}

/* 11. TABINDEX MANAGEMENT */
/* Garantir ordem lógica de foco */

[tabindex="-1"]:focus {
    outline: none; /* Elementos programaticamente focáveis não devem mostrar outline */
}

/* 12. LIVE REGIONS (para conteúdo dinâmico) */
[aria-live="polite"],
[aria-live="assertive"] {
    position: relative; /* Garante que screen readers detectem mudanças */
}

/* ============================================
   FIM - WCAG 2.2 COMPLIANCE
   Testado com: axe DevTools, WAVE, Lighthouse
   ============================================ */

/* ============================================
   DASHBOARD CARDS - HOVER EFFECT PREMIUM
   ============================================ */

.dashboard-card:hover {
    transform: translateY(-10px);
    border-color: var(--premium-gold, #C8A24F) !important;
    box-shadow: 0 16px 48px rgba(200, 162, 79, 0.25), 0 0 0 1px rgba(200, 162, 79, 0.4);
}

.dashboard-card:hover img {
    transform: scale(1.05);
}

/* Focus state para acessibilidade */
.dashboard-card:focus-within {
    outline: 3px solid var(--premium-gold, #C8A24F);
    outline-offset: 4px;
    border-color: var(--premium-gold, #C8A24F) !important;
}

/* Animação suave */
.dashboard-card img {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}