/* =====================================================================
   producteurs-dignois.com
   Repertoire du terroir dignois. Habillage « papier lilas cendre ».
   Vocabulaire de classes : le marche couvert (enseigne, allees, etal, banc,
   nappe, rayon, fiche, ardoise, tablee, borne), prefixe .rbn-
   Polices systeme uniquement, aucune requete externe.
   ===================================================================== */

:root {

  /* ---------- 1. PALETTE ---------- */
  --fond:          #e8e3ef;   /* papier lilas cendre */
  --fond-creux:    #dbd4e8;   /* encarts, colophon, encoches */
  --fond-relief:   #f3f0f8;   /* survol, lignes paires */
  --encre:         #221d33;   /* texte courant */
  --encre-pale:    #524b66;   /* mentions, reperes, notes */
  --accent:        #4b3a7a;   /* violet d'encre : titres, ardoises, chiffres */
  --accent-vif:    #5a4590;   /* survol */
  --signal:        #6a5410;   /* bronze : liens et passerelles */
  --filet:         #c9c2d8;
  --filet-fort:    #a79ec0;
  --selection:     #ded0f0;

  /* ---------- 2. POLICES ---------- */
  --plume:    Cambria, Constantia, "Bitstream Vera Serif", "Noto Serif", "Droid Serif", Georgia, serif;
  --pancarte: "Trebuchet MS", "Fira Sans", "Noto Sans", "Segoe UI", Tahoma, "DejaVu Sans", sans-serif;
  --tampon:   "Lucida Console", Monaco, "Nimbus Mono PS", "Liberation Mono", "Courier New", monospace;

  /* ---------- 3. RYTHME ---------- */
  --laize:         38.5rem;   /* colonne de lecture, plus large que le squelette */
  --banc-largeur:  15rem;     /* colonne de reperes */
  --travee:        68rem;     /* largeur maximale de page */
  --allee:         3.25rem;   /* ecart entre colonnes */
  --interligne:    1.62;      /* aere : ce n'est pas un dictionnaire technique */
  --pas:           1.35rem;
  --rayon:         0;
  --graisse-titre: 700;

  /* ---------- 4. TAILLES ---------- */
  --t-base:        1.055rem;
  --t-petit:       0.885rem;
  --t-menu:        0.75rem;
  --t-h1:          clamp(1.85rem, 1.2rem + 2.4vw, 2.85rem);
  --t-h2:          clamp(1.24rem, 1.05rem + 0.75vw, 1.55rem);
  --t-h3:          1.08rem;
}

/* =====================================================================
   BASE
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

body {
  margin: 0;
  font-synthesis-weight: none;
  background: var(--fond);
  color: var(--encre);
  font-family: var(--plume);
  font-size: var(--t-base);
  line-height: var(--interligne);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}

::selection { background: var(--selection); color: var(--encre); }

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: var(--signal); text-underline-offset: 0.14em; text-decoration-thickness: from-font; }
a:hover { color: var(--accent-vif); }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

h1, h2, h3, h4 {
  font-family: var(--pancarte);
  font-weight: var(--graisse-titre);
  line-height: 1.2;
  margin: 0;
  color: var(--encre);
}

p, ul, ol, dl, table, figure, blockquote { margin: 0; }

/* =====================================================================
   OSSATURE
   ===================================================================== */

.rbn-passe {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--encre);
  color: var(--fond);
  padding: 0.6rem 1rem;
  font-family: var(--pancarte);
  z-index: 50;
}
.rbn-passe:focus {
  left: 0.5rem;
  top: 0.5rem;
  position: fixed;
}

.rbn-enceinte {
  width: 100%;
  max-width: var(--travee);
  margin: 0 auto;
  padding: 0 1.15rem;
}

/* =====================================================================
   FRONTISPICE (entete)
   ===================================================================== */

.rbn-enseigne {
  border-bottom: 3px double var(--encre);
  background: var(--fond-relief);
}

.rbn-enseigne__haut {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
  padding: 1.1rem 0 0.75rem;
}

.rbn-marque { display: block; text-decoration: none; color: inherit; }
.rbn-marque:hover { color: var(--accent); }

.rbn-marque__nom {
  font-family: var(--pancarte);
  font-size: clamp(1.15rem, 1rem + 0.9vw, 1.6rem);
  font-weight: 700;
  letter-spacing: 0.01em;
  display: block;
}

.rbn-marque__ligne {
  display: block;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--encre-pale);
  margin-top: 0.2rem;
}

.rbn-millesime {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  color: var(--encre-pale);
  letter-spacing: 0.04em;
  text-align: right;
}
.rbn-millesime span { display: block; }
@media (max-width: 45.99em) { .rbn-millesime { text-align: left; } }

