/* ============================================
   Améliorations d'accessibilité WCAG 2.1 AA
   ============================================ */

/* Validates: Requirements 13.1, 13.2, 13.3, 13.4, 13.5 */

/* Focus visible pour tous les éléments interactifs */
button:focus,
a:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus {
    outline: 3px solid #4A90E2;
    outline-offset: 2px;
}

/* Taille de police minimale 14px */
body {
    font-size: 14px;
}

/* Contraste WCAG AA pour les textes */
.text-primary {
    color: #212529; /* Contraste 16.1:1 sur blanc */
}

.text-secondary {
    color: #495057; /* Contraste 8.6:1 sur blanc */
}

/* Contraste pour les badges de confiance */
.confidence-high {
    background-color: #28a745;
    color: #ffffff; /* Contraste 4.5:1 */
}

.confidence-medium {
    background-color: #fd7e14;
    color: #000000; /* Contraste 4.6:1 */
}

.confidence-low {
    background-color: #dc3545;
    color: #ffffff; /* Contraste 5.9:1 */
}

/* Labels ARIA visuellement cachés mais accessibles aux lecteurs d'écran */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Skip link pour navigation clavier */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #000;
    color: #fff;
    padding: 8px;
    text-decoration: none;
    z-index: 100;
}

.skip-link:focus {
    top: 0;
}

/* Indicateurs de focus améliorés pour les panneaux */
.panel:focus-within {
    box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.3);
}

/* Amélioration du contraste pour les liens */
a {
    color: #0056b3; /* Contraste 7.0:1 sur blanc */
    text-decoration: underline;
}

a:hover {
    color: #003d82;
}

/* Amélioration du contraste pour les boutons */
.btn-primary {
    background-color: #0056b3;
    border-color: #004085;
    color: #ffffff;
}

.btn-primary:hover {
    background-color: #004085;
}

.btn-secondary {
    background-color: #6c757d;
    border-color: #545b62;
    color: #ffffff;
}

.btn-success {
    background-color: #28a745;
    border-color: #1e7e34;
    color: #ffffff;
}

/* Amélioration de la visibilité des séparateurs */
.panel-separator {
    background-color: #495057;
}

.panel-separator:hover,
.panel-separator:focus {
    background-color: #212529;
}

/* Amélioration du contraste pour les onglets */
.tab-button {
    color: #495057;
}

.tab-button.active {
    color: #212529;
    border-bottom-color: #0056b3;
}

/* Amélioration du contraste pour les highlights */
.highlight-dp {
    background-color: rgba(0, 123, 255, 0.3);
    border-bottom: 2px solid #007bff;
}

.highlight-dr {
    background-color: rgba(40, 167, 69, 0.3);
    border-bottom: 2px solid #28a745;
}

.highlight-das {
    background-color: rgba(255, 193, 7, 0.3);
    border-bottom: 2px solid #ffc107;
}

.highlight-ccam {
    background-color: rgba(111, 66, 193, 0.3);
    border-bottom: 2px solid #6f42c1;
}

/* Amélioration de la visibilité des tooltips */
.tooltip {
    background-color: #212529;
    color: #ffffff;
    border: 1px solid #495057;
}

/* Mode haut contraste (optionnel) */
@media (prefers-contrast: high) {
    * {
        border-color: #000 !important;
    }
    
    .text-secondary {
        color: #212529 !important;
    }
}

/* Mode sombre (optionnel) */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #212529;
        color: #f8f9fa;
    }
    
    .panel {
        background-color: #343a40;
        border-color: #495057;
    }
    
    .text-primary {
        color: #f8f9fa;
    }
    
    .text-secondary {
        color: #adb5bd;
    }
}
