/* Do‘kon sozlamalari ekrani. TZ 12.2, 16.1.
 *
 * ⛔ Bu yerda faqat NAMUNA CHEK uslubi. Maydonlar, yorliqlar va
 * tugmalar umumiy poydevordan keladi (`base.css`, `plan.css` dagi
 * `.oc`): sozlamalar ekrani alohida ko‘rinishga ega bo‘lmasligi
 * kerak — u boshqa ekranlarga o‘xshasin.
 */

/* ⛔ CHEK QOG‘OZDEK KO‘RINADI va bir belgili shrift bilan
 * chiziladi. Sabab: kenglik BELGIDA o‘lchanadi (12.4). Oddiy
 * shriftda «48 belgi» ko‘z bilan o‘lchanmaydi — harflar har xil
 * kenglikda bo‘lgani uchun 32 va 48 bir xil ko‘rinadi va ekran
 * o‘z vazifasini bajarmaydi.
 *
 * ⛔ `white-space:pre` — bo‘shliqlar CHEKNING O‘ZI. Serverdan
 * kelgan qatorlar allaqachon tekislangan; brauzer ularni siqsa,
 * namuna haqiqiy chekdan boshqacha chiqadi. */
.rc-paper{
  margin:0 0 14px;padding:14px 12px;
  background:#fff;border:0;box-shadow:var(--card-sh);
  border-radius:var(--card-r);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:var(--t-2);line-height:1.5;color:var(--ink);
  white-space:pre;overflow-x:auto;
}

/* ── Panel: bo‘limlar ro‘yxati ──────────────────────────── */

/* ⛔ Bo‘lim qatori IKKI QATORLI: nomi va tagida «bu yerda nima
   o‘zgaradi». Faqat nom qolsa («Do‘kon», «To‘lov turlari»)
   do‘kondor qaysi biriga kirishni topolmasdi — bu ekran aynan
   shu savolga javob berish uchun bor. */
.st-menu{display:flex;flex-direction:column;gap:8px;max-width:560px}
.st-item{display:grid;grid-template-columns:1fr auto;gap:2px 12px;
  width:100%;min-height:var(--tap);padding:12px 14px;cursor:pointer;
  background:#fff;border:0;box-shadow:var(--card-sh);
  border-radius:var(--card-r);
  font-family:inherit;color:var(--ink);text-align:left}
.st-item:active{background:#f2f4f7}
/* ⛔ USTUN VA QATOR IKKALASI HAM ANIQ KO‘RSATILADI.
   Faqat `grid-row` berilganda `.st-count` birinchi bo‘sh ustunga
   tushib, nomni o‘ng chekkaga surib yuborgan edi — suratda
   ko‘rindi (DIZAYN 6: buni test ushlamaydi). */
.st-item .who{grid-column:1;grid-row:1;font-size:var(--t-4);font-weight:500}
.st-item .sub{grid-column:1;grid-row:2;font-size:var(--t-2);color:var(--muted)}
/* Holat: «2 ta», «Naqd · Plastik». Kechikib kelsa ham joy siljimaydi. */
.st-count{grid-column:2;grid-row:1 / span 2;align-self:center;
  font-size:var(--t-2);color:var(--muted);text-align:right;white-space:nowrap}

/* ⛔ USTUN TOR. Keng monitorda maydon va tugma cho‘zilmaydi
   (DIZAYN 5.3): 1440px da «58 mm» tugmasi 640 piksellik tasma
   bo‘lib, ekrandagi eng baland ovozli narsa oddiy bir sozlama
   bo‘lib qolardi. 560px — namuna chek (48 belgi) sig‘adigan eng
   kichik kenglik. */
.st-wrap{max-width:560px}

/* ⛔ Qoida qatori: maydon TOR, yonida birlik. Kenglik 100% bo‘lsa
   «5 soat» kabi qisqa javob 560 piksellik maydonda yo‘qolib
   ketardi va do‘kondor u yerga nima yozilishini bilmasdi. */
.rule-row{display:flex;align-items:center;gap:10px}
.rule-row input{width:120px;flex:0 0 auto;text-align:right}
.rule-unit{font-size:var(--t-2);color:var(--muted)}

/* ── Vakolat ro‘yxati: berilgani ✓, berilmagani xira ───────
 *
 * ⛔ Berilmagani ham TURADI, faqat xira: «nima mumkin emas» —
 * muhimroq savol. Chiqarib tashlansa, do‘kondor kassirda
 * chegirma yo‘qligini ro‘yxatda TOPOLMASDI, faqat yo‘qligini
 * sezishi kerak bo‘lardi. */
.perm-list{display:grid;grid-template-columns:1fr;gap:2px}
@media (min-width:520px){
  .perm-list{grid-template-columns:1fr 1fr;gap:2px 16px}
}
.perm-row{display:flex;align-items:baseline;gap:8px;
  padding:5px 2px;font-size:var(--t-2);color:#b3b8bf}
.perm-row.on{color:var(--ink)}
.perm-mark{width:14px;flex:0 0 auto;text-align:center;
  font-size:var(--t-2);color:#d0d4da}
.perm-row.on .perm-mark{color:var(--ok)}

/* Maydon tugmalar ostiga yopishmasin (DIZAYN 5.2: chiziq emas,
   bo‘shliq). */
.st-gap{margin-top:14px}