/*
 * Le socle du front : la racine des écrans et ce que tous partagent.
 *
 * Le contrat avec le thème (ci-dessous), les couleurs d'état propres à
 * l'extension, la racine des écrans, la frise des étapes du tunnel et les
 * champs de base de ses formulaires.
 *
 * Écrans : tous ceux de l'extension.
 *
 * Sa place dans la cascade est fixée par cnpr_insc_feuilles_front()
 * (includes/front-tunnel-core.php) : toutes les feuilles du front se
 * chargent partout où l'extension s'affiche, dans cet ordre, avant le thème.
 */

/*
 * Les écrans de l'inscription côté adhérent : leur style par défaut.
 *
 * Le tunnel ([cnpr_inscriptions]), l'espace adhérent ([cnpr_mes_adherents]),
 * le règlement groupé ([cnpr_reglement_groupe]), « Comment se passe une
 * inscription » ([cnpr_parcours_inscription]), la grille des cotisations
 * ([cnpr_cotisations]) et le planning public ([cnpr_creneaux_publics]).
 *
 * LE CONTRAT AVEC LE THÈME (docs/theme-et-extensions.md) :
 * - ce fichier ne lit QUE les jetons --cnpr-*, toujours avec une valeur de
 *   repli : sans thème qui les définit, les écrans restent propres, aux
 *   couleurs du logo ;
 * - il se charge AVANT les feuilles du thème (front-tunnel-core.php,
 *   priorité 5) : une retouche du thème l'emporte à sélecteur égal. Là où le
 *   thème gagnait désormais un réglage qui doit rester celui de l'extension,
 *   le sélecteur est renforcé au plus juste, et un commentaire le dit ;
 * - les seuils de largeur du tunnel restent des @media, pas des @container,
 *   et c'est voulu : ces écrans sont des GABARITS entiers (tout le contenu
 *   de la page), où `container-type` sur la racine en ferait un nouveau
 *   contexte de mise en forme — ses marges ne se fondraient plus avec celles
 *   de la carte qui l'entoure, et tout l'écran descendrait. Le cadre du
 *   tunnel (« Tunnel shell ») vise d'ailleurs la carte du thème, AUTOUR de la
 *   racine : aucune requête @container ne peut l'atteindre.
 *
 * LES COULEURS D'ÉTAT. Le contrat n'en a pas : succès, alerte, erreur et
 * information disent quelque chose de l'inscription, pas du style du site.
 * Elles sont posées ici, une fois, et tout le fichier les lit. Un thème qui
 * veut les changer redéfinit ces variables — elles ne sont pas pour autant
 * des jetons du contrat : aucune autre extension ne les lit.
 *
 * Sur :root plutôt que sur les racines des écrans : le message qui annonce le
 * nombre de cours dépassé (.cnpr-insc-toast) est ajouté par le script à la fin
 * de <body>, hors de toute racine, et les pastilles d'état se retrouvent sur
 * des écrans du bureau. Le préfixe --cnpr-insc- suffit à les tenir à part.
 *
 * Restent en dur, faute de rôle au contrat : le blanc d'un texte posé sur un
 * aplat foncé, et l'encre translucide (rgba(16, 32, 53, …)) des ombres et du
 * bord des contrôles.
 */
:root {
    /* Succès : payé, reçu, place gardée par le bureau. */
    --cnpr-insc-succes: #14532d;
    --cnpr-insc-succes-fond: #d6efdc;
    /* Alerte : une réponse manque, une action est attendue. Rien n'est cassé. */
    --cnpr-insc-alerte: #7a4a13;
    --cnpr-insc-alerte-vif: #c98a16;
    --cnpr-insc-alerte-fond: #fde6cf;
    --cnpr-insc-alerte-filet: #f0cfa5;
    /* Erreur : refusé, à retirer, au-delà de ce qui est permis. */
    --cnpr-insc-erreur: #7a1313;
    --cnpr-insc-erreur-vif: #c0392b;
    --cnpr-insc-erreur-fond: #f6d9d9;
    /* Information : un état du dossier, ni bon ni mauvais (validé, gelé). */
    --cnpr-insc-info: #1e40af;
    --cnpr-insc-info-fond: #dbeafe;
}

.cnpr-insc { max-width: none; width: 100%; }
.cnpr-insc .card-title { margin-top: 0; }

.cnpr-insc-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    counter-reset: step;
}
.cnpr-insc-steps li {
    counter-increment: step;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--cnpr-fond-doux, #eaf7fd);
    color: var(--cnpr-couleur-texte-doux, #4c5f80);
    font-size: 14px;
}
.cnpr-insc-steps li::before { content: counter(step) ". "; font-weight: 600; }
/* (0,3,0) : le thème pose `.page-standard .page-content li { color }` en
   (0,2,1), et cette feuille se charge AVANT lui — à égalité, il gagnerait. */
.cnpr-insc .cnpr-insc-steps .is-current { background: var(--cnpr-couleur-titre, #1e3f94); color: #fff; }
.cnpr-insc .cnpr-insc-steps .is-done { background: var(--cnpr-couleur-accent-clair, #5bc5f2); color: var(--cnpr-couleur-titre, #1e3f94); }

.cnpr-insc-form { margin: 0 0 8px; }
.cnpr-insc-form label { display: inline-block; margin: 4px 12px 4px 0; }
.cnpr-insc-form input[type="text"],
.cnpr-insc-form input[type="email"],
.cnpr-insc-form input[type="date"],
.cnpr-insc-form input[type="file"] {
    padding: 8px 10px;
    border: 1px solid var(--cnpr-filet, #d3eefb);
    border-radius: 8px;
}