/* CNPR Inscriptions — front-end tunnel. Reuses the theme design tokens. */
.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(--bg-soft, #e7eef6);
    color: var(--muted, #516278);
    font-size: 14px;
}
.cnpr-insc-steps li::before { content: counter(step) ". "; font-weight: 600; }
.cnpr-insc-steps li.is-current { background: var(--accent, #1c4a7a); color: #fff; }
.cnpr-insc-steps li.is-done { background: var(--accent-4, #61c7b5); color: #08323a; }

.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(--panel-strong, #d4dde9);
    border-radius: 8px;
}

.cnpr-insc-q {
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 10px;
    padding: 12px 14px;
    margin: 0 0 10px;
}
.cnpr-insc-q legend { font-weight: 600; padding: 0 6px; }
.cnpr-insc-q label { margin-right: 18px; }

/* Health questionnaire: Oui/Non as a clean two-segment toggle. */
.cnpr-insc-q--bool { display: flex; flex-direction: column; gap: 10px; }
.cnpr-insc-q--bool legend { float: left; width: 100%; margin-bottom: 4px; }
.cnpr-insc-choice { display: flex; gap: 8px; }
/* Container-scoped (0,2,0) to beat the generic ".cnpr-insc-form label" reset. */
.cnpr-insc-choice .cnpr-insc-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 18px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 999px;
    background: #ffffff;
    cursor: pointer;
    font-weight: 600;
    color: var(--muted, #516278);
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.cnpr-insc-pill input { margin: 0; }
.cnpr-insc-pill:hover { border-color: var(--accent-2, #2d74a5); }
/* The pending-encaissement pill is display-only (the member's dashboard status
   that mirrors the bureau's `.cnpr-ad-tag--pending-enc`), not one of the
   interactive choice pills this class also styles. Give it the amber "action
   attendue" fill and drop the choice pill's pointer + hover so it never reads
   as clickable. Declared after the base + `:hover` so it wins on source order. */
.cnpr-insc-pill--pending-enc {
    background: #fde6cf;
    border-color: #f0cfa5;
    color: #7a4a13;
    cursor: default;
}
.cnpr-insc-pill--pending-enc:hover { border-color: #f0cfa5; }
.cnpr-insc-pill--yes:has(input:checked) {
    border-color: #c98a16;
    background: rgba(201, 138, 22, 0.12);
    color: #7a4a13;
}
.cnpr-insc-pill--no:has(input:checked) {
    border-color: var(--accent-2, #2d74a5);
    background: rgba(45, 116, 165, 0.10);
    color: var(--accent, #1c4a7a);
}

/* Action row: primary + secondary buttons, consistent spacing across steps. */
.cnpr-insc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 18px;
}
/* Equal width across the row so the buttons read as one consistent set. */
.cnpr-insc-actions .btn {
    margin: 0;
    min-width: 200px;
    justify-content: center;
    text-align: center;
}
/* The forward (primary) button always sits on the right — the row is justified
   flex-end, so it stays anchored right even on steps that have no "Précédent".
   When a "Précédent" exists, its auto right-margin pushes it back to the left. */
.cnpr-insc-actions .cnpr-insc-prev { margin-right: auto; }
/* On narrow screens the lone forward button reads better full-width. */
@media (max-width: 560px) {
    .cnpr-insc-actions .btn { flex: 1 1 100%; }
}

/* Semantic colour by feature. Scoped under .cnpr-insc so it beats the theme's
   ".page-content form .btn" rule, which otherwise paints EVERY form button accent.
   - primary  (Continuer / Déposer / Soumettre) : accent, the encouraged action
   - secondary (Précédent)                      : neutral, navigation
   - defer    (Le déposer plus tard)            : amber, an optional/later action */
.cnpr-insc .cnpr-insc-actions .btn-primary {
    background: var(--accent, #1c4a7a);
    color: #ffffff;
    border: 1px solid transparent;
}
.cnpr-insc .btn:disabled,
.cnpr-insc .btn.is-disabled {
    opacity: .5;
    cursor: not-allowed;
    box-shadow: none;
}
.cnpr-insc .cnpr-insc-actions .btn-secondary {
    background: var(--panel, #eef3f8);
    color: var(--text, #20303f);
    border: 1px solid var(--panel-strong, #d4dde9);
    box-shadow: none;
}
.cnpr-insc .cnpr-insc-actions .btn-defer {
    background: rgba(201, 138, 22, 0.12);
    color: #7a4a13;
    border: 1px solid rgba(201, 138, 22, 0.45);
    box-shadow: none;
}
.cnpr-insc .cnpr-insc-actions .btn-defer:hover { background: rgba(201, 138, 22, 0.20); }
/* danger (Retirer un dossier) : destructive, neutral-red. Scoped to beat the
   theme's accent paint on form buttons (the withdraw control is a <button>). */
.cnpr-insc .cnpr-insc-inline .btn-danger,
.cnpr-insc .cnpr-insc-actions .btn-danger {
    background: rgba(176, 42, 42, 0.10);
    color: #8a1f1f;
    border: 1px solid rgba(176, 42, 42, 0.45);
    box-shadow: none;
}
.cnpr-insc .cnpr-insc-inline .btn-danger:hover,
.cnpr-insc .cnpr-insc-actions .btn-danger:hover { background: rgba(176, 42, 42, 0.18); }
/* Inline withdraw form sits flush inside the dashboard action row. */
.cnpr-insc-inline { display: inline-flex; margin: 0; }

@media (max-width: 560px) {
    .cnpr-insc-actions { flex-direction: column-reverse; align-items: stretch; }
    .cnpr-insc-actions .btn { width: 100%; min-width: 0; }
    .cnpr-insc-actions .cnpr-insc-prev { margin-right: 0; }
}

/* "Received" success line (e.g. certificate already uploaded). */
.cnpr-insc-ok {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 10px;
    background: rgba(97, 199, 181, 0.14);
    border: 1px solid rgba(97, 199, 181, 0.45);
    color: #14584c;
    font-weight: 600;
}
.cnpr-insc-ok__icon {
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--accent-4, #61c7b5);
    color: #fff;
    font-size: 12px;
}
.cnpr-insc-ok a { color: inherit; }

/* File upload: a native input wrapped in a soft dropzone. The browser's own
   file-selector button is styled (keeps native dialog, validation & filename
   display); margin-right guarantees the filename never touches the button. */
.cnpr-insc-file {
    padding: 16px 18px;
    border: 1.5px dashed var(--panel-strong, #d4dde9);
    border-radius: 12px;
    background: rgba(63, 166, 191, 0.04);
    margin: 0 0 4px;
}
/* Neutralise the generic .cnpr-insc-form input[type=file] box for this field
   (same specificity, later in the file => wins). */
.cnpr-insc-form input.cnpr-insc-fileinput {
    padding: 0;
    border: 0;
    border-radius: 0;
    max-width: 100%;
    font-size: 14px;
    color: var(--muted, #516278);
}
.cnpr-insc-fileinput::file-selector-button {
    margin-right: 16px;
    padding: 10px 18px;
    border: 0;
    border-radius: 10px;
    background: var(--accent, #1c4a7a);
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.15s ease;
}
.cnpr-insc-fileinput::file-selector-button:hover { background: var(--accent-2, #2d74a5); }

.cnpr-insc-radio {
    display: block;
    padding: 10px 12px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 10px;
    margin: 0 0 8px;
}
/* Inside a form, the generic ".cnpr-insc-form label" reset (0,1,1) would force
   this to inline-block; this (0,2,0) keeps it a full-width block row. */
.cnpr-insc-form .cnpr-insc-radio { display: block; margin: 0 0 8px; }

/* The theme turns every .page-content form into a bordered, shadowed grid card.
   Inside our own .cnpr-insc card that nests a second card AND forces grid flow on
   children — reset it so our forms are plain flow blocks. */
.cnpr-insc .cnpr-insc-form {
    display: block;
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
    margin: 0;
    box-shadow: none;
    max-width: none;
}

/* Activities: a tight, connected list with a clear selected state. */
.cnpr-insc-activites {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 12px;
    overflow: hidden;
    margin: 0 0 18px;
}
.cnpr-insc-activites .cnpr-insc-activite {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 12px 16px;
    border-top: 1px solid var(--panel-strong, #d4dde9);
    cursor: pointer;
    transition: background-color .12s ease;
}
.cnpr-insc-activites .cnpr-insc-activite:first-child { border-top: 0; }
.cnpr-insc-activites .cnpr-insc-activite:hover { background: var(--bg-soft, #f4f7fb); }
.cnpr-insc-activites .cnpr-insc-activite input { width: 18px; height: 18px; flex: 0 0 auto; margin: 0; }
.cnpr-insc-activites .cnpr-insc-activite:has(input:checked) { background: #eaf2fb; box-shadow: inset 3px 0 0 var(--accent, #1c4a7a); }
.cnpr-insc-activite__body { display: flex; flex-direction: column; gap: 1px; }
.cnpr-insc-activite__name { font-weight: 600; }
.cnpr-insc-activite__slot { font-size: 13px; color: var(--muted, #516278); }
.cnpr-insc-activite .cnpr-insc-badge { margin-left: auto; }
.cnpr-insc-muted { color: var(--muted, #516278); }

/* Duration hoisted onto the activité name (« Aquagym · créneaux de 45 min »):
   lighter than the title so it reads as a caption, not a second heading. */
.cnpr-insc-conteneur__duree {
    font-size: 14px;
    font-weight: 500;
    color: var(--muted, #516278);
}

/* The tunnel card clips with overflow:hidden, which creates a scroll container
   and KILLS position:sticky for everything inside it. Switch the pick step's card
   to overflow:clip — same clipping, but no scroll container, so the sticky name
   below actually pins. Scoped with :has() so no other card/step is affected. */
.card:has(.cnpr-insc-picks) {
    overflow: clip;
}

/* The activité name floats: it sticks under the theme's sticky site-header (69px)
   while you scroll through its créneaux, so you always know which activité you're
   picking in. Opaque background + a hairline so pills scrolling underneath stay
   readable. Only the open <h3> — the collapsed locked <summary> is never sticky. */
h3.cnpr-insc-conteneur__name {
    position: sticky;
    /* Height of the pinned top bars, measured live by cnpr-tunnel.js (varies by
       viewport + theme). 69px is only the desktop fallback if JS hasn't run. */
    top: var(--cnpr-sticky-top, 69px);
    z-index: 3;
    margin: 0;
    padding: 12px 4px 10px;
    background: #fff;
    box-shadow: 0 1px 0 var(--panel-soft, #e7eef6);
}

/* Over-cap warning (max-cours), toggled by the client mirror in cnpr-tunnel.js. */
.cnpr-insc-maxcours-warn { margin: 0 0 16px; }

.cnpr-insc-creneaux { display: flex; flex-direction: column; border-top: 1px solid var(--panel-strong, #d4dde9); }
/* The container-scoped selector (0,2,0) beats the generic ".cnpr-insc-form
   label" reset (0,1,1) which would otherwise force these labels to inline-block
   and collapse their flex layout (checkbox glued to the text). */
.cnpr-insc-creneaux .cnpr-insc-creneau {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 11px 16px 11px 34px;
    border-top: 1px solid var(--panel-soft, #e7eef6);
    cursor: pointer;
    transition: background-color .12s ease;
}
.cnpr-insc-creneau:first-child { border-top: 0; }
.cnpr-insc-creneau:hover { background: var(--bg-soft, #f4f7fb); }
.cnpr-insc-creneau input { width: 18px; height: 18px; flex: 0 0 auto; margin: 0; }
.cnpr-insc-creneau:has(input:checked) { background: #eaf2fb; box-shadow: inset 3px 0 0 var(--accent, #1c4a7a); }
.cnpr-insc-creneau__slot { font-weight: 500; }
.cnpr-insc-creneau .cnpr-insc-badge { margin-left: auto; }
.cnpr-insc-creneau--off {
    cursor: not-allowed;
    opacity: .55;
    background: var(--bg-soft, #f4f7fb);
}
.cnpr-insc-creneau--off:hover { background: var(--bg-soft, #f4f7fb); }
.cnpr-insc-creneau--off input { cursor: not-allowed; }

/* Backlog A (suppression-rejet-aspects): a bureau-confirmed seat, shown
   checked+disabled during the self-service activités correction — a
   positive "kept" state, not a greyed-out "off" one. */
.cnpr-insc-creneau--locked {
    cursor: not-allowed;
    background: #eaf7ee;
}
.cnpr-insc-creneau--locked:hover { background: #eaf7ee; }
.cnpr-insc-creneau--locked input { cursor: not-allowed; }
.cnpr-insc-badge--locked { background: #d6efdc; color: #14532d; }

/* Constant-depth sections inside a container: a jour (Aquagym) or a libellé
   (École de nage « Niveau 1 »…) titles each group; its créneaux sit under it.
   The title carries a top rule to split it from the group above (the container's
   own border-top covers the first one). Each group's first créneau drops its
   border-top so it sits flush under the title, not double-ruled. */
.cnpr-insc-creneau-group__label {
    margin: 0;
    padding: 14px 16px 6px 34px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted, #516278);
    border-top: 1px solid var(--panel-strong, #d4dde9);
}
.cnpr-insc-creneau-group:first-child .cnpr-insc-creneau-group__label { border-top: 0; }

/* Selectable pills, wrapped into a grid under each section title. The créneau's
   checkbox is visually hidden and drives the pill state; the whole chip is the
   click target. Base rule is grid-scoped (0,2,0) to beat the ".cnpr-insc-form
   label" reset (0,1,1) that would otherwise force inline-block + a stray margin. */
.cnpr-insc-creneau-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 16px 16px 34px;
}
.cnpr-insc-creneau-grid .cnpr-insc-creneau-pill {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    min-width: 76px;
    margin: 0;
    padding: 8px 15px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 11px;
    background: #fff;
    color: var(--text, #20303f);
    font-weight: 600;
    font-size: 14px;
    line-height: 1.25;
    text-align: center;
    cursor: pointer;
    transition: border-color .14s ease, background-color .14s ease, box-shadow .14s ease, color .14s ease, transform .1s ease;
}
.cnpr-insc-creneau-pill input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
}
.cnpr-insc-creneau-pill:hover {
    border-color: var(--accent-2, #2d74a5);
    background: var(--bg-soft, #f4f7fb);
}
.cnpr-insc-creneau-pill:has(input:checked) {
    border-color: var(--accent, #1c4a7a);
    background: var(--accent, #1c4a7a);
    color: #fff;
    box-shadow: 0 2px 6px rgba(28, 74, 122, .28);
}
.cnpr-insc-creneau-pill:has(input:checked) .cnpr-insc-creneau-pill__slot::after {
    content: " ✓";
    font-weight: 700;
}
.cnpr-insc-creneau-pill:has(input:checked) .cnpr-insc-creneau-pill__note { display: none; }
.cnpr-insc-creneau-pill:has(input:focus-visible) {
    outline: 2px solid var(--accent, #1c4a7a);
    outline-offset: 2px;
}
.cnpr-insc-creneau-pill:active { transform: translateY(1px); }

/* Full but still pickable (waitlist): dashed border + a small "complet" note. */
.cnpr-insc-creneau-pill--full { border-style: dashed; }
.cnpr-insc-creneau-pill__note {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #a05a13;
}

/* Ineligible by age: greyed, not selectable — title/aria-label carries the why. */
.cnpr-insc-creneau-grid .cnpr-insc-creneau-pill--off {
    cursor: not-allowed;
    color: var(--muted, #516278);
    background: var(--bg-soft, #f4f7fb);
    border-style: dashed;
    opacity: .6;
}
.cnpr-insc-creneau-pill--off:hover {
    border-color: var(--panel-strong, #d4dde9);
    background: var(--bg-soft, #f4f7fb);
}

/* Backlog A (suppression-rejet-aspects): a bureau-confirmed seat — checked,
   disabled, but styled as a KEPT choice (green), not a greyed-out one. */
.cnpr-insc-creneau-grid .cnpr-insc-creneau-pill--locked {
    cursor: not-allowed;
    border-color: #14532d;
    background: #d6efdc;
    color: #14532d;
}
.cnpr-insc-creneau-pill--locked:hover {
    border-color: #14532d;
    background: #d6efdc;
}
.cnpr-insc-creneau-pill--locked .cnpr-insc-creneau-pill__note { color: #14532d; }

/* Age-reserved activités: relegated below the pickable ones, each collapsed
   under its name (a native <details>) so the list stays focused on what the
   adhérent can actually take — the summary spells out the reservation reason. */
.cnpr-insc-picks-locked {
    margin-top: 24px;
    padding-top: 4px;
    border-top: 1px dashed var(--panel-strong, #d4dde9);
}
.cnpr-insc-picks-locked__intro {
    margin: 10px 0 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted, #516278);
}
.cnpr-insc-conteneur--locked {
    margin-bottom: 6px;
}
.cnpr-insc-conteneur--locked > summary {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 4px;
    cursor: pointer;
    list-style: none;
    color: var(--muted, #516278);
}
.cnpr-insc-conteneur--locked > summary::-webkit-details-marker { display: none; }
.cnpr-insc-conteneur--locked > summary::before {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-right: 2px solid var(--muted, #516278);
    border-bottom: 2px solid var(--muted, #516278);
    transform: rotate(-45deg);
    transition: transform .15s ease;
}
.cnpr-insc-conteneur--locked[open] > summary::before { transform: rotate(45deg); }
.cnpr-insc-conteneur--locked .cnpr-insc-conteneur__title { flex: 1 1 auto; }
.cnpr-insc-conteneur--locked > summary:hover { color: var(--text, #20303f); }

/* Créneaux covered by a single "souscription" (mode partagé) — informational.
   Grouped by day (like the indépendant grid) then laid on a 3-per-row grid, so a
   6-day week reads Lun/Mar/Mer then Jeu/Ven/Sam. The pills keep the full range
   (durations vary) and are static (no checkbox, no hover state — not pickable). */
.cnpr-insc-day-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 10px;
    padding: 10px 16px 14px 34px;
}
.cnpr-insc-day-col__label {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted, #516278);
}
.cnpr-insc-day-col__slots {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.cnpr-insc-slot-pill {
    display: inline-block;
    padding: 7px 13px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 10px;
    background: var(--bg-soft, #f4f7fb);
    font-size: 13px;
    font-weight: 600;
    color: var(--text, #20303f);
}
@media (max-width: 620px) {
    .cnpr-insc-day-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.cnpr-insc-list { list-style: none; margin: 0 0 24px; padding: 0; }
/* Each adhérent is a self-contained card (« bloc ») rather than a bare row, so
   the name, its dossier status and the chosen activities read as one unit. */
.cnpr-insc-item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 16px;
    margin: 0 0 12px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 12px;
    background: var(--panel, #fff);
}
.cnpr-insc-item:last-child { margin-bottom: 0; }

/* Chosen activities, listed under the name as chips (full-width row, so they
   wrap below the name + status like the edit panel does). */
.cnpr-insc-item__acts {
    flex-basis: 100%;
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cnpr-insc-item__acts li {
    font-size: 13px;
    color: var(--muted, #516278);
    background: var(--bg-soft, #e7eef6);
    border-radius: 8px;
    padding: 3px 10px;
}

.cnpr-insc-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--bg-soft, #e7eef6);
    font-size: 13px;
    color: var(--muted, #516278);
}
.cnpr-insc-badge--warn { background: #f6e2c9; color: #7a4a13; }

.cnpr-insc-table {
    width: 100%;
    /* separate (not collapse) so the outer border-radius + overflow clip the
       corners — with border-collapse:collapse both are ignored and the outer
       frame never paints. border-spacing:0 keeps the rows flush. */
    border-collapse: separate;
    border-spacing: 0;
    margin: 0 0 4px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 12px;
    overflow: hidden;
}
.cnpr-insc-table td { padding: 13px 16px; border-bottom: 1px solid var(--panel-strong, #d4dde9); }
.cnpr-insc-table tr:last-child td { border-bottom: 0; }
.cnpr-insc-table td:last-child { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cnpr-insc-total td {
    font-weight: 700;
    font-size: 1.05em;
    border-top: 2px solid var(--accent, #1c4a7a);
    background: rgba(45, 116, 165, 0.04);
}

/* Recap adjustment rows: dossier-level add-ons that reconcile into the NET Total
   (surcharge/majoration are positive, remise is a credit), plus the real
   collected payments and the remaining balance below the Total. Muted labels,
   tabular amounts; credits (remise/payment) read green, the residual "Reste à
   régler" is emphasised like the Total so the member's action item stands out. */
.cnpr-insc-supplement td,
.cnpr-insc-majoration td,
.cnpr-insc-remise td,
.cnpr-insc-paiement td {
    color: var(--muted, #5a6b80);
    font-size: 0.95em;
}
.cnpr-insc-remise td:last-child,
.cnpr-insc-paiement td:last-child {
    color: #1a5c2f;
    font-weight: 600;
}
.cnpr-insc-reste td {
    font-weight: 700;
    font-size: 1.05em;
    border-top: 1px dashed var(--panel-strong, #d4dde9);
    background: rgba(45, 116, 165, 0.04);
}

/* Dégressif récap: role label ("1er cours" / "cours supplémentaire") + saving
   badge, so a reduced line reads as a discount, not as a cheap activity. */
.cnpr-insc-tarif-role {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 0.78em;
    font-weight: 600;
    color: var(--accent, #1c4a7a);
    background: rgba(45, 116, 165, 0.1);
    vertical-align: middle;
    white-space: nowrap;
}
.cnpr-insc-tarif-save {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 0.78em;
    font-weight: 700;
    color: #1a5c2f;
    background: rgba(38, 128, 66, 0.12);
    vertical-align: middle;
    white-space: nowrap;
}
.cnpr-insc-tarif-note { font-size: 0.9em; }

.cnpr-insc-notice {
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--accent-5, #d8e3bf);
    color: #2f3a1a;
    margin: 0 0 16px;
}
.cnpr-insc-notice--warn { background: #f6d9d9; color: #7a1313; }
.cnpr-insc-hint { color: #7a4a13; font-weight: 600; }
/* The active theme resets `.page-content form p { margin: 0 }`, which strips our
   in-form notices of their spacing (e.g. two stacked notices at the payment
   step). Reassert the bottom margin with container specificity so it wins. */
.cnpr-insc .cnpr-insc-notice { margin: 0 0 16px; }

/* --- Dashboard header bar --------------------------------------------- */
.cnpr-insc-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 0 0 18px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--panel-strong, #d4dde9);
}
.cnpr-insc-head .card-title { margin: 0; }
.cnpr-insc-season {
    margin: -8px 0 18px;
    font-size: 15px;
    color: var(--muted, #516278);
}
.cnpr-insc-season strong { color: var(--text, #1d2733); font-weight: 700; }

/* Previous-season history (collapsed, read-only) */
.cnpr-insc-season-group {
    margin: 24px 0 0;
    border-top: 1px solid var(--panel-strong, #d4dde9);
    padding-top: 16px;
}
.cnpr-insc-season-group > summary {
    cursor: pointer;
    font-weight: 700;
    color: var(--accent, #1c4a7a);
    list-style: none;
}
.cnpr-insc-season-group > summary::-webkit-details-marker { display: none; }
.cnpr-insc-season-group > summary::before {
    content: "▸";
    display: inline-block;
    margin-right: 8px;
    transition: transform 0.15s ease;
}
.cnpr-insc-season-group[open] > summary::before { transform: rotate(90deg); }
.cnpr-insc-history {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    display: grid;
    gap: 12px;
}
.cnpr-insc-history__item {
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 8px;
    padding: 12px 14px;
    background: var(--panel, #f7fafd);
}
.cnpr-insc-history__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    flex-wrap: wrap;
}
.cnpr-insc-history__acts {
    margin: 8px 0 0;
    padding-left: 18px;
    color: var(--muted, #516278);
    font-size: 14px;
}
.cnpr-insc-history__paid {
    margin: 8px 0 0;
    font-size: 14px;
    font-weight: 600;
}
.cnpr-insc-history__reenroll { margin: 12px 0 0; }
.cnpr-insc-history__reenroll .cnpr-insc-inline,
.cnpr-insc-history__reenroll form { margin: 0; }
.cnpr-insc-history__already {
    margin: 12px 0 0;
    font-size: 13px;
    color: var(--muted, #516278);
    font-style: italic;
}

/* Per-adhérent "edit my info" panel — full-width row under the list item. */
.cnpr-insc-item__edit { flex-basis: 100%; margin: 2px 0 0; }
.cnpr-insc-item__edit > summary {
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--accent, #1c4a7a);
    list-style: none;
    display: inline-block;
}
.cnpr-insc-item__edit > summary::-webkit-details-marker { display: none; }
.cnpr-insc-item__edit > summary::before { content: "\270E\00a0"; }
.cnpr-insc-item__edit[open] { padding-bottom: 10px; }
.cnpr-insc-item__edit .cnpr-insc-form { margin-top: 12px; }
.cnpr-insc-item__danger {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--panel-strong, #d4dde9);
}

/* Dashboard action buttons (adhérent list + N-1 history) are inline form
   buttons, so the theme's ".page-content form .btn" turns them into oversized
   blue pills with a heavy shadow. Re-style them compact here — the 3-class
   scope beats that theme rule — so they read as one tidy, consistent set. */
.cnpr-insc .cnpr-insc-list .btn,
.cnpr-insc .cnpr-insc-history .btn {
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    box-shadow: none;
}
.cnpr-insc .cnpr-insc-list .btn:hover,
.cnpr-insc .cnpr-insc-history .btn:hover {
    transform: none;
}
.cnpr-insc .cnpr-insc-list .btn-primary,
.cnpr-insc .cnpr-insc-history .btn-primary {
    background: var(--accent, #1c4a7a);
    color: #ffffff;
    border: 1px solid transparent;
}
.cnpr-insc .cnpr-insc-list .btn-secondary,
.cnpr-insc .cnpr-insc-history .btn-secondary {
    background: var(--panel, #eef3f8);
    color: var(--text, #20303f);
    border: 1px solid var(--panel-strong, #d4dde9);
}
/* The theme paints every ".page-content form" as a bordered, shadowed card.
   The dashboard's inline action forms (Inscrire / Réinscrire / Régler…) carry
   no class, so that card box wraps each button — the visible "double border".
   Strip it here (2-class scope beats ".page-content form"); display is left to
   the form's own inline style so the withdraw inline-flex form is untouched. */
.cnpr-insc .cnpr-insc-list form,
.cnpr-insc .cnpr-insc-history form {
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
    margin: 0;
    box-shadow: none;
    max-width: none;
    gap: 0;
}
.cnpr-insc-link {
    color: var(--accent, #1c4a7a);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.cnpr-insc-link:hover { text-decoration: underline; }

/* --- Adherent list (name left, status/action right) ------------------- */
.cnpr-insc-item__name { font-weight: 600; font-size: 16px; }
.cnpr-insc-item__right {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cnpr-insc-empty {
    padding: 16px;
    border: 1px dashed var(--panel-strong, #d4dde9);
    border-radius: 10px;
    color: var(--muted, #516278);
    margin: 0 0 18px;
}

/* --- Collapsible "add adherent" panel --------------------------------- */
.cnpr-insc-panel {
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 12px;
    padding: 0 16px;
    margin: 8px 0 0;
    background: var(--bg-soft, #f4f7fb);
}
.cnpr-insc-panel > summary {
    cursor: pointer;
    font-weight: 600;
    padding: 14px 4px;
    list-style: none;
    color: var(--accent, #1c4a7a);
}
.cnpr-insc-panel > summary::-webkit-details-marker { display: none; }
.cnpr-insc-panel > summary::before { content: "+ "; font-weight: 700; }
.cnpr-insc-panel[open] > summary::before { content: "− "; }
.cnpr-insc-panel[open] { padding-bottom: 16px; }

/* --- Status badge palette --------------------------------------------- */
.cnpr-insc-badge--cnpr_paye { background: #d6efdc; color: #14532d; }
.cnpr-insc-badge--cnpr_paye_partiel { background: #fef0c7; color: #7a4a13; }
.cnpr-insc-badge--cnpr_valide_attente_paiement { background: #dbeafe; color: #1e40af; }
.cnpr-insc-badge--cnpr_a_valider { background: #e7eef6; color: #1c4a7a; }
.cnpr-insc-badge--cnpr_valide_gele { background: #dbeafe; color: #1e40af; }
.cnpr-insc-badge--cnpr_attente_certif { background: #fde6cf; color: #7a4a13; }
.cnpr-insc-badge--cnpr_file_attente { background: #ede9fe; color: #5b21b6; }

/* --- Derived label badge (suppression-rejet-aspects, Requirement 6) --- */
.cnpr-insc-derived-label {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 0.85em;
    font-weight: 600;
}
.cnpr-insc-derived-label--warn { background: #f6d9d9; color: #7a1313; }
.cnpr-insc-derived-label--info { background: #fde6cf; color: #7a4a13; }
.cnpr-insc-derived-label--success { background: #d6efdc; color: #14532d; }

/* --- Themed login card ------------------------------------------------ */
.cnpr-insc-auth {
    max-width: 440px;
    margin: 8px auto;
    padding: 28px 28px 24px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 16px;
    background: var(--bg-soft, #f4f7fb);
}
.cnpr-insc-auth .card-title { margin-top: 0; }
.cnpr-insc-auth .cnpr-insc-login { margin-top: 4px; }
.cnpr-insc-login label { display: block; margin: 0 0 4px; font-weight: 600; }
.cnpr-insc-login input[type="text"],
.cnpr-insc-login input[type="email"],
.cnpr-insc-login input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 8px;
    font-size: 16px;
}
/* Magic-link auth: breathing room between the intro text, the email field, the
   submit button and the bureau link so nothing collides. */
.cnpr-insc-auth > p { margin: 0 0 12px; }
.cnpr-insc-auth .cnpr-insc-login p { margin: 0 0 16px; }
.cnpr-insc-auth .cnpr-insc-login .cf-turnstile { margin: 0 0 16px; }
.cnpr-insc-auth .cnpr-insc-login + p { margin-top: 14px; }
/* Welcome / onboarding block (no-dossier landing): give the CTA button air. */
.cnpr-insc-welcome .btn { display: inline-block; margin-top: 14px; }
.cnpr-insc-checkbox { font-weight: 400 !important; }
.cnpr-insc-checkbox input { margin-right: 6px; }

/* --- Form grid (add adherent + profil correction) --------------------- */
.cnpr-insc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
    margin: 0 0 16px;
}
.cnpr-insc-grid .field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
}
.cnpr-insc-grid .field > span { font-weight: 600; font-size: 14px; color: var(--muted, #516278); }
.cnpr-insc-grid .field--wide { grid-column: 1 / -1; }
.cnpr-insc-grid input[type="text"],
.cnpr-insc-grid input[type="date"],
.cnpr-insc-grid input[type="tel"],
.cnpr-insc-grid input[type="email"],
.cnpr-insc-grid select {
    width: 100%;
    box-sizing: border-box;
    padding: 9px 11px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 8px;
    font-size: 15px;
    background: #fff;
}
/* Phone widget: country-code select + national number on one row. */
.cnpr-insc-phone { display: flex; gap: 8px; }
.cnpr-insc-phone select { flex: 0 0 auto; width: auto; max-width: 170px; }
.cnpr-insc-phone input { flex: 1 1 auto; width: auto; min-width: 0; }
/* City hint: a permanently reserved line so revealing it never shifts the layout. */
.cnpr-insc-cityhint {
    display: block;
    min-height: 16px;
    line-height: 16px;
    font-size: 12px;
    color: #7a4a13;
}
.cnpr-insc-cityselect { /* legacy JS-injected select on the correction screen */
    width: 100%;
    box-sizing: border-box;
    padding: 9px 11px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 8px;
    font-size: 15px;
    background: #fff;
}

.cnpr-insc-checks { display: flex; flex-direction: column; gap: 8px; margin: 0 0 16px; }
.cnpr-insc-checks label { display: flex; align-items: center; gap: 8px; margin: 0; }
/* "Ancien / proche d'ancien" is a mutually-exclusive situation -> radio group. */
.cnpr-insc-situation { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.cnpr-insc-situation legend { padding: 0; margin: 0 0 2px; font-weight: 600; }
.cnpr-insc-situation label { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 400; }
.cnpr-insc-situation small { color: var(--muted, #516278); }
/* Air above the "Ajouter cet adhérent" submit button. */
.cnpr-insc-situation + .btn { margin-top: 16px; }
/* "Copier le téléphone du gestionnaire" mini-button under the phone field. */
.cnpr-insc-copyphone { margin-top: 6px; background: none; border: 1px solid var(--panel-strong, #d4dde9); border-radius: 6px; padding: 4px 10px; font-size: 13px; cursor: pointer; color: var(--accent, #0d2a4a); }
.cnpr-insc-copyphone:hover { background: var(--bg-soft, #f4f7fb); }
/* "Copier l'adresse du premier adhérent" button. */
.cnpr-insc-copyaddr { background: none; border: 1px solid var(--panel-strong, #d4dde9); border-radius: 6px; padding: 4px 10px; font-size: 13px; cursor: pointer; color: var(--accent, #0d2a4a); }
.cnpr-insc-copyaddr:hover { background: var(--bg-soft, #f4f7fb); }
/* "Gestionnaire du compte" contact section on the dashboard. */
.cnpr-insc-gestionnaire { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--panel-strong, #d4dde9); }
.cnpr-insc-gestionnaire__title { margin: 0 0 8px; font-size: 18px; }
.cnpr-insc-gestionnaire__who { margin: 0 0 4px; font-size: 16px; }

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

/* --- Step 5: indicative multi-method payment plan ------------------------ */
.cnpr-insc-recap-total { margin: 0 0 14px; }

/* A lighter, informational notice (vs. the heavier green --accent-5 block). */
.cnpr-insc-notice--info {
    background: rgba(63, 166, 191, 0.10);
    color: var(--accent, #1c4a7a);
    border: 1px solid rgba(63, 166, 191, 0.30);
}

.cnpr-insc-paymethods { border: 0; padding: 0; margin: 22px 0 14px; }
.cnpr-insc-paymethods > legend {
    font-weight: 700;
    color: var(--text, #20303f);
    padding: 0;
    margin: 0 0 10px;
}

.cnpr-insc-paymethod {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 14px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 12px;
    margin: 0 0 8px;
    background: #ffffff;
    transition: border-color 0.15s ease, background 0.15s ease;
}
/* Highlight a selected method (progressive enhancement; harmless if unsupported). */
.cnpr-insc-paymethod:has(input:checked) {
    border-color: var(--accent-2, #2d74a5);
    background: rgba(45, 116, 165, 0.05);
}
.cnpr-insc-paymethod .cnpr-insc-radio {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

/* Indicative amount field, sitting on the right of each offline method. */
.cnpr-insc-payamount {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    color: var(--muted, #516278);
}
.cnpr-insc-payamount input[type="number"] {
    width: 110px;
    padding: 9px 12px;
    border-radius: 10px;
    border: 1px solid var(--panel-strong, #d4dde9);
    background: #ffffff;
    font-size: 15px;
    text-align: right;
    color: var(--text, #20303f);
}
.cnpr-insc-payamount input[type="number"]:focus {
    outline: none;
    border-color: var(--accent-2, #2d74a5);
    box-shadow: 0 0 0 3px rgba(45, 116, 165, 0.15);
}

/* Card row: a normal row that stacks its explanatory sub-notes underneath. */
.cnpr-insc-paymethod--cb { flex-direction: column; align-items: stretch; gap: 6px; }
.cnpr-insc-paymethod--cb .cnpr-insc-muted { display: block; margin: 0 0 0 30px; }

/* Recommended card (1x): NEUTRAL like the others (no accent border/fill/inset).
   The "--reco" class is kept purely as a marker for the badge + the non-muted
   thank-you text below; the "Recommandé" badge alone carries the emphasis. */
.cnpr-insc-paymethod--reco .cnpr-insc-muted {
    color: var(--text, #20303f); /* the CB thank-you note is NOT greyed out */
}
.cnpr-insc-reco-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 9px;
    border-radius: 999px;
    background: var(--accent, #1c4a7a);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    vertical-align: middle;
}
/* Card thank-you panel — warm, accent-tinted, tied to the recommended card. */
.cnpr-insc .cnpr-insc-pay-thanks {
    background: rgba(28, 74, 122, 0.06);
    border: 1px solid rgba(28, 74, 122, 0.20);
    color: var(--accent, #1c4a7a);
    font-weight: 500;
    margin: 0 0 16px 30px;
}
.cnpr-insc-pay-installments { font-weight: 600; color: var(--accent-2, #2d74a5); }

/* Blocked by an incompatible choice (e.g. a card while chèque 3x is on). */
.cnpr-insc-paymethod.--blocked { opacity: 0.4; }
.cnpr-insc-paymethod.--blocked .cnpr-insc-radio { cursor: not-allowed; }

/* Group règlement: the shared main-method option greyed live when a per-child
   appoint rules it out (mirrors the per-dossier --blocked visual). */
.cnpr-insc-groupe-principal .cnpr-insc-radio.--blocked { opacity: 0.4; cursor: not-allowed; }

/* Group règlement: the family summary sitting just above "Confirmer" — the
   amount to actually pay is the decision, so it leads. */
.cnpr-insc-groupe-total {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 16px 0 12px;
    padding: 12px 14px;
    border: 1px solid var(--panel-strong, #d4dde9);
    border-radius: 10px;
    background: var(--panel, #eef3f8);
}
.cnpr-insc-groupe-total__main { font-size: 17px; }
.cnpr-insc-groupe-total__main strong { color: var(--accent, #1c4a7a); }
.cnpr-insc-groupe-total .cnpr-insc-muted { font-size: 14px; }

/* Chèque 3x cashing schedule (octobre / janvier / avril). */
.cnpr-insc-pay-schedule {
    flex-basis: 100%;
    margin: 8px 0 0 30px;
    font-size: 13px;
}
.cnpr-insc-pay-schedule ul {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
}
.cnpr-insc-pay-schedule li { white-space: nowrap; }
.cnpr-insc-pay-schedule strong { color: var(--accent, #1c4a7a); }

.cnpr-insc-pay-cheque-note { margin-top: 14px; }

/* Desktop: lay the payment methods out on two columns to cut the tall single
   column in half. The legend and the thank-you note span both columns; the two
   card methods (CB 1x + CB 3x) now sit side by side like the other methods (CB
   rendered first → column 1, carte_3x → column 2). The chèque-3x schedule lives
   INSIDE its card, so the grid never splits it. Below the breakpoint everything
   falls back to one column. */
@media (min-width: 720px) {
    .cnpr-insc-paymethods {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .cnpr-insc-paymethods > legend,
    .cnpr-insc-pay-thanks {
        grid-column: 1 / -1;
    }
    .cnpr-insc-paymethod { margin: 0; }
}

/* --- Règlement page: live distribution banner (recap-tarif Slice 1) -------- */
.cnpr-insc-repartition {
    margin: 18px 0 12px;
    padding: 14px 16px;
    border: 1px solid var(--c-border, #d8dee6);
    border-radius: var(--radius-sm, 8px);
    background: var(--c-bg-soft, #f6f8fa);
}
.cnpr-insc-repartition__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 3px 0;
}
/* [hidden] must win over the flex display above: the UA rule [hidden]{display:none}
   has specificity 0,0,0 and would otherwise lose to the 0,1,0 flex rule, leaving
   a masked row visible at "0.00 €". This 0,2,0 rule restores the hide. */
.cnpr-insc-repartition__row[hidden],
.cnpr-insc-repartition__card[hidden] { display: none; }
.cnpr-insc-repartition__row--remaining {
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px dashed var(--c-border, #d8dee6);
    font-weight: 600;
}
/* Over-assignment: the on-site amounts exceed the total. The final line then
   carries only the "Montant trop élevé" label (no amount), so colour both. */
.cnpr-insc-repartition__row--over,
.cnpr-insc-repartition__row--over strong { color: var(--c-danger, #c0392b); }
.cnpr-insc-pay-round-note { margin: 6px 0 0; }

/* Double opt-in that locks the choice. */
.cnpr-insc-optin {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 16px 0 4px;
}

/* Confirm button disabled until the distribution is complete. */
.cnpr-insc-actions .btn.is-disabled,
.cnpr-insc-actions .btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Locked (read-only) règlement view. */
.cnpr-insc-lock-confirmed { margin-top: 16px; }
.cnpr-insc-pay-summary {
    list-style: none;
    margin: 8px 0;
    padding: 0;
}
.cnpr-insc-pay-summary li {
    padding: 6px 0;
    border-bottom: 1px solid var(--c-border, #e3e8ee);
    font-weight: 600;
}
.cnpr-insc-deposit-msg { margin-top: 14px; }

/* Bureau fiche: "choix confirmé" badge on a locked payment plan. */
.cnpr-ad-badge--locked {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: #e6f4ea;
    color: #1a7f37;
    font-size: 12px;
    font-weight: 600;
}
.cnpr-ad-reopen-choice { margin: 10px 0 0; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
