/* ============================================================
   Design system back-office — composants partages entre pages
   (menu/topbar : voir BackOfficeMenu.razor.css/BackOfficeLayout.razor.css,
   scopes a leur composant). Charge globalement (App.razor) comme
   pal-cms.css/pal-manage.css/pal-forum.css — meme convention, meme
   contrainte HeadContent (cf. decisions.md [[css-scope-headcontent-piege]]).
   ============================================================ */

.pal-bo-pg-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.375rem;
}

.pal-bo-pg-actions {
    display: flex;
    gap: 0.625rem;
    align-items: center;
    flex-wrap: wrap;
}

.pal-bo-pg-crumb {
    font-size: .78rem;
    color: var(--text-muted);
    margin-bottom: 0.375rem;
}

.pal-bo-pg-title {
    font-size: 1.55rem;
    margin: 0;
}

    /* Convention (2026-08-10) : le h1 de chaque page reprend l'icone de son entree de menu
       (BackOfficeMenu.razor) — a appliquer systematiquement aux prochaines pages retouchees. */
    .pal-bo-pg-title i {
        color: var(--pal-red);
        margin-right: .4rem;
    }

.pal-bo-pg-sub {
    color: var(--text-muted);
    font-size: .9rem;
    margin-top: 0.25rem;
}

.pal-bo-btn {
    appearance: none;
    border: 1px solid transparent;
    border-radius: var(--pal-btn-radius);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
    white-space: nowrap;
}

.pal-bo-btn-ghost {
    background: transparent;
    color: var(--text-muted);
    padding: 9px 12px;
}

    .pal-bo-btn-ghost:hover {
        background: var(--bo-row-hover);
        color: var(--text);
    }

.pal-bo-btn-sm {
    padding: 6px 11px;
    font-size: .78rem;
}

.pal-bo-btn-primary {
    background: var(--pal-red);
    color: var(--pal-on-accent);
    padding: 9px 16px;
    font-size: .86rem;
}

    .pal-bo-btn-primary:hover {
        background: color-mix(in srgb, var(--pal-red) 84%, black 16%);
    }

.pal-bo-btn-secondary {
    background: transparent;
    color: var(--text);
    border-color: var(--surface-border);
    padding: 9px 16px;
    font-size: .86rem;
}

    .pal-bo-btn-secondary:hover {
        background: var(--bo-row-hover);
    }

.pal-bo-btn-success {
    background: var(--pal-success);
    color: var(--pal-on-accent);
    padding: 9px 16px;
    font-size: .86rem;
}

    .pal-bo-btn-success:hover {
        background: color-mix(in srgb, var(--pal-success) 84%, black 16%);
    }

.pal-bo-icon-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--surface-border);
    background: var(--surface-bg);
    color: var(--text);
    display: inline-grid;
    place-items: center;
    flex: none;
}

    .pal-bo-icon-btn:hover {
        background: var(--bo-row-hover);
    }

.pal-bo-icon-btn-danger {
    color: var(--pal-red);
    border-color: color-mix(in srgb, var(--pal-red) 35%, var(--surface-border));
}

    .pal-bo-icon-btn-danger:hover {
        background: var(--bo-danger-bg);
    }

.pal-bo-btn-danger {
    background: transparent;
    color: var(--pal-red);
    border-color: color-mix(in srgb, var(--pal-red) 35%, var(--surface-border));
    padding: 9px 16px;
    font-size: .86rem;
}

    .pal-bo-btn-danger:hover {
        background: var(--bo-danger-bg);
    }

.pal-bo-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .01em;
    white-space: nowrap;
    flex: none;
}

/* Variante pour un libelle libre potentiellement long (ex. titre de forum, /BackOffice/Fora) :
   peut passer a la ligne plutot que d'elargir la page sur mobile. */
.pal-bo-chip.pal-bo-chip-wrap {
    white-space: normal;
    max-width: 100%;
    border-radius: var(--pal-chip-wrap-radius);
}

    .pal-bo-chip::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: currentColor;
        flex: none;
    }

.pal-bo-chip-success {
    background: var(--pal-success-bg);
    color: var(--pal-success);
}

.pal-bo-chip-warning {
    background: var(--pal-warning-bg);
    color: var(--pal-warning);
}

.pal-bo-chip-danger {
    background: var(--bo-danger-bg);
    color: var(--pal-red);
}

.pal-bo-chip-flat {
    background: color-mix(in srgb, var(--pal-red) 10%, transparent);
    color: var(--pal-red);
}

    .pal-bo-chip-flat::before {
        display: none;
    }

.pal-bo-chip-muted {
    background: color-mix(in srgb, var(--text-muted) 14%, transparent);
    color: var(--text-muted);
}

    .pal-bo-chip-muted::before {
        display: none;
    }

.pal-bo-pill-tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.pal-bo-pill-tab {
    appearance: none;
    border: 1px solid var(--surface-border);
    background: var(--surface-bg);
    color: var(--text-muted);
    font: inherit;
    font-size: .8rem;
    font-weight: 700;
    padding: 7px 13px;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

    .pal-bo-pill-tab .n {
        background: color-mix(in srgb, var(--text-muted) 16%, transparent);
        padding: 1px 6px;
        border-radius: 999px;
        font-size: .72rem;
    }

    .pal-bo-pill-tab:hover:not([aria-selected="true"]) {
        background: var(--bo-row-hover);
    }

    .pal-bo-pill-tab[aria-selected="true"] {
        background: var(--pal-red);
        border-color: var(--pal-red);
        color: var(--pal-on-accent);
    }

        .pal-bo-pill-tab[aria-selected="true"] .n {
            background: color-mix(in srgb, var(--pal-on-accent) 25%, transparent);
            color: var(--pal-on-accent);
        }

.pal-bo-card {
    background: var(--surface-card);
    border: 1px solid var(--surface-border);
    border-radius: var(--pal-card-radius);
    box-shadow: var(--pal-card-shadow);
    /* Carte toujours enfant d'une grille/flex (pal-bo-grid-2col, -2, -main...) : sans min-width:0
       elle garde sa largeur min-content, et un <strong> en white-space:nowrap dans une mini-row
       (titre de tournoi, nom d'adherent) fait deborder la piste 1fr => scroll horizontal mobile.
       L'ellipsis est deja pose sur .pal-bo-mini-row-main strong, il ne demandait qu'a etre contraint. */
    min-width: 0;
}

.pal-bo-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--surface-border);
    gap: 0.75rem;
}

