/* Console — vue structure (V8-13) : arbre par branches, marquage des états, recherche. */

/* Liste imbriquée : indentation + fil de lignée */
.structure-list {
    list-style: none;
    margin: 0;
    padding-left: 1rem;
    border-left: 2px solid var(--bs-border-color);
}

.structure-list-root {
    padding-left: 0;
    border-left: 0;
}

.structure-node-row {
    padding: 0.15rem 0;
}

/* Fiche relais : nœud gris « hors app » */
.structure-node-relay > .structure-node-row .structure-node-name {
    color: var(--bs-secondary-color);
    font-style: italic;
}

/* Importée non activée : identité en demi-teinte */
.structure-node-imported > .structure-node-row .structure-node-name {
    color: var(--bs-secondary-color);
}

/* Anonymisée (« ancienne étincelle ») : badge violet (jeton fonctionnel du thème) */
.structure-badge-anonymized {
    background-color: var(--brand-violet);
    color: var(--brand-on-dark);
}

/* Recherche : nœuds masqués / correspondances */
.structure-hidden {
    display: none;
}

/* Sélecteurs par enfant direct : seul le nom du nœud correspondant est surligné,
   jamais ceux de sa descendance (qui vivent sous > ul / > .accordion-collapse) */
.structure-match > .structure-node-row .structure-node-name,
.structure-match > .accordion-header .structure-node-name,
.structure-match > div > .structure-node-name {
    font-weight: 700;
    background-color: var(--bs-warning-bg-subtle);
}

/* ------------------------------------------------------------------ */
/* Coquille console (squelette UI, V8-1T-01) — layout, bloc latéral,   */
/* barre haute, fraîcheur des données (§3.5 du socle P0)               */
/* ------------------------------------------------------------------ */
.console-layout { display: grid; grid-template-columns: 236px 1fr; min-height: 100vh; background: var(--brand-bg); }
.console-sidebar { background: linear-gradient(180deg, var(--brand-secondary), var(--brand-secondary-2)); color: var(--brand-on-dark); padding: 1rem .8rem; }
.console-sidebar .brand { font-weight: 800; letter-spacing: .18em; font-size: .78rem; padding: .3rem .6rem .9rem; }
.console-sidebar .brand b { color: var(--brand-accent-light); }
.console-sidebar .brand small { display: block; letter-spacing: 0; opacity: .7; font-weight: 400; }
.console-sidebar .group { font-size: .56rem; letter-spacing: .2em; text-transform: uppercase; color: var(--brand-on-dark-muted); padding: .9rem .6rem .3rem; }
.console-sidebar .nav-link { display: flex; align-items: center; gap: .55rem; padding: .48rem .65rem; border-radius: 11px; color: var(--brand-on-dark-muted); font-size: .78rem; font-weight: 600; }
.console-sidebar .nav-link.active { background: var(--brand-accent); color: var(--brand-secondary); font-weight: 800; }
.console-sidebar .nav-link .badge { margin-left: auto; }
.console-sidebar .foot { margin-top: 1.2rem; padding: .9rem .65rem 0; font-size: .62rem; color: var(--brand-on-dark-muted); border-top: 1px solid rgba(255, 255, 255, .1); }
/* Le retour à l'espace membre : un bouton visible, pas une ligne grise collée à la date (retour François 13/09) */
.console-sidebar .back-link { display: flex; align-items: center; justify-content: center; gap: .45rem; padding: .65rem 1rem; border-radius: 11px; border: 1px solid rgba(255, 255, 255, .28); color: var(--brand-on-dark); font-size: .76rem; font-weight: 700; text-decoration: none; }
.console-sidebar .back-link + .back-link { margin-top: .5rem; }
.console-sidebar .back-link:hover, .console-sidebar .back-link:focus-visible { background: rgba(255, 255, 255, .1); color: var(--brand-accent-light); border-color: var(--brand-accent-light); }
.console-sidebar .foot-note { margin-top: .9rem; padding: 0 .1rem; }
.console-main { padding: 0 1.4rem 2rem; min-width: 0; }
/* Les cartes empilées respirent, comme dans l'espace membre (.app-body .card) — retour François 13/09,
   recette #544 : la page d'une coureuse avait ses trois cartes collées. */
