/*
 * TULAJDONOSI FELÜLET · 3/3 — LISTÁK ÉS KIMUTATÁSOK
 *
 * Allergénlista (nyomtatással), összesítő sávok, adatsorok, ikongombok,
 * műszakkezdő kártyarács.
 *
 * A BETÖLTÉSI SORREND KÖTÖTT: ezek a fájlok EGY kaszkádot alkotnak —
 * ugyanazt, ami korábban egyetlen fájl volt. A darabolás BAJTRA folytonos
 * volt, tehát egyetlen szabály sem mozdult el a kaszkádban; de csak addig,
 * amíg a sorrend ez marad:
 *
 *   tulaj.css  ->  tulaj-licenc.css  ->  tulaj-listak.css
 *
 * A sorrendet a `lib/header.php` `$cssLapok` tömbje rögzíti.
 */
/* ── Termékadat-szerkesztő (admin) ─────────────────────────────────────── */

.qb-adatsor {
  margin: 0 0 16px;
  padding: 0;
  border: 0;
}

.qb-adatsor__row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.qb-adatsor__row input:first-child {
  flex: 0 1 34%;
  min-width: 0;
}

.qb-adatsor__row input:last-child {
  flex: 1 1 auto;
  min-width: 0;
}

.qb-form input[type="file"] {
  width: 100%;
  margin-top: 8px;
  padding: 10px;
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  color: inherit;
  font-family: var(--font-body);
  font-size: 0.85rem;
}

/* ── Statisztika ───────────────────────────────────────────────────────── */

.qb-num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.qb-bar {
  display: block;
  width: 100%;
  min-width: 80px;
  height: 8px;
  border: 0;
  border-radius: var(--radius);
  background: var(--hairline);
  appearance: none;
}

.qb-bar::-webkit-progress-bar {
  background: var(--hairline);
  border-radius: var(--radius);
}

.qb-bar::-webkit-progress-value {
  background: var(--ink);
  border-radius: var(--radius);
}

.qb-bar::-moz-progress-bar {
  background: var(--ink);
  border-radius: var(--radius);
}

/* ── Áttekintés ────────────────────────────────────────────────────────── */

.qb-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 20px 0 0;
}

.qb-summary__item {
  flex: 1 1 200px;
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  box-shadow: var(--lift);
}

.qb-summary__label {
  display: block;
  color: var(--ash);
  font-family: var(--font-body);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
}