.pal-bo-card-head-wrap {
    flex-wrap: wrap;
}

.pal-bo-tablewrap {
    overflow: auto;
}

/* Pop-up d'import de résultats online : zone de scroll bornée, en-tête du tableau figé. */
.pal-bo-pop-import-scroll {
    max-height: min(62vh, 520px);
}

.pal-bo-pop-import-grid thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

/* .quickgrid > tbody > tr > td:empty { display:inherit } (app.css, legacy) casse le fond zébré
   des cellules vides — on rétablit le comportement de cellule pour cette grille. */
.pal-bo-pop-import-grid > tbody > tr > td:empty {
    display: table-cell;
}

.pal-bo-card-pager {
    padding-inline: 1.25rem;
}

    .pal-bo-card-pager:last-child {
        padding-bottom: 1.25rem;
    }

    .pal-bo-card-head h3 {
        font-size: 1rem;
        margin: 0;
    }

.pal-bo-card-head-sub {
    font-size: .78rem;
    color: var(--text-muted);
    margin-top: 0.125rem;
}

.pal-bo-card-body {
    padding: 1.1rem 1.25rem;
}

/* ---- onglets de contenu (distinct de .pal-bo-pill-tabs = pastilles de filtre) ---- */
.pal-bo-tabs {
    display: flex;
    gap: .25rem;
    border-bottom: 1px solid var(--surface-border);
    margin: 1.25rem 0;
    overflow-x: auto;
    /* overflow-x seul suffit a faire calculer overflow-y en "auto" par le navigateur (regle du
       spec CSS Overflow) et fait apparaitre une barre verticale non voulue ici : neutralisee. */
    overflow-y: hidden;
}

.pal-bo-tab {
    appearance: none;
    background: none;
    border: none;
    font: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1rem;
    font-size: .86rem;
    font-weight: 700;
    color: var(--text-muted);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    white-space: nowrap;
}

    .pal-bo-tab:hover {
        color: var(--text);
    }

    .pal-bo-tab[aria-selected="true"] {
        color: var(--pal-red);
        border-color: var(--pal-red);
    }

/* ---- field-row generique (label + valeur/champ) ---- */
.pal-bo-field-row {
    display: grid;
    grid-template-columns: 9rem 1fr;
    gap: .5rem 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--surface-border);
    align-items: center;
}

    .pal-bo-field-row:last-child {
        border-bottom: none;
    }

    .pal-bo-field-row .k {
        font-size: .78rem;
        color: var(--text-muted);
        font-weight: 700;
    }

    .pal-bo-field-row .v {
        font-size: .88rem;
    }

    .pal-bo-field-row input,
    .pal-bo-field-row select {
        width: 100%;
        padding: 7px 10px;
        border-radius: 7px;
        border: 1px solid var(--surface-border);
        background-color: var(--surface-bg);
        color: var(--text);
        font: inherit;
        font-size: .86rem;
    }

/* ---- champs de formulaire generiques (hors field-row : label au-dessus, pas a cote) ---- */
.pal-bo-form-label {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    color: var(--text-muted);
    margin-bottom: .35rem;
}

.pal-bo-form-row {
    margin-bottom: .95rem;
}

    .pal-bo-form-row:last-child {
        margin-bottom: 0;
    }

.pal-bo-form-row select,
.pal-bo-form-row input,
.pal-bo-form-row textarea {
    width: 100%;
    padding: 8px 10px;
    border-radius: 7px;
    border: 1px solid var(--surface-border);
    background-color: var(--surface-bg);
    color: var(--text);
    font: inherit;
    font-size: .88rem;
}

/* input/textarea seuls (pas select, dont la fleche native a besoin de sa marge par defaut) :
   padding-right plus resserre pour laisser la place aux boutons +/- d'un eventuel type="number",
   pose ici directement plutot que via une regle [type="number"] separee qui devrait re-emettre
   tout le reste du padding pour gagner la cascade sur le raccourci ci-dessus. */
.pal-bo-form-row input,
.pal-bo-form-row textarea {
    padding-right: var(--pal-number-input-gutter);
}

.pal-bo-form-row textarea {
    resize: vertical;
}

.pal-bo-form-hint {
    font-size: .72rem;
    color: var(--text-muted);
    margin-top: .3rem;
}

/* Avertissement de saisie inline dans un .pal-bo-form-hint (ex. borne haute d'inactivite <= borne basse). */
.pal-bo-form-warn {
    display: block;
    margin-top: .3rem;
    color: var(--pal-warning);
    font-weight: 600;
}

.pal-bo-form-warn > i {
    margin-right: .3rem;
}

/* Variante inline de .pal-bo-form-hint, pour un texte explicatif place a cote d'un champ plutot
   qu'en dessous (ex. "Joueurs totaux"/"Passage au jour d'apres", label+champ sur une seule ligne). */
.pal-bo-form-hint-inline {
    font-size: .72rem;
    color: var(--text-muted);
}

