/*
 * [T4 B-4-1 2026-09-30 · Claude Opus 5.5] FEUILLE PROPRE DES LAYOUTS DE RIF
 * (chemin logique styles/app.css, servi par l'AssetMapper sous /modules/…).
 *
 * Liée par front/base.html.twig JUSTE APRÈS Bootstrap 5.3.3 et AVANT les feuilles
 * du site (style4, cookieconsent, perso), qui gardent donc le dernier mot comme
 * elles l'avaient sur Bootstrap 4. Deux parties :
 *
 * 1. Les classes qui remplacent les styles en ligne du layout public, et les réglages d'accessibilité
 *    (lien d'évitement, focus visible, contrastes WCAG 2.1 AA 4,5:1).
 *
 * 2. LE PONT BOOTSTRAP 4 : les règles de Bootstrap 4.2.1 (MIT, © 2011-2018 The
 *    Bootstrap Authors, Twitter Inc.) pour les SEULES classes que Bootstrap 5 a
 *    retirées et que les gabarits de RIF — ou le thème de formulaire
 *    bootstrap_4_layout — emploient encore. Extraites telles quelles de
 *    public/front/css/bootstrap.min.css. tests/Unit/Twig/PontBootstrap4Test.php
 *    recalcule cette liste et tombe si une classe y manque. À RETIRER classe par
 *    classe à mesure que B-4-2 reprend les gabarits.
 *    [B-4-2, 30/09] Le pont est gardé ENTIER : card-columns, badge-primary et
 *    font-italic ne sont plus employées par aucun gabarit, mais la recette au
 *    navigateur de B-4-1, en attente, vérifie encore leur rendu. À retirer une fois
 *    B-4-1 et B-4-2 validées.
 */

/* ── 1. Layout public ─────────────────────────────────────────────────────── */

/* Lien d'évitement : invisible (visually-hidden-focusable) jusqu'au focus clavier. */
.lien-d-evitement:focus,
.lien-d-evitement:focus-visible {
    position: fixed !important;
    top: .5rem;
    left: .5rem;
    z-index: 1080;
    padding: .5rem 1rem;
    background-color: #fff;
    color: #0a58ca;
    border: 2px solid #0a58ca;
    border-radius: .25rem;
    text-decoration: underline;
}

/* [hors-planning 30/09] Cible du lien d'évitement : après Entrée, la zone de
   contenu reçoit le focus mais rien ne le montrait. Contour au clavier seulement
   (:focus-visible — un clic de souris ne le déclenche pas), #0a58ca 6,4:1 sur
   blanc (tests/Unit/Twig/CibleDuLienDEvitementVisibleTest.php). */
#contenu-principal:focus-visible {
    outline: 3px solid #0a58ca;
    outline-offset: -3px;
}

/* Focus visible au clavier sur la navigation latérale (fond #2B2D2E). */
#sidebar a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -2px;
}

/* [hors-planning 30/09] Zone de contenu, à côté de #sidebar dans .wrapper (flex,
   style4) : elle prend le RESTE de la rangée et peut rétrécir sous la largeur de
   son contenu. « w-100 » lui donnait 100 % EN PLUS des 80 px du menu : la page
   débordait à droite sur téléphone (tests/Unit/Twig/LayoutPublicNeDebordePasTest.php). */
.contenu-principal {
    flex: 1 1 0;
    min-width: 0;
}

/* [hors-planning 30/09] Un descendant en position: absolute (span.visually-hidden
   des en-têtes triables) reste dans la boîte qui défile au lieu d'élargir la page. */
.table-responsive {
    position: relative;
}

/* Pied de page — reprend à l'identique les styles en ligne d'avant B-4-1. */
.pied-de-page {
    font-size: 14px;
    background-color: #f8f9fa;
    border-top: 1px solid #eee;
}

.pied-de-page__bloc {
    min-height: 180px;
}

.pied-de-page__bloc--haut {
    min-height: 230px;
}

/* Titres : #808080 (« grey ») sur #f8f9fa ne donnait que 3,75:1 ; #595959 donne 6,65:1. */
.pied-de-page__titre {
    color: #595959;
}

.pied-de-page__reseaux {
    font-size: 20px;
}

.pied-de-page__mentions {
    font-size: 13px;
}

/* Liens du pied : le bleu primaire de Bootstrap 5 (#0d6efd) ne donne que 4,3:1
   sur #f8f9fa ; #0a58ca (son « emphasis ») donne 6,1:1. */
.pied-de-page .text-primary {
    color: #0a58ca !important;
}

