/* Kunlik hisobot — «Men» bo‘limi ichida. TZ 18.3. */

/* ⛔ Tugmalar telefonda bir qatorga sig‘maydi — o‘raladi.
   Gorizontal aylantirish qilinmadi: ko‘rinmay qolgan tugmani
   bozorda hech kim qidirmaydi. */

/* ⛔ IKKI FILTR QATORI BIR XIL KO‘RINADI (2026-09-14).
 *
 * Egasi ikkalasini birga aylantirib «birxil qilgin» dedi. Ular
 * bitta ishni qilardi — bittasini tanlash — lekin ikki xil
 * ko‘rinardi:
 *
 *     davr      `.oc`    2px ramka, 44px, to‘rtburchak
 *     rejim     `.chip`  soyali pill, 30px
 *
 * Ikkalasi ham endi `.chip`. Tanlandi, chunki `.oc` dagi ramka
 * 2026-09-13 dagi «ramka emas, soya» qaroriga qarshi edi
 * (DIZAYN.md) — ya'ni qator eskirib qolgan uslubda turgan ekan.
 *
 * ⛔ `--tap` esa SAQLANADI: `.chip` ning o‘z bo‘yi 30px va u
 * bozordagi qo‘pol qo‘l uchun kichik (DIZAYN.md 5.1). Shuning
 * uchun hisobot ekranida ikkala qator ham `--tap` ga ko‘tariladi
 * — bu yerda zichlik emas, tegish muhim. */
.rep-days, .g-sorts {
  display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 10px;
}
.rep-days { margin-top: 16px; }

/* ⛔ FILTRLAR BITTA QATORDA (2026-09-15).
 *
 * Uchta blok — davr, rejim, qidiruv — uch qatorda turardi va har
 * biri faqat o‘z mazmuni kengligida edi. 1600px ekranda ularning
 * o‘ng tomonida ~900 piksellik bo‘sh maydon qolardi, jadval esa
 * pastda butun kenglikni egallardi: yuqorisi tor, pasti keng —
 * ekran ikkiga bo‘lingandek ko‘rinardi. Egasi suratda aynan shu
 * joyni belgiladi.
 *
 * ⛔ Qidiruv O‘NGGA suriladi (`margin-left:auto`), chiplar chapda
 * qoladi. Bu BILLZ naqshi: tanlov chapdan o‘qiladi, qidiruv esa
 * alohida ish va u ko‘z bilan aralashmasin.
 *
 * ⛔ `flex-wrap` MAJBURIY: telefonda uchalasi o‘z qatoriga
 * tushadi va eski ko‘rinish qaytadi. */
.rep-bar {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px; margin: 16px 0 10px;
}
.rep-bar .rep-days, .rep-bar .g-sorts { margin: 0; }
/* ⛔ IKKI GURUH ORASIDA KATTAROQ BO‘SHLIQ.
 *
 * Bitta qatorga yig‘ilgach sakkizta chip bir xil oraliqda turdi va
 * ular BITTA ro‘yxatdek o‘qildi: «Davr» ham, «Hammasi» ham ko‘k
 * bo‘lib, bitta ro‘yxatdan ikkita tanlanganga o‘xshardi
 * (suratda ko‘rindi).
 *
 * ⛔ Chiziq emas, BO‘SHLIQ (DIZAYN.md 5.2): chiziq qatorni kesadi,
 * bo‘shliq esa kesmasdan ajratadi. Uslub bir xil qoladi — egasi
 * «birxil qilgin» degandi va u haq edi; ular bir xil ko‘rinishda,
 * lekin bir xil GURUHDA emas. */
@media (min-width: 820px) {
  .rep-bar > .g-sorts { margin-left: 18px; }
}
/* ⛔ `flex-basis` bilan: maydon o‘z kengligini SO‘RAYDI, lekin
   joy qolmasa qisqaradi. Qat'iy kenglik tor ekranda chiplarni
   siqib, ularni ikkiga bo‘lib yuborardi. */
.rep-bar .field { margin-left: auto; flex: 0 1 380px; min-width: 220px; }
.rep-bar .field input { max-width: 100%; }

@media (max-width: 819px) {
  /* ⛔ Telefonda qidiruv TO‘LIQ kenglikda: u eng ko‘p ishlatiladigan
     maydon va barmoq ostida katta bo‘lsin (DIZAYN.md 5.1). */
  .rep-bar .field { margin-left: 0; flex: 1 1 100%; }
}
/* ⛔ `999px`, `15px` emas: balandlik `--tap` ga ko‘tarilgach
   qotirilgan radius pillni cho‘zilgan to‘rtburchakka aylantirardi. */