.console-main .card { margin-bottom: .9rem; }
.console-topbar { display: flex; align-items: center; justify-content: space-between; padding: .7rem 0; margin-bottom: .6rem; border-bottom: 1px solid var(--brand-line); font-size: .76rem; }
.console-topbar .who { display: flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--brand-secondary); }
.console-head h1 { font-size: 1.75rem; margin: .4rem 0 .1rem; }
.console-head p { font-size: .78rem; color: var(--brand-muted); margin: 0 0 .9rem; }
.console-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin-bottom: 1rem; }
.console-section-title { font-family: var(--brand-font-display); font-size: 1.2rem; color: var(--brand-secondary); margin: 1.1rem 0 .5rem; padding-bottom: .25rem; border-bottom: 2px solid var(--brand-accent); display: inline-block; }

/* Bandeau de fraîcheur (C8-R01) : « export du {date} » / import ancien */
.freshness { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: var(--brand-radius-pill); background: rgba(var(--brand-secondary-rgb), .07); color: var(--brand-secondary); font-size: .66rem; font-weight: 700; }
.freshness.is-stale { background: var(--brand-warning-soft); color: var(--brand-warning-deep); }
.freshness-banner { display: flex; gap: .7rem; align-items: center; padding: .7rem .9rem; border-radius: 14px; border: 1px solid var(--brand-warning); background: var(--brand-warning-soft); font-size: .76rem; color: var(--brand-warning-deep); margin-bottom: .9rem; }

/* Étiquette « suggestion indicative » (C5-R17, C8-R06) — jamais supprimable */
.indicative { display: block; font-size: .64rem; font-style: italic; color: var(--brand-muted); }

/* Table de lecture console (rendements constatés, comparatifs) */
.compare-table { font-size: .78rem; }
.compare-table th { font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: var(--brand-muted); font-weight: 800; }
.compare-table td, .compare-table th { padding: .45rem .5rem; border-bottom: 1px dashed var(--brand-line-soft); }
/* Un chiffre ne se coupe jamais sur deux lignes (« +1 760 » sur téléphone — repasse #551 du 15/09) */
.compare-table td:not(:first-child) { white-space: nowrap; }

/* Mobile < 992 px : le bloc latéral devient un tiroir (offcanvas gauche, P0-03) */
@media (max-width: 991.98px) {
    .console-layout { grid-template-columns: 1fr; }
    .console-layout > .console-sidebar { display: none; }
    .console-main { padding: 0 1rem 2rem; }
    /* Les 4 tuiles KPI en carré 2 × 2 (retour recette 04/09 : 4 tuiles sur 390 px, illisible) */
    .console-kpis { grid-template-columns: repeat(2, 1fr); }
}

/* Téléphone < 576 px (retour François 15/09, recette #547 : le 2 × 2 reste illisible — textes à 9 px,
   tuiles de hauteurs inégales) : une tuile par ligne, le chiffre à gauche, puis une information par
   ligne à droite (libellé, précision, évolution), en corps lisible. */
@media (max-width: 575.98px) {
    .console-kpis { grid-template-columns: 1fr; gap: .6rem; }
    /* Deux cellules centrées l'une sur l'autre (le chiffre, le bloc de texte) : la grille à trois lignes
       répartissait la hauteur du chiffre sur des lignes vides et décalait le texte vers le haut (retour Axel 17/09) */
    .console-kpis .kpi-tile { display: flex; align-items: center; gap: .9rem; padding: .8rem 1rem; }
    .console-kpis .kpi-tile .kpi-value { flex: 0 0 auto; font-size: 1.9rem; min-width: 4.2rem; text-align: right; }
    .console-kpis .kpi-tile .kpi-text { min-width: 0; }
    .console-kpis .kpi-tile .kpi-label { font-size: .9rem; margin-top: 0; line-height: 1.4; }
    .console-kpis .kpi-tile .kpi-date { font-size: .8rem; line-height: 1.5; }
    .console-kpis .kpi-tile .kpi-trend { font-size: .8rem; margin-top: 0; line-height: 1.5; }
    .console-kpis .kpi-tile .kpi-trend .delta { font-size: .8rem; }
    .console-kpis .kpi-tile .kpi-help { font-size: .95rem; }

    /* Tâche console (retour François 15/09) : le texte prend toute la largeur, le bouton passe
       en bas de la tâche sur sa propre ligne, pleine largeur ; corps lisible, de l'air. */
    .task-row { flex-wrap: wrap; padding: .9rem 0; row-gap: .7rem; }
    .task-row .t-text { font-size: .9rem; line-height: 1.5; }
    .task-row .t-text b { margin-bottom: .25rem; }
    .task-row .t-text small { font-size: .82rem; line-height: 1.55; display: block; }
    .task-row > .text-end { flex: 1 0 100%; text-align: left !important; }
    .task-row .t-due { margin-bottom: .6rem; }
    .task-row .t-due .badge { font-size: .82rem; }
    .task-row > .text-end .btn { display: block; width: 100%; padding: .55rem 1rem; }
}