.rbn-allees {
  border-top: 1px solid var(--filet);
  padding: 0.4rem 0 0.55rem;
}
.rbn-allees ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.4rem;
}
.rbn-allees a {
  font-family: var(--pancarte);
  font-size: var(--t-petit);
  font-weight: 600;
  letter-spacing: 0.015em;
  color: var(--encre);
  text-decoration: none;
  padding: 0.24rem 0.55rem;
  display: inline-block;
  border: 1px solid transparent;
}
.rbn-allees a:hover,
.rbn-allees a[aria-current="page"] {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--fond-relief);
}

/* =====================================================================
   FIL (chemin de lecture)
   ===================================================================== */

.rbn-trace {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.05em;
  color: var(--encre-pale);
  padding: 0.85rem 0 0;
}
.rbn-trace ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.35rem; }
.rbn-trace li + li::before { content: "› "; color: var(--filet-fort); }
.rbn-trace a { color: var(--encre-pale); }

/* =====================================================================
   PLAN DE PAGE : colonne de marge + colonne de lecture
   ===================================================================== */

.rbn-etal {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.6rem var(--allee);
  padding: 1.4rem 0 2.5rem;
  align-items: start;
}

/* Sur petit ecran, la colonne de reperes passe SOUS le contenu,
   quel que soit son rang dans le HTML. */
.rbn-banc { order: 2; }
.rbn-nappe { order: 1; }

@media (min-width: 64em) {
  /* Colonne de reperes a gauche (plan par defaut) */
  .rbn-etal { grid-template-columns: var(--banc-largeur) minmax(0, 1fr); }
  .rbn-etal > .rbn-banc   { grid-column: 1; grid-row: 1; order: 0; }
  .rbn-etal > .rbn-nappe { grid-column: 2; grid-row: 1; order: 0; }

  /* Marge a droite */
  .rbn-etal--retourne { grid-template-columns: minmax(0, 1fr) var(--banc-largeur); }
  .rbn-etal--retourne > .rbn-banc   { grid-column: 2; }
  .rbn-etal--retourne > .rbn-nappe { grid-column: 1; }
}

.rbn-banc {
  font-size: var(--t-petit);
  color: var(--encre-pale);
  border-top: 3px double var(--encre);
  padding-top: 0.7rem;
}

@media (min-width: 64em) {
  .rbn-banc {
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
  }
}

.rbn-banc__titre {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--encre);
  margin-bottom: 0.45rem;
}

.rbn-banc ul { list-style: none; margin: 0 0 1.2rem; padding: 0; }
.rbn-banc li { border-bottom: 1px dotted var(--filet); }
.rbn-banc li a {
  display: block;
  padding: 0.28rem 0;
  color: var(--encre);
  text-decoration: none;
}
.rbn-banc li a:hover { color: var(--accent); }

.rbn-nappe { max-width: 100%; }

/* =====================================================================
   TRANCHES (sections)
   ===================================================================== */

.rbn-rayon { padding: 0 0 1.9rem; }
.rbn-rayon + .rbn-rayon { border-top: 1px solid var(--filet); padding-top: 1.5rem; }

.rbn-rayon__tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.3rem 1rem;
  margin-bottom: 0.9rem;
}

.rbn-rayon__titre {
  font-size: var(--t-h2);
  letter-spacing: 0.01em;
}
.rbn-rayon__titre .rbn-chiffre {
  font-family: var(--tampon);
  color: var(--accent);
  margin-right: 0.45rem;
  font-weight: 400;
}

.rbn-rayon__mention {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--encre-pale);
}

.rbn-preambule {
  font-size: 1.03rem;
  color: var(--encre);
  max-width: var(--laize);
}

/* Ouverture de page : titre de rang 1 + chapeau + mention */
.rbn-fronton { padding: 0 0 1.4rem; }
.rbn-fronton > * + * { margin-top: 0.7rem; }
.rbn-titre-fiche {
  font-family: var(--pancarte);
  font-size: var(--t-h1);
  font-weight: 700;
  letter-spacing: -0.005em;
  line-height: 1.12;
}
.rbn-titre-fiche .rbn-repere { display: block; margin-bottom: 0.35rem; }

.rbn-filigrane { font-size: var(--t-petit); color: var(--encre-pale); }

/* =====================================================================
   ABECEDAIRE (bandeau alphabetique)
   ===================================================================== */

