/* BREVE VIVANTE — LE FIL (21/09/2026, refonte sur retour de Jocelyn : « la frise doit etre
   verticale, et doit marquer, au niveau du titre de la mise a jour, l heure et la date de
   ladite mise a jour, a la facon d un thread ou l actu la plus recente apparait en haut »).

   UN SEUL fil vertical antechronologique : une ligne continue a gauche, un noeud par entree,
   la date et l heure en tete de chaque entree a hauteur du noeud, la breve d origine en
   derniere entree. Plus d encadre « derniere mise a jour », plus de frise horizontale, plus
   d ombre portee autour de chaque entree (trop lourd empile) : la ligne, les noeuds et un
   filet portent la structure. Zero JS.

   Feuille STATIQUE, liee seulement par ActuBreve.astro sur une page vivante : la feuille
   hachee des breves de prod reste identique a l octet. Charte : creme du site, filets,
   Barlow Condensed en capitales pour les reperes, ocre pour l heure et l action, brun pour
   la date, sauge pour les noeuds anciens. */

.bv-maj-le strong { color: var(--brun); font-weight: 600; }

/* ── En-tete du suivi : etat, nombre de mises a jour, lien d evitement ── */
.bv-etat { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: 0 0 1.5rem;
  font-family: 'Barlow Condensed', system-ui, sans-serif; font-size: .95rem; color: var(--gris); }
.bv-etat strong { font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ocre); }
.bv-pastille { width: .62rem; height: .62rem; border-radius: 50%; background: var(--ocre); flex: none;
  box-shadow: 0 0 0 2px var(--creme), 0 0 0 3.5px var(--ocre); margin: 0 .3rem 0 .25rem; }
.bv-pastille--clos { background: var(--sauge); box-shadow: 0 0 0 2px var(--creme), 0 0 0 3.5px var(--sauge); }
.bv-evite { margin-left: auto; display: inline-flex; align-items: center; min-height: 24px;
  padding: 0 .1rem; color: var(--sapin); font-weight: 600; text-decoration: underline;
  text-underline-offset: .22em; }
.bv-evite:hover { color: var(--ocre); }

/* ── Le fil ── */
.bv { --bv-rail: .56rem; --bv-gouttiere: 2.15rem; margin: 0 0 2.2rem; min-width: 0; }
.bv .bv-fil-h { font-family: 'Barlow Condensed', system-ui, sans-serif; font-weight: 600;
  font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; color: var(--sauge);
  margin: 0 0 1rem; padding: 0; border: 0; }
.bv .bv-fil-h::before { width: 9px; height: 17px; transform: translateY(2px); }

.bv-fil { list-style: none; margin: 0; padding: 0; }
.bv-e { position: relative; margin: 0; padding: 0 0 1.75rem var(--bv-gouttiere); min-width: 0; }
.bv-e:last-child { padding-bottom: 0; }
/* la ligne continue : un segment par entree, donc aucune rupture entre deux entrees */
.bv-e::before { content: ''; position: absolute; left: calc(var(--bv-rail) - 1px); top: 0; bottom: 0;
  width: 2px; background: var(--filet); }
.bv-e:first-child::before { top: .82rem; }          /* le fil part du premier noeud */
/* le noeud, centre sur la ligne de date */
.bv-e::after { content: ''; position: absolute; left: var(--bv-rail); top: .82rem;
  width: .78rem; height: .78rem; box-sizing: border-box; border-radius: 50%;
  background: var(--creme); border: 2px solid var(--sauge); transform: translate(-50%, -50%); }
.bv-e--une::after { background: var(--ocre); border-color: var(--ocre);
  box-shadow: 0 0 0 2px var(--creme), 0 0 0 4px var(--ocre); }
.bv-e--origine::after { border-radius: 0; background: var(--brun); border-color: var(--brun);
  transform: translate(-50%, -50%) rotate(45deg); }

/* ── Une entree ── */
.bv-e-art { min-width: 0; scroll-margin-top: 1.2rem; padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--filet); }
.bv-e:last-child .bv-e-art { padding-bottom: 0; border-bottom: 0; }
.bv-e-art:target { outline: 2px solid var(--ocre); outline-offset: 6px; }

/* la date et l heure : l information structurante du fil, pas une metadonnee grise */
.bv .bv-e-quand { margin: 0 0 .35rem; font-family: 'Barlow Condensed', system-ui, sans-serif;
  font-size: 1.08rem; line-height: 1.55; }
.bv-e-jour { font-weight: 600; color: var(--brun); }
.bv-e-heure { font-weight: 600; color: var(--ocre); white-space: nowrap; }
.bv-e-badge { display: inline-block; margin-left: .55rem; padding: .05rem .5rem; vertical-align: .06em;
  background: var(--ocre); color: var(--papier); font-weight: 600; font-size: .76rem;
  line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.bv-e-badge--origine { background: var(--brun); }

.bv .bv-e-titre { font-family: 'Barlow Condensed', system-ui, sans-serif; font-weight: 600;
  font-size: 1.36rem; line-height: 1.22; letter-spacing: .01em; color: var(--encre);
  margin: 0 0 .55rem; padding: 0; border: 0; }
.bv .bv-e--une .bv-e-titre { font-size: 1.58rem; }
.bv .bv-e-titre--origine { font-size: 1.44rem; }
.bv .bv-e-rattrapage { margin: -.25rem 0 .65rem; font-family: 'Barlow Condensed', system-ui, sans-serif;
  font-size: .9rem; font-style: italic; color: var(--gris); }
.bv .bv-e-chapo { font-size: 1.06rem; line-height: 1.6; font-weight: 500; color: var(--encre);
  margin: 0 0 1rem; }
.bv-e-corps > p:last-child { margin-bottom: .7rem; }
.bv .bv-e-source { margin: 0; padding-top: .55rem; border-top: 1px dotted var(--filet);
  font-family: 'Barlow Condensed', system-ui, sans-serif; font-size: .9rem; line-height: 1.6;
  color: var(--gris); overflow-wrap: anywhere; }
.bv-e-source a { color: var(--sapin); }

@media (max-width: 560px) {
  .bv { --bv-rail: .42rem; --bv-gouttiere: 1.5rem; }
  .bv-evite { margin-left: 0; }
  .bv-e { padding-bottom: 1.5rem; }
  .bv-e-art { padding-bottom: 1.25rem; }
  .bv .bv-e-quand { font-size: 1.02rem; }
  .bv-e-badge { margin-left: .45rem; font-size: .72rem; }
  .bv .bv-e-titre { font-size: 1.24rem; }
  .bv .bv-e--une .bv-e-titre { font-size: 1.4rem; }
  .bv .bv-e-titre--origine { font-size: 1.32rem; }
}
