/* =====================================================================
   SUPERMART MALI — reçu « ticket à souche »
   Même dessin à l'écran et à l'impression : toutes les mesures sont en em,
   seule la taille de police change (écran ≈ 340 px, impression = 80 mm).
   ===================================================================== */
.tk {
  --tk-papier: #FFFDF6; --tk-encre: #0D1A33; --tk-doux: #5E6880; --tk-bleu: #004AAD; --tk-nuit: #061A3A; --tk-or: #FFCF01; --tk-trait: #D9D4C4;
  position: relative; display: flex; width: 26em; margin: 0 auto; font: 500 13px/1.45 "Manrope", system-ui, sans-serif; color: var(--tk-encre);
  background: var(--tk-papier);
  box-shadow: 0 1px 2px rgba(13, 26, 51, .08), 0 30px 60px -28px rgba(13, 26, 51, .55);
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
  /* bord inférieur dentelé, comme un ticket détaché */
  -webkit-mask: radial-gradient(.5em at 50% 100%, transparent 98%, #000) 0 0 / 1.2em 100% repeat-x;
          mask: radial-gradient(.5em at 50% 100%, transparent 98%, #000) 0 0 / 1.2em 100% repeat-x;
  padding-bottom: .5em;
}
.tk * { box-sizing: border-box; }

/* souche détachable */
.tk__souche {
  flex: none; width: 2.3em; position: relative; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 1.1em 0;
  background: repeating-linear-gradient(135deg, #F3EEDD 0 .35em, var(--tk-papier) .35em .75em);
  border-right: 2px dashed var(--tk-trait);
}
.tk__souche span, .tk__souche b { writing-mode: vertical-rl; transform: rotate(180deg); letter-spacing: .22em; text-transform: uppercase; }
.tk__souche span { font-size: .62em; font-weight: 800; color: #9A937C; }
.tk__souche b { font: 700 .72em/1 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; letter-spacing: .12em; color: var(--tk-encre); }

.tk__corps { flex: 1; min-width: 0; padding: 1.15em 1.15em .9em; }
.tk__tete { display: flex; gap: .7em; align-items: center; padding-bottom: .75em; border-bottom: 2px solid var(--tk-encre); }
.tk__tete img { width: 3em; height: 3em; flex: none; object-fit: contain; border-radius: .7em; background: var(--tk-nuit); padding: .3em; }
.tk__tete b { display: block; font: 800 1.12em/1.15 "Playfair Display", Georgia, serif; color: var(--tk-bleu); }
.tk__tete small { display: block; font-size: .72em; color: var(--tk-doux); line-height: 1.35; }

.tk__titre { position: relative; display: flex; align-items: center; justify-content: space-between; margin-top: .85em; }
.tk__titre span { font-size: .66em; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #7A7360; }
.tk__tampon {
  position: absolute; right: 0; top: -.15em; transform: rotate(-9deg); font: 900 .9em/1 "Manrope", sans-serif; font-style: normal; letter-spacing: .16em;
  padding: .3em .55em .25em; border: .17em solid currentColor; border-radius: .4em; color: #11994C; background: rgba(255, 253, 246, .8);
}
.tk--du .tk__tampon { color: #C26A00; }
.tk--annule .tk__tampon { color: #D92D2B; }
.tk__montant { margin: .15em 0 0; display: flex; align-items: baseline; gap: .3em; }
.tk__montant b { font: 800 2.15em/1.05 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; letter-spacing: -.02em; }
.tk__montant span { font: 700 .8em/1 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; color: var(--tk-doux); }
.tk__lettres { margin: .2em 0 0; font: italic 500 .8em/1.35 "Playfair Display", Georgia, serif; color: var(--tk-doux); }
.tk__lettres::first-letter { text-transform: uppercase; }

.tk__infos { margin: .8em 0 0; display: grid; gap: .28em; }
.tk__infos div { display: flex; justify-content: space-between; gap: .8em; font-size: .78em; }
.tk__infos dt { color: var(--tk-doux); }
.tk__infos dd { margin: 0; font-weight: 700; text-align: right; }

.tk__articles { list-style: none; margin: .8em 0 0; padding: .7em 0 0; border-top: 1px dashed var(--tk-trait); display: grid; gap: .45em; }
.tk__articles li { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .6em; font-size: .78em; }
.tk__nom { grid-column: 1 / -1; font-weight: 700; line-height: 1.3; }
.tk__calc { color: var(--tk-doux); font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: .95em; }
.tk__articles b { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; text-align: right; }

.tk__lignes { margin-top: .7em; padding-top: .6em; border-top: 1px dashed var(--tk-trait); display: grid; gap: .25em; }
.tk__lignes div { display: flex; justify-content: space-between; font-size: .78em; color: var(--tk-doux); }
.tk__lignes b { color: var(--tk-encre); font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; }
.tk__total { margin-top: .55em; display: flex; align-items: center; justify-content: space-between; padding: .55em .7em; border-radius: .55em; background: #FFF4C2; border: 1px solid #F1D766; }
.tk__total span { font-size: .66em; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #6B5200; }
.tk__total b { font: 800 1.25em/1 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; }
.tk__total small { font-size: .58em; margin-left: .3em; color: var(--tk-doux); }
.tk__encaisse { margin: .45em 0 0; font-size: .7em; color: #0B6B35; font-weight: 700; text-align: right; }

.tk__verif { margin-top: .8em; display: flex; gap: .75em; align-items: center; padding: .7em; border-radius: .6em; background: var(--tk-nuit); color: #C9D4EC; }
.tk__qr { width: 5.2em; height: 5.2em; flex: none; padding: .3em; border-radius: .35em; background: #fff; }
.tk__qr svg { display: block; width: 100%; height: 100%; }
.tk__verif p { margin: 0; font-size: .68em; line-height: 1.4; }
.tk__verif b { display: block; color: #fff; font-size: 1.15em; margin-bottom: .1em; }
.tk__verif small { display: block; margin-top: .35em; font: 700 .95em/1.2 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; color: var(--tk-or); letter-spacing: .04em; word-break: break-all; }
.tk__merci { margin: .8em 0 0; text-align: center; font: 700 .9em/1.3 "Playfair Display", Georgia, serif; color: var(--tk-bleu); }
.tk__merci small { display: block; font: 500 .74em/1.4 "Manrope", sans-serif; color: var(--tk-doux); margin-top: .15em; }

/* barre d'actions au-dessus du reçu (jamais imprimée) */
.recu-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 0 auto 22px; max-width: 520px; }

/* ---- impression : uniquement le ticket, à 80 mm de large */
#zone-recu { display: none; }
#zone-recu.mesure { display: block !important; position: absolute; left: -10000px; top: 0; }
#zone-recu .tk, #zone-recu.mesure .tk { font-size: 11.6px; box-shadow: none; margin: 0; }
@media print {
  body.impression-recu { background: #fff !important; padding: 0 !important; margin: 0 !important; }
  body.impression-recu > *:not(#zone-recu) { display: none !important; }
  body.impression-recu > #zone-recu { display: block !important; }
}
.tk__remise span, .tk__remise b { color: #0B6B35 !important; font-weight: 700; }
.tk__club { margin-top: .6em; padding: .55em .7em; border-radius: .55em; border: 1px dashed #D9A300; background: #FFFBEA; display: grid; gap: .1em; text-align: center; }
.tk__club b { font: 700 .82em/1.2 "Playfair Display", Georgia, serif; color: #8A6400; }
.tk__club span { font-size: .72em; color: var(--tk-encre); font-weight: 600; }