/* Icone "info" signalant une explication complementaire (portee par l'attribut title de cette meme
   icone) — un title ne doit jamais etre la seule indication qu'une info existe : invisible tant que
   l'utilisateur ne survole pas volontairement l'element, personne ne sait qu'il faut le faire.
   Convention a reprendre pour tout futur title explicatif du site (2026-08-13, page Saison =
   premier cas traite ; a etendre aux autres deja repertories — BOTransactions/BOChampionnatEdit —
   quand ces pages seront reprises). */
.pal-bo-info-hint {
    color: var(--text-muted);
    cursor: help;
    font-size: .85em;
    margin-left: .3rem;
}

/* Petit champ numerique (nombre de 1 a 3 chiffres au pire des cas) — utilise a la fois dans les
   popups d'import (Pop/ImportLiveGT.razor, CutOff) et sur la fiche tournoi (BOTournoiDetail.razor,
   "Joueurs totaux") : meme champ conceptuel (un compte de joueurs ou un seuil en heures), meme
   traitement visuel des deux cotes plutot qu'un style inline duplique. Alignement + degagement
   pour les boutons +/- herites de la regle generale input[type="number"] (app.css) — largeur
   elargie en consequence (etait 4.5rem avant l'ajout de ce degagement, cf. commit precedent). */
.pal-bo-input-num-sm {
    display: inline-block;
    width: 5.5rem;
}

.pal-bo-form-grid-2 {
    display: grid;
    grid-template-columns: 1fr;
    gap: .95rem;
    margin-bottom: .95rem;
}

    .pal-bo-form-grid-2:last-child {
        margin-bottom: 0;
    }

/* seuil: --bp-tablet */
@media (min-width: 600px) {
    .pal-bo-form-grid-2 {
        grid-template-columns: 1fr 1fr;
    }
}

.pal-bo-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .5rem 0;
}

    .pal-bo-toggle-row .t {
        font-size: .87rem;
        font-weight: 600;
    }

    .pal-bo-toggle-row .d {
        font-size: .73rem;
        color: var(--text-muted);
        margin-top: .1rem;
    }

/* ---- grille 2 colonnes generique (paire de cartes) ---- */
.pal-bo-grid-2 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.1rem;
}

/* seuil: --bp-desktop-sm */
@media (min-width: 900px) {
    .pal-bo-grid-2 {
        grid-template-columns: 1fr 1fr;
    }
}

/* minmax(0, 1fr) et non 1fr : 1fr ne descend jamais sous la largeur min-content de la carte — sur
   mobile, un libelle ou un anneau un peu large elargissait toute la page. */
.pal-bo-grid-kpi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.375rem;
}

/* seuil: --bp-desktop-sm */
@media (min-width: 1024px) {
    .pal-bo-grid-kpi {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.pal-bo-kpi {
    background: var(--surface-card);
    border: 1px solid var(--surface-border);
    border-radius: var(--pal-card-radius);
    padding: 1.125rem 1.25rem;
    box-shadow: var(--pal-card-shadow);
}

.pal-bo-kpi-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.625rem;
}

.pal-bo-kpi-label {
    font-size: .76rem;
    font-weight: 700;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .05em;
}

.pal-bo-kpi-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: var(--bo-danger-bg);
    color: var(--pal-red);
    flex: none;
}

.pal-bo-kpi-value {
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1;
}

.pal-bo-kpi-delta {
    font-size: .76rem;
    margin-top: 0.5rem;
    color: var(--text-muted);
}

.pal-bo-kpi-delta-up {
    color: var(--pal-success);
}

.pal-bo-grid-2col {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

/* seuil: --bp-desktop-lg */
@media (min-width: 1440px) {
    .pal-bo-grid-2col {
        grid-template-columns: 1.3fr 1fr;
    }
}

.pal-bo-mini-list {
    display: flex;
    flex-direction: column;
}

.pal-bo-mini-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--surface-border);
    color: var(--text);
    text-decoration: none;
}

    .pal-bo-mini-row:last-child {
        border-bottom: none;
    }

    .pal-bo-mini-row:hover {
        background: var(--bo-row-hover);
    }

.pal-bo-mini-row-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

    .pal-bo-mini-row-main strong {
        font-size: .86rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pal-bo-mini-row-main span {
        font-size: .76rem;
        color: var(--text-muted);
    }

/* Montant aligné à droite d'une mini-row (dashboard « Adhésions à valider ») */
.pal-bo-mini-row-amount {
    flex: none;
    min-width: 4rem;
    text-align: right;
    line-height: 1.3;
}

    .pal-bo-mini-row-amount strong {
        display: block;
        font-size: .86rem;
        font-weight: 800;
    }

    .pal-bo-mini-row-amount span {
        display: block;
        font-size: .7rem;
        color: var(--text-muted);
    }

.pal-bo-mini-empty {
    padding: 1.25rem;
    text-align: center;
    color: var(--text-muted);
    font-size: .86rem;
}

.pal-bo-avatar-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--pal-red);
    color: var(--pal-on-accent);
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: .76rem;
    flex: none;
}

.pal-bo-date-chip {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: none;
    line-height: 1;
}

    .pal-bo-date-chip .d {
        font-size: 1rem;
        font-weight: 800;
    }

    .pal-bo-date-chip .m {
        font-size: .6rem;
        color: var(--pal-red);
        text-transform: uppercase;
        font-weight: 700;
    }

/* ---- grille QuickGrid generique (surcharge du theme .quickgrid fixe de app.css) ----
   Pattern duplique par page (::deep .pal-bo-xxx-grid) sur Championnats/Utilisateurs/Tournois
   (voir leurs .razor.css scopes) ; promu ici en classe partagee des la 4e page concernee
   (Saisons/News/Pages/Partenaires/Rooms/Lieux) plutot que de reconduire la duplication. */
