/*
 * Plugin Accessibilité GLPI — Espacement du texte
 * RGAA 10.12 / WCAG 1.4.12 : Espacement du texte (Level AA)
 *
 * Critère : lorsqu'un utilisateur applique les propriétés suivantes,
 * aucun contenu ni fonctionnalité ne doit être perdu :
 *   - Hauteur de ligne ≥ 1.5 × taille de la police
 *   - Espacement des lettres ≥ 0.12 em
 *   - Espacement des mots ≥ 0.16 em
 *   - Espace après les paragraphes ≥ 2 em
 *
 * Trois paliers, portés par la VALEUR de data-a11y-spacing sur <html>
 * (positionné par JS) : absent = désactivé, "medium" ou "large" choisit le
 * jeu de variables ci-dessous. Toutes les autres règles du fichier ciblent
 * la simple présence de l'attribut — c'est la valeur qui sélectionne le
 * palier, pas la présence qui en dépend.
 * Distinct de la propriété CSS prefers-reduced-motion.
 */

/* ── Variables par palier ─────────────────────────────────────────────────────
   medium : les seuils exacts de WCAG 1.4.12 (interligne 1.5, lettres 0.12em,
            mots 0.16em, paragraphes 2em).
   large  : au-delà du critère, pour les utilisateurs qui en ont besoin. */
html[data-a11y-spacing="medium"] {
    --a11y-line-height:     1.5;
    --a11y-letter-spacing:  0.12em;
    --a11y-word-spacing:    0.16em;
    --a11y-para-spacing:    2em;
}

html[data-a11y-spacing="large"] {
    --a11y-line-height:     1.8;
    --a11y-letter-spacing:  0.2em;
    --a11y-word-spacing:    0.24em;
    --a11y-para-spacing:    2.5em;
}

/* ── Texte courant : paragraphes, listes, définitions ─────────────────────── */
html[data-a11y-spacing] p,
html[data-a11y-spacing] li,
html[data-a11y-spacing] dt,
html[data-a11y-spacing] dd,
html[data-a11y-spacing] blockquote {
    line-height:     var(--a11y-line-height)    !important;
    letter-spacing:  var(--a11y-letter-spacing) !important;
    word-spacing:    var(--a11y-word-spacing)   !important;
}

/* Espacement après paragraphe */
html[data-a11y-spacing] p + p,
html[data-a11y-spacing] p:not(:last-child) {
    margin-bottom: var(--a11y-para-spacing) !important;
}

/* ── Titres ────────────────────────────────────────────────────────────────── */
html[data-a11y-spacing] h1,
html[data-a11y-spacing] h2,
html[data-a11y-spacing] h3,
html[data-a11y-spacing] h4,
html[data-a11y-spacing] h5,
html[data-a11y-spacing] h6 {
    line-height:    var(--a11y-line-height)    !important;
    letter-spacing: var(--a11y-letter-spacing) !important;
    word-spacing:   var(--a11y-word-spacing)   !important;
}

/* ── Éléments de formulaire ────────────────────────────────────────────────── */
html[data-a11y-spacing] input,
html[data-a11y-spacing] select,
html[data-a11y-spacing] textarea,
html[data-a11y-spacing] button,
html[data-a11y-spacing] label {
    line-height:    var(--a11y-line-height)    !important;
    letter-spacing: var(--a11y-letter-spacing) !important;
    word-spacing:   var(--a11y-word-spacing)   !important;
}

/* ── Cellules de tableau ────────────────────────────────────────────────────── */
html[data-a11y-spacing] th,
html[data-a11y-spacing] td {
    line-height:    var(--a11y-line-height)    !important;
    letter-spacing: var(--a11y-letter-spacing) !important;
}

/* ── Navigation : ne pas casser les menus avec l'espacement ─────────────────
   Les items de nav ont souvent des contraintes de largeur fixes.
   On limite le letter-spacing pour éviter les débordements de menu.
   ─────────────────────────────────────────────────────────────────────────── */
html[data-a11y-spacing] .nav-link,
html[data-a11y-spacing] .dropdown-item,
html[data-a11y-spacing] .breadcrumb-item {
    letter-spacing: 0.05em !important;  /* Réduit pour la navigation */
    word-spacing:   0.08em !important;
}

/* ── Composants Tabler / Bootstrap ─────────────────────────────────────────── */
html[data-a11y-spacing] .form-label,
html[data-a11y-spacing] .form-text,
html[data-a11y-spacing] .alert,
html[data-a11y-spacing] .badge,
html[data-a11y-spacing] .card-text {
    line-height:    var(--a11y-line-height)    !important;
    letter-spacing: var(--a11y-letter-spacing) !important;
    word-spacing:   var(--a11y-word-spacing)   !important;
}

/* ── Widget a11y lui-même : ne pas appliquer l'espacement aux contrôles ───────
   Évite de casser l'ergonomie du widget d'accessibilité avec ses propres styles.
   ─────────────────────────────────────────────────────────────────────────── */
html[data-a11y-spacing] #a11y-panel *,
html[data-a11y-spacing] #a11y-trigger {
    letter-spacing: normal !important;
    word-spacing:   normal !important;
}

/* ── Interligne / hauteur de ligne (préférence utilisateur dédiée) ──────────────
   Distincte de l'espacement du texte (data-a11y-spacing). Pilotée par
   data-a11y-line-height="1" + la variable --a11y-user-line-height (1.5 ou 2),
   positionnées par le JS. Gatée sous l'interrupteur maître (data-a11y-baseline).
   ─────────────────────────────────────────────────────────────────────────────── */
html[data-a11y-baseline][data-a11y-line-height="1"] p,
html[data-a11y-baseline][data-a11y-line-height="1"] li,
html[data-a11y-baseline][data-a11y-line-height="1"] dt,
html[data-a11y-baseline][data-a11y-line-height="1"] dd,
html[data-a11y-baseline][data-a11y-line-height="1"] blockquote,
html[data-a11y-baseline][data-a11y-line-height="1"] h1,
html[data-a11y-baseline][data-a11y-line-height="1"] h2,
html[data-a11y-baseline][data-a11y-line-height="1"] h3,
html[data-a11y-baseline][data-a11y-line-height="1"] h4,
html[data-a11y-baseline][data-a11y-line-height="1"] h5,
html[data-a11y-baseline][data-a11y-line-height="1"] h6,
html[data-a11y-baseline][data-a11y-line-height="1"] label,
html[data-a11y-baseline][data-a11y-line-height="1"] th,
html[data-a11y-baseline][data-a11y-line-height="1"] td,
html[data-a11y-baseline][data-a11y-line-height="1"] .form-label,
html[data-a11y-baseline][data-a11y-line-height="1"] .form-text,
html[data-a11y-baseline][data-a11y-line-height="1"] .card-text {
    line-height: var(--a11y-user-line-height, 1.5) !important;
}

/* Ne pas appliquer l'interligne aux contrôles du widget a11y lui-même */
html[data-a11y-baseline][data-a11y-line-height="1"] #a11y-panel *,
html[data-a11y-baseline][data-a11y-line-height="1"] #a11y-trigger {
    line-height: normal !important;
}
