/*
 * Les coordonnées de la famille, et le gel d'une saison close.
 *
 * Les boutons « copier l'adresse / le téléphone », le bloc du gestionnaire
 * du compte et sa carte compacte, l'adresse et le droit à l'image comme
 * seconds gestes, la vignette de la photo, l'état civil figé, puis
 * l'enveloppe du gel de saison close (includes/saison-verrou.php), qui
 * éteint ces mêmes formulaires.
 *
 * Écrans : l'espace adhérent ([cnpr_mes_adherents]) et les étapes du
 * tunnel d'une saison verrouillée.
 *
 * 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.
 */

/* "Copier le téléphone du gestionnaire" / "Copier l'adresse de …" mini-buttons,
   each under their own field. Same look, on purpose. */
/* Two convenience buttons — « copier l'adresse de X », « copier le téléphone du
   gestionnaire ». They are shortcuts, not decisions, and must not outweigh the
   « Enregistrer » that ends the form.
   Three classes on purpose: the theme styles every button inside a form as a
   full-width blue pill with white bold text and a heavy shadow, and it beat the
   single-class rule that used to live here. The old rule still won its ONE
   declaration — the hover background — which painted a near-white ground under
   white text: the label vanished on hover. Hence an explicit `color` on hover
   too; whatever the theme sets, it stays readable. */