.pal-bo-grid.quickgrid {
    width: 100%;
}

.pal-bo-grid th {
    background-color: color-mix(in srgb, var(--surface-card) 92%, var(--text) 8%);
    color: var(--text);
    border-color: var(--surface-border);
    font-size: .78rem;
    text-transform: var(--pal-th-text-transform);
    letter-spacing: .04em;
    font-weight: 700;
    padding: 0.7rem 0.875rem;
}

.pal-bo-grid th .sort-indicator {
    filter: var(--pal-icon-invert-filter);
}

.pal-bo-inscrits-table th.pal-bo-th-sortable,
.pal-bo-inscrits-table td.pal-bo-td-num {
    text-align: right;
}

.pal-bo-inscrits-table th.pal-bo-th-sortable button {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: inherit;
    background: transparent;
    border: none;
    font: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    padding: 0;
}

/* Les colonnes triables de QuickGrid enveloppent leur libelle dans un <button> — un <button>
   n'herite pas de color/background de son parent comme le ferait un <div> (regle UA du navigateur,
   independante du theme du site), d'ou un entete de colonne triable qui restait au rendu systeme
   (parfois blanc en clair, texte noir en sombre) meme quand .pal-bo-grid th est correctement theme. */
.pal-bo-grid th button {
    color: inherit;
    background: transparent;
    border: none;
    text-transform: inherit;
    letter-spacing: inherit;
}

.pal-bo-grid > tbody > tr {
    border-bottom: 1px solid var(--surface-border);
}

.pal-bo-grid tbody tr:nth-of-type(odd) {
    background-color: color-mix(in srgb, var(--text) 4%, transparent);
}

.pal-bo-grid tbody tr:hover {
    background-color: var(--bo-row-hover);
}

.pal-bo-grid td {
    color: var(--text);
    vertical-align: middle;
    padding: 0.6rem 0.875rem;
}

/* Cellules editables (ex. tableau des paliers de la fiche Saison) : un <input>/<select> brut,
   sans classe, ne suit pas le theme du site (couleur/fond fixes du navigateur) meme si le <td>
   parent est correctement theme — texte illisible en sombre. Meme traitement que les autres
   grilles editables du site (.pal-bo-don-row input, .pal-bo-classement-grid td input). */
.pal-bo-grid td input,
.pal-bo-grid td select {
    width: 100%;
    padding: 5px 7px;
    border-radius: 6px;
    border: 1px solid var(--surface-border);
    background-color: var(--surface-bg);
    color: var(--text);
    font: inherit;
    font-size: .85rem;
}

/* input seul (pas select, dont la fleche native a besoin de sa marge par defaut) : padding-right
   plus resserre pour les boutons +/- d'un eventuel type="number" — voir .pal-bo-form-row input
   plus haut, meme technique. */
.pal-bo-grid td input {
    padding-right: var(--pal-number-input-gutter);
}

/* Etat "page pas encore prete" (toute future page en attente) */
.pal-bo-doc-placeholder {
    padding: 3.5rem 2rem;
    text-align: center;
    color: var(--text-muted);
}

    .pal-bo-doc-placeholder i {
        font-size: 2.5rem;
        color: var(--pal-red);
    }

    .pal-bo-doc-placeholder h2 {
        font-size: 1.2rem;
        color: var(--text);
        margin: 0.875rem 0 0.5rem;
    }

    .pal-bo-doc-placeholder p {
        max-width: 32rem;
        margin-inline: auto;
        font-size: .9rem;
    }

/* ============================================================
   Page /BackOffice/Documentation — composants specifiques (une seule
   page les utilise, mais places ici plutot que dans un .razor.css scope
   pour rester utilisables depuis les composants de theme enfants, cf.
   Components/Pages/BackOffice/Documentation/*.razor).
   ============================================================ */
.pal-bo-doc-search {
    position: relative;
    margin: 1.1rem 0 1rem;
}

    .pal-bo-doc-search svg {
        position: absolute;
        left: 14px;
        top: 50%;
        transform: translateY(-50%);
        color: var(--text-muted);
        width: 17px;
        height: 17px;
    }

    .pal-bo-doc-search input {
        width: 100%;
        padding: 12px 14px 12px 42px;
        border-radius: 12px;
        border: 1px solid var(--surface-border);
        background: var(--surface-card);
        color: var(--text);
        font: inherit;
        font-size: .94rem;
    }

    .pal-bo-doc-search input:focus {
        outline: 2px solid var(--pal-red);
        outline-offset: 1px;
    }

    .pal-bo-doc-search .kbd {
        position: absolute;
        right: 12px;
        top: 50%;
        transform: translateY(-50%);
        font-size: .7rem;
        color: var(--text-muted);
        border: 1px solid var(--surface-border);
        border-radius: 5px;
        padding: 2px 6px;
        background: var(--surface-bg);
    }

.pal-bo-doc-theme-nav {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 12px 0;
    margin-bottom: 4px;
    background: var(--surface-bg);
}

.pal-bo-doc-noresults {
    display: none;
    text-align: center;
    padding: 40px 20px;
    color: var(--text-muted);
}

    .pal-bo-doc-noresults svg {
        width: 28px;
        height: 28px;
        margin-bottom: 10px;
        opacity: .5;
    }