/* Liste console qui s'empile (« Activer l'équipe » P1-15, retour recette 04/09) : en bureau un tableau ;
   sous 992 px chaque ligne devient une carte — même balisage, les cellules se placent par classe :
   .stack-lead (case à cocher, à gauche sur toute la hauteur) · .stack-title · .stack-line (une ligne
   secondaire) · .stack-action (bouton, à droite sur toute la hauteur). L'en-tête ne garde que sa
   première cellule (la case « tout sélectionner » et son libellé mobile), posée sur le fond de la carte
   comme les lignes empilées — sans le fond de page que Bootstrap donne aux cellules —, un libellé lisible
   et de l'air au-dessus pour ne pas toucher « Envoyer la sélection » à sa place (retour Axel 17/09). */
@media (max-width: 991.98px) {
    .table-stack, .table-stack thead, .table-stack thead tr, .table-stack tbody { display: block; }
    .table-stack thead th { display: none; }
    .table-stack thead th:first-child { display: flex; align-items: center; gap: .55rem; padding: 1.1rem .2rem .75rem; border: 0; box-shadow: none; background: transparent; font-size: .88rem; font-weight: 700; }
    .table-stack tbody tr { display: grid; grid-template-columns: auto 1fr auto; column-gap: .7rem; row-gap: .12rem; align-items: center; padding: .7rem .8rem; margin-bottom: .55rem; border: 1px solid var(--brand-line); border-radius: 14px; background: var(--brand-surface); }
    .table-stack tbody td { display: block; grid-column: 2; min-width: 0; padding: 0; border: 0; box-shadow: none; background: transparent; overflow-wrap: anywhere; }
    .table-stack tbody td.stack-lead { grid-column: 1; grid-row: 1 / span 4; }
    .table-stack tbody td.stack-action { grid-column: 3; grid-row: 1 / span 4; }
    .table-stack tbody td.stack-title { font-size: .9rem; }
    .table-stack tbody td.stack-line { font-size: .74rem; color: var(--brand-muted); }
}
/* Largeur par le jeton Bootstrap : la règle .offcanvas.offcanvas-start l'emporte sur une largeur posée à la main
   (le tiroir prenait tout l'écran sur 400 px, plus de fond à toucher pour le fermer — recette 13/09) */
.console-drawer { --bs-offcanvas-width: 280px; padding: 0; border: 0; }
/* La croix du tiroir : en haut à droite, zone de touche généreuse (retour François 13/09) */
.console-drawer .console-drawer-close { position: absolute; top: .55rem; right: .55rem; z-index: 2; padding: .75rem; opacity: .85; }
.console-drawer .console-drawer-close:hover, .console-drawer .console-drawer-close:focus-visible { opacity: 1; }
.console-drawer .console-sidebar { height: 100%; overflow-y: auto; }

/* ------------------------------------------------------------------ */
/* Console V0 (P7-01 → P7-08 — V8-1T-11) : les 3 listes du métier,     */
/* onglets, quota, rapport hebdo, journal d'audit, tâches              */
/* ------------------------------------------------------------------ */

/* Les 3 listes du métier (components/care_list — jamais plus de 3 par liste) */
.care-list { margin-bottom: .9rem; }
.care-list .care-title { display: flex; align-items: center; gap: .4rem; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .25rem; }
.care-list.welcome .care-title { color: var(--brand-success); }
.care-list.support .care-title { color: var(--brand-accent-deep); }
.care-list.praise .care-title { color: var(--brand-primary); }
.care-list .care-more { font-size: .68rem; color: var(--brand-muted); margin-top: .2rem; }
.care-list .row-item .badge { white-space: nowrap; }