.rbn-alphabet {
  background: var(--fond-creux);
  border-left: 5px solid var(--accent);
  padding: 0.55rem 0.7rem;
  margin: 0 0 1.6rem;
}
.rbn-alphabet ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem;
}
.rbn-alphabet a,
.rbn-alphabet span {
  display: inline-block;
  min-width: 1.7rem;
  padding: 0.18rem 0.25rem;
  text-align: center;
  font-family: var(--tampon);
  font-size: var(--t-petit);
  letter-spacing: 0.06em;
  text-decoration: none;
  color: var(--encre);
  border: 1px solid transparent;
}
.rbn-alphabet a:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.rbn-alphabet span { color: var(--filet-fort); }

/* =====================================================================
   NOMENCLATURE (listes de definitions)
   ===================================================================== */

.rbn-listage { margin: 0; }

.rbn-fiche {
  border-top: 1px solid var(--filet);
  padding: 0.7rem 0 0.75rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.15rem 1rem;
}

@media (min-width: 46em) {
  .rbn-fiche { grid-template-columns: minmax(10.5rem, 17rem) minmax(0, 1fr); }
}

.rbn-fiche:hover { background: var(--fond-relief); }
.rbn-fiche:first-of-type { border-top: 3px double var(--encre); }

.rbn-appellation {
  font-family: var(--pancarte);
  font-weight: 700;
  font-size: var(--t-h3);
  margin: 0;
  line-height: 1.25;
}
.rbn-appellation a { color: var(--encre); text-decoration: none; }
.rbn-appellation a:hover { color: var(--accent); text-decoration: underline; }

.rbn-appellation__autre {
  display: block;
  font-family: var(--plume);
  font-style: italic;
  font-weight: 400;
  font-size: var(--t-petit);
  color: var(--encre-pale);
}

.rbn-notice { margin: 0; font-size: 0.97rem; }
.rbn-notice p + p { margin-top: 0.4rem; }

.rbn-repere {
  display: block;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--encre-pale);
}
/* nowrap reserve aux ecrans assez larges : sur mobile, le plus long repere
   ("Haute-Provence · Alpes-de-Haute-Provence", lettres espacees + capitales)
   ne doit jamais forcer de debordement horizontal. */
@media (min-width: 30em) {
  .rbn-repere { white-space: nowrap; }
}

.rbn-jeton {
  display: inline-block;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--encre);
  border: 1px solid var(--filet-fort);
  padding: 0.05rem 0.4rem;
  margin-right: 0.3rem;
}

/* Tete de groupe alphabetique dans une nomenclature */
.rbn-lettre {
  display: flex;
  align-items: baseline;
  gap: 0.7rem;
  font-family: var(--pancarte);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--accent);
  border-bottom: 2px solid var(--encre);
  padding: 1.5rem 0 0.25rem;
  scroll-margin-top: 1rem;
}
.rbn-lettre__compte {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--encre-pale);
}
.rbn-lettre + .rbn-listage .rbn-fiche:first-of-type { border-top: 0; }

/* Liste compacte de termes, en colonnes */
.rbn-colonnes {
  list-style: none;
  margin: 0;
  padding: 0;
  columns: 1;
  column-gap: var(--allee);
}
@media (min-width: 46em) { .rbn-colonnes { columns: 2; } }
@media (min-width: 68em) { .rbn-colonnes { columns: 3; } }

.rbn-colonnes li {
  break-inside: avoid;
  border-bottom: 1px dotted var(--filet);
  padding: 0.22rem 0;
  font-size: var(--t-petit);
}
.rbn-colonnes a { color: var(--encre); text-decoration: none; }
.rbn-colonnes a:hover { color: var(--accent); text-decoration: underline; }

/* =====================================================================
   ABAQUE (tableau comparatif, defilement propre)
   ===================================================================== */

.rbn-tablee {
  overflow-x: auto;
  border: 2px solid var(--filet-fort);
  background: var(--fond);
  max-width: 100%;
}
.rbn-tablee:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }

.rbn-grille {
  border-collapse: collapse;
  width: 100%;
  min-width: 38rem;
  font-size: var(--t-petit);
  font-variant-numeric: tabular-nums;
}

.rbn-grille caption {
  caption-side: top;
  background: var(--fond-creux);
  text-align: left;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--encre-pale);
  padding: 0.5rem 0.7rem;
  border-bottom: 1px solid var(--filet);
}

.rbn-grille th,
.rbn-grille td {
  padding: 0.45rem 0.7rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--filet);
}

.rbn-grille thead th {
  background: var(--accent);
  color: var(--fond-relief);
  font-family: var(--pancarte);
  font-size: var(--t-menu);
  letter-spacing: 0.07em;
  text-transform: uppercase;
  border-bottom: 0;
  white-space: nowrap;
}