/* accordeon de theme (<details> natif, pas de JS necessaire pour ouvrir/fermer) */
.pal-bo-doc-theme {
    background: var(--surface-card);
    border: 1px solid var(--surface-border);
    border-radius: var(--pal-card-radius);
    margin-bottom: 1rem;
    scroll-margin-top: 70px;
    overflow: hidden;
    box-shadow: var(--pal-card-shadow);
}

    .pal-bo-doc-theme > summary {
        list-style: none;
        cursor: pointer;
        padding: 1.25rem 1.375rem;
        display: flex;
        align-items: center;
        gap: 1rem;
    }

        .pal-bo-doc-theme > summary::-webkit-details-marker {
            display: none;
        }

.pal-bo-doc-theme-icon {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: var(--bo-danger-bg);
    color: var(--pal-red);
    display: grid;
    place-items: center;
    flex: none;
}

.pal-bo-doc-theme-main {
    flex: 1;
    min-width: 0;
}

    .pal-bo-doc-theme-main h2 {
        font-size: 1.12rem;
        margin: 0;
    }

    .pal-bo-doc-theme-main p {
        font-size: .82rem;
        color: var(--text-muted);
        margin-top: .2rem;
    }

.pal-bo-doc-theme-chevron {
    color: var(--text-muted);
    transition: transform .15s;
    flex: none;
}

.pal-bo-doc-theme[open] > summary .pal-bo-doc-theme-chevron {
    transform: rotate(180deg);
}

.pal-bo-doc-theme-body {
    padding: .25rem 1.375rem 1.6rem;
    border-top: 1px solid var(--surface-border);
}

.pal-bo-doc-where {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    margin: 1.1rem 0 1.6rem;
    padding: .75rem .9rem;
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    font-size: .82rem;
}

    .pal-bo-doc-where strong {
        font-weight: 700;
        margin-right: 2px;
    }

.pal-bo-doc-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 700;
    background: var(--surface-card);
    border: 1px solid var(--surface-border);
}

    .pal-bo-doc-pill.front {
        color: var(--pal-red);
    }

    .pal-bo-doc-pill.back {
        color: var(--text);
    }

.pal-bo-doc-qa {
    padding: 1.25rem 0;
    border-bottom: 1px solid var(--surface-border);
    scroll-margin-top: 70px;
}

    .pal-bo-doc-qa:last-child {
        border-bottom: none;
        padding-bottom: .25rem;
    }

    .pal-bo-doc-qa h3 {
        font-size: 1rem;
        margin: 0 0 .5rem;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .pal-bo-doc-qa p {
        font-size: .92rem;
        line-height: 1.6;
        color: var(--text);
        max-width: 70ch;
        margin: 0;
    }

    .pal-bo-doc-qa p + p {
        margin-top: .6rem;
    }

    .pal-bo-doc-qa ul,
    .pal-bo-doc-qa ol {
        margin: .6rem 0 0;
        padding-left: 1.2rem;
        font-size: .92rem;
        line-height: 1.6;
    }

    .pal-bo-doc-qa li {
        margin-bottom: .25rem;
    }

    .pal-bo-doc-qa strong.hl {
        color: var(--pal-red);
    }

/* bloc "En detail" imbrique — jamais de code/nom de table/champ DB dedans, uniquement du francais plus precis */
.pal-bo-doc-tech {
    margin-top: .875rem;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--text) 4%, var(--surface-bg));
    overflow: hidden;
}

    .pal-bo-doc-tech > summary {
        list-style: none;
        cursor: pointer;
        padding: .625rem .875rem;
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: .82rem;
        font-weight: 700;
        color: var(--text-muted);
    }

        .pal-bo-doc-tech > summary::-webkit-details-marker {
            display: none;
        }

        .pal-bo-doc-tech > summary svg,
        .pal-bo-doc-tech > summary i {
            color: var(--pal-red);
        }

.pal-bo-doc-tech-chevron {
    margin-left: auto;
    color: var(--text-muted);
    transition: transform .15s;
}

.pal-bo-doc-tech[open] > summary .pal-bo-doc-tech-chevron {
    transform: rotate(180deg);
}

.pal-bo-doc-tech-body {
    padding: .125rem 1rem 1rem;
    font-size: .86rem;
    line-height: 1.65;
    border-top: 1px solid var(--surface-border);
}

    .pal-bo-doc-tech-body p {
        margin: .6rem 0;
        max-width: 74ch;
    }

    .pal-bo-doc-tech-body ol,
    .pal-bo-doc-tech-body ul {
        margin: .6rem 0;
        padding-left: 1.3rem;
    }

    .pal-bo-doc-tech-body li {
        margin-bottom: .375rem;
    }

.pal-bo-doc-formula {
    margin: .6rem 0;
    padding: .7rem .875rem;
    border: 1px solid var(--surface-border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--text) 3%, var(--surface-bg));
}

    .pal-bo-doc-formula-label {
        font-size: .74rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .02em;
        color: var(--text-muted);
        margin-bottom: .4rem;
    }

    .pal-bo-doc-formula pre {
        margin: 0;
        font-family: var(--pal-mono-font);
        font-size: .84rem;
        color: var(--text);
        white-space: pre-wrap;
        word-break: break-word;
    }

.pal-bo-doc-chart-point {
    cursor: pointer;
    opacity: .6;
    transition: opacity .1s, r .1s;
}

    .pal-bo-doc-chart-point:hover {
        opacity: 1;
        r: 5;
    }

.pal-bo-doc-chart-legend {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem 1.1rem;
    margin-top: .5rem;
    font-size: .82rem;
    color: var(--text-muted);
}

    .pal-bo-doc-chart-legend-item {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
    }

    .pal-bo-doc-chart-legend-swatch {
        width: 11px;
        height: 11px;
        border-radius: 3px;
        display: inline-block;
        flex: none;
    }

        .pal-bo-doc-chart-legend-swatch.pal10 {
            background: var(--pal-red);
        }

        .pal-bo-doc-chart-legend-swatch.pal05 {
            background: var(--pal-warning);
        }

        .pal-bo-doc-chart-legend-swatch.winamax {
            background: var(--pal-info);
        }