/* ── 1 bis. Composants partagés et pages (B-4-2) ─────────────────────────────
 * [T4 B-4-2 2026-09-30 · Claude Opus 5.5] Les classes qui remplacent les styles en
 * ligne des pages publiques reprises par B-4-2 (publications, pétitions,
 * harcèlements, conditions de travail, notations) — mêmes valeurs qu'avant, donc
 * même rendu — et les composants partagés : mention IA (R20), frise chronologique.
 */

/* Bandeau illustré en tête de page (était style="margin-top:0px"). */
.rif-bandeau {
    margin-top: 0;
}

/* Élément d'une liste de services / publications / pétitions (étaient des
 * style="font-size:17px|16px|15px" répétés sur chaque ligne). */
.rif-element__libelle {
    font-size: 17px;
}

.rif-element__date {
    font-size: 16px;
}

.rif-element__etat {
    font-size: 15px;
}

/* Titres renumérotés par B-4-2 (un seul <h1> par page, aucun saut de niveau) : ils
 * gardent la taille de leur ancien niveau par la classe .hN de Bootstrap, mais
 * style4.min.css dimensionne les ÉLÉMENTS (h1 1,6rem ; sous 768 px h1 1,3rem, h2 et
 * h3 1,2rem, h4 1rem, h5 et h6 0,8rem). « rif-titre » aligne ces seuls titres sur
 * style4 : même rendu qu'avant, sans toucher les autres gabarits qui emploient .hN. */
.rif-titre.h1 {
    font-size: 1.6rem;
}

@media (max-width: 768px) {
    .rif-titre.h1 { font-size: 1.3rem; }
    .rif-titre.h2 { font-size: 1.2rem; }
    .rif-titre.h3 { font-size: 1.2rem; }
    .rif-titre.h4 { font-size: 1rem; }
    .rif-titre.h5 { font-size: .8rem; }
    .rif-titre.h6 { font-size: .8rem; }
}

/* Texte des éléments de liste (services, publications, pétitions, signalements) :
 * perso.min.css leur donne #007bff, 3,97:1 sur blanc — sous le seuil AA de 4,5:1
 * (mesuré par axe-core le 30/09). #0a58ca, le bleu de lien appuyé de Bootstrap 5,
 * donne 6,44:1. Sélecteur plus spécifique que celui de perso.min.css, liée après. */
.list-group > .list-group-item {
    color: #0a58ca;
}

/* Aide du formulaire de témoignage, écrite par le script du site selon le type choisi. */
.rif-aide-de-formulaire {
    font-size: 13px;
    font-style: italic;
}

/* Messages de session, habillage réduit du site public (étaient deux styles en ligne). */
.alert-petit {
    font-size: 14px;
}

.alert-petit__fermer {
    padding: .5rem 1.25rem;
}

/* R20 — la mention « Assistant RIF » (_composants/_disclaimer_ia).
 * NON MASQUABLE : aucune règle ne la cache ni ne la réduit, et aucune
 * ne doit le faire (DisclaimerIaComposantTest). Texte #523e02 sur #fff3cd : 9,25:1. */
.disclaimer-ia {
    display: block;
    margin: 0 0 1rem;
    padding: .5rem .75rem;
    border-left: 4px solid #997404;
    border-radius: .5rem;
    background-color: #fff3cd;
    color: #523e02;
    font-weight: 700;
}

/* B-R-45 — l'icône « stars » (SVG en ligne, aria-hidden, couleur héritée) précède « Assistant RIF ». */
.disclaimer-ia svg {
    width: 1.1em;
    height: 1.1em;
    margin-right: .35rem;
    vertical-align: -.2em;
}

/* ABC-4-232 — barre d'actions de la sortie IA : la mention et le bouton « Écouter » (ajouté juste après
 * par /scripts-publics/ecouter-ia.js) sont sur la même ligne, centrés verticalement, séparés par le
 * même écart (--ia-ecart) horizontalement et verticalement ; à 375 px le bouton passe à la ligne
 * sans chevauchement. Un seul réglage, pas de marge au cas par cas. */
.disclaimer-ia,
.disclaimer-ia + .ecouter-ia {
    --ia-ecart: .75rem;
    display: inline-block;
    vertical-align: middle;
    margin: 0 var(--ia-ecart) var(--ia-ecart) 0;
}

/* [B-R-130] Sur la page de détail d'une actualité, la mention vient après le texte, en petits caractères et très discrète :
 * règle à part, portée par la page (la règle de base ci-dessus reste intacte et la mention reste lisible : #6c757d sur blanc 4,69:1). */
.actualite-page .disclaimer-ia {
    font-size: .75rem;
    font-weight: 400;
    color: #6c757d;
    background: transparent;
    border: 0;
    border-left: 2px solid #dee2e6;
    padding: .125rem .5rem;
    margin: .5rem 0;
}