.rbn-grille tbody th {
  font-family: var(--pancarte);
  font-weight: 600;
  white-space: nowrap;
}

.rbn-grille tbody tr:nth-child(even) { background: var(--fond-relief); }
.rbn-grille tbody tr:last-child th,
.rbn-grille tbody tr:last-child td { border-bottom: 0; }

.rbn-glissement {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.06em;
  color: var(--encre-pale);
  margin-top: 0.35rem;
}
@media (min-width: 46em) { .rbn-glissement { display: none; } }

/* =====================================================================
   RENVOIS CROISES
   ===================================================================== */

.rbn-passerelle {
  color: var(--signal);
  font-style: italic;
}
.rbn-passerelle::before { content: "→ "; font-style: normal; }

.rbn-passerelles {
  list-style: none;
  margin: 0;
  padding: 0.7rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1.1rem;
  border-top: 1px solid var(--filet);
  font-size: var(--t-petit);
}
.rbn-passerelles li::before { content: "→ "; color: var(--filet-fort); }
.rbn-passerelles a { color: var(--signal); text-decoration: none; }
.rbn-passerelles a:hover { text-decoration: underline; }

/* =====================================================================
   NOTULE (encart) et EXERGUE (definition d'ouverture)
   ===================================================================== */

.rbn-encoche {
  background: var(--fond-creux);
  border-left: 3px solid var(--accent);
  padding: 0.8rem 1rem;
  font-size: var(--t-petit);
}
.rbn-encoche__titre {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
}

.rbn-attaque {
  font-size: 1.12rem;
  background: var(--fond-relief);
  border-left: 5px solid var(--accent);
  padding: 0.95rem 1.1rem;
  margin: 0 0 1.5rem;
  max-width: var(--laize);
}
.rbn-attaque strong { font-family: var(--pancarte); }

/* =====================================================================
   PARAGRAPHE A MANCHETTE (titre en marge, texte a droite)
   ===================================================================== */

.rbn-panneau {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  padding: 1.2rem 0;
  border-top: 1px solid var(--filet);
}

.rbn-panneau ul,
.rbn-panneau ol,
.rbn-notice ul,
.rbn-encoche ul { padding-left: 1.15rem; }
.rbn-encoche ul { list-style: square; }
.rbn-panneau li,
.rbn-encoche li { padding: 0.1rem 0; }

.rbn-ardoise {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  padding-top: 0.15rem;
}
.rbn-ardoise .rbn-chiffre { color: var(--encre-pale); }

@media (min-width: 60em) {
  .rbn-panneau {
    grid-template-columns: 12rem minmax(0, 1fr);
    gap: 0.75rem var(--allee);
  }
  /* Le texte garde la mesure de lecture ... */
  .rbn-panneau > *:not(.rbn-ardoise) {
    grid-column: 2;
    max-width: var(--laize);
  }
  /* ... mais les tableaux et les planches prennent toute la colonne. */
  .rbn-panneau > .rbn-tablee,
  .rbn-panneau > .rbn-vue,
  .rbn-panneau > figure { max-width: none; }

  .rbn-ardoise { grid-column: 1; grid-row: 1; text-align: left; border-top: 2px solid var(--accent); padding-top: 0.4rem; }
}

/* =====================================================================
   PLANCHE (image, rare dans cet ouvrage)
   ===================================================================== */

.rbn-vue { margin: 0; }
.rbn-vue img,
.rbn-vue svg {
  border: 1px solid var(--filet-fort);
  background: var(--fond-relief);
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.rbn-vue__legende {
  font-size: var(--t-petit);
  color: var(--encre-pale);
  padding-top: 0.35rem;
  border-bottom: 1px solid var(--filet);
  padding-bottom: 0.5rem;
}

/* =====================================================================
   JALONS (entree precedente / suivante)
   ===================================================================== */

.rbn-bornes {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.6rem;
  border-top: 3px double var(--encre);
  margin-top: 1.6rem;
  padding-top: 0.9rem;
}
@media (min-width: 46em) { .rbn-bornes { grid-template-columns: 1fr 1fr; } }

.rbn-borne { text-decoration: none; color: var(--encre); display: block; padding: 0.4rem 0; }
.rbn-borne:hover .rbn-borne__nom { color: var(--accent); text-decoration: underline; }
.rbn-borne__sens {
  display: block;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--encre-pale);
}
.rbn-borne__nom { font-family: var(--pancarte); font-weight: 600; }
.rbn-borne--suivante { text-align: left; }
@media (min-width: 46em) { .rbn-borne--suivante { text-align: right; } }

/* =====================================================================
   COLOPHON (pied de page)
   ===================================================================== */