.pal-bo-doc-callout {
    display: flex;
    gap: 10px;
    padding: .75rem .875rem;
    border-radius: 10px;
    font-size: .84rem;
    margin: .875rem 0;
    line-height: 1.55;
}

    .pal-bo-doc-callout svg,
    .pal-bo-doc-callout i {
        flex: none;
        margin-top: 1px;
    }

    .pal-bo-doc-callout b {
        display: block;
        margin-bottom: 2px;
    }

.pal-bo-doc-callout-warn {
    background: var(--pal-warning-bg);
    border: 1px solid color-mix(in srgb, var(--pal-warning) 35%, transparent);
    color: var(--text);
}

    .pal-bo-doc-callout-warn i {
        color: var(--pal-warning);
    }

.pal-bo-doc-callout-info {
    background: color-mix(in srgb, var(--pal-red) 7%, transparent);
    border: 1px solid color-mix(in srgb, var(--pal-red) 25%, transparent);
    color: var(--text);
}

    .pal-bo-doc-callout-info i {
        color: var(--pal-red);
    }

/* Bandeau d'info generique au-dessus d'une liste back-office (hors Documentation, qui a deja son
   propre .pal-bo-doc-callout) — ex. BONewsList : prevenir l'admin quand aucune news n'est "Mise
   en avant", puisque dans ce cas le carrousel de la home n'affiche plus rien (comportement
   volontairement strict, cf. Home.razor). */
.pal-bo-page-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: .75rem .875rem;
    border-radius: 10px;
    font-size: .88rem;
    line-height: 1.55;
    margin-bottom: 1rem;
    background: var(--pal-warning-bg);
    border: 1px solid color-mix(in srgb, var(--pal-warning) 35%, transparent);
    color: var(--text);
}

    .pal-bo-page-notice i {
        flex: none;
        margin-top: 1px;
        color: var(--pal-warning);
    }

.pal-bo-doc-stub-body {
    padding: 1.125rem 1.375rem 1.6rem;
    border-top: 1px solid var(--surface-border);
}

.pal-bo-doc-stub-note {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .8rem;
    color: var(--text-muted);
    margin-bottom: .875rem;
    font-weight: 700;
}

.pal-bo-doc-tbl-wrap {
    overflow-x: auto;
    margin: .875rem 0;
}

table.pal-bo-doc-tbl {
    width: 100%;
    border-collapse: collapse;
    min-width: 480px;
}

    .pal-bo-doc-tbl thead th {
        text-align: left;
        font-size: .7rem;
        font-weight: 700;
        text-transform: var(--pal-th-text-transform);
        letter-spacing: .05em;
        color: var(--text-muted);
        padding: .5625rem .75rem;
        border-bottom: 1px solid var(--surface-border);
        white-space: nowrap;
    }

    .pal-bo-doc-tbl tbody td {
        padding: .6875rem .75rem;
        border-bottom: 1px solid var(--surface-border);
        font-size: .86rem;
        vertical-align: top;
    }

    .pal-bo-doc-tbl tbody tr:last-child td {
        border-bottom: none;
    }

    .pal-bo-doc-tbl .num {
        font-variant-numeric: tabular-nums;
        font-weight: 700;
    }

/* mini-graphique points (SVG genere a partir de vraies valeurs calculees, cf. @code de DocThemeClassement.razor) */
.pal-bo-doc-chart-wrap {
    margin: 1rem 0;
}

    .pal-bo-doc-chart-wrap svg {
        width: 100%;
        height: auto;
        display: block;
    }

.pal-bo-doc-chart-caption {
    font-size: .76rem;
    color: var(--text-muted);
    margin-top: .5rem;
}

/* diagramme fusion GT (deux timelines qui se combinent) */
.pal-bo-doc-gt {
    margin: 1.125rem 0;
    border: 1px solid var(--surface-border);
    border-radius: 10px;
    padding: 1.125rem 1rem .875rem;
    background: var(--surface-bg);
}

.pal-bo-doc-gt-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: .875rem;
}

    .pal-bo-doc-gt-row:last-child {
        margin-bottom: 0;
    }

.pal-bo-doc-gt-label {
    width: 108px;
    flex: none;
    font-size: .76rem;
    font-weight: 700;
    color: var(--text-muted);
}

.pal-bo-doc-gt-track {
    position: relative;
    flex: 1;
    height: 26px;
    background: color-mix(in srgb, var(--text) 5%, transparent);
    border-radius: 999px;
}

    .pal-bo-doc-gt-track .dot {
        position: absolute;
        top: 50%;
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: var(--text-muted);
        transform: translate(-50%, -50%);
    }

    .pal-bo-doc-gt-track .dot.win {
        width: 14px;
        height: 14px;
        background: var(--pal-red);
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--pal-red) 25%, transparent);
    }

    .pal-bo-doc-gt-track.merged {
        background: color-mix(in srgb, var(--pal-red) 10%, transparent);
    }

        .pal-bo-doc-gt-track.merged .dot {
            background: var(--pal-red);
            opacity: .55;
        }

        .pal-bo-doc-gt-track.merged .dot.win {
            opacity: 1;
        }

.pal-bo-doc-gt-offset {
    position: absolute;
    top: -16px;
    font-size: .66rem;
    color: var(--text-muted);
    white-space: nowrap;
}

.pal-bo-doc-gt-arrow {
    text-align: center;
    color: var(--text-muted);
    font-size: .8rem;
    margin: .375rem 0;
}