/* Onglets de l'accueil console (Accompagner · Constellation · Parole & croissance) */
.console-tabs { display: flex; gap: .3rem; border-bottom: 1px solid var(--brand-line); margin-bottom: 1rem; }
.console-tabs a { padding: .5rem .8rem; font-size: .8rem; font-weight: 700; color: var(--brand-muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.console-tabs a.active { color: var(--brand-secondary); border-bottom-color: var(--brand-accent); }

/* Quota du Mot doux (plafond 5 / j — la rareté fait la valeur) */
.quota { display: inline-flex; align-items: center; gap: .3rem; font-size: .7rem; color: var(--brand-muted); }
.quota i { width: 9px; height: 9px; border-radius: 50%; background: var(--brand-line); display: inline-block; }
.quota i.used { background: var(--brand-accent); }

/* Rapport hebdo (P7-05) : la feuille retouchable + grille de chiffres datés */
.report-sheet { background: var(--brand-surface); border: 1px solid var(--brand-line); border-radius: 12px; padding: 1.2rem 1.4rem; font-size: .82rem; line-height: 1.6; box-shadow: var(--brand-shadow-card); }
.report-sheet .rs-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; border-bottom: 1px solid var(--brand-line-soft); padding-bottom: .5rem; margin-bottom: .7rem; }
.report-sheet .rs-head b { font-family: var(--brand-font-display); font-size: 1.15rem; color: var(--brand-secondary); }
.report-sheet .rs-head span { font-size: .68rem; color: var(--brand-muted); }
.report-sheet h4 { font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--brand-secondary); margin: 1rem 0 .35rem; }
.report-sheet ul { margin: 0; padding-left: 1.1rem; }
/* Les blocs de la feuille à l'écran : une information par ligne, un filet entre deux (retour François 15/09, recette #551) */
.report-sheet .rs-lines { list-style: none; padding: 0; margin: 0; font-size: .88rem; }
.report-sheet .rs-lines li { padding: .45rem 0; border-bottom: 1px dashed var(--brand-line-soft); }
.report-sheet .rs-lines li:last-child { border-bottom: 0; }
.report-sheet .rs-lines b { color: var(--brand-secondary); }
.report-sheet .rs-lines .rs-sub { display: block; font-size: .78rem; color: var(--brand-muted); margin-top: .1rem; }
.report-sheet .rs-lines .rs-sub .rs-link { margin-left: 0; }
.report-sheet .rs-sign { margin-top: .8rem; font-style: italic; color: var(--brand-muted); font-size: .74rem; }
/* Lien direct vers les personnes concernées, à l'écran seulement — le texte copié reste sans prénom (retour François 13/09) */
.report-sheet .rs-link { display: inline-block; margin-left: .35rem; font-weight: 700; color: var(--brand-accent-deep); text-decoration: none; }
.report-sheet .rs-link:hover, .report-sheet .rs-link:focus-visible { text-decoration: underline; }
.report-sheet[contenteditable] { outline: 2px dashed color-mix(in srgb, var(--brand-accent) 45%, transparent); outline-offset: 4px; }
.report-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; margin: .5rem 0; }
.report-grid .rg { background: var(--brand-surface-soft); border-radius: 10px; padding: .45rem .55rem; }
.report-grid .rg b { display: block; font-size: 1.1rem; color: var(--brand-secondary); }
.report-grid .rg small { font-size: .62rem; color: var(--brand-muted); }

/* Journal d'audit (P7-06) — métadonnées seulement, jamais un contenu */
.audit-table { font-size: .76rem; }
.audit-table th { font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: var(--brand-muted); font-weight: 800; border-bottom: 1px solid var(--brand-line); }
.audit-table td { border-bottom: 1px dashed var(--brand-line-soft); vertical-align: top; padding: .45rem .5rem; }
.audit-table code { font-size: .68rem; color: var(--brand-primary); }
.audit-kind { font-size: .58rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: .1rem .45rem; border-radius: var(--brand-radius-pill); background: rgba(var(--brand-secondary-rgb), .08); color: var(--brand-secondary); white-space: nowrap; }

/* Tâches console (components/task_row — un fait daté, jamais de rouge punitif) */
.task-row { display: flex; align-items: flex-start; gap: .7rem; padding: .65rem 0; border-bottom: 1px dashed var(--brand-line-soft); }
.task-row:last-child { border-bottom: 0; }
.task-row .t-ico { flex: 0 0 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: var(--brand-surface-soft); font-size: 1rem; }
.task-row .t-text { flex: 1; min-width: 0; font-size: .8rem; }
.task-row .t-text b { display: block; color: var(--brand-secondary); }
.task-row .t-text small { color: var(--brand-muted); font-size: .68rem; }
/* L'échéance : une pastille « ⏳ À faire dès que possible », jamais un texte nu perdu au-dessus du bouton (retour François 15/09). */
.task-row .t-due { margin-bottom: .45rem; }
.task-row .t-due .badge { font-size: .74rem; font-weight: 600; padding: .35em .7em; }
.task-row.is-due .t-ico { background: color-mix(in srgb, var(--brand-accent) 22%, transparent); }
.task-row.is-done { opacity: .6; }
.task-row.is-done .t-text b { text-decoration: line-through; }

/* Surlignage d'un nœud trouvé dans un écran statique du catalogue (le vrai écran
   utilise .structure-match posé par structure.js) */