/* ⛔ `min-width` — «OY» VA «YIL» DOIRA BO‘LIB QOLMASIN.
   Ikki harfli yozuvda `padding` ham, radius ham yetarli bo‘lib,
   tugma to‘garakka aylanardi va qator «uchta pill + ikkita
   doira» bo‘lib g‘adir-budur ko‘rinardi (suratda ko‘rindi). */
.rep-days .chip, .g-sorts .chip {
  min-height: var(--tap); min-width: 76px;
  border-radius: 999px; padding: 0 16px;
}

/* ⛔ `.rep-range` VA `.rep-dash` O‘CHIRILDI (2026-09-17).
 *
 * Ular «Davr» chipi bosilganda chiqadigan ikkita `input[date]`
 * qatori edi. Endi sana KALENDARDAN tanlanadi (`datepick.css`)
 * va bu qatorni hech kim chizmaydi.
 *
 * O‘chirildi, «ehtimol keraklidir» deb qoldirilmadi: uslub
 * o‘qilmaydi, lekin keyingi o‘quvchi uni ISHLATILADI deb
 * o‘ylaydi va nega ko‘rinmayotganini qidiradi. */

/* Qaysi oraliq ko‘rsatilyapti — raqamlar tepasida, sarlavha
   sifatida. ⛔ Bu bezak emas: «Hafta» tugmasi bosilganda qaysi
   yetti kun sanalgani KO‘RINIB tursin. */