.rbn-pied {
  border-top: 3px double var(--encre);
  background: var(--fond-creux);
  padding: 1.6rem 0 2rem;
  font-size: var(--t-petit);
}

.rbn-pied__grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.2rem var(--allee);
}
@media (min-width: 46em) { .rbn-pied__grille { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.rbn-pied h2 {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.11em;
  text-transform: uppercase;
  margin-bottom: 0.45rem;
}
.rbn-pied ul { list-style: none; margin: 0; padding: 0; }
.rbn-pied li { padding: 0.16rem 0; }
.rbn-pied a { color: var(--encre); }
.rbn-pied a:hover { color: var(--accent); }

.rbn-pied__bas {
  border-top: 1px solid var(--filet-fort);
  margin-top: 1.3rem;
  padding-top: 0.8rem;
  color: var(--encre-pale);
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.05em;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1.2rem;
  justify-content: space-between;
}

/* =====================================================================
   IMPRESSION
   ===================================================================== */

@media print {
  :root { --fond: #ffffff; --fond-creux: #ffffff; --fond-relief: #ffffff; }
  .rbn-allees, .rbn-banc, .rbn-alphabet, .rbn-bornes, .rbn-passe, .rbn-vue { display: none; }
  .rbn-etal { grid-template-columns: minmax(0, 1fr); }
  a { color: inherit; text-decoration: none; }
  .rbn-tablee { overflow: visible; }
  .rbn-grille { min-width: 0; }
}

/* =====================================================================
   COMPLEMENTS DU SITE
   ===================================================================== */

/* Bandeau de rappel court, pose sous un titre de rayon. */
.rbn-avis {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.03em;
  line-height: 1.5;
  color: var(--encre-pale);
  border-top: 1px dotted var(--filet-fort);
  border-bottom: 1px dotted var(--filet-fort);
  padding: 0.5rem 0;
  margin: 0 0 1.1rem;
  max-width: var(--laize);
}

/* Chiffre ou mot mis en exergue au fil du texte. */
.rbn-saillie {
  font-family: var(--pancarte);
  font-weight: 700;
  color: var(--accent);
}

/* Liste de criteres numerotee, employee dans les panneaux pratiques. */
.rbn-criteres {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: critere;
}
.rbn-criteres li {
  counter-increment: critere;
  padding: 0.3rem 0 0.3rem 2.1rem;
  position: relative;
  border-bottom: 1px dotted var(--filet);
}
.rbn-criteres li::before {
  content: counter(critere);
  position: absolute;
  left: 0;
  top: 0.3rem;
  width: 1.5rem;
  text-align: center;
  font-family: var(--tampon);
  font-size: var(--t-menu);
  color: var(--fond-relief);
  background: var(--accent);
  padding: 0.1rem 0;
}

@media print {
  .rbn-avis { border-color: #999999; }
  .rbn-criteres li::before { color: #000000; background: transparent; }
}

/* Journal des mises a jour de fiches, flux date pose en tete de sommaire. */
.rbn-agenda { list-style: none; margin: 0; padding: 0; }

.rbn-agenda__ligne {
  padding: 0.85rem 0.5rem;
  border-left: 3px solid transparent;
  border-bottom: 1px solid var(--filet);
}
.rbn-agenda__ligne:first-child { border-top: 3px double var(--encre); }
.rbn-agenda__ligne:hover { background: var(--fond-relief); border-left-color: var(--accent); }

.rbn-agenda__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.6rem;
  margin: 0;
}
.rbn-agenda__date {
  font-family: var(--tampon);
  font-size: var(--t-menu);
  letter-spacing: 0.04em;
  color: var(--accent);
  font-weight: 700;
}

.rbn-agenda__titre { margin: 0.25rem 0 0; }
.rbn-agenda__titre a {
  font-family: var(--pancarte);
  font-weight: 700;
  font-size: var(--t-h3);
  color: var(--encre);
  text-decoration: none;
}
.rbn-agenda__titre a:hover { color: var(--accent); text-decoration: underline; }

.rbn-agenda__extrait {
  margin: 0.2rem 0 0;
  font-family: var(--plume);
  font-size: var(--t-petit);
  color: var(--encre-pale);
}

@media (min-width: 46em) {
  .rbn-agenda__ligne {
    display: grid;
    grid-template-columns: 9.5rem minmax(0, 1fr);
    column-gap: 1.1rem;
  }
  .rbn-agenda__meta { flex-direction: column; align-items: flex-start; gap: 0.2rem; }
  .rbn-agenda__titre, .rbn-agenda__extrait { grid-column: 2; }
}

@media print {
  .rbn-agenda { display: none; }
}