@media (min-width: 700px) {
    .pal-bo-doc-qa h3 {
        font-size: 1.05rem;
    }
}

/* ---------- /BackOffice/Statistiques ---------- */
.pal-bo-stats-period-card {
    margin-bottom: 1.375rem;
}

.pal-bo-stats-period-row {
    display: flex;
    align-items: center;
    gap: .9rem;
    flex-wrap: wrap;
}

.pal-bo-stats-field {
    display: flex;
    align-items: center;
    gap: .5rem;
}

    .pal-bo-stats-field label {
        font-size: .84rem;
        font-weight: 700;
        color: var(--text-muted);
    }

    .pal-bo-stats-field select {
        padding: 7px 30px 7px 12px;
        border-radius: 8px;
        border: 1px solid var(--surface-border);
        background: var(--surface-bg);
        color: var(--text);
        font: inherit;
        font-size: .86rem;
    }

.pal-bo-stats-arrow {
    color: var(--text-muted);
}

.pal-bo-stats-hint {
    font-size: .78rem;
    color: var(--text-muted);
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    border-radius: 999px;
    padding: .3rem .7rem;
}

.pal-bo-stats-mode-tabs {
    display: flex;
    gap: .35rem;
    margin-left: auto;
}

.pal-bo-stats-mode-tab {
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--surface-border);
    background: var(--surface-bg);
    color: var(--text-muted);
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}

    .pal-bo-stats-mode-tab.active {
        background: var(--pal-red);
        border-color: var(--pal-red);
        color: var(--pal-on-accent);
    }

.pal-bo-kpi-value-text {
    font-size: 1.15rem;
}

.pal-bo-kpi-value-sub {
    color: var(--text-muted);
    font-weight: 600;
    font-size: .8rem;
}

.pal-bo-stats-rank-row {
    display: grid;
    /* minmax(0, 1fr) : meme piege que .pal-bo-grid-kpi, la colonne centrale elargissait la page sur mobile */
    grid-template-columns: 2.4rem minmax(0, 1fr) 6.5rem;
    align-items: center;
    gap: .9rem;
    padding: .8rem 1.25rem;
    border-bottom: 1px solid var(--surface-border);
}

    .pal-bo-stats-rank-row:last-child {
        border-bottom: none;
    }

.pal-bo-stats-rank-num {
    font-family: var(--pal-mono-font);
    font-weight: 800;
    font-size: 1rem;
    color: var(--text-muted);
    text-align: center;
}

.pal-bo-stats-rank-row.top .pal-bo-stats-rank-num {
    color: var(--pal-red);
}

.pal-bo-stats-rank-top-line {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .4rem;
}

.pal-bo-stats-mode-chip {
    display: inline-flex;
    align-items: center;
    padding: .1rem .55rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
}

    .pal-bo-stats-mode-chip.live {
        background: var(--bo-danger-bg);
        color: var(--pal-red);
    }

    .pal-bo-stats-mode-chip.online {
        background: color-mix(in srgb, var(--agenda-online) 16%, transparent);
        color: var(--agenda-online);
    }

.pal-bo-stats-rank-name {
    font-weight: 800;
    font-size: .96rem;
}

.pal-bo-stats-weekday-chip {
    font-size: .72rem;
    color: var(--text-muted);
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    border-radius: 999px;
    padding: .06rem .55rem;
}

.pal-bo-stats-rank-badge {
    font-size: .66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .03em;
    padding: .08rem .5rem;
    border-radius: 5px;
}

    .pal-bo-stats-rank-badge.best {
        background: var(--pal-success-bg);
        color: var(--pal-success);
    }

    .pal-bo-stats-rank-badge.watch {
        background: var(--pal-warning-bg);
        color: var(--pal-warning);
    }

.pal-bo-stats-bar-track {
    position: relative;
    height: 9px;
    border-radius: 999px;
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    overflow: hidden;
    margin-bottom: .35rem;
}

.pal-bo-stats-bar-fill {
    position: absolute;
    inset: 0;
    border-radius: 999px;
}

    .pal-bo-stats-bar-fill.live {
        background: var(--pal-red);
    }

    .pal-bo-stats-bar-fill.online {
        background: var(--agenda-online);
    }

.pal-bo-stats-rank-figures {
    font-size: .78rem;
    color: var(--text-muted);
    display: flex;
    /* wrap : sur mobile les morceaux de la phrase passent a la ligne au lieu de s'empiler en
       3 colonnes etroites */
    flex-wrap: wrap;
    column-gap: 1rem;
}

    .pal-bo-stats-rank-figures b {
        color: var(--text);
        font-variant-numeric: tabular-nums;
    }

.pal-bo-stats-rank-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .3rem;
}

.pal-bo-stats-rank-part {
    font-size: 1.15rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.pal-bo-stats-spark {
    display: block;
    margin-top: .2rem;
}

/* ============================================================================
   Affiliations Winamax — badge de statut (fiche membre, page Suivi, dashboard)
   4 tonalites : ok (affilie) / pending (en cours) / warn (a traiter) / none (pas affilie).
   ============================================================================ */
.pal-affil-bo {
    --_c: var(--text-muted);
    --_bg: color-mix(in srgb, var(--surface-border) 45%, transparent);
}
.pal-affil-bo--ok { --_c: var(--pal-success); --_bg: var(--pal-success-bg); }
.pal-affil-bo--pending { --_c: var(--pal-info); --_bg: var(--pal-info-bg); }
.pal-affil-bo--warn { --_c: var(--pal-warning); --_bg: var(--pal-warning-bg); }

/* Encart statut de la fiche membre (onglet Affiliation) */
.pal-affil-statut {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: .7rem .9rem;
    border-radius: var(--pal-card-radius);
    border: 1px solid color-mix(in srgb, var(--_c) 35%, transparent);
    background-color: var(--_bg);
    margin-bottom: 1rem;
}
.pal-affil-statut-txt {
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--_c);
}
.pal-affil-statut-mode {
    font-size: .74rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

/* Pastille compacte (cellule de grille / dashboard) */
.pal-affil-pill {
    display: inline-block;
    padding: .12rem .55rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    color: var(--_c);
    background-color: var(--_bg);
    border: 1px solid color-mix(in srgb, var(--_c) 30%, transparent);
    white-space: nowrap;
}

/* « À rapprocher » › Réponse incohérente : réponse Winamax + ligne demandée + statut du membre */
.pal-affil-incoherente {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--pal-affil-incoherente-gap);
}

