/**
 * L'HISTORIQUE EN PANNEAU LATÉRAL — css/admin-historique.css (2026-10-21)
 * ---------------------------------------------------------------------------
 * Le CONTENU de l'historique. Le panneau lui-même (cadre, en-tête, boutons) est celui de toute l'administration :
 * css/admin-panneau.css (moteur commun, étape B). Chargée aussi par admin/composer.php : chaque valeur porte son repli.
 */
.adm-panneau--historique .adm-panneau__corps .admin-card { padding: var(--ad-space-3, 12px); margin-bottom: var(--ad-space-3, 12px); box-shadow: none; }
.hist-tete { margin-bottom: var(--ad-space-3, 12px); }
.hist-titre { margin: 0 0 var(--ad-space-1, 4px); font-size: var(--ad-fs-md, 1rem); font-weight: 600; }
.hist-liens { display: flex; flex-wrap: wrap; gap: var(--ad-space-1, 4px) var(--ad-space-4, 16px); margin: 0; font-size: var(--ad-fs-sm, 13px); }
.hist-liste { list-style: none; margin: 0; padding: 0; }
.hist-version { padding: var(--ad-space-3, 12px) 0; border-top: 1px solid var(--ad-border, #dfe3ea); }
.hist-version:first-child { border-top: 0; }
.hist-version p { margin: 0 0 4px; }
.hist-version__quand { font-weight: 600; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }
.hist-version__qui { font-weight: 400; color: var(--ad-text-mute, #6b7280); }
.hist-version__geste { color: var(--ad-text, #1f2430); }
.hist-version__resume { color: var(--ad-text-mute, #6b7280); font-size: var(--ad-fs-sm, 13px); }
.hist-version .inline-form { margin-top: var(--ad-space-1, 4px); }
.hist-sujet { margin: 0 0 var(--ad-space-1, 4px); color: var(--ad-text-mute, #6b7280); font-size: var(--ad-fs-sm, 13px); }

/* Les deux vues du panneau — les versions de ce qu'on regarde, et les contenus supprimés — sont deux onglets. */
.hist-onglets { display: flex; gap: var(--ad-space-1, 4px); border-bottom: 1px solid var(--ad-border, #dfe3ea); margin: 0 0 var(--ad-space-3, 12px); }
.hist-onglets a {
    padding: 7px var(--ad-space-3, 12px); margin-bottom: -1px;
    border-bottom: 2px solid transparent;
    color: var(--ad-text-mute, #6b7280); font-size: var(--ad-fs-sm, 13px); font-weight: 600; text-decoration: none;
}
.hist-onglets a:hover { color: var(--ad-text, #1f2430); text-decoration: none; }
.hist-onglets a.is-active { color: var(--ad-accent, #ad5c25); border-bottom-color: var(--ad-accent, #ad5c25); }
.hist-liens { margin: var(--ad-space-4, 16px) 0 0; }
.hist-version--supprime .hist-version__geste { display: flex; align-items: center; gap: 6px; color: var(--ad-danger, #b42318); }
.hist-version--supprime .hist-version__geste .lt-icon { flex: 0 0 auto; }

/* LES ÉTAPES (2026-10-21) : un journal de modifications, la plus récente en haut. Un clic choisit un moment ;
   les étapes au-dessus de celle qu'on a choisie sont ce qu'on défait, elles se grisent (js/admin-historique.js). */
.hist-etapes { list-style: none; margin: 0; padding: 0; }
.hist-etape { border-top: 1px solid var(--ad-border, #dfe3ea); }
.hist-etape:first-child { border-top: 0; }
.hist-etape__corps {
    display: block; width: 100%; text-align: left;
    padding: var(--ad-space-3, 12px) var(--ad-space-2, 8px);
    background: none; border: 0; border-left: 3px solid transparent;
    font: inherit; color: var(--ad-text, #1f2430); cursor: pointer;
}
.hist-etape__corps:hover { background: var(--ad-bg-sunk, #f4f5f7); }
.hist-etape__titre { display: block; font-weight: 600; }
.hist-etape__detail { font-weight: 400; color: var(--ad-text-mute, #6b7280); }
.hist-etape__meta { display: block; margin-top: 2px; font-size: var(--ad-fs-xs, 12px); color: var(--ad-text-mute, #6b7280); }
.hist-etape__qui { margin-left: 8px; }
.hist-etape.is-choisie .hist-etape__corps { border-left-color: var(--ad-accent, #ad5c25); background: var(--ad-bg-sunk, #f4f5f7); }
.hist-etape.is-annulee .hist-etape__corps { opacity: .45; text-decoration: line-through; }
.hist-etape--supprime .hist-etape__titre { color: var(--ad-danger, #b42318); display: flex; align-items: center; gap: 6px; }
.hist-confirme { position: sticky; top: 0; z-index: 1; margin: 0 0 var(--ad-space-2, 8px); padding: var(--ad-space-2, 8px) 0; background: var(--ad-bg, #fff); }
.hist-confirme[hidden] { display: none; }
.hist-confirme { display: flex; gap: var(--ad-space-2, 8px); align-items: center; }

/* LES PASTILLES DE ZONE (Autour des pages, 2026-10-22) : le résumé de chaque zone et le filtre du fil — le même
   dessin que les filtres des listes des Galeries (.gal-dash__filtre). Une zone sans version est éteinte. */
.hist-zones { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 var(--ad-space-3, 12px); }
.hist-zone {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 10px; border: 1px solid var(--ad-border, #dfe3ea); border-radius: 999px;
    background: var(--ad-bg, #fff); color: var(--ad-text-mute, #5b6472);
    font: inherit; font-size: var(--ad-fs-xs, .78rem); font-weight: 600; cursor: pointer;
}
.hist-zone span { padding: 0 6px; border-radius: 999px; background: var(--ad-bg-alt, #f3f5f8); font-variant-numeric: tabular-nums; }
.hist-zone:hover { border-color: var(--ad-accent, #4a7a96); color: var(--ad-text, #1d2430); }
.hist-zone:focus-visible { outline: 2px solid var(--ad-accent, #4a7a96); outline-offset: 2px; }
.hist-zone.is-active { background: var(--ad-accent, #4a7a96); border-color: var(--ad-accent, #4a7a96); color: #fff; }
.hist-zone.is-active span { background: color-mix(in srgb, #fff 22%, transparent); color: #fff; }
.hist-zone.is-vide:not(.is-active) { opacity: .55; }
.hist-etape[hidden] { display: none; }

/* La flèche de zone : dans la pastille, devant le nom ; sur une ligne du fil, seule, dans un rond teinté. */
.hist-zone .lt-icon { width: 14px; height: 14px; flex: none; }
.hist-etape__zone {
    display: inline-grid; place-items: center; flex: none;
    width: 22px; height: 22px; margin-right: 8px; vertical-align: -6px;
    border-radius: 50%; background: var(--ad-accent-sf, #e7f0f5); color: var(--ad-accent, #4a7a96);
}
.hist-etape__zone .lt-icon { width: 13px; height: 13px; }
.hist-etape.is-annulee .hist-etape__zone { opacity: .6; }

/* TOUTE LA PAGE (2026-10-28) : la liste « Section » qui filtre le fil, et le nom de la section en tête de chaque étape. */
.hist-filtre {
    display: flex; align-items: center; gap: 8px; margin: 0 0 var(--ad-space-3, 12px);
    font-size: var(--ad-fs-xs, .78rem); font-weight: 600; color: var(--ad-text-mute, #5b6472);
}
.hist-filtre select {
    flex: 1 1 auto; min-width: 0; padding: 5px 8px;
    border: 1px solid var(--ad-border, #dfe3ea); border-radius: 6px;
    background: var(--ad-bg, #fff); color: var(--ad-text, #1d2430); font: inherit; font-weight: 500;
}
.hist-etape__section {
    display: inline-block; max-width: 12em; margin-right: 8px; padding: 1px 8px; vertical-align: 1px;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
    border-radius: 999px; background: var(--ad-accent-sf, #e7f0f5); color: var(--ad-accent, #4a7a96);
    font-size: var(--ad-fs-xs, .78rem); font-weight: 600;
}
.hist-etape.is-annulee .hist-etape__section { opacity: .6; }