/* ==================================================================
   Le prix : l'addition (24/10/2026)
   ==================================================================
   Chargée après pages.css, qu'elle ne modifie pas. Une feuille tapée,
   et posée dessus la note du petit plateau d'argent : une bande de
   papier de caisse plus blanc (une ombre : elle est posée), les dents du
   couteau en haut et en bas, ses lignes tapées avec leurs points de
   conduite, et le total sous un double filet. Tout y est à zéro.
   ================================================================== */

.feuille-prix .doc-objet { width: 84px; height: 60px; margin-top: 8px; }
.feuille-prix h1 { text-wrap: balance; }

/* ---------- l'addition ---------- */
.addition {
  --caisse: #f7f3e8;
  position: relative;
  max-width: 25rem;
  margin: clamp(30px, 4.6vw, 44px) 0 10px;
  padding: 20px clamp(16px, 3.6vw, 26px) 18px;
  background: url("img/grain-papier.png") 0 0 / 256px 256px, var(--caisse);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16), 0 6px 14px rgba(40, 28, 10, 0.18);
  image-rendering: pixelated;
}
.addition::before, .addition::after {
  content: ""; position: absolute; left: 0; right: 0; height: 7px;
  background:
    linear-gradient(-45deg, var(--caisse) 5px, transparent 0) 0 0 / 10px 7px repeat-x,
    linear-gradient(45deg, var(--caisse) 5px, transparent 0) 0 0 / 10px 7px repeat-x;
}
.addition::before { top: -7px; }
.addition::after { bottom: -7px; transform: scaleY(-1); }
.addition-tete {
  margin: 0 0 12px; padding-bottom: 10px;
  border-bottom: 1px dashed var(--pointille);
  font-size: var(--t-etiquette); line-height: 1.3; text-align: center;
  letter-spacing: calc(2em / 27); text-transform: uppercase;
}

/* une ligne : le nom, une rangée de points tapés, le prix */
.bareme > li { padding: 9px 0 8px; }
.b-ligne { display: flex; align-items: baseline; align-items: last baseline; }
.b-nom {
  flex: 1 1 0; min-width: 0; overflow: hidden;
  font-family: var(--f-titre); font-size: var(--t-etiquette); line-height: 1.35;
}
.b-nom::after {
  content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .";
  content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ." / "";
  display: inline-block; width: 0; vertical-align: baseline;
  white-space: pre; color: var(--encre-2);
}
.b-prix {
  flex: none; padding-left: 10px;
  font-family: var(--f-titre); font-size: var(--t-etiquette); line-height: 1.35; text-align: right;
  font-variant-numeric: tabular-nums;
}
.addition-total {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  margin-top: 10px; padding-top: 12px;
  border-top: 3px double var(--encre);
  font-family: var(--f-titre); font-size: var(--t-h2); line-height: 1;
}

/* ---------- téléphone ---------- */
@media (max-width: 600px) {
  .feuille-prix .doc-objet { grid-row: 1; width: 56px; height: 40px; }
  .feuille-prix .chapeau { grid-column: 1 / -1; }
  .addition { margin-inline: -8px; padding-inline: 14px; }
}

@media print {
  .addition { box-shadow: none; border: 1px solid #000; }
  .addition::before, .addition::after { display: none; }
}
