/* public/css/mobile-lisibilite.css
 *
 * Correctif de lisibilité mobile, chargé sur TOUTES les pages (application
 * connectée, espace admin, pages publiques).
 *
 * Le design a été composé pour un écran large, avec beaucoup de `text-xs` (12px)
 * et de tailles arbitraires descendant jusqu'à 9px pour les étiquettes. Ces
 * valeurs restent lisibles sur un grand écran mais deviennent pénibles sur un
 * téléphone tenu à bout de bras.
 *
 * Choix d'implémentation : on relève les classes de texte plutôt que la taille
 * racine (`html { font-size }`). Modifier la racine aurait aussi dilaté tous les
 * espacements exprimés en rem, avec un risque de débordement sur les grilles
 * denses qu'on vient justement de corriger. Ici, seul le texte change.
 *
 * Le `!important` est nécessaire : Tailwind (CDN comme compilé) définit ces
 * mêmes classes, et sans lui l'ordre de cascade dépendrait du moment où le CDN
 * injecte sa feuille.
 */

@media (max-width: 767px) {

    /* Tailles arbitraires en pixels : elles ne suivent aucune échelle et
       servent surtout aux étiquettes en capitales et aux pastilles. */
    .text-\[8px\]  { font-size: 11px !important; }
    .text-\[9px\]  { font-size: 11px !important; }
    .text-\[10px\] { font-size: 12px !important; }
    .text-\[11px\] { font-size: 12.5px !important; }
    .text-\[12px\] { font-size: 13px !important; }
    .text-\[13px\] { font-size: 14px !important; }

    /* Échelle Tailwind : on remonte d'un cran les tailles de corps de texte,
       en ajustant l'interligne pour conserver une densité correcte. */
    .text-xs   { font-size: 0.8125rem !important; line-height: 1.15rem !important; }  /* 12 → 13 */
    .text-sm   { font-size: 0.9375rem !important; line-height: 1.4rem !important; }   /* 14 → 15 */
    .text-base { font-size: 1.0625rem !important; line-height: 1.6rem !important; }   /* 16 → 17 */

    /* Champs de saisie : en dessous de 16px, iOS zoome automatiquement sur le
       champ au focus et décale la mise en page. 16px l'en empêche. */
    input:not([type='checkbox']):not([type='radio']),
    select,
    textarea {
        font-size: 16px !important;
    }

    /* Cibles tactiles : les actions en icône seule (barres d'outils des cartes)
       tombaient sous le seuil confortable au doigt. */
    a[title] > svg,
    button[title] > svg {
        min-width: 1.15rem;
        min-height: 1.15rem;
    }
}