.qb-summary__value {
  display: block;
  margin-top: 8px;
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.qb-summary__sub {
  display: block;
  margin-top: 2px;
  color: var(--ash);
  font-size: 0.8125rem;
}

.qb-chart {
  display: block;
  width: 100%;
  height: auto;
  margin: 12px 0 0;
}

.qb-chart__bar {
  fill: var(--mint);
}

.qb-chart__tick {
  fill: var(--ash);
  font-family: var(--font-mono);
  font-size: 6px;
  text-anchor: middle;
}

.qb-h2 {
  margin-top: 24px;
}

.qb-logo--preview {
  height: 72px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
}

/* ── Megosztott opciócsoport ───────────────────────────────────────────── */

.qb-shared {
  margin: 8px 0 16px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
}

.qb-shared summary {
  color: var(--ash);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
}

.qb-shared__list {
  columns: 220px;
  margin: 12px 0;
}

.qb-shared__cat {
  margin: 12px 0 4px;
  color: var(--ash);
  font-family: var(--font-body);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
  break-after: avoid;
}

.qb-shared__item {
  display: flex;
  gap: 8px;
  padding: 4px 0;
  break-inside: avoid;
  font-size: 0.9rem;
}

/* A vendég rétegéből ide: ezt az állapotot az admin QR-lapja mutatja. */

/*
 * ══════════════════════════════════════════════════════════════════════════
 * ALLERGÉN- ÉS ÖSSZETEVŐLISTA · admin/allergen-lista.php
 * ══════════════════════════════════════════════════════════════════════════
 *
 * Ez a lap KÉT KÖZEGBEN él, és a kettő nem ugyanazt akarja:
 *
 *  - KÉPERNYŐN egy sima admin táblázat: a tulajdonos ellenőrzi, mi hiányzik,
 *    mielőtt nyomtat.
 *  - PAPÍRON egy A4-es hivatalos lap: fehér alap, fekete szöveg, keskeny
 *    margó, és semmi, ami tintát eszik.
 *
 * A TÁBLÁZAT FEJLÉCE MINDEN OLDALON MEGISMÉTLŐDIK (`thead` + `display:
 * table-header-group`). Egy hetven tételes étlap három lapra megy, és a
 * második lapon a „Tétel / Allergének / Összetevők” nélkül nem lehet tudni,
 * melyik oszlop micsoda.
 *
 * A SOROKAT NEM TÖRJÜK KETTÉ (`break-inside: avoid`): egy termék neve az
 * egyik lapon, az allergénjei a másikon — ez pont az a hiba, ami miatt egy
 * allergénlistát nem szabad papírra nyomtatni.
 */

.qb-allergen__eszkozok {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 16px 0 24px;
}

.qb-allergen {
  padding: 24px;
  background: var(--paper, #fff);
  border: 1px solid var(--hairline, #e3e3e0);
  border-radius: var(--radius, 12px);
}

.qb-allergen__fej {
  padding-bottom: 16px;
  border-bottom: 2px solid var(--ink, #1a1a18);
}

.qb-allergen__fej h2 {
  margin: 0 0 6px;
  font-size: 1.15rem;
}

.qb-allergen__datum {
  margin: 0 0 8px;
  font-family: var(--font-mono, monospace);
  font-size: 0.82rem;
}

.qb-allergen__jog {
  margin: 0;
  max-width: 68ch;
  color: var(--ash, #6b6b66);
  font-size: 0.8rem;
  line-height: 1.5;
}

.qb-allergen__tabla {
  width: 100%;
  margin-top: 16px;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.qb-allergen__tabla th,
.qb-allergen__tabla td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--hairline, #e3e3e0);
  text-align: left;
  vertical-align: top;
}

.qb-allergen__tabla thead th {
  border-bottom: 1px solid var(--ink, #1a1a18);
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* A tétel neve és az allergénoszlop a fontos; az összetevő a magyarázat. */
.qb-allergen__tabla tbody th[scope="row"] { width: 30%; font-weight: 600; }
.qb-allergen__tabla td:first-of-type { width: 34%; }

.qb-allergen__katsor th {
  padding-top: 16px;
  border-bottom: 1px solid var(--ink, #1a1a18);
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qb-allergen__kiszereles,
.qb-allergen__jel {
  display: block;
  margin-top: 2px;
  font-weight: 400;
  font-size: 0.75rem;
}

.qb-allergen__kiszereles { color: var(--ash, #6b6b66); }
.qb-allergen__jel        { font-style: italic; }

.qb-allergen__recept,
.qb-allergen__sajat {
  margin: 0 0 4px;
}

.qb-allergen__sajat { color: var(--ash, #6b6b66); }

/*
 * A HIÁNYZÓ ADAT NEM HALKABB, MINT A MEGLÉVŐ. Kísértő volna szürkére venni,
 * de pont ezt kell észrevenni: itt nincs válasz, tehát kérdezni kell.
 */
.qb-allergen__hianyzik { font-style: italic; }
.qb-allergen__nincs    { color: var(--ash, #6b6b66); }

.qb-allergen__lab {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--hairline, #e3e3e0);
  font-size: 0.78rem;
  line-height: 1.55;
}

.qb-allergen__lab p { margin: 0 0 4px; }

@media print {
  body.qb-allergenlap {
    background: #fff;
    margin: 0;
  }

  /* A menü, a licencsáv, a gombok és a lábléc papíron csak helyet foglalnak. */
  body.qb-allergenlap .qb-adminbar,
  body.qb-allergenlap .qb-allergen__eszkozok,
  body.qb-allergenlap .qb-footer,
  body.qb-allergenlap .qb-uzenetgomb,
  body.qb-allergenlap .qb-uzenetfab,
  body.qb-allergenlap .qb-uzenetek,
  body.qb-allergenlap .qb-uzenet-felugro,
  body.qb-allergenlap .qb-notice {
    display: none;
  }

  body.qb-allergenlap .qb-page {
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .qb-allergen {
    padding: 0;
    border: 0;
    border-radius: 0;
  }

  /* Minden lapon legyen fejléc, és egyetlen tétel se szakadjon ketté. */
  .qb-allergen__tabla thead { display: table-header-group; }
  .qb-allergen__tabla tr    { break-inside: avoid; page-break-inside: avoid; }

  .qb-allergen__tabla,
  .qb-allergen__lab {
    font-size: 9.5pt;
  }

  @page { margin: 14mm; }
}

/*
 * ══════════════════════════════════════════════════════════════════════════
 * MŰSZAKKEZDÉS · admin/muszakkezdes.php
 * ══════════════════════════════════════════════════════════════════════════
 *
 * KÁRTYARÁCS, NEM EGYMÁS ALATTI SZAKASZOK. Hat blokk egymás alatt görgetést
 * jelent, és ami a hajtás alatt van, azt nyitás előtt tíz perccel nem nézi
 * meg senki. Egy rácsban mind a hat EGYSZERRE látszik — a lap dolga pont ez.
 *
 * MINDEN KÁRTYA UGYANÚGY ÉPÜL FEL: felirat, egy nagy szám, egy magyarázó sor,
 * alatta legfeljebb néhány tétel, és egy hivatkozás oda, ahol intézkedni
 * lehet. A szem így egy pillantás alatt letapogatja a hat nagy számot, és
 * csak abba olvas bele, amelyik nem stimmel.
 *
 * AZ `is-warn` NEM RIASZTÁS. Azt jelöli, amivel NYITÁS ELŐTT tenni kell
 * valamit: átlógó nyitott rendelés, üres kijelzőkeret, várólista, stop-lista.
 * Ha minden rendben, a lapon egyetlen színes kártya sincs — és épp ez a jó
 * hír olvasható formája.
 * ══════════════════════════════════════════════════════════════════════════
 */
.qb-shiftgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-top: 20px;
}

.qb-shiftcard {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
}

.qb-shiftcard.is-warn {
  background: var(--tint-amber);
  border-color: color-mix(in srgb, var(--amber) 60%, var(--hairline));
  border-left: 4px solid var(--amber);
}

.qb-shiftcard__big {
  margin: 2px 0 0;
  font-family: var(--font-mono);
  font-size: 2.1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 1.05;
}

.qb-shiftcard__sub {
  margin: 0;
  color: var(--ash);
  font-size: 0.8125rem;
  line-height: 1.45;
}

/* Az ÜRES ÁLLAPOT IS VÁLASZ: „minden kapható" ugyanolyan hír, mint egy szám. */
.qb-shiftcard__empty {
  margin: 6px 0 0;
  color: var(--ash);
  font-size: 0.85rem;
  font-style: italic;
}

.qb-shiftcard .qb-link {
  margin-top: auto;
  padding-top: 10px;
  font-size: 0.8125rem;
  font-weight: 700;
}

.qb-shiftlist {
  display: grid;
  gap: 3px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.85rem;
}

.qb-shiftlist li {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

/* Az IDŐ FIX SZÉLESSÉGŰ, hogy a nevek egy vonalban kezdődjenek. */
.qb-shiftlist__key {
  flex: 0 0 auto;
  color: var(--ash);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.qb-shiftlist li > span:not(.qb-shiftlist__key):not(.qb-shiftlist__meta) {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.qb-shiftlist__meta {
  flex: 0 0 auto;
  color: var(--ash);
  font-size: 0.75rem;
  text-align: right;
}