.rep-when { color: var(--muted, #777); font-size: var(--t-2);
  padding: 0 2px 8px; }

/* ⛔ Ramka emas, SOYA — sabab `base.css` dagi `--card-sh` da. */
.rep-block {
  background: var(--glass);
  border-radius: var(--card-r);
  box-shadow: var(--card-sh);
  padding: 14px 18px;
  margin-bottom: 12px;
}

.rep-big { font-size: 24px; font-weight:600; padding: 4px 0 6px; }

/* ⛔ O‘Z QATORIDA. Ilgari katta raqam bilan yonma-yon turardi va
   telefonda «o‘rtacha 450 000» ikkiga bo‘linib, «000» yolg‘iz
   pastki qatorga tushib qolardi — ko‘z uni ALOHIDA raqam deb
   o‘qirdi (suratda ko‘rindi). */
.rep-sub { display: block; font-size: var(--t-2); font-weight: 400;
  color: #777; padding-bottom: 2px; }
/* ⛔ KATTA HARF OLIB TASHLANDI (DIZAYN.md). Qo‘riqchi uni
   ko‘rmagan edi: `text-transform:uppercase` deb qidirardi, bu
   yerda esa ikki nuqtadan keyin probel bor edi. Qo‘riqchi
   tuzatildi, sarlavhalar esa endi baqirmaydi. */
.rep-head { font-size: var(--t-2); color: #777;
  letter-spacing: .02em; padding: 2px 0 6px; }

.rep-row {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 6px 0; border-top: 1px solid #f1f1f1;
}
.rep-row:first-child { border-top: 0; }
.rep-k { color: #555; }
/* ⛔ PUL IKKI QATORGA BO‘LINMAYDI (2026-09-14).
   Uzun yorliq yonida «600 000» «600» va «000» bo‘lib ketardi va
   qator qiymat emas, sinib qolgan matn bo‘lib ko‘rinardi
   (suratda ko‘rindi). Yorliq qisqaradi, son emas. */
.rep-v { font-variant-numeric: tabular-nums; font-weight: 600;
  white-space: nowrap; }

.rep-bad { color: #c0392b; }
.rep-good { color: #1e8449; }

/* Excel eksport tugmalari — «Men» bo‘limi (15.1) */
.exp-btns { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; }

/* Do'konni almashtirish ro'yxati — «Men» bo'limi */
.places{margin-top:8px}
.places .found.on{border-color:var(--mid)}

/* ═════════════════════════════════════════════════════════
   Kunlik ustunlar (18.4)

   ⛔ Ustun BOSILMAYDI — sababi `report_chart.js` boshida.
   ⛔ Balandlik `<i>` da, `.bar` da emas: `.bar` o‘zi to‘liq
      balandlikda turadi va ustunlar pastdan tekislanadi.
   ═════════════════════════════════════════════════════════ */
.chart {
  display: flex; align-items: flex-end; gap: 2px;
  height: 64px; padding: 8px 0 0;
}
.chart-bar { flex: 1 1 0; min-width: 0; height: 100%;
  display: flex; align-items: flex-end; }
.chart-bar > i { display: block; width: 100%; border-radius: 2px 2px 0 0;
  background: var(--mid, #2f6fed); min-height: 2px; }

/* ⛔ Savdosiz kun ko‘rinib tursin — och chiziq bo‘lib. Butunlay
   yo‘qolsa, yopiq yakshanba grafikdan tushib qolardi. */
.chart-bar.nil > i { background: #e6e6e6; }

.chart-foot {
  display: flex; justify-content: space-between; gap: 8px;
  font-size: var(--t-2); color: var(--muted, #777); padding: 6px 0 0;
}
/* ⛔ Sanalar bilan BIR QATORDA emas — sabab `report_chart.js` da. */
.chart-top { font-size: var(--t-2); color: var(--ink, #222); padding: 2px 0; }

/* ═════════════════════════════════════════════════════════
   Keng ekran (2.1)

   ⛔ Bir ustunda qolsa, yorliq chapda va raqam o‘ngda — orasi
   900 piksel bo‘sh joy. Ko‘z ularni ulay olmaydi va qatorni
   barmoq bilan kuzatib o‘qishga to‘g‘ri keladi.
   ═════════════════════════════════════════════════════════ */
@media (min-width: 900px) {
  /* ⛔ `grid` EMAS, `columns`. Ikki ustunli katakda qatorlar
     eng balandiga tenglashadi va past kartochka tagida katta
     bo‘sh joy qoladi (suratda ko‘rindi). Ustunlar esa
     kartochkalarni zich terib chiqadi. */
  .rep-cards { columns: 2; column-gap: 10px; }
  /* ⛔ Kartochka ikki ustunga BO‘LINMASIN — «Kassa» sarlavhasi
     bir ustunda, qatorlari ikkinchisida qolib ketardi. */
  .rep-cards > .rep-block { break-inside: avoid; }
}

/* ⛔ KENG EKRANDA UCHTA USTUN (2026-09-14).
   Sahifa chegarasi 1400 ga ko‘tarilgach, ikkita ustun 690
   pikseldan bo‘lib ketdi va yorliq bilan raqam orasi yana
   uzoqlashdi — chegara ko‘tarilishi bu qoidani ham ko‘chirdi. */
@media (min-width: 1320px) {
  .rep-cards { columns: 3; }
}

/* ── Tovar savdosi (18.4) ─────────────────────────────────
   ⛔ Bu yerda `.g-sorts` ning O‘Z qoidasi turardi va izohida
   «saralash chiplari kichikroq bo‘lsin, aks holda ekran ikki
   qator bir xil tugmaga aylanardi» deb yozilgandi. Bu MENING
   dalilim edi va egasi uni bekor qildi (2026-09-14): ikkala
   qatorni birga aylantirib «birxil qilgin» dedi.

   U haq chiqdi — ikki qator bir xil ishni qiladi (bittasini
   tanlash) va ularni farqlash o‘rgatadigan narsa yo‘q edi,
   faqat ekranni g‘adir-budur qilardi.

   Qoida endi yuqorida, `.rep-days` bilan BIRGA. */

/* ── HISOBOT JADVALI — KENGLIK USTUN BILAN ISHLATILADI ────
 *
 * ⛔ NEGA BU BOR (2026-09-14)
 *
 * Egasi suratda chap va o‘ng chekkani belgilab so‘radi: «nega
 * bo‘sh». Sahifa chegarasi 1040 dan 1400 ga ko‘tarildi
 * (`shell.css`), lekin kenglikning O‘ZI yechim emas edi: qator
 * ikkita katakdan iborat edi va kengaytirilganda nom chap
 * chekkada, summa 1400 piksel narida qolardi. Ko‘z ularni ulay
 * olmaydi — bu 1040 chegarasi tuzatgan muammoning aynan o‘zi.
 *
 * Shuning uchun kenglik USTUN bilan to‘ldiriladi. Ma'lumot
 * allaqachon javobda bor edi: «kirim» va «chiqim» umuman
 * ko‘rsatilmasdi, «qotgan pul» esa qoldiq ostiga siqilgandi.
 *
 * ⛔ IKKITA KO‘RINISH, BITTA DOM (`.ops` bilan bir xil qaror).
 * Qator ikkala ko‘rinish uchun ham kerakli kataklarni chizadi,
 * CSS bittasini tanlaydi:
 *
 *     telefon      .rt-sub + .rt-mob      ustunlar yashirin
 *     kompyuter    .rt-c + .rt-val        siqilganlar yashirin
 *
 * ⛔ Busiz telefonda BUZILARDI: `.found` — `flex`, ya'ni sakkizta
 * katak bitta qatorga tizilib chiqib ketardi.
 */

/* Telefon — sukut. Ustunlar yo‘q. */
/* ⛔ Konteyner E'LON QILINADI — busiz `@container` qoidalari
   hech qachon ishlamaydi va qator jimgina siqilgan holida
   qolardi.

   ⛔ `.found-list` BU YERDA emas, `debt.css` da — u o‘sha
   faylning sinfi. Ikki faylda ta'riflansa
   `TestCssDuplicatesDoNotGrow` yiqiladi, va u haq: bu loyihada
   yalang‘och sinf ikki joyda ta'riflangani ikki marta zarar
   bergan (`.when`, `.totals`). */
[data-list]{container-type:inline-size;container-name:list}

.rt-head{display:none}
.found.rt-row > .rt-c,
.found.rt-row > .rt-val{display:none}
.found.rt-row > .rt-mob{margin-left:auto;text-align:right;
  font-size:var(--t-4);font-weight:600;white-space:nowrap;
  font-variant-numeric:tabular-nums}

/* ⛔ KONTEYNER SO‘ROVI, oyna kengligi EMAS (2026-09-15).
 *
 * Ro‘yxat qatorlari BESH xil joyda chiziladi: to‘liq ekranda
 * («Tovar», hisobotlar), savat yon ustunida, buyurtma, ko‘chirish
 * va chiqim formalarida. Oyna kengligiga qarab qaror qilinsa,
 * 1600px monitorda savatning 320 piksellik yon ustuni ham
 * «keng» deb hisoblanib, sakkizta ustun u yerga tiqilardi.
 *
 * `@container` qatorga O‘Z JOYINING kengligini so‘ratadi. Shu
 * bilan bitta qoida beshta joyda to‘g‘ri ishlaydi — ikkinchi
 * nusxa yozilmaydi (CLAUDE.md 1).
 *
 * Chegara 700px: undan tor joyda ustunlar o‘qib bo‘lmas darajada
 * siqiladi va siqilgan ko‘rinish to‘g‘riroq. */
@container list (min-width:700px){
  .found.rt-row, .rt-head{
    display:grid; grid-template-columns:var(--rt-cols);
    align-items:center; gap:14px;
  }
  /* Sarlavha qatori — kartochka emas, yozuv */
  .rt-head{padding:2px 16px 6px;font-size:var(--t-2);color:var(--muted);
    box-shadow:none;background:none;margin:0;min-height:0}
  /* ⛔ Siqilgan ko‘rinish YASHIRINADI: o‘sha qiymatlar endi
     o‘z katagida turibdi va ikki marta ko‘rinmasin. */
  .found.rt-row > .rt-sub,
  .found.rt-row > .who .rt-sub,
  .found.rt-row > .rt-mob{display:none}
  .found.rt-row > .rt-c,
  .found.rt-row > .rt-val{display:block}
  .rt-n{text-align:right;font-variant-numeric:tabular-nums}
  .rt-c{font-size:var(--t-2);color:var(--muted);overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap}
  .found.rt-row > .rt-val{text-align:right;font-weight:600;
    font-variant-numeric:tabular-nums;white-space:nowrap}
  /* ⛔ «Qotgan pul» ustunida `muzlagan` so‘zi ORTIQCHA: sarlavha
     allaqachon shuni aytib turibdi. Faqat «tannarx yo‘q»
     qoladi — u javob emas, javobning yo‘qligi. */
  .found.rt-row > .rt-val .g-profit{display:inline;font-weight:600}
  .found.rt-row > .rt-val .g-dim{font-weight:400}
}

/* ⛔ Foyda summaning TAGIDA, yonida emas: telefonda ular bir
   qatorga sig‘masdi va summa ikkiga bo‘linib ketardi. */
.g-profit{display:block;font-size:var(--t-2);font-weight:400;
  color:var(--muted);margin-top:2px}
/* ⛔ MANFIY FOYDA QIZIL. `.rep-bad` bu faylda YUQORIROQDA
   turibdi, ya'ni bir xil kuchdagi `.g-profit` uni bosib
   qo‘yardi va zararga sotilgan mol boshqalar bilan bir xil
   kulrang ko‘rinardi (2026-09-13, suratda ko‘rindi). */
.g-profit.rep-bad{color:var(--danger)}

/* ⛔ «TANNARX YO‘Q» — RAQAM EMAS, shuning uchun XIRAROQ.
 *
 * Bu yozuv foyda turadigan joyda turadi va u yerda hamma qator
 * son bo‘lib o‘qiladi. Bir xil to‘qlikda yozilsa, ko‘z uni ham
 * qiymat deb o‘qib, ro‘yxatni solishtirishga urinardi — aslida
 * bu javobning YO‘QLIGI.
 *
 * ⛔ Qizil EMAS: bu xato emas, hali kiritilmagan ma'lumot.
 * Qizil bo‘lsa do‘kondor har ochganda shoshib qolardi. */
.g-profit.g-dim{color:var(--muted);opacity:.7;font-style:italic}

/* ⛔ Kun yakunidagi «tannarxsiz savdo» qatori — xira, chunki u
   foyda EMAS, foydaning qamrovi haqidagi izoh. */
.rep-v.rep-dim{color:var(--muted);font-weight:400}
/* ⛔ Izoh — qatordan KEYIN, kichik va chapga tekislangan:
   u qiymat emas, jumla. */
.rep-block .rep-note{font-size:var(--t-1);line-height:1.5;
  color:var(--muted);padding:2px 0 6px}

/* ⛔ TELEFONDAGI QATOR — NOM USTIDA, IZOH TAGIDA.
 *
 * Bu qoidalar ilgari `.row-4` ga bog‘langan edi va qator
 * `.rt-row` ga ko‘chgach (2026-09-14) JIMGINA ishlamay qoldi:
 * `sales.css` dagi `.found.row-4 .who{flex-direction:column}`
 * ham shu bilan tushib qoldi va izoh nom OSTIGA emas, YONIGA
 * tiqilib, «Bolalar kurtkasotil…» bo‘lib chiqdi.
 *
 * ⛔ Sinf nomini almashtirdim-u, unga bog‘langan qoidalarni
 * qidirmadim. Testlar ko‘rmadi — SURAT ko‘rsatdi. Bu CLAUDE.md
 * 0-bo‘limidagi «kim buziladi?» savolining yana bir marta
 * yarim javoblangani.
 *
 * ⛔ Pul ustuni mazmuniga qarab kengayadi: tagida yana bir qator
 * bor («muzlagan 20 000 000») va qotirilgan 120px unga sig‘masdi
 * — qator kartochkadan chiqib ketardi (2026-09-13). */
.found.rt-row > .who{display:flex;flex-direction:column;
  gap:1px;min-width:0;overflow:hidden}
.found.rt-row > .who b{font-size:var(--t-3);font-weight:600}
.found.rt-row > .who b,
.found.rt-row > .who .sub{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.found.rt-row > .rt-mob{min-width:96px;flex:0 1 auto}

/* ═════════════════════════════════════════════════════════
   HISOBOT KATALOGI — BILLZ dan ko‘chirildi (2026-09-13)

   ⛔ Kartochkalar TO‘RDA, ro‘yxat emas: BILLZ da ham shunday va
   sabab bor — har kartochkada ikki-uch qatorlik izoh turadi,
   ro‘yxatda esa ular bir-biriga yopishib ketardi.
   ═════════════════════════════════════════════════════════ */
.rc-grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
}
.rc{
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;
  padding:18px;border:0;border-radius:var(--card-r);
  background:var(--glass);box-shadow:var(--card-sh);
  font-family:inherit;text-align:left;cursor:pointer;color:var(--ink);
}
.rc-top{display:flex;align-items:center;justify-content:space-between;
  width:100%}
.rc-kind{font-size:var(--t-2);color:var(--muted)}
/* ⛔ Nuqtacha — turkum emas, TANIB OLISH belgisi (sabab js da) */
.rc-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.rc b{font-size:var(--t-5);font-weight:600;letter-spacing:-.01em}
.rc-why{font-size:var(--t-2);color:var(--muted);line-height:1.5}
.rc-go{margin-top:6px;font-size:var(--t-2);color:var(--mid);font-weight:500}