.disclaimer-ia + .ecouter-ia {
    line-height: 1.5;
    padding-block: .5rem;
}

/* Frise chronologique (_composants/_frise_chronologique), rendue sans JavaScript.
 * L'état de chaque étape est écrit en toutes lettres ; la couleur ne fait que le
 * redoubler (WCAG 1.4.1). Contrastes sur blanc : #146c43 6,45:1, #0a58ca 6,44:1, #495057 8,18:1. */
.frise-chronologique {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0 0 0 1.25rem;
    border-left: 3px solid #adb5bd;
}

.frise-chronologique__etape {
    position: relative;
    padding: 0 0 1rem .75rem;
}

.frise-chronologique__etape::before {
    content: "";
    position: absolute;
    top: .35rem;
    left: -1.75rem;
    width: .9rem;
    height: .9rem;
    border: 2px solid #495057;
    border-radius: 50%;
    background-color: #fff;
}

.frise-chronologique__etape--passee::before {
    border-color: #146c43;
    background-color: #146c43;
}

.frise-chronologique__etape--courante::before {
    border-color: #0a58ca;
    background-color: #0a58ca;
}

.frise-chronologique__etat {
    display: block;
    font-size: .8125rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #495057;
}

.frise-chronologique__etape--passee .frise-chronologique__etat {
    color: #146c43;
}

.frise-chronologique__etape--courante .frise-chronologique__etat {
    color: #0a58ca;
}

.frise-chronologique__libelle {
    display: block;
    font-weight: 700;
}

.frise-chronologique__date {
    display: block;
    color: #495057;
}

.frise-chronologique__detail {
    margin: .25rem 0 0;
}

/* [hors-planning 2026-09-30 · Claude Opus 5.5] Texte justifié des pages de
   présentation (accueil, associations, mentions). Bootstrap 5 a retiré
   « text-justify » sans équivalent : cette classe propre garde le rendu, sans
   dépendre du pont ci-dessous. */
.texte-justifie {
    text-align: justify;
}

/* [hors-planning 2026-09-30 · Claude Opus 5.5] Barre de recherche et de filtres
   des listes (_composants/liste/_recherche.html.twig) : une ligne compacte. Une
   liste déroulante prend la largeur de sa plus longue option (« Procédure
   administrative et motivation des actes ») et poussait la barre sur deux
   lignes : elle est plafonnée, l'option choisie reste lisible en entier dans la
   liste ouverte ; dates et saisies courtes de même. La recherche garde une
   largeur utile quand elle partage la ligne. Mesuré au navigateur à 1280 px
   (zone de contenu de 1012 px, menu latéral compris) : une seule ligne. */
.barre-filtres .form-select {
    max-width: 10rem;
}

.barre-filtres input[type="date"] {
    max-width: 8.5rem;
}

.barre-filtres input[type="text"] {
    max-width: 7rem;
}

.barre-filtres__recherche {
    min-width: 8rem;
}

/* [ABC-4-157 13/10] Filtre des listes de données = mêmes principes que le filtre d'EUSEP (principes communs : docs/FILTRE-DES-LISTES.md d’EUSEP) :
   barre HORIZONTALE pleine largeur, libellé VISIBLE au-dessus de chaque champ, champs qui se partagent la ligne, boutons au bout ;
   empilés sous 576 px. Remplace les plafonds de largeur ci-dessus pour les cellules .filter-field. */