.structure-node .structure-node-name { font-weight: 700; color: var(--brand-secondary); font-size: .8rem; }
.structure-node.is-hit > div .structure-node-name { background: color-mix(in srgb, var(--brand-accent) 30%, transparent); border-radius: 4px; padding: 0 .2rem; }

/* Rendements constatés (P8-04, V8-37) — mise en page « une information par ligne » (retour François
   15/09, recette #547 : le tableau à 5 colonnes était illisible sur téléphone). Une carte par geste,
   l'historique en entrées de quatre lignes ; en bureau les cartes se rangent sur deux colonnes. */
.yield-title { font-weight: 700; font-size: 1rem; color: var(--brand-secondary); margin-bottom: .35rem; }
.yield-figure { font-family: var(--brand-font-display); font-size: 1.9rem; line-height: 1.1; color: var(--brand-secondary); margin-bottom: .4rem; }
.yield-line { font-size: .92rem; line-height: 1.6; color: var(--brand-text); }
.yield-source { font-size: .86rem; line-height: 1.55; color: var(--brand-muted); margin-top: .5rem; }
.yield-link { display: inline-block; margin-top: .6rem; font-size: .9rem; }
.yield-list { display: grid; grid-template-columns: 1fr; gap: .8rem; }
.yield-card .card-body { padding: 1rem 1.1rem; }
.yield-notes { font-size: .86rem; line-height: 1.6; color: var(--brand-muted); margin: 1rem 0 .5rem; display: grid; gap: .3rem; }
.yield-history-form .form-label { font-weight: 700; margin-bottom: .35rem; }
.yield-entry { padding: .8rem 0; border-bottom: 1px dashed var(--brand-line-soft); }
.yield-entry:last-child { border-bottom: 0; padding-bottom: 0; }
.yield-entry.is-current { background: var(--brand-surface-soft); border-radius: 10px; padding: .8rem .9rem; border-bottom: 0; margin-bottom: .4rem; }
.yield-when { font-size: .84rem; line-height: 1.5; color: var(--brand-muted); margin-bottom: .25rem; }
.yield-entry.is-current .yield-when { color: var(--brand-secondary); font-weight: 700; }
@media (min-width: 768px) {
    .yield-list { grid-template-columns: repeat(2, 1fr); }
    .yield-conversion .btn { width: auto !important; min-width: 16rem; }
}

/* Réglages du calculateur par rang (P8-05) — un bloc par rang, deux champs nommés (retour François 15/09 :
   le tableau à trois colonnes ne passait pas sur téléphone) ; en bureau, deux blocs par ligne. */
.rank-setting-help { display: grid; gap: .35rem; font-size: .88rem; line-height: 1.55; color: var(--brand-muted); margin-bottom: 1rem; }
.rank-setting-list { display: grid; grid-template-columns: 1fr; gap: .7rem; }
.rank-setting { border: 1px solid var(--brand-line); border-radius: 12px; padding: .8rem .9rem; background: var(--brand-surface); }
.rank-setting-name { font-weight: 700; font-size: 1rem; color: var(--brand-secondary); margin-bottom: .5rem; }
.rank-setting-field { display: grid; gap: .25rem; margin: 0; font-size: .86rem; color: var(--brand-text); }
.rank-setting-field + .rank-setting-field { margin-top: .6rem; }
.rank-setting-field .form-control { max-width: 5.5rem; text-align: right; }
@media (min-width: 768px) {
    .rank-setting-list { grid-template-columns: repeat(2, 1fr); }
}
/* La page entière des réglages du calculateur : corps lisible, une information par ligne. */
.calc-settings .card { margin-bottom: .9rem; }
.calc-settings-switch { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.calc-settings-switch .form-switch .form-check-input { width: 2.6em; height: 1.4em; margin-top: .1em; }
.calc-settings-title { font-weight: 700; font-size: 1rem; color: var(--brand-secondary); }
.calc-settings-help { font-size: .9rem; line-height: 1.6; color: var(--brand-muted); }
.calc-settings-help + .calc-settings-help { margin-top: .15rem; }
.calc-settings textarea.form-control { font-size: .95rem; line-height: 1.5; }
.calc-settings-preview { background: var(--brand-surface-soft); border-radius: 10px; padding: .6rem .8rem; margin-top: .3rem; }
.calc-settings-preview .indicative { font-size: .86rem; }
.calc-settings-submit { margin: 1.2rem 0 1.4rem; }
.calc-settings-submit .btn { padding: .75rem 1rem; font-size: 1rem; }
.calc-settings-item { padding: .6rem 0; border-bottom: 1px dashed var(--brand-line-soft); }
.calc-settings-item:last-child { border-bottom: 0; padding-bottom: 0; }