/*
 * Plugin Accessibilité GLPI — Corrections de contraste GLPI baseline
 * RGAA 3.2 (issue #304) : Contraste éléments de formulaire ≥ 3:1
 * RGAA 3.2 (issue #309) : Contraste texte ≥ 4.5:1
 *
 * Ces corrections NE s'appliquent QUE lorsque l'utilisateur a activé
 * l'interrupteur maître « Activer l'accessibilité » dans le widget
 * (html[data-a11y-baseline="1"]). Sans cet attribut, le rendu GLPI
 * natif est préservé à l'identique.
 */

/* ─────────────────────────────────────────────────────────────────────────
   #304 — Contraste bordures éléments de formulaire (RGAA 3.2 / WCAG 1.4.11)
   Thème GLPI par défaut : bordures trop claires (#FEC85B / blanc = 1.5:1)
   Correction : bordure #767676 sur fond blanc = 4.5:1 ✓
   ───────────────────────────────────────────────────────────────────────── */
html[data-a11y-baseline="1"] input:not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
html[data-a11y-baseline="1"] select,
html[data-a11y-baseline="1"] textarea {
    border-color: #767676 !important;
}

/* .input-group-flat (Tabler/GLPI 11) : la bordure visible est sur le wrapper,
   pas sur l'input interne. On fixe le wrapper à #767676 et on efface la bordure
   de l'input interne pour éviter une double bordure. */
html[data-a11y-baseline="1"] .input-group-flat {
    border: 1px solid #767676 !important;
    border-radius: 6px !important;
}

html[data-a11y-baseline="1"] .input-group-flat input:not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
html[data-a11y-baseline="1"] .input-group-flat select,
html[data-a11y-baseline="1"] .input-group-flat textarea {
    border-color: transparent !important;
}

/* Le focus sur .input-group-flat doit rester visible */
html[data-a11y-baseline="1"] .input-group-flat:focus-within {
    border-color: #005FCC !important;
    outline: none;
}

/* Checkboxes et radios — bordure visible ≥ 3:1 */
html[data-a11y-baseline="1"] input[type="checkbox"],
html[data-a11y-baseline="1"] input[type="radio"] {
    outline: 1px solid #767676;
    outline-offset: 0;
}

/* Éviter un double outline sur les checkboxes Bootstrap custom */
html[data-a11y-baseline="1"] .form-check-input {
    border-color: #767676 !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   #309 — Contraste texte (RGAA 3.2 / WCAG 1.4.3) ≥ 4.5:1
   Titres de groupe dans les préférences / personnalisation GLPI
   ───────────────────────────────────────────────────────────────────────── */

/* Titres de groupe de formulaires GLPI (card-header, section headers) */
html[data-a11y-baseline="1"] .card-header,
html[data-a11y-baseline="1"] .card-header .card-title,
html[data-a11y-baseline="1"] .tab-vnavbar .nav-link,
html[data-a11y-baseline="1"] .preference-form .group-title,
html[data-a11y-baseline="1"] .form-group-title,
html[data-a11y-baseline="1"] .pref-section-header {
    color: #1a1a1a !important;
}

/* Texte secondaire / muted — GLPI utilise souvent un gris trop clair */
html[data-a11y-baseline="1"] .text-muted,
html[data-a11y-baseline="1"] .help-block,
html[data-a11y-baseline="1"] .form-text {
    color: #595959 !important; /* ratio ≥ 4.5:1 sur blanc */
}

/* Libellés de formulaire */
html[data-a11y-baseline="1"] label,
html[data-a11y-baseline="1"] .form-label,
html[data-a11y-baseline="1"] .col-form-label {
    color: #1a1a1a;
}

/* ── Le widget a11y garde son thème (Noir Ambré), même master switch activé ──
   Les corrections de contraste des libellés/liens GLPI ci-dessus ciblent le
   contenu de page (texte sombre sur fond clair) et ne doivent pas repeindre
   notre propre UI sur fond sombre. ID + !important > sélecteur générique. */
html[data-a11y-baseline="1"] #a11y-widget-root .a11y-ctrl-label,
html[data-a11y-baseline="1"] #a11y-widget-root label {
    color: var(--aw-text) !important;
}

html[data-a11y-baseline="1"] #a11y-widget-root a {
    color: inherit !important;
}

/* Liens dans le contenu — doivent contraster avec le texte environnant */
html[data-a11y-baseline="1"] a:not(.btn):not(.nav-link):not([class*="dropdown"]) {
    color: #0050b3; /* ratio 5.6:1 sur blanc */
}

html[data-a11y-baseline="1"] a:not(.btn):not(.nav-link):not([class*="dropdown"]):hover,
html[data-a11y-baseline="1"] a:not(.btn):not(.nav-link):not([class*="dropdown"]):focus {
    color: #003a82;
}

/* ─────────────────────────────────────────────────────────────────────────
   Corrections de contraste supplémentaires — scopées hors mode high-contrast
   pour ne pas interférer avec a11y-contrast.css
   ───────────────────────────────────────────────────────────────────────── */
html[data-a11y-baseline="1"]:not([data-a11y-contrast]) {

    /* Placeholders trop pâles (ratio ~2.5:1 dans Bootstrap 5) → 4.5:1 */
    input::placeholder,
    textarea::placeholder {
        color: #595959 !important;
        opacity: 1;
    }

    /* Champs désactivés : texte #6c757d sur #e9ecef = ~3.3:1 → forcer ≥ 4.5:1 */
    .form-control:disabled,
    .form-control[readonly],
    .form-select:disabled {
        color: #444444 !important;
    }

    /* Badges secondaires : fond #6c757d + texte blanc = 4.4:1 — insuffisant.
       Forcer un fond légèrement plus sombre pour atteindre 4.5:1. */
    .badge.bg-secondary {
        background-color: #5a6571 !important;
    }

    /* Liens de navigation désactivés */
    .nav-link.disabled,
    .nav-link[aria-disabled="true"] {
        color: #595959 !important;
    }

    /* Texte des dropdowns Bootstrap : .dropdown-item en état hover/focus */
    .dropdown-item:hover,
    .dropdown-item:focus {
        color: #0d0d0d !important;
    }

    /* Boutons outline secondaires : texte #6c757d = ratio ~3.5:1 */
    .btn-outline-secondary {
        color: #444444 !important;
        border-color: #444444 !important;
    }

    .btn-outline-secondary:hover,
    .btn-outline-secondary:focus {
        color: #fff !important;
        background-color: #444444 !important;
    }
}

/* ─────────────────────────────────────────────────────────────────────────
   Indicateur visuel « nouvelle fenêtre » (RGAA 13.2 / WCAG 3.2)
   Affiche une flèche ↗ après les liens qui ouvrent un nouvel onglet.
   Le module JS marque ces liens via data-a11y-new-window ; l'affichage est
   piloté par html[data-a11y-new-window="1"] et gaté sous l'interrupteur maître.
   ───────────────────────────────────────────────────────────────────────── */
html[data-a11y-baseline="1"][data-a11y-new-window="1"] a[data-a11y-new-window]::after {
    content: "\00a0\2197";
    display: inline;
    font-size: 0.85em;
    line-height: 1;
    color: currentColor;
    text-decoration: none;
}