.cnpr-insc .cnpr-insc-form .cnpr-insc-copyphone,
.cnpr-insc .cnpr-insc-form .cnpr-insc-copyaddress {
    display: inline-flex;
    align-items: center;
    /* Their parent (.field / .cnpr-insc-grid) is a flex/grid box, so the button
       is stretched to the full field width by the default `stretch` alignment —
       `width: auto` has nothing to say about that. Both properties are set
       because the parent's display is not ours to pin. */
    width: auto;
    align-self: flex-start;
    justify-self: start;
    margin-top: 6px;
    padding: 4px 10px;
    border: 1px solid var(--cnpr-filet, #d3eefb);
    border-radius: 6px;
    background: transparent;
    box-shadow: none;
    color: var(--cnpr-couleur-titre, #1e3f94);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}
/* The address button lives in its own grid row, so the 14px row gap piled up
   on its 6px margin: 20px above it, against 10px (4px field gap + 6px margin)
   for the phone button under its input. Pull the row up so both buttons keep
   the same 10px from what precedes them. Specificity (0,3,0) beats the
   `.cnpr-insc-grid .field { margin: 0 }` reset. */
.cnpr-insc-grid .field.cnpr-insc-copyaddress-row { margin-top: -10px; }
.cnpr-insc .cnpr-insc-form .cnpr-insc-copyphone:hover,
.cnpr-insc .cnpr-insc-form .cnpr-insc-copyaddress:hover {
    background: var(--cnpr-fond-doux, #eaf7fd);
    border-color: var(--cnpr-couleur-lien, #0a6fb2);
    color: var(--cnpr-couleur-titre, #1e3f94);
}
/* "Gestionnaire du compte" contact section on the dashboard. The rule sits
   BELOW the block: it now opens the page instead of closing it, so the
   separator has to fall between it and the actions that follow. A border-top
   here would draw a line under the page heading and leave the block glued to
   the payment call-to-action underneath. */
/* The account block and the adhérents list are two zones, not one flow: the
   rule between them is the same 2px accent used to separate the zones of the
   tunnel's last step, and it sits at EQUAL distance from both — padding-bottom
   above it, margin-bottom below it, same value. The title that follows zeroes
   its own margin-top so nothing is added on one side only. */
.cnpr-insc-gestionnaire {
    margin-bottom: 26px;
    padding-bottom: 26px;
    border-bottom: 2px solid var(--cnpr-couleur-accent-clair, #5bc5f2);
}
.cnpr-insc .cnpr-insc-adherents-title { margin: 0 0 16px; }
/* Inside « Modifier », the address is a SECOND gesture, slower than the rest of
   the form (it only takes effect once a link is clicked). A rule sets it apart
   so it does not read as a field the « Enregistrer » button above would save. */
/* Same rule, same reason, in the adhérent panel: the image right is a SECOND
   form under the identity one, with its own « Enregistrer ». Back to back and
   unseparated, the two read as one form with a stray button in the middle. */
.cnpr-insc-gestionnaire__email,
.cnpr-insc-item__photo {
    margin: 20px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--cnpr-filet, #d3eefb);
}
/* Vignette de la photo de carte : assez petite pour ne pas dominer le
   formulaire qui la remplace. */
.cnpr-insc-photo-thumb {
    display: block;
    width: 96px;
    height: auto;
    margin: 0 0 10px;
    border-radius: 8px;
}
/* Nothing above this section names the question any more — the panel says
   « Modifier mes infos » — so the fieldset's legend carries the title and has
   to read as one. */
.cnpr-insc-item__photo .cnpr-insc-photo > legend {
    float: left;
    width: 100%;
    margin: 0 0 10px;
    font-weight: 700;
}
/* Frozen état civil: shown, greyed, inert. The <fieldset> is a carrier for
   `disabled`, nothing else — strip the UA's default groove border and padding
   so it lays out exactly like the <form> it replaces. */
.cnpr-insc .cnpr-insc-frozen {
    border: 0;
    padding: 0;
    margin: 0;
}
.cnpr-insc-frozen__why { margin: 0 0 12px; }
.cnpr-insc .cnpr-insc-frozen input,
.cnpr-insc .cnpr-insc-frozen select,
.cnpr-insc .cnpr-insc-frozen textarea {
    background: var(--cnpr-fond-doux, #eaf7fd);
    color: var(--cnpr-couleur-texte-doux, #4c5f80);
    cursor: not-allowed;
    opacity: 1; /* iOS Safari fades disabled controls to unreadable on its own. */
}
/* « Copier l'adresse du gestionnaire » has nothing to fill in here. Doubled up
   on .cnpr-insc-form because the copy buttons are claimed by a (0,3,0) rule
   further up; a plain descendant `button` (0,2,1) loses to it and the button
   stays on screen, disabled and pointless. */
.cnpr-insc .cnpr-insc-form.cnpr-insc-frozen button { display: none; }
/* The city hint is written by cnpr-tunnel.js after the postal lookup and says
   « choisissez la vôtre » — an instruction nobody can follow on a locked
   <select>. The field hints stay: they explain the CONTENT, not an action. */
.cnpr-insc .cnpr-insc-form.cnpr-insc-frozen .cnpr-insc-cityhint { display: none; }

/* GEL DE SAISON CLOSE — l'enveloppe posée par cnpr_insc_verrou_front_gel_*()
   (includes/saison-verrou.php), jumelle front de `.cnpr-ad-gel`.

   POURQUOI PAS `.cnpr-insc-frozen` JUSTE AU-DESSUS, qui gèle déjà un état civil.
   Deux différences, et la seconde est rédhibitoire :

   1. La fiche figée remplace un <form> par un <fieldset> et lui reprend sa
      boîte (`border: 0; padding: 0; margin: 0`). Ici l'enveloppe s'ajoute
      AUTOUR d'une mise en page existante — un tunnel entier, une rangée de
      boutons en flex — donc elle ne doit avoir aucune boîte du tout :
      `display: contents` la retire du flux, ses enfants remontent à sa place,
      et le `disabled` continue de désactiver toute sa descendance (c'est une
      propriété du DOM, pas de la mise en page).

   2. `.cnpr-insc-form.cnpr-insc-frozen button { display: none }` CACHE le
      bouton. Là-bas c'est juste : il n'aurait rien à enregistrer. Ici il porte
      l'explication — le `title` du fieldset s'affiche au survol de ce qu'il
      contient — et le cacher ferait disparaître la raison avec le geste. La
      doctrine du dépôt est « verrouillé ≠ caché ».

   ON NE GRISE PAS LA ZONE, ON GRISE LES CONTRÔLES : passer tout le bloc en
   `opacity` délaverait le montant payé, les activités et les dates, c'est-à-dire
   exactement ce qu'on vient lire sur un dossier qu'on ne peut plus modifier. */
.cnpr-insc-gel { display: contents; }

/* `opacity: 1` explicite : iOS Safari délave les contrôles `disabled` de son
   côté jusqu'à l'illisible. Même parade que `.cnpr-insc-frozen` ci-dessus et
   que `.cnpr-ad-gel` côté bureau. */
.cnpr-insc .cnpr-insc-gel :disabled {
    opacity: 1;
    cursor: not-allowed;
}
/* SPÉCIFICITÉ ASSUMÉE, ET MESURÉE. Le thème peint les champs de toute page de
   contenu par `.page-content form input[type="text"]` et ses voisines, avec
   `background: #ffffff` et l'encre du texte. Ce sélecteur pèse (0,2,2), et PAS
   (0,2,1) : un sélecteur d'attribut compte dans la colonne CLASSE, jamais dans
   celle des éléments. `.page-content` + `[type="text"]` font donc deux classes,
   `form` + `input` deux éléments. C'est ce calcul-là que le prochain recopiera,
   alors autant qu'il soit juste.

   Conséquence : (0,2,1) ne « perd le départage » pas, il PERD tout court. La
   règle de `.cnpr-insc-frozen` juste au-dessus, en (0,2,1), n'y échappe que
   parce que la fiche figée ne rend AUCUN `<form>` (elle remplace le formulaire
   par un `<fieldset>`), si bien que le sélecteur du thème ne la vise jamais.
   Le gel, lui, enveloppe de VRAIS formulaires : le thème l'atteint, et un champ
   mort qui garde son encre pleine et son fond blanc est exactement le défaut
   que ce lot corrige. On monte donc d'un cran, ici et une seule fois : (0,3,1)
   bat (0,2,2) quel que soit l'ordre de chargement. Même arbitrage que
   `.cnpr-admin .cnpr-ad-gel input:disabled` côté bureau
   (assets/css/admin/boutons.css). */
.cnpr-insc .cnpr-insc-gel input:disabled,
.cnpr-insc .cnpr-insc-gel select:disabled,
.cnpr-insc .cnpr-insc-gel textarea:disabled {
    background: var(--cnpr-fond-doux, #eaf7fd);
    color: var(--cnpr-couleur-texte-doux, #4c5f80);
}
/* Le bouton reste VISIBLE, simplement mort. Qualifié sur `button` ET sur `.btn`
   — (0,3,1) et (0,4,0) — parce que la règle générique ci-dessus, en (0,3,0),
   battrait un `.cnpr-insc-gel .btn:disabled` nu et lui redonnerait son
   `opacity: 1`, c'est-à-dire l'apparence d'un bouton vivant.

   CE QUE CE SÉLECTEUR NE FAIT PAS, ET NE PEUT PAS FAIRE : atteindre un
   `<a class="btn">`. `:disabled` ne matche que les contrôles de formulaire,
   jamais une ancre. Les zones gelées en portent plusieurs (« Continuer »,
   « Le déposer plus tard », « ← Mes adhérents », les PDF), et elles restent
   vives. C'est la bonne doctrine et pas un oubli : un `<fieldset disabled>` ne
   touche pas non plus les liens, la lecture reste ouverte sur une saison close.
   Aujourd'hui `.btn:disabled` ne couvre donc qu'un `<button class="btn">`, que
   la ligne d'à côté couvre déjà ; il tient la place d'un
   `<input type="submit" class="btn">` que le front n'utilise pas encore. */
.cnpr-insc .cnpr-insc-gel button:disabled,
.cnpr-insc .cnpr-insc-gel .btn:disabled {
    opacity: 0.5;
}

/* LE BANDEAU DANS UNE CARTE ADHÉRENT PREND LA LIGNE. `.cnpr-insc-item` est une
   rangée flex (nom à gauche, boutons à droite) : un bloc posé là s'y rangerait
   comme une troisième colonne, à la largeur de son texte. Il prend donc toute
   la ligne, comme `__acts` et `__edit` juste avant lui, et l'explication tombe
   au-dessus des boutons qu'elle concerne au lieu de se glisser entre eux. */
.cnpr-insc .cnpr-insc-item > .cnpr-insc-gel-bandeau {
    flex-basis: 100%;
    margin: 4px 0 0;
}

.cnpr-insc-gestionnaire__current { margin: 0; }
.cnpr-insc-gestionnaire__title { margin: 0 0 8px; font-size: 18px; }
/* La carte compacte du compte : identité à gauche, « ✎ Modifier » à droite,
   sur une ligne qui retombe d'elle-même sur deux en mobile. Le <summary> porte
   toute la carte — cliquer n'importe où ouvre le panneau — donc il ne prend
   aucune décoration à lui : la seule affordance visible est le lien de droite,
   qui emprunte le style des cartes adhérent (plus haut). */
.cnpr-insc-gestionnaire__edit > summary { cursor: pointer; list-style: none; }
.cnpr-insc-gestionnaire__edit > summary::-webkit-details-marker { display: none; }
.cnpr-insc-gestionnaire__row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 2px 16px;
}
.cnpr-insc-gestionnaire__who { font-size: 16px; }
.cnpr-insc-gestionnaire__mail { word-break: break-all; }
.cnpr-insc-gestionnaire__sub { display: block; margin-top: 2px; font-size: 13px; }
/* La phrase longue ne se lit qu'une fois le panneau ouvert : elle a besoin
   d'air au-dessus, pour ne pas se coller au libellé qui vient de l'ouvrir.
   (0,2,0) comme partout ailleurs ici : le `p { margin: 0 }` du thème (0,1,1)
   écraserait une classe seule. */
.cnpr-insc .cnpr-insc-gestionnaire__why { margin: 14px 0 0; }
.cnpr-insc-gestionnaire__edit .cnpr-insc-form { margin-top: 12px; }

@media (max-width: 560px) {
    .cnpr-insc-grid { grid-template-columns: minmax(0, 1fr); }
}