/* Savat va to‘lov. TZ 8.
 *
 * ⛔ Bu ekran kuniga yuzlab marta ochiladi. Ikkita qaror shundan
 * chiqqan:
 *
 * 1. Skaner maydoni YIRIK va ekranning tepasida — kassir unga
 *    qaramasdan ura oladi.
 * 2. Miqdor maydoni o‘ngda va katta: bir qo‘lda tovar, ikkinchi
 *    qo‘lda yozuv.
 */

/* ── Tepa qator ────────────────────────────────────────── */

.sale-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sale-top .chek{font-variant-numeric:tabular-nums;font-size:var(--t-2);
  font-weight:var(--w-mid);color:var(--mid);letter-spacing:.02em;white-space:nowrap}
.sale-top .here{margin-left:auto;color:var(--muted);font-size:var(--t-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52%}
.sale-top select{margin-left:auto;height:36px;max-width:52%;
  border:0;box-shadow:var(--ctl-sh);border-radius:10px;
  background:var(--glass);
  color:var(--ink);font:inherit;font-size:var(--t-4);padding:0 8px}
.sale-top select:disabled{opacity:.55}

/* ⛔ Smena holati DOIM ko‘rinadi.
 *
 * Naqd savdo ochiq smenasiz o‘tmaydi (13.8). Kassir buni tasdiqlash
 * paytida emas, ISHNI BOSHLAGANDA bilishi kerak — aks holda savatni
 * to‘ldirib bo‘lib, oxirida to‘siqqa uriladi. */
.shift-chip{min-height:44px;padding:4px 12px;border-radius:9px;
  border:0;box-shadow:var(--ctl-sh);background:var(--glass);cursor:pointer;
  font:inherit;font-size:var(--t-2);font-weight:var(--w-mid);white-space:nowrap}
.shift-chip.on{color:var(--ok);border-color:rgba(15,145,96,.3);
  background:rgba(15,145,96,.08)}
.shift-chip.off{color:var(--danger);border-color:#f0cfcf;
  background:#fdf2f2}


/* ⛔ Sotuvchi TEPADA va doim ko‘rinadi.
 *
 * Tanlov yodda qoladi (kichik do‘konda kun bo‘yi bir odam xizmat
 * ko‘rsatadi), lekin yashirilsa noto‘g‘ri odamga yozilib ketardi va
 * oy oxirida hisob buzilardi. Ko‘rinib tursa — xato darhol seziladi. */
/* ── Savat sarlavhasi va sotuvchi chipi (BILLZ kassasi) ──── */
/* ⛔ QAYTARILADIGAN TOVARLAR (sale_return.js) — BILLZ «Товары к
   возврату / обмену»: savat sarlavhasi bilan BIR XIL sarlavha, qatorlar
   oddiy savat qatori. Rang yo‘q: qizg‘ish blok o‘zimning o‘ylab
   topganim edi, BILLZ da yo‘q (egasi, 2026-09-26). */
.ret-zone{margin:12px 0 4px}
.ret-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ret-head b{font-size:var(--t-6);font-weight:var(--w-head);letter-spacing:-.01em}
.cart-head{display:flex;align-items:center;gap:8px;margin:12px 0 8px}
/* ⛔ BILLZ «Корзина» — ekranning eng katta so‘zi (2026-09-27). Telefonda
   bir pog‘ona past: u yerda sarlavha qatori chiplar bilan bo‘lishiladi. */
.cart-head b{font-size:var(--t-7);font-weight:var(--w-head);letter-spacing:-.01em;
  line-height:var(--lh-tight)}
@media (max-width:819px){.cart-head b{font-size:var(--t-6)}}
.cart-head .cart-cnt,.ret-head .cart-cnt{min-width:26px;height:24px;padding:0 8px;border-radius:12px;
  background:#eef1f6;color:var(--mid);font-size:var(--t-2);font-weight:var(--w-mid);
  display:inline-flex;align-items:center;justify-content:center}
/* ⛔ SAVATNI BO‘SHATISH — qator soni YONIDA (BILLZ surati). Jim
   kulrang: kundalik amal emas. Bosilganda qizaradi. */
.cart-head .cart-wipe{border:0;background:none;padding:0 4px;
  color:var(--muted);font-size:var(--t-3);line-height:1;cursor:pointer;
  min-width:var(--tap);min-height:var(--tap)}
.cart-head .cart-wipe:hover,.cart-head .cart-wipe:active{color:var(--danger)}

/* ⛔ BILLZ «#000500073276»: asosiy shriftda, katta va och — «mashinka»
   shrifti (monospace) boshqa dasturdan qolgandek ko'rinardi (2026-09-27) */
.cart-head .chek{margin-left:auto;color:#c3c8cf;font-size:var(--t-6);
  font-weight:var(--w-head);font-variant-numeric:tabular-nums;white-space:nowrap}
/* ⛔ «#» CSS da, matnda emas: raqam nusxalansa yoki qidiruvga
   qo‘yilsa, belgisiz tushsin (ekran testlari ham matnni o‘qiydi) */
.cart-head .chek[data-num]::before{content:'#'}

/* ⛔ Ochiladigan ro‘yxat o‘rniga chip: do‘konda o‘nlab sotuvchi
   bo‘lishi mumkin va `select` telefonda uzun bo‘lib ketardi. */
.seller-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}
/* ⛔ TANLANMAGANI HAM TANLASA BO‘LADIGAN ko‘rinishda. `--muted`
   turgan edi va «Hammasi / Tugaganlari» juftligida tanlanmagani
   o‘chirilgan tugmadek ko‘rinardi: bittasi to‘q ko‘k, ikkinchisi
   oqargan (2026-09-12, suratda ko‘rindi). Tanlovni RAMKA va FON
   ko‘rsatadi, matnni o‘chirish orqali emas. */
/* ⛔ 44px — sensor (2026-09-19); 30 edi. */
.chip{height:44px;padding:0 14px;border-radius:22px;border:0;
  box-shadow:var(--ctl-sh);
  background:#fff;color:var(--ink);font:inherit;font-size:var(--t-2);cursor:pointer}
.chip.on{background:var(--mid);color:#fff}
.chip.add{width:44px;padding:0;color:var(--mid);font-size:16px}
/* ⛔ SOTUVCHI SO‘RALYAPTI (do‘kon `require_seller` yoqqan).
   Rang OGOHLANTIRISH (`--warn`), xato emas: kassir noto‘g‘ri ish
   qilmadi — shunchaki javob bermadi. */
.chip.ask{background:#fdf6ea;color:var(--warn);font-weight:var(--w-mid)}
/* Sotuvchi ro‘yxatidagi tartib raqami — «S», keyin «1» */
.seller-row-item .num{min-width:20px;height:20px;border-radius:6px;
  background:#eef1f6;color:var(--muted);font-size:var(--t-2);font-weight:var(--w-mid);
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto}
.ask-hint{margin-top:6px;color:var(--warn);font-size:var(--t-2)}

/* ⛔ Skaner maydoni — ekranning eng muhim elementi */
.scan-field input{height:var(--tap-lg);font-size:var(--t-5);font-weight:var(--w-mid)}
.scan-field input:focus{border-color:var(--mid);
  box-shadow:var(--ring)}

/* ── Sarlavhaning yangi unsurlari (BILLZ, namuna tasdiqlangan) ──
 * Joylashuvni pastdagi 820px bloklari hal qiladi: ikonlar, «/»
 * eslatmasi va klavish belgilari faqat kompyuterda ko‘rinadi. */
.scan-holder{display:flex;gap:10px}
.scan-field{flex:1;position:relative}
.scan-field input{width:100%;padding-left:42px;padding-right:96px}
/* ⛔ Tor ekranda «Bosing» so‘zi ketadi, «/» qoladi: 1366 da maydon
   ~290 px va yozuv «Shtrix-kod yoki no…» bo‘lib kesilardi (surat).
   Maydonning o‘z yozuvi eslatmadan muhimroq. */
@media (max-width:1499px){
  .scan-word{display:none}
  .scan-field input{padding-right:46px}
}
.scan-lupa{position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:var(--muted);pointer-events:none}
.scan-hint{position:absolute;right:14px;top:50%;display:flex;align-items:center;
  gap:6px;font-size:var(--t-2);color:var(--muted);
  transform:translateY(-50%);pointer-events:none}
/* Yozila boshlagach eslatma olib qo‘yiladi */
.scan-field input:not(:placeholder-shown)~.scan-hint{display:none}

/* ── Qidiruv ro‘yxati — maydonga YOPISHGAN (sale_find.js, 2026-09-24) ──
 * BILLZ dagidek: savat ustida turadi, qolgan ekran xiralashadi.
 * ⛔ Qidiruv qatori xira fondan YUQORIDA (`z-index`), aks holda
 * maydon ham xiralashib, kassir nima yozayotganini ko‘rmasdi.
 * ⛔ Fon butun ish maydonini qoplashi uchun savat panelida
 * `contain` olib tashlangan — `shell.css`, `.pane` yonida. */
.sf-dim{position:fixed;inset:0;z-index:30;background:rgba(20,28,45,.28)}
.scan-holder{position:relative;z-index:31}
/* ⛔ `top` maydon balandligidan, `100%` dan emas: kompyuterda qator
 * yonidagi kassa belgisi bilan cho‘ziladi va ro‘yxat 20 px pastga
 * tushib, maydondan ajralib qolardi (suratda ko‘rindi). */
.sf-list{position:absolute;top:calc(var(--tap-lg) + 6px);left:0;right:0;
  max-height:min(60vh,440px);overflow-y:auto;padding:6px;
  background:var(--glass);border-radius:14px;box-shadow:var(--sh-3)}
.sf-row{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;
  padding:8px 12px;border:0;border-radius:10px;background:none;
  font:inherit;color:var(--ink);text-align:left;cursor:pointer}
/* ⛔ `:hover` faqat YORITADI, hech narsa ochmaydi — sensorli
 * ekranda ham hammasi ishlaydi (NORMALAR N0) */
.sf-row:hover,.sf-row.on{background:var(--soft)}
.sf-row.on .sf-name{color:var(--mid)}
.sf-pic{width:40px;height:40px;flex:0 0 auto;display:flex;align-items:center;
  justify-content:center;overflow:hidden;border-radius:8px;
  background:var(--field);color:var(--muted);font-size:16px}
.sf-pic img{width:100%;height:100%;object-fit:cover}
.sf-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.sf-name{font-size:var(--t-4);font-weight:var(--w-mid);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.sf-code{font-size:var(--t-2);color:var(--muted);
  font-variant-numeric:tabular-nums}
.sf-side{flex:0 0 auto;display:flex;flex-direction:column;
  align-items:flex-end;gap:3px}
.sf-price{font-size:var(--t-4);font-weight:var(--w-bold);color:var(--price)}
.sf-left{font-size:var(--t-2);color:var(--ink)}
.sf-left.none{color:var(--muted)}
.sf-left.bad{color:var(--danger)}
/* Topilgan so‘z — BILLZ dagi ko‘k belgi */
.sf-row mark{padding:0 3px;border-radius:4px;background:var(--mid);color:#fff}
.sf-none{padding:18px 14px;color:var(--muted);font-size:var(--t-3)}
.sale-wrap .kbd{min-width:22px;height:22px;padding:0 6px;
  border:1px solid var(--line);border-radius:6px;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:var(--t-2);font-weight:var(--w-mid);color:var(--muted)}
/* ⛔ Kulrang to‘ldirilgan, SOYASIZ — BILLZ «A7». Oq va soyali
   tugmalar qidiruv maydonidan kuchliroq ko‘rinib, ko‘zni tortardi;
   ular esa kamdan-kam bosiladi. Rang — maydon rangi (`--field`). */
.icon-btn{position:relative;width:var(--tap);height:var(--tap);flex:0 0 auto;border:0;
  box-shadow:none;border-radius:12px;background:var(--field);
  color:var(--mid);font-size:21px;cursor:pointer}
/* «◷ 2» — surilganlar soni (egasi, 9-qaror). Burchakda, tugmani
   yopmaydi; rang — ogohlantirish: bu kutib turgan mijozlar */
.icon-btn .held-n{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;
  padding:0 5px;border-radius:9px;background:var(--warn);color:#fff;
  font-size:var(--t-1);font-weight:var(--w-mid);line-height:18px;text-align:center}
/* Ulgurji — lentaning kompyuterdagi ko‘rinishi: almashtirgich */
.tgl{display:none;align-items:center;gap:8px;margin-left:16px;
  border:0;background:none;color:var(--ink);font:inherit;
  font-size:var(--t-3);padding:0;cursor:pointer;min-height:44px}
.tgl .knob{width:38px;height:22px;border-radius:11px;
  background:#d7dbe2;position:relative}
.tgl .knob::after{content:'';position:absolute;left:2px;top:2px;
  width:18px;height:18px;border-radius:50%;background:#fff;
  box-shadow:var(--sh-knob);transition:left .15s}
/* ⛔ Yoqilgani lentadagi rang bilan bir xil — ikki ekranda ikki
   rang bo‘lsa kassir «bu boshqa narsa» deb o‘ylardi. */
.tgl.on .knob{background:#7b4bd6}
.tgl.on .knob::after{left:18px}
.sellers-row{display:contents}

/* ── Savat qatorlari ───────────────────────────────────── */

.lines{margin-top:6px}
/* ⛔ Tartib BILLZ dagidek: miqdor CHAPDA (kassir eng ko‘p shuni
   o‘zgartiradi), keyin rasm o‘rni, nom va kod, o‘ngda summa va
   sotuvchi ismi. */
.line{display:flex;align-items:center;gap:10px;padding:10px;
  border-radius:10px;background:#f7f8fa;margin-bottom:6px}

/* ⛔ FAQAT SAVAT QATORI. `.line` ni qaytarish ekrani ham
   ishlatadi (`return.js`) — u yerda tartib boshqacha va bu
   qoidalar unga tegmasligi kerak. */
.line.cart{background:var(--glass);border:0;box-shadow:var(--card-sh);
  border-radius:var(--card-r);padding:12px 10px;gap:10px;margin-bottom:8px}
.line.cart .thumb{width:44px;height:44px;border-radius:12px;font-size:18px}
/* Nom · narx · kod USTMA-UST: 390px da beshta ustun sig‘masdi */
.line.cart .who{gap:2px}
.line.cart .who b{font-size:var(--t-4)}
.line.cart .sum{text-align:left;font-size:var(--t-4)}
.line.cart .sub{font-size:var(--t-2)}

/* ⛔ NOM QIRQILMAYDI, O‘RALADI.
 *
 * Egasi suratda belgilab ko‘rsatdi: «MJCODIE…». 390px da bitta
 * qatorga nom, hisoblagich va o‘chirish tugmasi sig‘masdi va
 * nomdan sakkiz harf qolardi. Endi nom ikki qatorgacha o‘raladi
 * — qirqish faqat undan keyin.
 *
 * ⛔ `-webkit-line-clamp` — hamma brauzerda (jumladan Safari)
 * ishlaydigan yagona yo‘l; `line-clamp` hali hamma joyda emas. */
.line.cart .who b{white-space:normal;overflow-wrap:anywhere;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;line-height:1.25}

/* «− 1 ＋» — BILLZ hisoblagichi. ⛔ SENSOR (2026-09-19): 44px;
   28×36 edi — eng ko‘p bosiladigan tugma eng kichigi edi. */
.step{display:flex;align-items:center;flex:0 0 auto;
  border-radius:12px;background:#f2f4f7}
.step .pm{width:44px;height:44px;border:0;background:none;cursor:pointer;
  color:var(--mid);font-size:var(--t-5);line-height:1;font-family:inherit}
.step .qty{width:36px;height:44px;border:0;background:none;
  box-shadow:none;font-size:var(--t-4);padding:0}
.step .qty:focus{outline:none;box-shadow:none}

/* ⛔ O‘chirish tugmasi QAYTARILDI (egasi so‘radi). 44px — sensor. */
.line.cart .drop{width:44px;height:44px;flex:0 0 auto;border:0;
  border-radius:9px;background:transparent;color:#b9bfc7;
  font-size:var(--t-4);cursor:pointer}
.line.cart .drop:active{background:#fdf2f2;color:var(--danger)}
.line .who{flex:1;display:flex;flex-direction:column;min-width:0}
.line .who b{font-size:var(--t-3);font-weight:var(--w-bold);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.line .sub{font-size:var(--t-2);color:#adb3bb}
.line .sub s{opacity:.6;margin-left:4px}
/* Rasm hali yo‘q (ROADMAP 7.5 B3) — o‘rni turadi, bo‘sh ko‘rinadi */
.line .thumb{width:34px;height:34px;flex:0 0 auto;border-radius:8px;
  background:#fff;border:0;box-shadow:var(--ctl-sh);
  display:flex;align-items:center;justify-content:center;
  color:#c3c8cf;font-size:var(--t-4)}
.line .line-right{display:flex;flex-direction:column;align-items:flex-end;
  gap:2px;flex:0 0 auto}
.line .line-right .sub{color:var(--ink);font-weight:var(--w-mid)}
.line .qty{width:60px;height:44px;flex:0 0 auto;text-align:center;
  font-size:var(--t-4);font-weight:var(--w-mid);border:0;box-shadow:var(--ctl-sh);
  border-radius:9px;background:#fff;color:var(--ink);font-family:inherit}
/* ⛔ KATAKCHA YORLIG‘I. `input` ning umumiy qoidasi (to‘liq kenglik,
   44px balandlik) katakchaga ham tushib, u bo‘sh kulrang qutining
   o‘rtasida yolg‘iz turardi, yozuvi esa pastga tushib ketgan edi
   (UX_TANQID 1.1). Katakcha kichik, yozuv yonida, butun qator
   bosiladi. */
.check{display:flex;align-items:center;gap:10px;min-height:var(--tap);
  cursor:pointer;font-size:var(--t-3);color:var(--ink)}
.check input{width:22px;height:22px;flex:0 0 auto;margin:0;padding:0;
  box-shadow:none;accent-color:var(--mid)}
.line .qty:focus{outline:none;border-color:var(--mid);
  box-shadow:var(--ring)}
/* ⛔ Narx to‘q sariq — BILLZ dagidek (skrinshotdan olindi) */
.line .sum{text-align:right;font-size:var(--t-3);font-weight:var(--w-bold);
  color:var(--price)}
/* Kelishilgan narx (8.4) — qalam summaning yonida */
/* ⛔ Qalam 15×15 edi. Endi 44×44, manfiy chekka bilan — qator
   balandligi o‘zgarmaydi, barmoq maydoni kattalashadi. */
.line .pen{border:0;background:none;color:var(--price);cursor:pointer;
  font-size:var(--t-2);padding:0;min-width:44px;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  margin:-12px -12px -12px -4px}

/* ── Jami ──────────────────────────────────────────────── */

/* ⛔ NOMI `.totals` EMAS — 2026-09-08 da bu yerda `display:block`
   yozib qo‘yilgandi, chunki `debt.css` dagi bir nomli `.totals`
   grid bo‘lib savdo hisobini yonma-yon terib qo‘yardi.
   Lekin `.totals{display:block}` ham YALANG‘OCH: u orqaga qarab
   MIJOZ KARTOCHKASINING statistika gridini buzardi. Ikki fayl
   bitta nomni bo‘lishgani uchun to‘g‘ri yechim — nomni ayirish. */
/* ⛔ `.sums` va `.trow` — `base.css` da: ularni OLTI ekran
   ishlatadi (savdo, to‘lov, qaytarish, smena, chek kartochkasi).
   Bitta ekran faylida tursa, ikkinchisi uni «qarzga» olardi va
   `test_bare_layout_class_does_not_leak` aynan shuni ushladi. */
.trow.disc input{width:120px;flex:0 0 auto;height:44px;text-align:right;font-size:var(--t-4);
  border:0;box-shadow:var(--ctl-sh);border-radius:9px;background:#fff;
  color:var(--ink);font-family:inherit}

.sale-acts{display:flex;gap:8px;margin-top:14px}
.sale-acts .go,.sale-acts .ghost{flex:1;margin-top:0}
/* ⛔ YON BO‘SHLIQ MAJBURIY. Ilgari yo‘q edi va bilinmasdi: `.ghost`
   hamma joyda cho‘zilgan qatorda turardi (`.sale-acts .ghost{flex:1}`).
   «Men» ekranida u YOLG‘IZ turibdi va yozuv ramkadan chiqib ketdi —
   egasi suratda ko‘rsatdi. */
/* ⛔ RANG KULRANG EMAS. `color:var(--muted)` turgan edi va natijada
   «Sozlamalar» bilan «Xodimlar» O‘CHIRILGAN tugmaga o‘xshardi —
   ular esa «Men» ekranining asosiy amallari. Yonidagi «Chiqish»
   ulardan QORAROQ edi, ya‘ni ierarxiya teskari edi (2026-09-12,
   suratda ko‘rindi).

   O‘chirilgani baribir farq qiladi: `:disabled` da shaffoflik. */
.ghost{min-height:var(--tap);padding:0 14px;border-radius:12px;
  border:0;box-shadow:var(--ctl-sh);
  background:var(--glass);color:var(--ink);font:inherit;font-weight:var(--w-text);
  font-size:var(--t-3);letter-spacing:0;cursor:pointer}
/* ⛔ `.wide` `.oc` da bor edi, `.ghost` da yo‘q: «Xodimlar» va
   «Parolni tiklash» tugmalari yozuvi bo‘yicha qisqarib turardi. */
.ghost.wide{width:100%}
/* ⛔ Keng ekranda 1000 piksellik tugma bo‘lmaydi: «Sozlamalar» va
   «Xodimlar» butun kartochkani kesib o‘tgan oq tasma edi va
   yonidagi «Chiqish» bilan bir qatorga tushmasdi (2026-09-12,
   suratda ko‘rindi). Uchalasi endi bir xil kenglikda. */
@media (min-width:820px){.ghost.wide{max-width:340px}}
/* ⛔ Savat TASHQARISIDAGI tugma qatori (qaytarish ekrani) ham
   maydon enida: «Chekni topish» 560 ga tushgach, ostidagi ikki
   ikkilamchi tugma 1000 piksel bo‘lib undan keng chiqib qoldi —
   suratda ko‘rindi. Savat ichida (`.sale-wrap`) qator o‘z enida. */
@media (min-width:820px){
  main:not(:has(.sale-wrap)) .sale-acts{max-width:560px}
}
.ghost:disabled{opacity:.5}
/* ⛔ Xavfli amalning ochuvchi tugmasi ham qizil: bosishdan
   OLDIN ko‘rinsin (tasdiq tugmasi `.go.danger`). */
.ghost.danger{color:var(--danger);border-color:#f0cfcf}

/* ── Telefon oqimi: savat → detallar ───────────────────────
 *
 * ⛔ Egasi BILLZ telefon ilovasini ko‘rsatdi: savat ekranida
 * FAQAT tovarlar turadi, mijoz-chegirma-izoh esa keyingi
 * qadamda. Bizda hammasi bitta uzun ustunda edi va kassir
 * jamini ko‘rish uchun suraverardi.
 *
 * DOM bitta — faqat ko‘rinish o‘zgaradi (`data-step`). */

.cart-head .cart-back{display:none;border:0;background:none;padding:0 4px;
  color:var(--mid);font-size:var(--t-6);line-height:1;cursor:pointer}
.chip.more{width:44px;flex:0 0 44px;padding:0;color:var(--muted);font-size:16px}
/* ⛔ Profil belgisi va mijoz/sotuvchi paneli — FAQAT TELEFONDA (dizayn «1»,
   `sale_who.js`). Kompyuterda «1-kassa · …» qatori va o‘ng ustun joyida. */
.prof-btn,.cart-head .tel-list{display:none}
.cnt-pill{display:contents}
.line.cart .drop .drop-w{display:none}

/* ⛔ Lenta chip emas: chip ikki qatorga bo‘linib ketardi va
   «Ulgurji / narx» bo‘lib turardi (egasi suratda ko‘rsatdi). */
.wholesale-banner{width:100%;min-height:44px;margin-bottom:10px;
  border:0;box-shadow:var(--ctl-sh);border-radius:12px;
  background:var(--glass);
  color:var(--muted);font:inherit;font-size:var(--t-3);font-weight:var(--w-mid);
  cursor:pointer}
.wholesale-banner.on{background:#7b4bd6;border-color:#7b4bd6;color:#fff}

.cart-empty{display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:44px 16px;text-align:center;color:var(--muted)}
.cart-empty .bars{font-size:30px;letter-spacing:3px;color:#dfe3e8}
.cart-empty b{font-size:var(--t-5);color:var(--ink)}
.cart-empty span{font-size:var(--t-2)}

/* ⛔ `sticky`, `fixed` emas: pastdagi navigatsiya alohida grid
   yo‘lakchasida turadi va `fixed` uni yopib qo‘yardi. */
.sale-bar{position:sticky;bottom:0;display:flex;gap:8px;
  padding:10px 0 2px;background:var(--page)}
.sale-bar .go,.sale-bar .ghost{flex:1;margin-top:0}
.sale-bar{flex-wrap:wrap}
.bar-due{width:100%;display:flex;justify-content:space-between;
  align-items:baseline;padding:0 4px 8px;font-size:var(--t-3);color:var(--muted)}
.bar-due b{font-size:20px;color:var(--ink);font-variant-numeric:tabular-nums}

@media (max-width:819px){
  /* ⛔ SENSOR (2026-09-19): «−/＋/🗑» 44px bo‘lgach telefonda nomga
     80px qoldi. Rasm o‘rni (hali rasm yo‘q, ROADMAP 7.5 B3) bo‘sh
     quti — telefonda yashiriladi, 50px nomga qaytadi. */
  .line.cart .thumb{display:none}
  /* ⛔ KULRANG VARAQ, OQ KARTOCHKALAR.
   *
   * BILLZ telefon ilovasida fon kulrang va har blok — oq
   * kartochka. Bizda aksi edi: oq varaq ustida kulrang
   * qatorlar. Egasi ikkala suratni yonma-yon qo‘yib ko‘rsatdi.
   *
   * Panelning o‘zi shaffof qilinadi (`shell.css`), ichidagi
   * bloklar esa shu yerda oq kartochkaga aylanadi. */
  .head-card{background:var(--glass);border:0;box-shadow:var(--card-sh);
    border-radius:var(--card-r);padding:12px;margin-bottom:10px}
  .head-card .wholesale-banner{margin-bottom:0}
  /* Telefonda klaviatura yo‘q: ikonlar «⋯» da, eslatmalar ortiqcha */
  .scan-hint,.sale-wrap .kbd,.cart-empty .on-desk,.cart-keys{display:none}
  /* ⛔ TELEFON SAVATI — BILLZ ILOVASI YO‘LIDA (egasi, 2026-09-27: suratlar,
     «juda katta joy egallagan», «chegarasi to‘g‘rilanmagan»).

     1. «Yangi savdo | Barcha savdolar» qatori savatda YO‘Q — ~60px. Cheklar,
        qaytarish va surilganlar — qidiruv yonidagi belgilar (kompyuterdagi
        o‘sha tugmalar, ilgari telefonda yashirin edi). Ro‘yxat ekranida
        qator qoladi: u savatga qaytish yo‘li (`sale_tab.js`, `data-now`). */
  .sale-ops[data-now="sale"]{display:none}
  .icon-btn{width:44px;height:44px;border-radius:12px;font-size:19px}
  .icon-btn svg{width:19px;height:19px}
  /* 2. Smena chipi — yashil QUTI emas, bir qatorli yozuv. Tugma bo‘lib
        qoladi: smenani yopish yo‘li shu (bosish maydoni 44px o‘zgarmaydi).
        Yopiq smena — qizil quti QOLADI: bu ogohlantirish. */
  .shift-chip.on{background:none;box-shadow:none;padding:4px 0}
  .sale-top{margin-bottom:4px}
  /* 3. Ulgurji — 2026-09-27 da «⋯» ichida edi, lenta faqat yoqilganda.
        2026-09-28 dan sarlavhadagi almashtirgich (pastda), lenta yo‘q. */
  .wholesale-banner{display:none}
  /* 4. «Skaner» tugmasi faqat qidiruvga fokus berardi; qo‘l skaneri
        maydonga o‘zi yozadi (egasi: «skaner bizga shart emas»). Bo‘sh
        savatda panelda boshqa hech narsa yo‘q — panel ham yo‘q. */
  .sale-bar [data-scan-focus],.sale-bar.thin{display:none}
  /* ⛔ Qidiruv maydoni to‘ldirilgan va chegarasiz — BILLZ dagidek */
  .scan-field input{background:#f2f4f7;border-color:transparent;
    border-radius:14px}
  /* ⛔ Chip sinmasin: «Barcha sotuvchilar» ikki qatorga bo‘linib,
     sarlavhani ikki barobar balandlashtirib qo‘yardi. */
  .cart-head .chip{white-space:nowrap;overflow:hidden;
    text-overflow:ellipsis;max-width:46%}
  /* Detallar qadamida har blok — alohida oq kartochka */
  [data-step="details"] .side-block,
  [data-step="details"] .sums{background:var(--glass);
    border:0;box-shadow:var(--card-sh);border-radius:var(--card-r);
    padding:12px;margin-bottom:10px}
  /* Pastki panel ham oq kartochka, tugmalari dumaloq */
  .sale-bar{background:var(--glass);border-radius:18px;padding:10px;
    margin-top:auto}
  .sale-bar .go,.sale-bar .ghost{border-radius:26px;min-height:52px}
  /* ⛔ Panel pastga yopishsin: ustun cho‘ziladi, panel esa
     `margin-top:auto` bilan ostiga tushadi (`shell.css` dagi
     zanjir bilan birga ishlaydi). */
  .sale-wrap{flex:1;display:flex;flex-direction:column}
  /* ⛔ `min-height:0` + `overflow-y:auto` — ikkalasi ham majburiy.
     Busiz uzun ro‘yxat pastdagi panel ostiga kirib ketardi va
     «To‘lanadi» qatori ko‘rinmasdi (`.pane` da `contain:paint`
     bor, ya‘ni chetdan chiqqan mazmun jimgina qirqiladi). */
  .sale-grid{flex:1;min-height:0;overflow-y:auto}
  .sale-bar{margin-top:auto}
  /* Oxirgi kartochka panelga tegib turmasin */
  [data-step="details"] .sale-side{padding-bottom:16px}
  /* ⛔ «To‘lanadi» IKKI MARTA yozilmasin: panel uni DOIM ko‘rsatadi
     (`bar-due`) va nusxa uning ustida turardi (suratda ko‘rindi).
     Kompyuterda panel yo‘q — qator o‘z joyida qoladi. */
  [data-step="details"] .sale-side .trow.big{display:none}
  /* ⛔ Savat qadami: MIJOZ VA SOTUVCHI TO‘LOV TUGMASI USTIDA (dizayn «1»,
     `sale_who.js`). 2026-09-27 da mijoz kartasi tovarlar OSTIDA edi (egasi:
     «mijoz tanlash yerkani yo‘q») — uzun savatda pastga surilib ketardi.
     O‘ng ustundan savat qadamida faqat xabar (`.msg`) qoladi; mijoz,
     chegirma va izoh — detallar qadamida. */
  [data-step="cart"] .sale-side{display:block;padding:0}
  [data-step="cart"] .sale-side>[data-side],
  [data-step="cart"] .sale-side .side-foot,
  [data-step="cart"] .cart-head .sellers-row{display:none}
  .who-row{width:100%;display:flex;gap:8px}
  .who-pick{flex:1 1 0;min-width:0;min-height:48px;padding:4px 12px;
    border:0;border-radius:14px;background:var(--page);cursor:pointer;
    font:inherit;display:flex;flex-direction:column;align-items:flex-start;
    justify-content:center;text-align:left}
  .who-k{font-size:var(--t-1);color:var(--muted)}
  .who-v{max-width:100%;font-size:var(--t-3);font-weight:var(--w-mid);
    color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .who-pick:not(.on) .who-v{color:var(--mid)}
  .who-pick.ask .who-v{color:var(--warn)}
  /* ⛔ Mijoz: ism kesiladi, oxirgi 4 raqam QOLADI (sale_who.js `phoneTail`) */
  .who-pick.on[data-bar-cust] .who-v{display:flex;gap:6px}
  /* ⛔ Mijoz tanlangach uning tugmasi KENGAYADI (2026-09-29, namuna «A»):
     sotuvchi tugmasi o‘z yozuvicha («Aziza ›», «tanlash shart ›» —
     kesilmaydi), lekin yarmidan oshmaydi; qolgan joy — mijoz ismiga. */
  .who-pick.on[data-bar-cust]{flex:1 1 auto}
  .who-pick.on[data-bar-cust] + .who-pick{flex:0 1 auto;max-width:50%}
  .who-nm{min-width:0;overflow:hidden;text-overflow:ellipsis}
  .who-tail{flex:none;color:var(--muted);font-variant-numeric:tabular-nums}
  /* ⛔ Profil — «1-kassa · Direktor» qatorining o‘rni. OCHIQ smena qatori
     yashiriladi (u endi profilda); yopiq/sanalgan/kassasiz — ogohlantirish,
     tepada qoladi (QARORLAR 2026-09-27: «yopiq — qizil quti»). */
  .sale-top.calm{display:none}
  .prof-btn{display:flex;align-items:center;justify-content:center;
    width:44px;height:44px;flex:0 0 44px;border:0;border-radius:50%;
    background:var(--mid);color:#fff;cursor:pointer;
    font:inherit;font-size:var(--t-2);font-weight:var(--w-mid)}
  /* ⛔ NAMUNA «A» (egasi, 2026-09-28: «ayrim joylar katta»): qidiruv
     yonidagi uch belgi telefonda yo‘q — «Cheklar» sarlavhada, qaytarish
     va surilganlar «⋯» ichida (`sale_steps.openMore`). Qidiruv to‘liq enli. */
  .scan-holder > .icon-btn{display:none}
  /* ⛔ ULGURJI — SARLAVHADAGI ALMASHTIRGICH, «⋯» ichida emas (egasi,
     2026-09-28: «web versiya kabi», «hammasini umumiy kichikroq qil —
     sig‘adi»). Qatorda yettita narsa: sarlavha bir pog‘ona kichik,
     tugmalar 38px, yozuv almashtirgich USTIDA bitta so‘z. 360px da ham
     sig‘adi (`TestPhoneHeadA`). Lenta ham yo‘q — holatni tugmacha
     rangi aytadi, kompyuterdagidek. */
  .cart-head{gap:2px}
  /* ⛔ 360px da «Savat 99» bilan zaxirasiz sig‘adi; undan ko‘pida so‘z
     kesiladi, tugmalar esa joyida qoladi (test: ikki xonali son) */
  .cart-head b{font-size:var(--t-5);min-width:0;overflow:hidden;text-overflow:ellipsis}
  .cart-head .tgl{display:inline-flex;flex-direction:column;align-items:center;
    gap:2px;margin-left:auto;font-size:var(--t-1);font-weight:var(--w-mid);
    color:var(--muted);line-height:1.2}
  .cart-head .tgl.on{color:#7b4bd6}
  .cart-head .tgl .tgl-x{display:none}
  .cart-head .tgl .knob{width:34px;height:20px;border-radius:10px}
  .cart-head .tgl .knob::after{width:16px;height:16px}
  .cart-head .tgl.on .knob::after{left:16px}
  /* ⛔ KO‘RINISHDA 38px, BOSISHDA 44px (TZ 2.1, `test_touch_targets`):
     shaffof 3px chekka — `background-clip:content-box`. Qator sig‘adi,
     barmoq esa hamon 44px maydonga tegadi. Birinchi urinishda tugmalar
     rostdan 38px edi — qo‘riqchi test ushladi. */
  .cart-head .tel-list,.cart-head .chip.more,.cart-head .prof-btn{
    width:44px;height:44px;flex:0 0 44px;min-height:44px;padding:3px;
    background-clip:content-box;box-shadow:none}
  .cart-head .chip.more{background-color:var(--page)}
  .cart-head .tgl{min-width:44px}
  /* ⛔ Soni va 🗑 — bitta kulrang tugmacha (BILLZ «[1 🗑]», egasi 2026-09-28) */
  .cart-head .cnt-pill{display:inline-flex;align-items:center;height:38px;
    padding:0 0 0 10px;border-radius:19px;background:var(--page)}
  .cart-head .cnt-pill:not(:has(.cart-wipe)){padding-right:12px}
  .cart-head .cnt-pill .cart-cnt{background:none;min-width:0;padding:0;
    color:var(--mid);font-size:var(--t-4)}
  .cart-head .cnt-pill .cart-wipe{width:44px;height:44px;flex:0 0 44px;
    color:var(--danger)}
  /* ⛔ CHAPGA SURIB O‘CHIRISH (egasi, 2026-09-28, BILLZ «Удалить»):
     🗑 qatorda yo‘q — qator 44px kengayadi. «O‘chirish» qator orqasida,
     eni surish bilan birga o‘sadi (`--sw`, `sale_lines.wireSwipe`). */
  .lines .line.cart[data-line]{position:relative;overflow:hidden;touch-action:pan-y;
    user-select:none;-webkit-user-select:none}
  .lines .line.cart[data-line] > :not(.drop){transform:translateX(var(--sw,0px));
    transition:transform .18s}
  .lines .line.cart[data-line] .drop{position:absolute;top:0;right:0;bottom:0;
    height:auto;width:calc(var(--sw,0px) * -1);border-radius:0;padding:0;
    overflow:hidden;white-space:nowrap;background:var(--danger);color:#fff;
    font-size:var(--t-3);font-weight:var(--w-mid);transition:width .18s}
  .lines .line.cart[data-line] .drop svg{display:none}
  .lines .line.cart[data-line] .drop .drop-w{display:inline}
  .lines .line.cart.swiping > :not(.drop),
  .lines .line.cart.swiping .drop{transition:none}
  [data-step="details"] .cart-head .tgl{display:none}
  /* ⛔ QUTILAR IXCHAM, SHRIFT QALINLIGI O‘ZGARMAYDI (egasi, 2026-09-28:
     «razmer bizda biroz katta», «tavsiya»). BILLZ surati bilan o‘lchandi:
     shrift u yerda kichik EMAS — qutilar kichik: qidiruv ~46px (bizda 52),
     pastki panel ~90px (bizda ~140). Bosish maydoni 44px dan pastga
     tushmaydi (DIZAYN 5.1). Qidiruv yozuvi 16px — iOS undan kichik
     maydonni bosganda sahifani o‘zi kattalashtiradi (DIZAYN 1.5). */
  .head-card{padding:10px}
  .head-card .scan-field{margin-bottom:0}
  .scan-field input{height:44px;font-size:16px}
  .cart-head{margin-bottom:6px}
  .sale-bar{padding:8px;gap:6px}
  .sale-bar .go,.sale-bar .ghost{height:48px;min-height:48px}
  .who-row{gap:6px}
  .who-pick{min-height:44px;padding:2px 12px;border-radius:12px}
  .cart-head .tel-list{display:flex;align-items:center;justify-content:center;
    border-radius:50%;color:var(--mid)}
  .cart-head .chip.more{margin-left:auto}
  .cart-head .tel-list ~ .chip.more{margin-left:0}
  /* Tovar qatorlari — bitta oq kartada, ingichka chiziq bilan (dizayn «1»):
     alohida kartochkalar har qatorga ~20px soya va oraliq qo‘shardi. */
  .lines:has(.line.cart){background:var(--glass);border-radius:var(--card-r);
    box-shadow:var(--card-sh);overflow:hidden;margin-top:0}
  .lines .line.cart{box-shadow:none;border-radius:0;margin:0;
    padding:8px 6px 8px 12px;border-bottom:1px solid #eef0f3}
  .lines .line.cart:last-child{border-bottom:0}
  .line.cart .who{gap:0}
  .line.cart .who b{font-size:var(--t-3)}
  .line.cart .sum{font-size:var(--t-3)}
  .line.cart .sub{font-size:var(--t-1)}
  .line.cart .step{background:var(--page);border-radius:12px}
  .line.cart .step .qty{width:44px;background:none;box-shadow:none}
  .sale-top.calm ~ .cart-head{margin-top:0}
  [data-step="details"] .prof-btn,
  [data-step="details"] .cart-head .tel-list{display:none}
  /* Detallar qadami: savat va qidiruv yo‘q, orqaga tugmasi bor */
  [data-step="details"] .scan-holder,
  [data-step="details"] .wholesale-banner,
  [data-step="details"] .sale-main,
  [data-step="details"] .cart-cnt,
  [data-step="details"] .cart-wipe,
  [data-step="details"] .chip.more{display:none}
  [data-step="details"] .cart-head .cart-back{display:block}
  /* ⛔ O‘ng ustundagi tugmalar nusxasi telefonda yashiriladi:
     ularning o‘rnini pastki panel egallaydi. Aks holda bir
     ekranda ikkita «To‘lov» turardi.

     ⛔ QOIDA `.sale-side` ICHIDA. Yalang‘och sinf bo‘lganda
     QAYTARISH ekrani buzilardi: u ham `.sale-acts` ishlatadi va
     telefonda ikkita tugmasi umuman ko‘rinmasdi (2026-09-19,
     suratda ko‘rindi — test emas). */
  .sale-side .sale-acts{display:none}
  /* ⛔ Chek raqami savat qadamida sarlavhani siqib qo‘yardi, lekin
     detallar qadamida u KERAK: kassir qaysi chek bilan ishlayotganini
     ko‘rsin (BILLZ da bu ekranning sarlavhasi — «Транзакция №»). */
  [data-step="cart"] .cart-head .chek{display:none}
  [data-step="details"] .cart-head .chek{font-size:var(--t-3)}
}

/* ── Kompyuter: savat markazda, hisob o‘ngda ────────────────
 *
 * ⛔ BILLZ kassasidagi tuzilish (egasi skrinshot yubordi):
 * markazda qidiruv va savat, o‘ngda mijoz/chegirma va pastida
 * «To‘lov» tugmasi. Telefonda bitta ustun bo‘lib qoladi —
 * DOM bitta, faqat joylashuv o‘zgaradi. */
@media (min-width:820px){
  /* ⛔ O‘NG USTUN EKRANNING TEPASIDAN BOSHLANADI (egasining BILLZ
   * surati: «Klient» va «Chegirma» qidiruv bilan bir satrda).
   * Bizda o‘ng ustun skaner va lentadan KEYIN boshlanardi — 1440px
   * da ekranning yarmi bo‘sh turardi. `.head-card` to‘rdan tashqarida
   * edi; `display:contents` bilan uning qutisi yo‘qoladi va ustunlar
   * `.sale-wrap` to‘riga tushadi — DOM o‘zgarmaydi (telefon
   * joylashuvi buzilmasin, 4-bo‘lim). */
  /* ⛔ `grid-template-rows` MAJBURIY. Ikkala qator ham `auto`
     bo‘lsa, to‘rning ortiqcha balandligi ULAR ORASIDA teng
     bo‘linadi (`align-content` sukut bo‘yicha `stretch`) va
     savat qatori ekranning o‘rtasiga — sarlavhadan 250px pastga
     tushib qolgan edi (suratda ko‘rindi). */
  .sale-wrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;
    grid-template-rows:auto 1fr;
    gap:0;align-items:start;position:relative;
    /* ⛔ ISH MAYDONINING TO‘LIQ BALANDLIGI: `main` ning yuqori va
       pastki chekkasi (24+24). Ilgari 150 edi — katta sarlavha bilan
       hisoblangan; sarlavha olingach (BILLZ «A5») o‘ng ustun 100 px
       qisqa qoldi va «To‘lov» ostida bo‘shliq paydo bo‘ldi (egasi
       suratda ko‘rsatdi, 2026-09-25). Ikki qoida BITTA o‘zgaruvchidan. */
    --sale-h:calc(100vh - 48px);
    min-height:var(--sale-h)}
  .sale-grid{display:contents}
  /* ⛔ Joylashuv ANIQ ko‘rsatiladi, avtomatik emas: o‘ng ustun
     ikkala qatorni ham egallashi kerak va avtomatik joylashtirish
     uni birinchi bo‘sh katakka tashlab yuborardi. */
  .head-card{grid-column:1;grid-row:1}
  .sale-main{grid-column:1;grid-row:2}
  .sale-side{grid-column:2;grid-row:1 / span 2}

  /* ⛔ TEPA BLOK IKKI QATOR, BESHTA EMAS (egasining BILLZ surati):
   *
   *     qidiruv maydoni ................ [belgi tugmalari]
   *     Korzina  0  [Ulgurji]  ......... #000500073276
   *
   * Bizda beshta narsa beshta qatorda edi — 1440px da tepa blok
   * 215px, savat ekranning yarmida. Telefonda tartib O‘ZGARMAYDI,
   * shuning uchun DOM emas, `order`. `flex-basis` piksellarda:
   * 820px da juftliklar o‘zi alohida qatorga tushadi. */
  .head-card{display:flex;flex-wrap:wrap;align-items:center;
    gap:8px;padding-right:20px;margin-bottom:8px}
  .head-card .scan-holder{order:1;flex:1 1 460px}
  .head-card .sale-top{order:2;flex:0 0 auto;margin:0}
  /* ⛔ QATOR TEKIS (egasi, 2026-09-28, surat: «tekis emas»): maydonning
     umumiy `margin-bottom:14px` i qatorni 66px qilardi va smena chipi
     o‘sha 66 ning o‘rtasiga — 7px pastga — tushardi; chip 44px, maydon
     va belgilar 52px edi. Endi uchalasi bir chiziqda, bir balandlikda. */
  .head-card .scan-field{margin-bottom:0}
  .head-card .shift-chip{min-height:var(--tap)}
  /* ⛔ Savat qatori TO‘LIQ kenglikda: «Savat 0 · almashtirgich»
     chapda, chek raqami o‘ngda (BILLZ). Sotuvchi chipi esa
     `order` bilan O‘RALIB o‘z qatoriga tushadi — `wrap` siz u
     hammani bir qatorga siqib, almashtirgich yozuvini sindirardi
     (2026-09-15, suratda ko‘rindi). */
  .head-card .ret-box{order:3;flex:1 1 100%}
  .head-card .cart-head{order:4;flex:1 1 100%;flex-wrap:wrap;margin:0}
  .head-card .sellers-row{display:flex;order:5;flex:1 1 100%;gap:8px}
  .tgl{white-space:nowrap}
  /* Lenta va «⋯» kompyuterda ortiqcha: almashtirgich va ikonlar bor */
  .wholesale-banner,.cart-head .chip.more{display:none}
  .tgl{display:inline-flex}
  .cart-empty .on-tel{display:none}
  /* ⛔ Bo‘sh savat maydoni shtrixli ramkada (BILLZ): kassir savat
     QAYERDA turishini bo‘shida ham ko‘radi. Rang --line dan biroz
     to‘qroq — shtrix ingichka va och rangda umuman ko‘rinmasdi. */
  .lines:has(.cart-empty){border:1.5px dashed #d3d8df;
    border-radius:14px;min-height:460px;
    display:flex;align-items:center;justify-content:center}
  /* O‘chiq tugmalar — bo‘sh savat: turadi, lekin bosilmaydi */
  .sale-acts .kbd{margin-left:8px}
  .sale-acts .ghost[disabled]{opacity:.55;cursor:default}
  .sale-acts .go[disabled]{background:#e8ebf0;color:#98a0ab;
    cursor:default}
  .sale-acts .go[disabled] .kbd{background:#fff;
    border-color:transparent;color:#98a0ab}
  /* ⛔ AJRATUVCHI CHIZIQ UZLUKSIZ BO‘LSIN.
   *
   * Egasi BILLZ skrinshotida shuni belgilab ko‘rsatdi: u yerda
   * markaz va o‘ng ustun orasida bitta uzun chiziq turadi.
   * Bizda chegara ustunning O‘ZIGA berilsa, chiziq ustun
   * mazmuni qayerda tugasa — o‘sha yerda uziladi (savat bo‘sh
   * bo‘lsa qisqa, to‘lsa uzun). Shuning uchun chiziq ustunga
   * emas, gridning O‘ZIGA — absolyut joylashgan element sifatida
   * chiziladi va har doim to‘liq balandlikda turadi.
   *
   * `min-height` ham shu uchun: savatda bitta tovar bo‘lsa ham
   * chiziq yarim ekranda kesilib qolmasin. */
  /* ⛔ VERTIKAL CHIZIQ OLIB TASHLANDI (2026-09-13). BILLZ da
     ustunlar chiziq bilan emas, BO‘SHLIQ bilan ajratiladi —
     egasi: «barcha narsani billz kabi qil». Chiziq ekranni
     ikkiga kesib turardi. */
  .sale-main{padding-right:24px}
  /* Hisob va tugma ekran bilan birga suriladi — kassir uzun
     savatda ham «To‘lov» ni qidirmasin. `align-items:start`
     shu uchun kerak: ustun mazmuni bo‘yicha qisqa bo‘lsagina
     `sticky` ga yuradigan joy qoladi. */
  /* ⛔ Ustun EKRAN BALANDLIGIDA turadi va hisob uning OSTIDA.
   *
   * BILLZ da «Podytog · Skidka · OPLATIT» kartochkasi o‘ng
   * ustunning tubida turadi va savat qancha uzun bo‘lsa ham
   * ko‘rinib qoladi. Bizda hisob mijoz blokining ostiga
   * yopishgan edi: bo‘sh savatda u ekranning o‘rtasida osilib
   * turardi, uzun savatda esa yuqoriga surilib ketardi.
   *
   * `sticky` uchun BALANDLIK kerak: `align-self:start` bo‘lmasa
   * element to‘r katagiga cho‘ziladi va suriladigan joy qolmaydi. */
  /* ⛔ «TO‘LOV» HECH QACHON AYLANIB KETMAYDI (2026-09-24).
   *
   * Ilgari butun ustun `overflow-y:auto` edi: mijoz, chegirma,
   * hisob va «To‘lov» BITTA aylanadigan qutida. Ekran past bo‘lsa
   * «To‘lov» qutining tubiga, ko‘rinmas joyga tushardi. Egasi
   * suratda ko‘rsatdi: noutbukda Windows 125% masshtabida (sayt
   * uchun ~1536×700) «Chetga sur» yarmi kesilgan, «To‘lov» YO‘Q.
   * Men esa 1920×960 da sinagan edim va ko‘rmagandim.
   *
   * BILLZ: hisob va «Оплатить» ustun tubiga MIXLANGAN, faqat
   * yuqori qism aylanadi. Endi bizda ham: `[data-side]` aylanadi,
   * hisob, tugmalar va xabar — yo‘q.
   *
   * Qo‘riqchi: `tests/ui/test_wide_screen.py` (1366×620 da ham). */
  .sale-side{padding-left:20px;position:sticky;top:0;align-self:start;
    height:var(--sale-h);display:flex;flex-direction:column;
    overflow:hidden}
  /* ⛔ «Pastda yana bor» belgisi — so‘nib boradi. Busiz kesilgan
     joy buzilgandek ko‘rinardi: mijoz tanlangach «Izoh qo‘shish»
     hisob qatorlari ustida yarmi kesilib turardi (2026-09-24,
     surat). `padding-bottom` so‘nish bilan bir xil — oxirigacha
     aylantirilganda so‘nadigan joy BO‘SH bo‘ladi, tugma emas. */
  .sale-side>[data-side]{flex:1 1 auto;min-height:0;overflow-y:auto;
    padding-bottom:28px;
    -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);
    mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent)}
  .sale-side>.side-foot,.sale-side>.msg{flex:0 0 auto}
  /* ⛔ Oq kartochka ustun tubida (BILLZ «A8»); «Chetga sur» unda
     kulrang — oq kartochkada oq tugma ko‘rinmasdi */
  .sale-side>.side-foot{margin-top:auto;padding:4px 14px 14px;
    border-radius:14px;background:var(--glass);box-shadow:var(--ctl-sh)}
  .side-foot .sale-acts .ghost{background:var(--field);box-shadow:none}
  /* Tor ustunda chegirma maydoni qatorga sig‘sin */
  .sale-side .trow.disc input{width:110px}
  /* ⛔ Ustunga aylanish TOR USTUNNIKI, sinfniki emas: qaytarish
     ekranida o‘sha sinf keng joyda yonma-yon turadi. */
  .sale-side .sale-acts{flex-direction:column}
  /* ⛔ `flex:0 0 auto` — aks holda ustun yo‘nalishida `flex:1`
     tugmaning balandligini yeb qo‘yadi va u yassilanadi. */
  .sale-side .sale-acts .go,
  .sale-side .sale-acts .ghost{flex:0 0 auto;width:100%}
  /* ⛔ Tor ustunda «Jami · summa» yonma-yon sig‘maydi */
  .sale-side .trow{padding:8px 10px}
  /* Pastki panel va orqaga tugmasi faqat telefonda */
  .sale-bar,.cart-head .cart-back{display:none}
}

/* ⛔ TO‘LOV TURINI TUZATISH (8.11) — «pf» qo‘shimchasi bilan.
 *
 * Yalang‘och sinf global qoida beradi (DIZAYN.md 3): `.row` yoki
 * `.sums` deb yozilsa, boshqa ekranning elementi jimgina
 * o‘zgarardi — `.when` bilan aynan shunday bo‘lgan.
 *
 * ⛔ Bo‘shliq bilan ajratiladi, chiziq bilan emas (DIZAYN.md 5.2):
 * to‘rtta to‘lov turi ro‘yxati chiziqlar bilan kesilsa, uch
 * qatorlik forma jadvalga o‘xshab qolardi. */
/* ⛔ Izoh bilan birinchi yorliq orasida bo‘shliq. Busiz
   telefonda izoh ikki qatorga bo‘linib, «Naqd» unga yopishib
   qolardi va yorliq izohning uchinchi qatoridek o‘qilardi —
   suratda ko‘rindi. */
.pf-say{margin-bottom:12px}
.pf-row input{text-align:right}
.pf-sums{margin-top:18px}

/* ⛔ Hisob ustuni MAYDONLAR bilan bir enlikda. Kengligi
   cheklanmasa, 1280 piksel monitorda maydonlar 560 px, «Farq»
   esa 1000 px bo‘lib turardi va ustun qiyshiq ko‘rinardi —
   suratda ko‘rindi. O‘lchov `base.css` dagi `.field` bilan
   bir xil va o‘sha shartda yoqiladi. */
@media (min-width:820px){
  main:not(:has(.sale-wrap)) .pf-sums{max-width:560px}
}

/* ⛔ Farq — ekrandagi ENG MUHIM son: u nol bo‘lmaguncha tugma
   bosilmaydi. Shuning uchun rang bilan aytiladi, yozuv bilan
   emas — kassir raqamni yozayotib ko‘radi.
   ⛔ SELEKTOR UCH SINFDAN: `base.css` dagi `.trow .money`
   rangni `--ink` qilib qo‘yadi va yalang‘och `.pf-bad` undan
   past turadi — qizil UMUMAN chiqmasdi. Suratdan topildi. */
.pf-sums .trow .pf-bad{color:var(--danger)}

/* ⛔ «Bu narxda bonus yo‘q» — savat qatoridagi ogohlantirish
   (egasi, 2026-09-20). Rangi OGOHLANTIRISH, xato emas: narx
   noto‘g‘ri deyilmayapti, shunchaki bonus tushmaydi. */
.cart-nobonus { color: var(--warn); font-weight:var(--w-mid); }

/* ── Narx paneli (price_panel.js, 2026-09-24) ──
 * BILLZ dagi «Свободная цена / Ручная скидка» paneli. Kompyuterda
 * o‘ngdan butun balandlikda, telefonda pastdan (umumiy `.sheet`
 * qoidasi, N4) — shuning uchun o‘ng panel FAQAT keng ekranda. */
@media (min-width:820px){
  .pp-sheet{justify-content:flex-end;padding:0}
  .pp{width:min(460px,100%);height:100vh;max-height:none;
    border-radius:24px 0 0 24px;padding:28px}
}
.pp{display:flex;flex-direction:column}
.pp-head{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.pp-pic{width:44px;height:44px;flex:0 0 auto;display:flex;align-items:center;
  justify-content:center;overflow:hidden;border-radius:10px;
  background:var(--field);color:var(--muted)}
.pp-pic img{width:100%;height:100%;object-fit:cover}
.pp-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.pp-who b{font-size:var(--t-4);font-weight:var(--w-bold)}
.pp-list{color:var(--mid);font-weight:var(--w-bold);font-variant-numeric:tabular-nums}
.pp-tabs{display:flex;gap:4px;padding:4px;margin-bottom:22px;
  border-radius:12px;background:var(--field)}
.pp-tab{flex:1;height:var(--tap);border:0;border-radius:9px;background:none;
  font:inherit;color:var(--muted);cursor:pointer}
.pp-tab.on{background:var(--glass);color:var(--ink);font-weight:var(--w-mid);
  box-shadow:var(--sh-1)}
.pp-label{display:flex;align-items:center;justify-content:space-between;
  margin-bottom:8px;font-weight:var(--w-mid)}
.pp-reset{min-height:var(--tap);padding:0 4px;border:0;background:none;
  font:inherit;color:var(--muted);cursor:pointer}
.pp-field{display:flex;align-items:center;gap:4px;padding:4px;
  border-radius:12px;background:var(--field)}
.pp-field:focus-within{box-shadow:var(--ring)}
.pp-field input{flex:1;min-width:0;height:48px;padding:0 12px;border:0;
  background:none;font-size:var(--t-5);font-variant-numeric:tabular-nums}
.pp-field input:focus{outline:none;box-shadow:none}
.pp-cur{display:flex;align-items:center;height:var(--tap);padding:0 14px;
  border-radius:9px;background:var(--glass);color:var(--muted)}
.pp-units{display:flex;gap:4px}
.pp-u{min-width:56px;height:var(--tap);border:0;border-radius:9px;
  background:none;font:inherit;color:var(--muted);cursor:pointer}
.pp-u.on{background:var(--glass);color:var(--ink);box-shadow:var(--sh-1)}
.pp-will{margin-top:10px;color:var(--muted)}
.pp-err{margin-top:10px;color:var(--danger)}
.pp-acts{display:flex;flex-direction:column;gap:10px;margin-top:auto;
  padding-top:24px}
.pp-acts .go,.pp-acts .ghost{width:100%;max-width:none;margin:0}

/* ⛔ JAVOB KELMAGAN QATOR (`sale_quick.js`, 2026-09-27): son yoki yangi
   tovar ekranda SHU ZAHOTI, lekin server hali tasdiqlamagan. Xira — «bu
   hali yakuniy emas»; qator yo‘qolmaydi va sakramaydi. */
/* ⛔ TANLANGAN QATOR — «+ / −» shunga tegadi (sale_keys.js). BILLZ dagidek
   ko‘k ramka; soya bilan birga, chiziq qo‘shilmaydi.

   ⛔ FAQAT KOMPYUTERDA (2026-09-27, egasining telefon surati). Bu qoidalar
   `@media` siz edi va fayl OXIRIDA turardi — tepadagi telefon blokidagi
   `.cart-keys{display:none}` ni bosib ketardi: telefonda klavish belgilari
   yashirinib, «tanlash soni» degan yalang‘och so‘zlar qolardi, qator esa
   klaviaturasiz ekranda ma'nosiz ko‘k ramka olardi. */
.line.cart[data-line]{cursor:pointer}
.cart-keys{display:none}
.cart-keys[hidden]{display:none}
@media (min-width:820px){
  .line.cart.picked{box-shadow:var(--card-sh),0 0 0 2px var(--mid)}
  .cart-keys{display:flex;align-items:center;gap:4px;flex-wrap:wrap;
    color:var(--muted);font-size:var(--t-2);padding:4px 4px 0}
  .cart-keys .kbd + .kbd{margin-left:-2px}
  .cart-keys .kbd:nth-of-type(3){margin-left:10px}
}
.line.cart.pending{opacity:.6}
.line.cart.pending .sub{color:var(--muted)}

/* ── Profil oynasi (telefon, `sale_who.js`) ─────────────── */
.prof-me{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.prof-ava{width:48px;height:48px;flex:0 0 48px;border-radius:50%;
  background:var(--mid);color:#fff;display:flex;align-items:center;
  justify-content:center;font-size:var(--t-3);font-weight:var(--w-mid)}
.prof-name{display:flex;flex-direction:column;min-width:0}
.prof-name span{font-size:var(--t-2);color:var(--muted)}
.prof-rows{margin-bottom:12px}
.who-need{margin:0 0 8px;color:var(--warn);font-size:var(--t-2)}

/* ── «⋯» oynasi — ro‘yxat (egasi, 2026-09-28: tugmalar yopishgan edi) ── */
.more-list{background:var(--page);border-radius:14px;overflow:hidden}
.more-row{width:100%;min-height:var(--tap);display:flex;align-items:center;
  gap:12px;padding:0 16px;border:0;border-bottom:1px solid var(--line);
  background:none;color:var(--ink);font:inherit;font-size:var(--t-3);
  font-weight:var(--w-mid);text-align:left;cursor:pointer}
.more-row:last-child{border-bottom:0}
.more-row svg{color:var(--mid);flex:0 0 auto}
.more-row span{flex:1 1 auto}
.more-n{min-width:24px;height:24px;padding:0 8px;border-radius:12px;
  background:var(--soft);color:var(--mid);font-size:var(--t-2);font-weight:var(--w-mid);
  display:inline-flex;align-items:center;justify-content:center}
.more-on{color:#7b4bd6;font-size:var(--t-2);font-weight:var(--w-mid)}