/* Spiżarnia — Zamawianie u dostawców (sesja 4, makiety 20b, 21a–d; docs/architektura.md §24.3). Klasy .zam-*, .sms-*, .przy-*,
   .asort-*, .note-* są kontraktem z js/ui/screens/zamowienie.js (karta dostawcy .sup-* w dostawcy.css). System v2: nazwy i zdania 15,
   przyciski i liczby 14/600, chipy i podpisy 13, cicha linia 12, etykiety wersalikami 12/600; bez cieni, fokus i wybrany chip beige-deep. */

/* ---------- karta dostawcy: linia rytmu i jeden stan zamówienia ---------- */
.zam-block { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.zam-block__rhythm { font: 500 var(--fs-chip)/1.35 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
/* „Dokończ zamówienie · Szkic · 3 pozycje” na ochrze: dopisek w atramencie (text-2 na ochrze byłby za słaby) */
.zam-block__btn .btn__sub { color: var(--ink); font-weight: 500; }
/* wysłane, nieprzyszłe: „Wysłane 11 września · 8 pozycji · ok. 1030 zł” + cichy „Nie wysłałam”, pod spodem beige „Przyszło” */
.zam-sent { display: flex; flex-direction: column; gap: 8px; padding: 8px 12px 12px 16px; }
.zam-sent__line { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.zam-sent__text { flex: 1; min-width: 0; font: 500 var(--fs-body)/1.35 var(--font-name); text-wrap: pretty; font-variant-numeric: tabular-nums; }
.zam-sent__unsend { margin-right: -8px; font-size: var(--fs-chip); }

/* ---------- karta dostawcy: sekcje Asortyment i Notatki ---------- */
.zam-sec { margin-top: 8px; }
.asort-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 6px 0; border-bottom: 1px solid var(--hairline); }
.asort-row__name { min-width: 0; font: 500 var(--fs-body)/1.3 var(--font-name); overflow-wrap: anywhere; text-wrap: pretty; font-variant-numeric: tabular-nums; }
.asort-row__sub { font: 500 var(--fs-3) var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.asort-row__price { flex: none; font: 500 var(--fs-chip) var(--font-sans); color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.asort-empty { margin: 2px 0 0; font: 500 var(--fs-body)/1.4 var(--font-name); color: var(--text-2); text-wrap: pretty; }
/* ciche linki pod sekcją („Edytuj asortyment”, „Wczytaj z notatki”, „Dodaj notatkę”): tekst równo z treścią */
.zam-links { display: flex; flex-wrap: wrap; column-gap: 12px; margin-left: -8px; padding-top: 2px; }
.zam-links .btn--quiet { font-size: var(--fs-chip); }
.note-row { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 6px 0 8px; border-bottom: 1px solid var(--hairline); text-align: left; color: var(--ink); font-family: var(--font-sans); transition: background var(--ease); }
button.note-row:active { background: var(--paper); }
.note-row__date { font: 500 var(--fs-3)/1.3 var(--font-sans); color: var(--text-3); font-variant-numeric: tabular-nums; }
.note-row__text { font: 500 var(--fs-body)/1.4 var(--font-name); white-space: pre-line; overflow-wrap: anywhere; text-wrap: pretty; font-variant-numeric: tabular-nums; }

/* ---------- karta dostawcy: Zamówienia (wiersz 48 z liniami, rozwijany) ---------- */
.zam-hist { margin-top: 16px; }
.zam-hist__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 48px; padding: 6px 0; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); text-align: left; color: var(--ink); font-family: var(--font-sans); }
.zam-hist__label { min-width: 0; line-height: 1.3; }
.zam-hist__name { font: 600 var(--fs-caps)/1.3 var(--font-sans); text-transform: uppercase; letter-spacing: var(--caps-tracking); color: var(--graphite); }
.zam-hist__count { font: 500 var(--fs-chip)/1.3 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.zam-hist__chev { flex: none; display: flex; color: var(--text-2); }
.zam-hist__row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 8px 0 2px; border-bottom: 1px solid var(--hairline); }
.zam-hist__text { min-width: 0; display: flex; flex-direction: column; gap: 2px; padding-top: 2px; }
.zam-hist__title { font: 500 var(--fs-body)/1.3 var(--font-name); font-variant-numeric: tabular-nums; }
.zam-hist__n, .zam-hist__sub { font: 500 var(--fs-3)/1.35 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.zam-hist__right { flex: none; display: flex; flex-direction: column; align-items: flex-end; }
.zam-hist__sum { padding-top: 3px; font: 600 var(--fs-chip)/1.3 var(--font-sans); white-space: nowrap; font-variant-numeric: tabular-nums; }
.zam-hist__again { margin-right: -8px; font-size: var(--fs-chip); }

/* ---------- strona Zamówienie (21a) ---------- */
/* podpis pod tytułem, równo z tytułem (8 + 48 strzałki + 4) */
.zam-sub { padding: 0 20px 2px 60px; font: 500 var(--fs-3)/1.35 var(--font-sans); color: var(--text-2); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
/* „✓ Szkic zapisany” pod linią dostawcy: ilości i pozycje szkicu zapisują się od razu (jak „✓ Zapisane” w arkuszach) */
.zam-saved { display: flex; align-items: center; gap: 4px; padding: 2px 20px 2px 60px; font: 500 var(--fs-3)/1.35 var(--font-sans); color: var(--sage-text); }
.zam-saved svg { display: block; flex: none; }
.zam { flex: 1; padding: 6px 16px 8px; }
.zam-row { display: flex; align-items: center; gap: 8px; min-height: 60px; padding: 6px 0; border-bottom: 1px solid var(--hairline); }
.zam-row__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.zam-row__name { font: 500 var(--fs-body)/1.25 var(--font-name); overflow-wrap: anywhere; text-wrap: pretty; font-variant-numeric: tabular-nums; }
.zam-row__sub { font: 500 var(--fs-3)/1.35 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.zam-row__qty { color: var(--graphite); }
.zam-row--zero .zam-row__name { color: var(--text-2); }
/* stepper „− 2 kg +”: stała szerokość wartości, żeby wiersz nie skakał przy zmianie liczby */
.zam-row .stepper { margin-right: -8px; }
.zam-row .stepper__val { min-width: 52px; white-space: nowrap; }
.zam-empty { display: flex; flex-direction: column; gap: 2px; padding: 8px 0 4px; }
.zam-empty__text { font: 500 var(--fs-body)/1.4 var(--font-name); color: var(--text-2); text-wrap: pretty; }
/* „Dodaj coś spoza listy”: „Co?” i „Ile?” w jednym rzędzie z „Dodaj”; na wąskim ekranie ilość z przyciskiem schodzi niżej */
.zam-free { display: flex; flex-direction: column; gap: 6px; padding-top: 14px; }
.zam-free__label { font: 500 var(--fs-chip)/1.3 var(--font-sans); color: var(--text-2); }
.zam-free__row { display: flex; flex-wrap: wrap; gap: 8px; }
.zam-free__row > .field { width: auto; min-width: 0; }
.zam-free__name { flex: 1 1 150px; }
.zam-free__qty { flex: 1 1 124px; }
.zam-free__btn { flex: none; width: auto; padding: 8px 18px; }
.zam__rule { margin-top: 18px; }
.zam-total { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; padding-top: 14px; }
.zam-total__main { font: 500 var(--fs-body)/1.3 var(--font-name); }
.zam-total__sum { font: 600 var(--fs-btn) var(--font-sans); font-variant-numeric: tabular-nums; }
.zam-total__side { font: 500 var(--fs-chip)/1.3 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.zam-paid { margin-top: 12px; }
.zam-delete { display: flex; justify-content: center; padding-top: 12px; }

/* ---------- strona Podgląd SMS-a / wiadomości (21b) ---------- */
.sms { flex: 1; display: flex; flex-direction: column; padding: 10px 16px 0; }
.sms-msg { padding: 14px 16px; border: 1px solid var(--border-ui); border-radius: var(--r8); background: var(--card); font: 500 var(--fs-btn)/1.55 var(--font-sans); color: var(--ink); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.sms-msg__line { display: block; }
.sms-msg__blank { display: block; height: 1.55em; }
/* „{adres}”, „{podpis}”: chip tint-yellow; przerywany obrys, gdy tego telefonu jeszcze nie ma */
.sms-token { padding: 0 4px; border-radius: var(--r4); background: var(--tint-yellow); }
.sms-token--missing { padding: 0 3px; background: none; border: 1px dashed var(--yellow-dirty); color: var(--text-2); }
.sms-note { padding: 10px 2px 0; font: 500 var(--fs-3)/1.45 var(--font-sans); color: var(--text-2); text-wrap: pretty; }
.sms-miss { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding: 2px 4px 2px 12px; border-radius: var(--r8); background: var(--tint-yellow); }
.sms-miss__text { flex: 1; min-width: 0; font: 500 var(--fs-chip)/1.35 var(--font-sans); color: var(--ink); text-wrap: pretty; }
/* oba przyciski na dole ekranu, przyklejone przy długim zamówieniu (nad slotem statusu, gdy jest) */
.sms-acts { margin-top: auto; position: sticky; bottom: calc(var(--tabbar-h) + var(--safe-b)); display: flex; flex-direction: column; gap: 10px; padding: 16px 0 8px; background: var(--cream); }
.app--slot .sms-acts { bottom: calc(var(--tabbar-h) + var(--slot-h) + var(--safe-b)); } /* §31: nad paskiem zakładek */
.sms-acts > .btn { width: 100%; }
.sms-mark { display: flex; justify-content: center; margin-top: -4px; }

/* ---------- arkusz „Co dodać do zapasów?” (21c) ---------- */
.przy-hint { margin: -4px 0 0; padding: 0 0 8px; font: 500 var(--fs-3)/1.4 var(--font-sans); color: var(--text-2); text-wrap: pretty; }
.przy-list { border-top: 1px solid var(--hairline); }
.przy-row { padding: 4px 0 8px; border-bottom: 1px solid var(--hairline); scroll-margin-top: 12px; }
.przy-row__head { display: flex; align-items: center; gap: 10px; min-height: 48px; }
.przy-row__name { flex: 1; min-width: 0; font: 500 var(--fs-body)/1.3 var(--font-name); overflow-wrap: anywhere; text-wrap: pretty; }
.przy-row__qty { font: 600 var(--fs-chip) var(--font-sans); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* chip podziału: wpisane wagi („1,2 kg, 1 kg, 800 g”) zawijają się w chipie, zamiast ściskać nazwę */
.przy-row__split { flex: 0 1 auto; max-width: 58%; height: auto; min-height: 36px; padding: 6px 12px; white-space: normal; line-height: 1.25; text-align: right; }
.przy-row__count, .przy-row__note { flex: none; font: 500 var(--fs-3) var(--font-sans); color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.przy-row--off { padding-bottom: 4px; }
.przy-row--off .przy-row__name { color: var(--text-2); }
.przy-row__sub { margin-top: -4px; font: 500 var(--fs-3)/1.4 var(--font-sans); color: var(--text-2); overflow-wrap: anywhere; }
/* „Zmień”: napis 12/600 olive w linii celu; cel 44 przez pseudoelement */
.przy-link { position: relative; display: inline; padding: 0 2px; font: 600 var(--fs-3)/1.4 var(--font-sans); color: var(--olive); }
.przy-link::before { content: ''; position: absolute; left: -8px; right: -8px; top: -14px; bottom: -14px; }
.przy-row .chips.przy-row__chips { padding-top: 8px; padding-bottom: 2px; }
.przy-weights { display: flex; align-items: stretch; gap: 8px; padding-top: 8px; }
.przy-weights > .field { flex: 1; min-width: 0; }
.przy-weights > .btn { flex: none; width: auto; padding: 8px 18px; }
.przy-row__detail { padding-top: 6px; font: 500 var(--fs-3)/1.4 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.przy-foot { margin: 0 2px 8px; font: 500 var(--fs-3)/1.4 var(--font-sans); color: var(--text-2); text-wrap: pretty; }

/* ---------- arkusz Asortyment ---------- */
.asort-list--sheet { border-top: 1px solid var(--hairline); }
.asort-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 6px 0; border-bottom: 1px solid var(--hairline); text-align: left; color: var(--ink); font-family: var(--font-sans); transition: background var(--ease); }
.asort-item:active { background: var(--paper); }
.asort-item__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.asort-item__name { font: 500 var(--fs-body)/1.25 var(--font-name); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.asort-item__sub { font: 500 var(--fs-3)/1.35 var(--font-sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
.asort-item__price { flex: none; font: 500 var(--fs-chip) var(--font-sans); color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.asort-acts { padding-top: 14px; }
.asort-note { display: flex; justify-content: center; padding-top: 4px; }
.asort-paste { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; }
.asort-msg { padding-top: 10px; }
.asort-form { display: flex; flex-direction: column; gap: 12px; padding-top: 2px; }
.asort-form .chips { padding-top: 0; padding-bottom: 0; }
.asort-units { margin-top: -4px; }
/* §95: zdanie pod „Sprzedają po” — co ta liczba robi w zamówieniu */
.asort-hint { margin-top: -6px; padding: 0 2px; font-size: var(--fs-3); }
.asort-form .toggle-row .hint { font-size: var(--fs-3); }
.asort-foot { display: flex; justify-content: center; gap: 16px; padding-top: 6px; }

/* ---------- arkusz Notatka (krótki) ---------- */
.note-form { display: flex; flex-direction: column; gap: 8px; padding-top: 2px; }
.note-form__area .field__input { min-height: 120px; }
.note-foot { display: flex; justify-content: center; padding-top: 6px; }

/* ---------- Ustawienia → Wiadomości do dostawców ---------- */
/* etykieta nad polem, pole na całą szerokość (jak „Zgłoś uwagę”); obrys hairline jak pola field--soft w Ustawieniach */
.zam-area { flex-direction: column; align-items: stretch; gap: 4px; border-color: var(--hairline); }
.zam-area .field__label { white-space: normal; }
.zam-area .field__input { min-height: 64px; }