/* Ofis ekranlari qobig'i (shell.js): yon menyu, oq sarlavha va yangilangan uslub. Faqat body.shell (Boshqaruv, Ombor, Karta) da.
   Kassa, ofitsiant, kuryer va boshqa ekranlarga ta'sir qilmaydi. */
body.shell {
  --sd-w: 248px;
  --sd-ink: #15201a;
  --sd-ink2: #1d2a22;
  --bg: #f4f5f1;
  --line: #e6e8e2;
  --ink: #1b211d;
  --muted: #687068;
  --soft: #eef5e8;
  --shadow: 0 1px 2px rgba(21, 32, 26, .04), 0 4px 14px -6px rgba(21, 32, 26, .10);
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  font-size: 15px;
  padding-left: var(--sd-w);
  background: var(--bg);
  transition: padding-left .18s ease;
  -webkit-font-smoothing: antialiased;
}
body.shell.sd-min { --sd-w: 72px; }

/* ---------- yon menyu ---------- */
.shell .sd { position: fixed; inset: 0 auto 0 0; width: var(--sd-w); z-index: 40; background: var(--sd-ink); color: #fff;
  display: flex; flex-direction: column; transition: width .18s ease, transform .2s ease; overflow: hidden; }
.shell .sd-brand { display: flex; align-items: center; gap: 11px; height: 64px; padding: 0 16px; flex-shrink: 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.shell .sd-brand img { width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0; background: #fff; object-fit: contain; }
.shell .sd-bt { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.shell .sd-bt b { font-size: 17px; font-weight: 750; letter-spacing: .4px; white-space: nowrap; }
.shell .sd-bt span { font-size: 11.5px; color: rgba(255,255,255,.5); white-space: nowrap; }
.shell .sd-x { display: none; margin-left: auto; background: transparent; color: rgba(255,255,255,.7); padding: 6px; border-radius: 8px; }
.shell .sd-nav { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 10px 0 12px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
.shell .sd-group { padding: 4px 0; }
.shell .sd-gt { font-size: 10.5px; font-weight: 650; letter-spacing: .9px; text-transform: uppercase; color: rgba(255,255,255,.36);
  padding: 10px 24px 6px; white-space: nowrap; }
.shell .sd-item { display: flex; align-items: center; gap: 12px; width: calc(100% - 20px); margin: 1px 10px; height: 40px; padding: 0 14px;
  background: transparent; color: rgba(255,255,255,.74); border-radius: 9px; font-size: 14.5px; font-weight: 500; text-align: left; white-space: nowrap;
  transition: background .12s, color .12s; }
.shell .sd-item:hover { background: rgba(255,255,255,.06); color: #fff; }
.shell .sd-item.on { background: var(--brand); color: #fff; box-shadow: 0 2px 8px rgba(59,154,20,.35); }
.shell .sd-item .ic { width: 19px; height: 19px; flex-shrink: 0; }
.shell .sd-item span { overflow: hidden; text-overflow: ellipsis; }
.shell .sd-foot { padding: 8px 0 12px; border-top: 1px solid rgba(255,255,255,.06); flex-shrink: 0; }
.shell .sd-fold { color: rgba(255,255,255,.55); }
/* yig'ilgan holat */
.shell.sd-min .sd-bt, .shell.sd-min .sd-item span { display: none; }
.shell.sd-min .sd-brand { justify-content: center; padding: 0; }
.shell.sd-min .sd-item { justify-content: center; padding: 0; }
.shell.sd-min .sd-gt { font-size: 0; padding: 6px 0; margin: 6px 18px; border-top: 1px solid rgba(255,255,255,.09); }
.shell .sd-scrim { display: none; }

/* ---------- sarlavha ---------- */
.shell .topbar { position: relative; height: 62px; padding: 0 22px; gap: 10px; background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); }
.shell .topbar .brand, .shell .topbar .scr { display: none !important; }
.shell .sh-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.shell .sh-title > div { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.shell .sh-title b { font-size: 19px; font-weight: 700; letter-spacing: -.2px; white-space: nowrap; }
.shell .sh-title span { font-size: 14px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shell .sh-title span:not(:empty)::before { content: '/'; margin-right: 10px; color: #c9cdc5; }
.shell .sh-burger { display: none; background: transparent; color: var(--ink); padding: 7px; border-radius: 9px; }
.shell .sh-burger .ic { width: 22px; height: 22px; display: block; }
.shell .topbar .btn { background: #fff; color: var(--ink); border: 1px solid var(--line); padding: 7px 13px; font-size: 14px; font-weight: 500; border-radius: 9px; }
.shell .topbar .btn:hover { background: #f6f7f3; }
.shell .topbar #bUser { display: inline-flex; align-items: center; gap: 9px; padding: 4px 12px 4px 4px; border-radius: 999px; }
.shell .topbar #bUser::before { content: attr(data-ini); display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--brand); color: #fff; font-size: 12.5px; font-weight: 700; letter-spacing: .3px; }
.shell .topbar #bUser:not([data-ini])::before, .shell .topbar #bUser[data-ini=""]::before { display: none; }

/* ---------- ish maydoni ---------- */
.shell main { max-width: none; margin: 0; padding: 14px 20px 30px; }
.shell[data-page="admin"] #tabs { display: none; }
.shell h2 { font-size: 20px; font-weight: 700; letter-spacing: -.2px; }
.shell h3 { font-size: 16px; font-weight: 650; }
.shell .muted { color: var(--muted); }

/* bo'limchalar — gorizontal yorliqlar: Ombor bo'limlari, Moliya va Hisobotlar ichki bo'limlari */
.shell[data-page="ombor"] #tabs { background: #fff; padding: 0 22px; gap: 4px; border-bottom: 1px solid var(--line); flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.shell[data-page="ombor"] #tabs button { padding: 13px 12px 12px; border-radius: 0; font-size: 14.5px; font-weight: 500; color: var(--muted); white-space: nowrap; background: transparent; box-shadow: none; }
.shell[data-page="ombor"] #tabs button:hover { color: var(--ink); }
.shell[data-page="ombor"] #tabs button.on { color: var(--brand-dark); font-weight: 600; box-shadow: inset 0 -2.5px 0 var(--brand); }
.shell .period:has(> [data-sub]), .shell #repSubs { gap: 4px; border-bottom: 1px solid var(--line); margin: -4px 0 18px; flex-wrap: wrap; }
.shell .period:has(> [data-sub]) > .btn, .shell #repSubs > .btn { background: transparent; border: 0; border-radius: 0; padding: 10px 12px 11px; font-size: 14.5px;
  font-weight: 500; color: var(--muted); box-shadow: none; }
.shell .period:has(> [data-sub]) > .btn:hover, .shell #repSubs > .btn:hover { color: var(--ink); background: transparent; }
.shell .period:has(> [data-sub]) > .btn.on, .shell #repSubs > .btn.on { background: transparent; color: var(--brand-dark); font-weight: 600; box-shadow: inset 0 -2.5px 0 var(--brand); }

/* tugmalar */
.shell .btn { padding: 6px 12px; font-size: 14px; font-weight: 500; border-radius: 9px; transition: background .12s, border-color .12s, box-shadow .12s; }
.shell :where(.btn:not(.primary):not(.green):not(.dark):not(.ghost):not(.on)) { border-color: #dfe2db; background: #fff; color: var(--ink); }
.shell :where(.btn:not(.primary):not(.green):not(.dark):not(.ghost):not(.on):hover:not(:disabled)) { background: #f6f7f3; border-color: #cfd4cb; }
.shell .btn.big { padding: 14px 20px; font-size: 18px; }
.shell .btn.sm { padding: 4px 9px; font-size: 13px; border-radius: 8px; }
.shell .btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 2px 6px rgba(59,154,20,.22); }
.shell .btn.primary:hover:not(:disabled) { background: var(--brand-dark); border-color: var(--brand-dark); }
.shell .period .btn.on, .shell .seg .btn.on { background: var(--sd-ink); border-color: var(--sd-ink); color: #fff; }

/* maydonlar */
.shell .input { border-radius: 8px; border-color: #dcdfd8; font-size: 14px; padding: 5px 10px; }
.shell .input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(59,154,20,.14); }

/* kartochkalar va ko'rsatkichlar */
.shell .card { border-color: var(--line); border-radius: 12px; box-shadow: var(--shadow); }
.shell .kpi div { border-color: var(--line); border-radius: 12px; box-shadow: var(--shadow); font-size: 13.5px; color: var(--muted); }
.shell .kpi b { color: var(--ink); font-weight: 700; letter-spacing: -.3px; }
.shell .help { border-radius: 12px; }

/* jadvallar */
.shell table.grid th, .shell table.grid td { font-size: 14px; padding: 6px 10px; border-bottom-color: #eef0eb; }
.shell table.grid th { background: #f8f9f6; color: #545c54; font-size: 11.5px; font-weight: 650; letter-spacing: .5px; }
.shell table.grid tr.click:hover, .shell table.grid tr[data-id]:hover { background: #f5f9f1; }
.shell table.bank-tbl th, .shell table.bank-tbl td { padding: 4px 8px; font-size: 13px; }
.shell table.bank-tbl th { padding: 6px 8px; font-size: 11px; }

/* oynalar */
.shell .modal { border-radius: 14px; width: min(680px, 94vw); }
.shell .modal.wide { width: min(1440px, 94vw); }
@media (max-width: 700px) { .shell .overlay.full .modal { width: 100%; } }

/* ---------- tor ekran: menyu chapdan chiqadigan panel ---------- */
@media (max-width: 899px) {
  body.shell, body.shell.sd-min { --sd-w: 272px; padding-left: 0; }
  .shell .sd { transform: translateX(-102%); z-index: 60; box-shadow: 8px 0 30px rgba(0,0,0,.25); }
  .shell.sd-open .sd { transform: none; }
  .shell.sd-open .sd-scrim { display: block; position: fixed; inset: 0; z-index: 59; background: rgba(15,20,17,.45); }
  .shell .sd-x { display: block; }
  .shell .sd-fold { display: none; }
  .shell.sd-min .sd-bt, .shell.sd-min .sd-item span { display: initial; }
  .shell.sd-min .sd-item { justify-content: flex-start; padding: 0 14px; }
  .shell.sd-min .sd-gt { font-size: 10.5px; padding: 10px 24px 6px; margin: 0; border: 0; }
  .shell .sh-burger { display: block; margin-left: -8px; }
  .shell .topbar { padding: 0 12px; height: 56px; }
  .shell .sh-title b { font-size: 17px; }
  .shell .sh-title span { display: none; }
  .shell main { padding: 14px 12px 30px; }
  .shell[data-page="ombor"] #tabs { padding: 0 8px; }
}
@media print { .shell .sd, .shell .sd-scrim { display: none; } body.shell { padding-left: 0; } }

/* zichlik va mayda tuzatishlar */
.shell .sd-gt { padding: 8px 24px 4px; }
.shell .sd-item { height: 38px; }
.shell .sd-group { padding: 2px 0; }
.shell .help { line-height: 1.45; font-size: 13.5px; padding: 7px 12px; margin-bottom: 10px; }
@media (max-width: 899px) {
  .shell .topbar #bUser { font-size: 0; gap: 0; padding: 3px; }
  .shell .topbar #bGuide .gl { display: none; }
  .shell .period:has(> [data-sub]), .shell #repSubs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .shell .period:has(> [data-sub]) > .btn, .shell #repSubs > .btn { white-space: nowrap; flex-shrink: 0; }
}

/* ---------- IXCHAM (15.11): maydon, yozuv, oyna va kartochkalar zichroq ---------- */
.shell label.f { margin: 6px 0 2px; font-size: 12.5px; }
.shell .chk { margin-top: 6px; font-size: 14.5px; gap: 7px; }
.shell .chk input { width: 17px; height: 17px; }
.shell .chk + small, .shell .chk ~ small.muted { font-size: 12.5px; }
.shell .form-grid { gap: 0 12px; }
.shell .modal h2 { padding: 10px 16px; font-size: 18px; }
.shell .modal h2 .mx { width: 36px; height: 36px; margin: -6px -8px -6px 0; }
.shell .modal .body { padding: 8px 16px 12px; }
.shell .modal .foot { padding: 8px 16px 10px; gap: 8px; }
.shell .card { padding: 12px; margin-bottom: 10px; }
.shell .kpi { gap: 8px; margin-bottom: 10px; }
.shell .kpi div { padding: 8px 12px; }
.shell .kpi b { font-size: 19px; margin-top: 1px; }
@media (max-width: 700px) { .shell .input { padding: 8px 10px; font-size: 16px; } .shell .chk input { width: 20px; height: 20px; } }
/* shriftning "normal" qator balandligi juda katta (~2.2) — boshqaruv sahifalarida aniq qiymat */
body.shell { line-height: 1.35; }
.shell .tag { line-height: 1.35; }