form.barre-filtres.filter-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; padding: 16px 20px 18px; margin-inline: 0; border: 1px solid #b7c4d9; border-radius: 7px; background: #f6f8fc; }
.barre-filtres.filter-bar > * { width: auto; max-width: none; padding-inline: 0; margin-top: 0; }
.barre-filtres .filter-field { flex: 1 1 200px; min-width: 0; }
.barre-filtres .filter-field > .form-control,
.barre-filtres .filter-field > .form-select { width: 100%; max-width: none; min-height: 40px; font-size: 1rem; }
.barre-filtres .filter-field label { display: block; margin: 0 0 6px; font-size: .95rem; font-weight: 600; color: #1f2d4d; }
.barre-filtres .filter-action { flex: 0 0 auto; display: flex; gap: 8px; }
.barre-filtres .filter-action .btn { min-height: 40px; font-size: 1rem; }
@media (max-width: 575.98px) {
    form.barre-filtres.filter-bar { flex-direction: column; align-items: stretch; padding: 14px; }
    .barre-filtres .filter-field, .barre-filtres .filter-action { flex: none; width: 100%; }
    .barre-filtres .filter-action .btn { flex: 1 1 0; }
}

/* Cartes de catégorie sous la barre (_composants/liste/_cartes_categorie.html.twig). */
.cartes-categorie { margin: 0 0 22px; }
.cartes-categorie__liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.cartes-categorie form { margin: 0; height: 100%; }
.carte-categorie { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 56px; padding: 12px 16px; border: 1px solid #b7c4d9; border-radius: 7px; background: #fff; color: #0056b3; font-size: 1rem; font-weight: 600; text-align: center; text-decoration: none; cursor: pointer; }
.carte-categorie:hover { background: #eef3fb; color: #0056b3; }
.carte-categorie:focus-visible { outline: 3px solid #0056b3; outline-offset: 2px; }
.carte-categorie--active, .carte-categorie--active:hover { background: #0056b3; border-color: #0056b3; color: #fff; }
/* Le gabarit public (refonte/rif-pages.css, « .source-content select / .btn / ul ») écrase ces règles : on les reprend à sa
   spécificité. Chevron visible sur chaque liste déroulante, « Réinitialiser » en bouton secondaire, cartes alignées sur la barre,
   carte en bouton (liste nominative) au même aspect que la carte en lien. */
.source-content .barre-filtres .filter-field select { appearance: none; background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%231f2d4d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat right 12px center / 16px 12px; padding-right: 40px; text-overflow: ellipsis; }
.source-content .barre-filtres .filter-action .btn-outline-secondary { background: #fff; color: #245b80; border: 1px solid #245b80; }
.source-content .barre-filtres .filter-action .btn-outline-secondary:hover { background: #eef3fb; color: #1f2d4d; }
.source-content ul.cartes-categorie__liste:not(.list-group) { padding-left: 0; }
.source-content .barre-filtres .filter-action .btn { justify-content: center; }
.source-content .cartes-categorie .carte-categorie { background: #fff; color: #0056b3; border: 1px solid #b7c4d9; border-radius: 7px; padding: 12px 16px; min-height: 56px; display: flex; justify-content: center; }
.source-content .cartes-categorie .carte-categorie:hover { background: #eef3fb; color: #0056b3; }
.source-content .cartes-categorie .carte-categorie--active, .source-content .cartes-categorie .carte-categorie--active:hover { background: #0056b3; border-color: #0056b3; color: #fff; }

/* ── 2. Pont Bootstrap 4.2.1 (classes retirées de Bootstrap 5) ────────────── */

.form-control-range{display:block;width:100%}
.form-group{margin-bottom:1rem}
.form-row{display:flex;flex-wrap:wrap;margin-right:-5px;margin-left:-5px}.form-row>.col,.form-row>[class*=col-]{padding-right:5px;padding-left:5px}
.custom-control-input.is-valid~.custom-control-label,.was-validated .custom-control-input:valid~.custom-control-label{color:#28a745}
.custom-control-input.is-valid~.custom-control-label::before,.was-validated .custom-control-input:valid~.custom-control-label::before{border-color:#28a745}
.custom-control-input.is-valid~.valid-feedback,.custom-control-input.is-valid~.valid-tooltip,.was-validated .custom-control-input:valid~.valid-feedback,.was-validated .custom-control-input:valid~.valid-tooltip{display:block}
.custom-control-input.is-valid:checked~.custom-control-label::before,.was-validated .custom-control-input:valid:checked~.custom-control-label::before{border-color:#34ce57;background-color:#34ce57}
.custom-control-input.is-valid:focus~.custom-control-label::before,.was-validated .custom-control-input:valid:focus~.custom-control-label::before{box-shadow:0 0 0 .2rem rgba(40,167,69,.25)}
.custom-control-input.is-valid:focus:not(:checked)~.custom-control-label::before,.was-validated .custom-control-input:valid:focus:not(:checked)~.custom-control-label::before{border-color:#28a745}
.custom-file-input.is-valid~.custom-file-label,.was-validated .custom-file-input:valid~.custom-file-label{border-color:#28a745}
.custom-file-input.is-valid~.valid-feedback,.custom-file-input.is-valid~.valid-tooltip,.was-validated .custom-file-input:valid~.valid-feedback,.was-validated .custom-file-input:valid~.valid-tooltip{display:block}
.custom-file-input.is-valid:focus~.custom-file-label,.was-validated .custom-file-input:valid:focus~.custom-file-label{border-color:#28a745;box-shadow:0 0 0 .2rem rgba(40,167,69,.25)}
.custom-control-input.is-invalid~.custom-control-label,.was-validated .custom-control-input:invalid~.custom-control-label{color:#dc3545}
.custom-control-input.is-invalid~.custom-control-label::before,.was-validated .custom-control-input:invalid~.custom-control-label::before{border-color:#dc3545}
.custom-control-input.is-invalid~.invalid-feedback,.custom-control-input.is-invalid~.invalid-tooltip,.was-validated .custom-control-input:invalid~.invalid-feedback,.was-validated .custom-control-input:invalid~.invalid-tooltip{display:block}
.custom-control-input.is-invalid:checked~.custom-control-label::before,.was-validated .custom-control-input:invalid:checked~.custom-control-label::before{border-color:#e4606d;background-color:#e4606d}
.custom-control-input.is-invalid:focus~.custom-control-label::before,.was-validated .custom-control-input:invalid:focus~.custom-control-label::before{box-shadow:0 0 0 .2rem rgba(220,53,69,.25)}
.custom-control-input.is-invalid:focus:not(:checked)~.custom-control-label::before,.was-validated .custom-control-input:invalid:focus:not(:checked)~.custom-control-label::before{border-color:#dc3545}
.custom-file-input.is-invalid~.custom-file-label,.was-validated .custom-file-input:invalid~.custom-file-label{border-color:#dc3545}
.custom-file-input.is-invalid~.invalid-feedback,.custom-file-input.is-invalid~.invalid-tooltip,.was-validated .custom-file-input:invalid~.invalid-feedback,.was-validated .custom-file-input:invalid~.invalid-tooltip{display:block}
.custom-file-input.is-invalid:focus~.custom-file-label,.was-validated .custom-file-input:invalid:focus~.custom-file-label{border-color:#dc3545;box-shadow:0 0 0 .2rem rgba(220,53,69,.25)}
.form-inline{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-align:center;align-items:center}
.form-inline .form-check{width:100%}
@media (min-width:576px){.form-inline label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin-bottom:0}.form-inline .form-group{display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-align:center;align-items:center;margin-bottom:0}.form-inline .form-control{display:inline-block;width:auto;vertical-align:middle}.form-inline .form-control-plaintext{display:inline-block}.form-inline .custom-select,.form-inline .input-group{width:auto}.form-inline .form-check{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-left:0}.form-inline .form-check-input{position:relative;margin-top:0;margin-right:.25rem;margin-left:0}.form-inline .custom-control{-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.form-inline .custom-control-label{margin-bottom:0}}
.btn-block{display:block;width:100%}
.btn-block+.btn-block{margin-top:.5rem}
input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-block{width:100%}
.input-group>.custom-file{position:relative;-ms-flex:1 1 auto;flex:1 1 auto;width:1%;margin-bottom:0}
.input-group>.custom-file+.custom-file,.input-group>.custom-file+.custom-select,.input-group>.custom-file+.form-control,.input-group>.custom-select+.custom-file,.input-group>.form-control+.custom-file,.input-group>.form-control-plaintext+.custom-file{margin-left:-1px}
.input-group>.custom-file .custom-file-input:focus~.custom-file-label{z-index:3}
.input-group>.custom-file .custom-file-input:focus{z-index:4}
.input-group>.custom-file{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}
.input-group>.custom-file:not(:last-child) .custom-file-label,.input-group>.custom-file:not(:last-child) .custom-file-label::after{border-top-right-radius:0;border-bottom-right-radius:0}
.input-group>.custom-file:not(:first-child) .custom-file-label{border-top-left-radius:0;border-bottom-left-radius:0}
.input-group-append,.input-group-prepend{display:-ms-flexbox;display:flex}
.input-group-append .btn,.input-group-prepend .btn{position:relative;z-index:2}
.input-group-append .btn:focus,.input-group-prepend .btn:focus{z-index:3}
.input-group-append .btn+.btn,.input-group-append .btn+.input-group-text,.input-group-append .input-group-text+.btn,.input-group-append .input-group-text+.input-group-text,.input-group-prepend .btn+.btn,.input-group-prepend .btn+.input-group-text,.input-group-prepend .input-group-text+.btn,.input-group-prepend .input-group-text+.input-group-text{margin-left:-1px}
.input-group-prepend{margin-right:-1px}
.input-group-append{margin-left:-1px}
.input-group-lg>.input-group-append>.btn,.input-group-lg>.input-group-append>.input-group-text,.input-group-lg>.input-group-prepend>.btn,.input-group-lg>.input-group-prepend>.input-group-text{padding:.5rem 1rem;font-size:1.25rem;line-height:1.5;border-radius:.3rem}
.input-group-sm>.input-group-append>.btn,.input-group-sm>.input-group-append>.input-group-text,.input-group-sm>.input-group-prepend>.btn,.input-group-sm>.input-group-prepend>.input-group-text{padding:.25rem .5rem;font-size:.875rem;line-height:1.5;border-radius:.2rem}
.input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle),.input-group>.input-group-append:last-child>.input-group-text:not(:last-child),.input-group>.input-group-append:not(:last-child)>.btn,.input-group>.input-group-append:not(:last-child)>.input-group-text,.input-group>.input-group-prepend>.btn,.input-group>.input-group-prepend>.input-group-text{border-top-right-radius:0;border-bottom-right-radius:0}
.input-group>.input-group-append>.btn,.input-group>.input-group-append>.input-group-text,.input-group>.input-group-prepend:first-child>.btn:not(:first-child),.input-group>.input-group-prepend:first-child>.input-group-text:not(:first-child),.input-group>.input-group-prepend:not(:first-child)>.btn,.input-group>.input-group-prepend:not(:first-child)>.input-group-text{border-top-left-radius:0;border-bottom-left-radius:0}
.custom-control{position:relative;display:block;min-height:1.5rem;padding-left:1.5rem}
.custom-control-inline{display:-ms-inline-flexbox;display:inline-flex;margin-right:1rem}
.custom-control-input{position:absolute;z-index:-1;opacity:0}
.custom-control-input:checked~.custom-control-label::before{color:#fff;border-color:#007bff;background-color:#007bff}
.custom-control-input:focus~.custom-control-label::before{box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}
.custom-control-input:focus:not(:checked)~.custom-control-label::before{border-color:#80bdff}
.custom-control-input:not(:disabled):active~.custom-control-label::before{color:#fff;background-color:#b3d7ff;border-color:#b3d7ff}
.custom-control-input:disabled~.custom-control-label{color:#6c757d}
.custom-control-input:disabled~.custom-control-label::before{background-color:#e9ecef}
.custom-control-label{position:relative;margin-bottom:0;vertical-align:top}
.custom-control-label::before{position:absolute;top:.25rem;left:-1.5rem;display:block;width:1rem;height:1rem;pointer-events:none;content:"";background-color:#fff;border:#adb5bd solid 1px}
.custom-control-label::after{position:absolute;top:.25rem;left:-1.5rem;display:block;width:1rem;height:1rem;content:"";background-repeat:no-repeat;background-position:center center;background-size:50% 50%}
.custom-checkbox .custom-control-label::before{border-radius:.25rem}
.custom-checkbox .custom-control-input:checked~.custom-control-label::after{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e")}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before{border-color:#007bff;background-color:#007bff}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::after{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e")}
.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before{background-color:rgba(0,123,255,.5)}
.custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label::before{background-color:rgba(0,123,255,.5)}
.custom-radio .custom-control-label::before{border-radius:50%}
.custom-radio .custom-control-input:checked~.custom-control-label::after{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")}
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before{background-color:rgba(0,123,255,.5)}
.custom-switch{padding-left:2.25rem}
.custom-switch .custom-control-label::before{left:-2.25rem;width:1.75rem;pointer-events:all;border-radius:.5rem}
.custom-switch .custom-control-label::after{top:calc(.25rem + 2px);left:calc(-2.25rem + 2px);width:calc(1rem - 4px);height:calc(1rem - 4px);background-color:#adb5bd;border-radius:.5rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out;transition:transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out}
@media screen and (prefers-reduced-motion:reduce){.custom-switch .custom-control-label::after{transition:none}}
.custom-switch .custom-control-input:checked~.custom-control-label::after{background-color:#fff;-webkit-transform:translateX(.75rem);transform:translateX(.75rem)}
.custom-switch .custom-control-input:disabled:checked~.custom-control-label::before{background-color:rgba(0,123,255,.5)}
.custom-file{position:relative;display:inline-block;width:100%;height:calc(2.25rem + 2px);margin-bottom:0}
.custom-file-input{position:relative;z-index:2;width:100%;height:calc(2.25rem + 2px);margin:0;opacity:0}
.custom-file-input:focus~.custom-file-label{border-color:#80bdff;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}
.custom-file-input:disabled~.custom-file-label{background-color:#e9ecef}
.custom-file-input:lang(en)~.custom-file-label::after{content:"Browse"}
.custom-file-input~.custom-file-label[data-browse]::after{content:attr(data-browse)}
.custom-file-label{position:absolute;top:0;right:0;left:0;z-index:1;height:calc(2.25rem + 2px);padding:.375rem .75rem;font-weight:400;line-height:1.5;color:#495057;background-color:#fff;border:1px solid #ced4da;border-radius:.25rem}
.custom-file-label::after{position:absolute;top:0;right:0;bottom:0;z-index:3;display:block;height:2.25rem;padding:.375rem .75rem;line-height:1.5;color:#495057;content:"Browse";background-color:#e9ecef;border-left:inherit;border-radius:0 .25rem .25rem 0}
.custom-control-label::before,.custom-file-label{transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}
@media screen and (prefers-reduced-motion:reduce){.custom-control-label::before,.custom-file-label{transition:none}}
.card-columns .card{margin-bottom:.75rem}
@media (min-width:576px){.card-columns{-webkit-column-count:3;-moz-column-count:3;column-count:3;-webkit-column-gap:1.25rem;-moz-column-gap:1.25rem;column-gap:1.25rem;orphans:1;widows:1}.card-columns .card{display:inline-block;width:100%}}
.badge-pill{padding-right:.6em;padding-left:.6em;border-radius:10rem}
.badge-primary{color:#fff;background-color:#007bff}
a.badge-primary:focus,a.badge-primary:hover{color:#fff;background-color:#0062cc}
.badge-danger{color:#fff;background-color:#dc3545}
a.badge-danger:focus,a.badge-danger:hover{color:#fff;background-color:#bd2130}
.alert-dismissible .close{position:absolute;top:0;right:0;padding:.75rem 1.25rem;color:inherit}
.close{float:right;font-size:1.5rem;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.5}
.close:hover{color:#000;text-decoration:none}
.close:not(:disabled):not(.disabled){cursor:pointer}
.close:not(:disabled):not(.disabled):focus,.close:not(:disabled):not(.disabled):hover{opacity:.75}
button.close{padding:0;background-color:transparent;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}
a.close.disabled{pointer-events:none}
.modal-header .close{padding:1rem 1rem;margin:-1rem -1rem -1rem auto}
.float-left{float:left!important}
.float-right{float:right!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mr-1{margin-right:.25rem!important}
.mr-auto{margin-right:auto!important}
.ml-1{margin-left:.25rem!important}
.mr-2{margin-right:.5rem!important}
.ml-2{margin-left:.5rem!important}
.ml-3{margin-left:1rem!important}
.mr-4{margin-right:1.5rem!important}
.text-justify{text-align:justify!important}
.text-left{text-align:left!important}
.font-weight-bold{font-weight:700!important}
.font-italic{font-style:italic!important}

/* [T5 ABC-5-33 2026-10-06] Accessibilité. Garde : PageAccessibiliteTest, ContrasteEleveCookieTest. */

/* Navigation au clavier : le focus est toujours entouré d'un contour visible. */
:focus-visible {
    outline: 3px solid #0b57d0;
    outline-offset: 2px;
}

/* Contraste élevé : noir, blanc, jaune ; liens soulignés. Demandé par le cookie `contraste_eleve` (classe posée sur
   <html> par le serveur) OU par le réglage « contraste renforcé » du système. */
.contraste-eleve,
.contraste-eleve * {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #fff !important;
    text-shadow: none !important;
}

.contraste-eleve a,
.contraste-eleve a:visited,
.contraste-eleve a *,
.contraste-eleve .nav-link,
.contraste-eleve .navbar a {
    color: #ff0 !important;
    text-decoration: underline !important;
}

.contraste-eleve .btn-primary,
.contraste-eleve .btn-secondary,
.contraste-eleve .btn-primary * {
    background-color: #ff0 !important;
    color: #000 !important;
    border-color: #fff !important;
}

.contraste-eleve :focus-visible {
    outline: 3px solid #fff;
    box-shadow: 0 0 0 6px #000;
}

@media (prefers-contrast: more) {
    body {
        background-color: #fff;
        color: #000;
    }

    a {
        color: #0000ee;
        text-decoration: underline;
    }
}

/* [T5 ABC-5-33 2026-10-06] FC.5 — ce que la mesure axe-core a trouvé (docs/ui/rapport-axe-t5.md). Garde : FeuilleAccessibiliteTest.
   (1) Le bleu de la marque #0292C7 (style4.css) ne donne que 3,53:1 sur blanc : bouton « Connexion », rubrique active de
   la barre latérale. #0277a8 donne 4,99:1. Sélecteurs plus précis que ceux de style4.css, chargé après cette feuille. */
.CTAs a.download {
    color: #0277a8;
}

#sidebar ul li.active > a[href] {
    background: #0277a8;
}

#sidebar a[aria-expanded="true"] {
    background: #0277a8;
}

#sidebar ul li a[href]:hover {
    color: #0277a8;
}

/* (2) Contraste élevé : la règle du pied de page (.pied-de-page .text-primary, !important) l'emportait sur
   « .contraste-eleve a » : les liens restaient en #0a58ca sur noir (3,26:1). */
.contraste-eleve .pied-de-page .text-primary {
    color: #ff0 !important;
    text-decoration: underline !important;
}

.contraste-eleve .pied-de-page a {
    color: #ff0 !important;
    text-decoration: underline !important;
}
/* Message 19, point 6 : une heure ne se coupe jamais en deux lignes. */
.heure { white-space: nowrap; }
/* [ABC-4-206] Statuts et règlement intérieur : texte officiel repris ligne à ligne. */
.texte-officiel { white-space: pre-line; overflow-wrap: anywhere; }

/* [ABC-4-144] L'astérisque d'un champ obligatoire est rouge (G24) ; #b02a37 : contraste AA sur fond blanc. */
.champ-obligatoire { color: #b02a37; font-weight: 700; }

/* [B-4-270 2026-10-18] Champ de mot de passe + bouton afficher / masquer (_composants/_bouton_mot_de_passe.html.twig) : le bouton
   se place à droite du champ, sur la même ligne, à 1280 comme à 375 px (le champ rétrécit). */
.mdp-groupe {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0.5rem;
}

.mdp-groupe > input {
    flex: 1 1 auto;
    min-width: 0;
}

.mdp-groupe > .mdp-bascule {
    flex: 0 0 auto;
    min-height: 2.75rem;
}

.mdp-groupe > .mdp-bascule[hidden] {
    display: none;
}

/* B-R-45 — la ligne « Modèle : … · le … » juste sous la pastille de la mention IA : même bloc, texte plus petit, lisible
 * (#523e02 sur blanc : 11,5:1), jamais masquée. Le bouton « Écouter » s'insère entre la pastille et cette ligne. */
.disclaimer-ia-detail {
    display: block;
    margin: -.25rem 0 1rem;
    color: #523e02;
    font-size: .875rem;
}

/* [B-R-118] « Les derniers arrivés » : cartes des dix textes les plus récents, une colonne sous 576 px. */
.derniers-arrives__cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 0.75rem; padding: 0; margin: 0 0 1.5rem; }
.derniers-arrives__carte { height: 100%; }
.derniers-arrives__carte .card-title { overflow-wrap: anywhere; }

/* [B-R-134] Inscription en deux onglets : onglets alignés sur une ligne (ou empilés en 375 px), onglet verrouillé grisé. */
.onglets-inscription [role="tablist"] { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 1px solid #dee2e6; margin-bottom: 1rem; }
.onglets-inscription [role="tab"] { flex: 1 1 14rem; background: #f8f9fa; border: 1px solid #dee2e6; border-bottom: 0; border-radius: .375rem .375rem 0 0; padding: .6rem 1rem; font-weight: 600; text-align: center; color: #212529; }
.onglets-inscription [role="tab"][aria-selected="true"] { background: #fff; border-bottom: 3px solid #0d6efd; }
.onglets-inscription [role="tab"][aria-disabled="true"] { color: #6c757d; cursor: not-allowed; }
.onglets-inscription [role="tab"]:focus-visible, .onglets-inscription [role="tabpanel"]:focus-visible { outline: 3px solid #0d6efd; outline-offset: 2px; }
.onglets-inscription [role="tabpanel"] { overflow-wrap: anywhere; }
.onglets-inscription [role="tabpanel"][hidden] { display: none; }
.onglets-inscription .onglet-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }

/* [B-R-193] Groupes de nombreuses cases à cocher en accordéon (<details>) : en-tête cliquable large (≥ 44 px), flèche qui tourne à l'ouverture, nombre de cases cochées. */
.accordeon-cases { border: 1px solid #dee2e6; border-radius: .375rem; background: #fff; }
.accordeon-cases__entete { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 2.75rem; padding: .5rem .875rem; cursor: pointer; font-weight: 600; list-style: none; }
.accordeon-cases__entete::-webkit-details-marker { display: none; }
.accordeon-cases__entete::after { content: ""; flex: none; width: .55rem; height: .55rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s; margin-left: auto; }
.accordeon-cases[open] > .accordeon-cases__entete::after { transform: rotate(-135deg); }
.accordeon-cases[open] > .accordeon-cases__entete { border-bottom: 1px solid #dee2e6; }
.accordeon-cases__entete:focus-visible { outline: 3px solid #0d6efd; outline-offset: 2px; }
.accordeon-cases__titre { flex: 1 1 auto; overflow-wrap: anywhere; }
.accordeon-cases__compte[data-compte-cochees="0"] { display: none; }
.accordeon-cases__corps { padding: .75rem .875rem; }