/* Encart Affiliations Winamax du tableau de bord — 6 tuiles cliquables par groupe de statut. */
.pal-affil-dash {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
    gap: .6rem;
}
.pal-affil-dash-item {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding: .7rem .8rem;
    border-radius: var(--pal-btn-radius);
    text-decoration: none;
    color: var(--_c, var(--text-muted));
    background-color: var(--_bg, color-mix(in srgb, var(--surface-border) 45%, transparent));
    border: 1px solid color-mix(in srgb, var(--_c, var(--text-muted)) 28%, transparent);
    transition: transform .12s ease;
}
.pal-affil-dash-item:hover { transform: translateY(-2px); }
.pal-affil-dash-item .n { font-size: 1.4rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.pal-affil-dash-item .l { font-size: .78rem; color: var(--text-muted); }

/* Onglet « À rapprocher » — groupes par catégorie + repli des lignes informatives. */
.pal-affil-rappr-groupe { margin-top: 1.75rem; }
.pal-affil-rappr-groupe:first-of-type { margin-top: .5rem; }
.pal-affil-rappr-groupe .pal-bo-fiche-timeline-title { margin-bottom: .25rem; }
.pal-affil-rappr-info { margin-top: 1.75rem; }
.pal-affil-rappr-info > summary { cursor: pointer; color: var(--text-muted); font-size: .84rem; }
.pal-affil-rappr-info > summary i { color: var(--pal-info); margin-right: .3rem; }

/* Bandeau « synchronisation en cours » (opération longue). */
.pal-affil-sync-en-cours .t {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
}
.pal-affil-sync-en-cours .t i { color: var(--pal-red); }
.pal-affil-spin { display: inline-block; animation: pal-affil-spin 1s linear infinite; }
@keyframes pal-affil-spin { to { transform: rotate(360deg); } }

/* Sections du rapport de synchro : « Retours Winamax lus » puis « Lignes à écrire ». Nettement
   détachées l'une de l'autre et du bloc d'infos au-dessus (deux sens de circulation distincts). */
.pal-affil-rapport-sec {
    margin-top: 1.6rem;
    padding-top: 1.1rem;
    border-top: 2px solid var(--surface-border);
}
.pal-affil-rapport-sec > h4 {
    margin: 0 0 .15rem;
    font-size: .95rem;
    display: flex;
    align-items: center;
    gap: .45rem;
}
.pal-affil-rapport-sec > h4 > i { color: var(--pal-info); }
.pal-affil-rapport-sec > .pal-bo-form-hint { margin: 0 0 .6rem; }

/* En-tête de colonne triable (tableaux « détail » et « Anomalies » du rapport de synchro).
   Repère visuel aligné sur les grilles QuickGrid de la page : chevrons neutres quand la
   colonne n'est pas le tri actif, flèche de direction accentuée sinon. */
.pal-affil-th-sort { cursor: pointer; user-select: none; white-space: nowrap; }
.pal-affil-th-sort:hover { color: var(--pal-info); }
.pal-affil-th-sort > i { font-size: .72rem; margin-left: .3rem; }
.pal-affil-th-sort > i.bi-chevron-expand { opacity: .45; }
.pal-affil-th-sort > i.bi-caret-up-fill,
.pal-affil-th-sort > i.bi-caret-down-fill { color: var(--pal-info); opacity: 1; }

/* Bloc « aperçu » du rapport de synchro : rien n'est encore enregistré, bouton Appliquer. */
.pal-affil-apercu {
    padding: .8rem 1rem;
    border-radius: var(--pal-card-radius);
    background-color: color-mix(in srgb, var(--pal-info) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--pal-info) 35%, transparent);
}
.pal-affil-apercu p { margin: 0 0 .6rem; font-size: .88rem; }
.pal-affil-apercu p i { color: var(--pal-info); margin-right: .3rem; }

/* Pseudo Winamax marqué privé (fiche adhérent › Affiliation) : masqué dans les tableaux du
   back-office liés au processus d'affiliation. La vraie valeur reste utilisée côté serveur. */
.pal-winamax-prive {
    display: inline-flex;
    flex-direction: column;
    line-height: 1.15;
}
.pal-winamax-prive-dots {
    letter-spacing: var(--pal-winamax-prive-dots-spacing);
    font-variant-numeric: tabular-nums;
}
.pal-winamax-prive-note {
    font-size: var(--pal-hint-font-size);
    color: var(--text-muted);
}

/* Champ d'édition du pseudo Winamax d'un membre privé (onglet Affiliation) : masqué par défaut,
   révélable via le bouton œil. */
.pal-winamax-input-wrap {
    display: inline-flex;
    align-items: center;
    gap: var(--pal-winamax-input-gap);
}
.pal-winamax-reveal-btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--text-muted);
    display: inline-flex;
}
.pal-winamax-reveal-btn:hover { color: var(--pal-info); }