/* Avizo — dizayn tokenlari v0 (T-110, frontend-dev) va umumiy komponentlar.
 * Ro'yxat va qoidalar: 03-Dizayn/dizayn-tokenlari-v0.md (ui-ux-designer keyin kengaytiradi).
 * Uslub: minimalistik, mobil birinchi (ESS). Qaror 2.135 (BR-1…BR-5): AVIZO brendbuki —
 * navy + oltin, Manrope (fayllari keyin qo'shiladi — ungacha tizim shrifti zaxirada), radius 6-11-18;
 * 2.134 dan kuchda: Kun / Tun (DZ-2), kontrast brenddan ustun (DZ-4). Holat ranglari izchil: yashil — tayyor/o'z vaqtida,
 * sariq — yaqinlashyapti/ogohlantirish, qizil — kechikkan/kritik; rang doim matn yoki belgi bilan.
 * Kun / Tun: tizim sozlamasi (`prefers-color-scheme`) + qo'lda tanlov (`<html data-tema="kun|tun">`,
 * static/js/tema.js, base.html dagi tugma). Yangi rang/komponent — faqat shu fayl orqali.
 */

/* ---------- 0. Shrift: Manrope (QARORLAR 2.135 BR-3) ----------
 * O'z serverimizda (CSP font-src 'self'), Google Fonts'dan olingan, OFL — static/fonts/manrope/OFL.txt.
 * O'zgaruvchan qalinlik 400–700. Faqat kerakli harflar: lotin (o'zbekcha ʻ ʼ — U+02BB-02BC shu yerda),
 * kengaytirilgan lotin, kirill va kengaytirilgan kirill (o'zbek kirilidagi қ ғ ҳ). */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/manrope/manrope-cyrillic-ext.28f2a82ccec8.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/manrope/manrope-cyrillic.8fc0aa17e129.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/manrope/manrope-latin-ext.623714ac1d99.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/manrope/manrope-latin.101877a7a906.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- 1. Tokenlar: yorug' rejim ---------- */
:root {
  color-scheme: light dark;      /* tizim sozlamasi; qo'lda tanlov — [data-tema] pastda */

  /* Ranglar — sirtlar va matn */
  --rang-fon: #f4f5f8;          /* sahifa foni */
  --rang-sirt: #ffffff;         /* karta, forma */
  --rang-sirt-2: #eef0f5;       /* jadval sarlavhasi, ichki blok */
  --rang-sirt-bosilgan: #e3e6ee;/* bosilgan (active) holat */
  --rang-matn: #13234a;         /* asosiy matn */
  --rang-matn-2: #46506b;       /* ikkinchi darajali matn (≥ 7:1 oq fonda) */
  --rang-matn-3: #5b6480;       /* izoh, vaqt (≥ 4.5:1 oq va #f4f5f8 fonda) */
  --rang-chegara: rgba(19, 35, 74, .14); /* ajratuvchi chiziq */
  --rang-chegara-2: #c5cad8;    /* forma maydoni chegarasi */

  /* Aksent va semantik ranglar (matn/belgi uchun kontrast ≥ 4.5:1) */
  --rang-aksent: #1d3f8f;       /* havola va matn rangi: kunda navy-ko'k, tunda oltin (BR-2) */
  --rang-aksent-matn: #ffffff;  /* aksent fonidagi matn */
  --rang-tugma: #13234a;        /* asosiy tugma foni: kunda navy, tunda oltin (BR-2) */
  --rang-tugma-matn: #ffffff;   /* tugma yozuvi: kunda oq (15,36 : 1), tunda navy (7,60 : 1) */
  --rang-aksent-fon: #e8ecf6;
  --rang-ok: #16703a;           /* yashil — tayyor, o'z vaqtida */
  --rang-ok-fon: #e6f4ea;
  --rang-ogoh: #8a5a00;         /* sariq/to'q sariq — yaqinlashyapti, ogohlantirish */
  --rang-ogoh-fon: #fff4d6;
  --rang-xato: #c5221f;         /* qizil — kechikkan, kritik, xato */
  --rang-xato-fon: #fdecea;
  --rang-xato-matn: #ffffff;    /* qizil tugma ustidagi matn */
  --rang-info: #5b2a86;         /* binafsha — tekshiruvda */
  --rang-info-fon: #f3e8ff;
  --rang-neytral: #5f6368;
  --rang-neytral-fon: #eef0f2;
  --rang-dev: #5c4400;          /* Q-K6 dev chizig'i */
  --rang-dev-fon: #fff4ce;
  --rang-dev-chegara: #e6d28a;
  --rang-oltin: #cfa44e;       /* brend oltini — faqat bezak (chiziq, belgi, √). Oq fonda matn uchun emas — 2,31 : 1 */

  /* Prioritet (00-KONTEKST 6: 🔴 P1 · 🟠 P2 · 🟡 P3 · ⚪ P4) */
  --rang-p1: #b3261e; --rang-p1-fon: #fde7e5;
  --rang-p2: #9a4a00; --rang-p2-fon: #ffe8d1;
  --rang-p3: #6b5500; --rang-p3-fon: #fff4c2;
  --rang-p4: #5f6368; --rang-p4-fon: #f1f3f4;

  /* Vazifa holatlari */
  --rang-h-yangi: #0a4a8c;       --rang-h-yangi-fon: #e8f1fc;
  --rang-h-ishda: #00527a;       --rang-h-ishda-fon: #e1f3fb;
  --rang-h-tekshiruvda: #5b2a86; --rang-h-tekshiruvda-fon: #f3e8ff;
  --rang-h-qaytarildi: #b3261e;  --rang-h-qaytarildi-fon: #fde7e5;
  --rang-h-tayyor: #16703a;      --rang-h-tayyor-fon: #e6f4ea;
  --rang-h-bekor: #6a6a70;       --rang-h-bekor-fon: #f1f1f3;

  /* Tipografiya — Manrope (fayllari keyin qo'shiladi; ungacha tizim shrifti zaxirada) */
  --shrift: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --shrift-mono: ui-monospace, "SF Mono", Consolas, Menlo, monospace;
  --matn-xs: 12px;   /* belgi, vaqt */
  --matn-s: 14px;    /* ikkinchi darajali matn, jadval */
  --matn-m: 16px;    /* asosiy matn, forma maydonlari (iOS kattalashtirmaydi) */
  --matn-l: 20px;    /* bo'lim sarlavhasi */
  --matn-xl: 28px;   /* sahifa sarlavhasi */
  --matn-2xl: 40px;  /* "katta raqam" (Boss paneli, xulosa) */
  --qalinlik-oddiy: 400;
  --qalinlik-orta: 500;
  --qalinlik-qalin: 600;
  --qalinlik-juda: 700;
  --qator: 1.45;

  /* Masofalar — 4 px panjara */
  --oraliq-1: 4px;
  --oraliq-2: 8px;
  --oraliq-3: 12px;
  --oraliq-4: 16px;
  --oraliq-5: 24px;
  --oraliq-6: 32px;
  --oraliq-7: 48px;

  /* Radiuslar, soya, o'lchamlar */
  --radius-s: 6px;               /* belgi */
  --radius: 11px;                /* tugma va forma maydoni */
  --radius-l: 18px;              /* kartochka */
  --radius-toliq: 999px;
  --soya-1: 0 1px 2px rgba(0, 0, 0, .06), 0 1px 1px rgba(0, 0, 0, .04);
  --soya-2: 0 4px 16px rgba(0, 0, 0, .08);
  --teginish: 44px;              /* eng kichik bosiladigan maydon (WCAG 2.5.5, Apple HIG) */
  --tugma-balandlik: 48px;       /* mobil asosiy tugma */
  --kenglik-ess: 720px;          /* ESS desktop'da markazlashgan kenglik */
  --kenglik-keng: 1120px;        /* boshqaruv jadvallari */
  --nav-balandlik: 64px;         /* ESS pastki navigatsiya */
  --fokus: 0 0 0 3px #1d3f8f;

  /* Eski nomlar (T-008…T-106 shablonlari) — yangi tokenlarga taxallus */
  --avizo-rang-asos: var(--rang-matn);
  --avizo-rang-fon: var(--rang-fon);
  --avizo-rang-aksent: var(--rang-aksent);
  --avizo-rang-xato: var(--rang-xato);
  --avizo-shrift: var(--shrift);
  --avizo-radius: var(--radius);
  --avizo-p1: var(--rang-p1); --avizo-p1-fon: var(--rang-p1-fon);
  --avizo-p2: var(--rang-p2); --avizo-p2-fon: var(--rang-p2-fon);
  --avizo-p3: var(--rang-p3); --avizo-p3-fon: var(--rang-p3-fon);
  --avizo-p4: var(--rang-p4); --avizo-p4-fon: var(--rang-p4-fon);
}

/* ---------- 2. Tokenlar: qorong'i rejim (Tun) ----------
 * DIQQAT: tun qiymatlari IKKI joyda bir xil bo'lishi shart — birini o'zgartirsangiz, ikkinchisini ham
 * o'zgartiring (@media ichidagi qoida qo'lda tanlov selektori bilan bitta ro'yxatga birlasha olmaydi).
 * Ikkalasining tengligini avizo/core/tests/test_tema.py tekshiradi.
 *   1) tizim Tun, foydalanuvchi "Kun" tanlamagan (`:root:not([data-tema="kun"])`);
 *   2) foydalanuvchi qo'lda "Tun" tanlagan (`:root[data-tema="tun"]`).
 * "Kun" qo'lda tanlansa — 1-qatlam qo'llanmaydi, :root dagi kun qiymatlari qoladi. */
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="kun"]) {
    --rang-fon: #0a1024;
    --rang-sirt: #121a33;
    --rang-sirt-2: #1a2443;
    --rang-sirt-bosilgan: #24304f;
    --rang-matn: #ffffff;
    --rang-matn-2: #c9cfde;
    --rang-matn-3: #98a1b9;
    --rang-chegara: rgba(255, 255, 255, .10);
    --rang-chegara-2: #3a4566;

    --rang-aksent: #d8b163;
    --rang-aksent-matn: #13234a;
    --rang-aksent-fon: #2a2416;
    --rang-tugma: #d8b163;        /* tugma: tunda oltin + navy yozuv (BR-2) */
    --rang-tugma-matn: #13234a;
    --rang-ok: #30d158;
    --rang-ok-fon: #10301a;
    --rang-ogoh: #ffd60a;
    --rang-ogoh-fon: #3a2e0a;
    --rang-xato: #ff6359;
    --rang-xato-fon: #3d1614;
    --rang-xato-matn: #0a1024;
    --rang-info: #d6b4ff;
    --rang-info-fon: #2d1c43;
    --rang-neytral: #c9cfde;
    --rang-neytral-fon: #1a2443;
    --rang-dev: #ffe08a;
    --rang-dev-fon: #3a2e0a;
    --rang-dev-chegara: #6b5a1f;
    --rang-oltin: #cfa44e;       /* brend oltini — faqat bezak (chiziq, belgi, √). Oq fonda matn uchun emas — 2,31 : 1 */

    --rang-p1: #ff8a80; --rang-p1-fon: #3d1614;
    --rang-p2: #ffb26b; --rang-p2-fon: #3a220b;
    --rang-p3: #ffe08a; --rang-p3-fon: #332a0a;
    --rang-p4: #c9cfde; --rang-p4-fon: #1a2443;

    --rang-h-yangi: #8cc4ff;       --rang-h-yangi-fon: #0f2a47;
    --rang-h-ishda: #7fd6ff;       --rang-h-ishda-fon: #0b2a38;
    --rang-h-tekshiruvda: #d6b4ff; --rang-h-tekshiruvda-fon: #2d1c43;
    --rang-h-qaytarildi: #ff8a80;  --rang-h-qaytarildi-fon: #3d1614;
    --rang-h-tayyor: #6fe38a;      --rang-h-tayyor-fon: #10301a;
    --rang-h-bekor: #98a1b9;       --rang-h-bekor-fon: #1a2443;

    --soya-1: 0 1px 2px rgba(0, 0, 0, .5);
    --soya-2: 0 4px 16px rgba(0, 0, 0, .6);
    --fokus: 0 0 0 3px rgba(216, 177, 99, .55);
    color-scheme: dark;
  }
}

/* Tun — qo'lda tanlangan (yuqoridagi @media blok bilan BIR XIL qiymatlar) */
:root[data-tema="tun"] {
  --rang-fon: #0a1024;
  --rang-sirt: #121a33;
  --rang-sirt-2: #1a2443;
  --rang-sirt-bosilgan: #24304f;
  --rang-matn: #ffffff;
  --rang-matn-2: #c9cfde;
  --rang-matn-3: #98a1b9;
  --rang-chegara: rgba(255, 255, 255, .10);
  --rang-chegara-2: #3a4566;

  --rang-aksent: #d8b163;
  --rang-aksent-matn: #13234a;
  --rang-aksent-fon: #2a2416;
  --rang-tugma: #d8b163;        /* tugma: tunda oltin + navy yozuv (BR-2) */
  --rang-tugma-matn: #13234a;
  --rang-ok: #30d158;
  --rang-ok-fon: #10301a;
  --rang-ogoh: #ffd60a;
  --rang-ogoh-fon: #3a2e0a;
  --rang-xato: #ff6359;
  --rang-xato-fon: #3d1614;
  --rang-xato-matn: #0a1024;
  --rang-info: #d6b4ff;
  --rang-info-fon: #2d1c43;
  --rang-neytral: #c9cfde;
  --rang-neytral-fon: #1a2443;
  --rang-dev: #ffe08a;
  --rang-dev-fon: #3a2e0a;
  --rang-dev-chegara: #6b5a1f;
  --rang-oltin: #cfa44e;       /* brend oltini — faqat bezak (chiziq, belgi, √). Oq fonda matn uchun emas — 2,31 : 1 */

  --rang-p1: #ff8a80; --rang-p1-fon: #3d1614;
  --rang-p2: #ffb26b; --rang-p2-fon: #3a220b;
  --rang-p3: #ffe08a; --rang-p3-fon: #332a0a;
  --rang-p4: #c9cfde; --rang-p4-fon: #1a2443;

  --rang-h-yangi: #8cc4ff;       --rang-h-yangi-fon: #0f2a47;
  --rang-h-ishda: #7fd6ff;       --rang-h-ishda-fon: #0b2a38;
  --rang-h-tekshiruvda: #d6b4ff; --rang-h-tekshiruvda-fon: #2d1c43;
  --rang-h-qaytarildi: #ff8a80;  --rang-h-qaytarildi-fon: #3d1614;
  --rang-h-tayyor: #6fe38a;      --rang-h-tayyor-fon: #10301a;
  --rang-h-bekor: #98a1b9;       --rang-h-bekor-fon: #1a2443;

  --soya-1: 0 1px 2px rgba(0, 0, 0, .5);
  --soya-2: 0 4px 16px rgba(0, 0, 0, .6);
  --fokus: 0 0 0 3px rgba(216, 177, 99, .55);
  color-scheme: dark;
}

/* Kun — qo'lda tanlangan: tizim qorong'i bo'lsa ham yorug' */
:root[data-tema="kun"] { color-scheme: light; }

/* Logotip varianti: Tun — "oq". Ikki qoida bir xil bo'lishi shart (tun tokenlari bloklari kabi). */
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="kun"]) .avizo-logo--rang { display: none; }
  :root:not([data-tema="kun"]) .avizo-logo--oq { display: block; }
}
:root[data-tema="tun"] .avizo-logo--rang { display: none; }
:root[data-tema="tun"] .avizo-logo--oq { display: block; }

/* ---------- 3. Asos ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--shrift); font-size: var(--matn-m); line-height: var(--qator);
  color: var(--rang-matn); background: var(--rang-fon);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--rang-aksent); text-underline-offset: 2px; }
table, .raqam { font-variant-numeric: tabular-nums; }  /* DZ-1: raqamlar bir xil kenglikda */
h1, h2, h3 { line-height: 1.2; letter-spacing: -0.01em; }
:focus-visible { outline: none; box-shadow: var(--fokus); border-radius: var(--radius-s); }
[hidden] { display: none !important; }
.inline { display: inline; }
.xato { color: var(--rang-xato); }
.kichik { color: var(--rang-matn-3); font-size: var(--matn-xs); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Sarlavha va pastki qism */
.avizo-header, .avizo-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--oraliq-2) var(--oraliq-3); padding: var(--oraliq-3) var(--oraliq-4); }
.avizo-header { background: var(--rang-sirt); border-bottom: 1px solid var(--rang-chegara); }
.avizo-footer { border-top: 1px solid var(--rang-chegara); color: var(--rang-matn-3); font-size: var(--matn-xs); }
.avizo-brend { font-weight: var(--qalinlik-juda); text-decoration: none; color: var(--rang-matn); font-size: 18px; min-height: var(--teginish); display: inline-flex; align-items: center; }
.avizo-nav { display: flex; gap: var(--oraliq-3); align-items: center; font-size: var(--matn-s); min-width: 0; }
.avizo-foydalanuvchi { max-width: 42vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--rang-matn-2); }
.avizo-havola-tugma { background: none; border: 0; color: var(--rang-aksent); font: inherit; cursor: pointer; min-height: var(--teginish); padding: 0 var(--oraliq-1); }
.avizo-til { font: inherit; font-size: var(--matn-s); min-height: 36px; padding: 4px 8px; border: 1px solid var(--rang-chegara-2); border-radius: var(--radius); background: var(--rang-sirt); color: var(--rang-matn); }
@media (max-width: 480px) { .avizo-rol { display: none; } }

/* Kun / Tun almashtirgichi (DZ-2): static/js/tema.js `<html class="js">` ni qo'yadi; JS yo'q bo'lsa tugma yashirin */
html:not(.js) .avizo-tema { display: none; }  /* JS yo'q bo'lsa tugma ishlamaydi — yashirin */
.avizo-tema { display: inline-flex; align-items: center; justify-content: center; gap: var(--oraliq-1); min-width: var(--teginish); min-height: var(--teginish); padding: 0 var(--oraliq-2); border: 0; border-radius: var(--radius); background: none; color: var(--rang-matn-2); font: inherit; font-size: var(--matn-s); cursor: pointer; }
.avizo-tema:hover { background: var(--rang-sirt-bosilgan); color: var(--rang-matn); }
.avizo-tema svg { width: 22px; height: 22px; flex: none; }
/* Joriy holat <html data-tema> dan ko'rinadi (JS DOMContentLoaded ni kutmaydi — sarlavha siljimaydi) */
.avizo-tema [data-h] { display: none; }
html:not([data-tema]) .avizo-tema [data-h="tizim"], html[data-tema="kun"] .avizo-tema [data-h="kun"], html[data-tema="tun"] .avizo-tema [data-h="tun"] { display: inline-flex; }
@media (max-width: 600px) { .avizo-tema__yozuv { display: none; } }

.avizo-main { max-width: var(--kenglik-ess); margin: var(--oraliq-5) auto; padding: 0 var(--oraliq-4); }
.avizo-main--keng { max-width: var(--kenglik-keng); }
.avizo-karta { background: var(--rang-sirt); border: 1px solid var(--rang-chegara); border-radius: var(--radius-l); padding: var(--oraliq-5); }
.avizo-karta + .avizo-karta { margin-top: var(--oraliq-4); }
.avizo-karta h3 { font-size: var(--matn-m); margin: var(--oraliq-5) 0 var(--oraliq-1); }
/* Logotip (BR-4): faqat kenglik beriladi, height: auto — proporsiya saqlanadi; gradient, fon, chegara, soya yo'q.
 * Kun — "rang" varianti, Tun — "oq" varianti. Ko'rinish qoidalari tun tokenlari bloklaridan keyin (3-bo'lim
 * oldida): ikkala tun selektori bir xil. */
.avizo-brend { padding: 8px 0; }  /* + sarlavha oralig'i 12 px = 20 px ≈ logotip balandligining ½ qismi (brendbukdagi ½x bo'sh joy) */
.avizo-brend .avizo-logo { width: 150px; }
.avizo-kirish-logo { margin: 0 0 var(--oraliq-4); line-height: 0; }
.avizo-kirish-logo .avizo-logo { width: min(260px, 70vw); }
.avizo-logo { display: block; height: auto; max-width: 100%; }
.avizo-logo--oq { display: none; }

/* Shior (BR-5): kirish sahifasida sarlavha ostida */
.avizo-shior { margin: var(--oraliq-2) 0 var(--oraliq-4); color: var(--rang-matn-2); font-size: var(--matn-s); letter-spacing: .06em; }
.avizo-login label { display: block; margin: var(--oraliq-2) 0; }
.avizo-login input { display: block; width: 100%; padding: var(--oraliq-2); margin-top: var(--oraliq-1); }

/* Q-K6: dev rejim ogohlantirish chizig'i (parolsiz kirish) */
.avizo-dev-chiziq { display: flex; flex-wrap: wrap; gap: var(--oraliq-2) var(--oraliq-4); align-items: center; padding: var(--oraliq-2) var(--oraliq-4); background: var(--rang-dev-fon); color: var(--rang-dev); border-bottom: 1px solid var(--rang-dev-chegara); font-size: var(--matn-s); }
.avizo-dev-tugma { margin-left: auto; color: var(--rang-dev); font-weight: var(--qalinlik-qalin); }
.avizo-tanlagich { list-style: none; padding: 0; margin: var(--oraliq-4) 0 0; display: grid; gap: var(--oraliq-2); }
.avizo-tanlagich-tugma { width: 100%; min-height: var(--tugma-balandlik); display: flex; justify-content: space-between; gap: var(--oraliq-3); padding: var(--oraliq-3) var(--oraliq-4); border: 1px solid var(--rang-chegara-2); border-radius: var(--radius); background: var(--rang-sirt); color: var(--rang-matn); cursor: pointer; font: inherit; text-align: left; }
.avizo-tanlagich-tugma:hover { border-color: var(--rang-aksent); }
.avizo-tanlagich-tugma .rol { color: var(--rang-matn-3); font-size: var(--matn-s); }

/* ---------- 4. Tugmalar ---------- */
.avizo-tugma { display: inline-flex; align-items: center; justify-content: center; gap: var(--oraliq-2); min-height: var(--teginish); padding: 10px 16px; border: 1px solid var(--rang-tugma); border-radius: var(--radius); background: var(--rang-tugma); color: var(--rang-tugma-matn); text-decoration: none; font: inherit; font-weight: var(--qalinlik-qalin); cursor: pointer; line-height: 1.2; text-align: center; }
.avizo-tugma:hover { filter: brightness(.94); }
.avizo-tugma:active { filter: brightness(.88); }
.avizo-tugma[aria-busy="true"] { opacity: .6; pointer-events: none; }
.avizo-tugma--ikkinchi { background: var(--rang-sirt); color: var(--rang-aksent); border-color: var(--rang-aksent); }
.avizo-tugma--xavfli { background: var(--rang-sirt); color: var(--rang-xato); border-color: var(--rang-xato); }
.avizo-tugma--xavfli-toliq { background: var(--rang-xato); border-color: var(--rang-xato); color: var(--rang-xato-matn); }
.avizo-tugma--kichik { min-height: 32px; padding: 4px 10px; font-size: 13px; }
.avizo-tugma--keng { width: 100%; min-height: var(--tugma-balandlik); }

/* ---------- 5. Jadvallar, formalar, filtrlar (boshqaruv paneli) ---------- */
.avizo-sarlavha { display: flex; flex-wrap: wrap; gap: var(--oraliq-2) var(--oraliq-4); align-items: center; justify-content: space-between; margin-bottom: var(--oraliq-4); }
.avizo-sarlavha h1 { margin: 0; font-size: 24px; }
.avizo-filtr { display: flex; flex-wrap: wrap; gap: var(--oraliq-2); align-items: end; margin-bottom: var(--oraliq-4); }
.avizo-filtr label { display: flex; flex-direction: column; font-size: 13px; color: var(--rang-matn-2); gap: var(--oraliq-1); }
.avizo-filtr input, .avizo-filtr select { min-height: var(--teginish); padding: 7px 8px; border: 1px solid var(--rang-chegara-2); border-radius: var(--radius); font: inherit; min-width: 160px; background: var(--rang-sirt); color: var(--rang-matn); }
.avizo-jadval-oram { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.avizo-jadval { width: 100%; border-collapse: collapse; font-size: var(--matn-s); }
.avizo-jadval th, .avizo-jadval td { text-align: left; padding: var(--oraliq-2) 10px; border-bottom: 1px solid var(--rang-chegara); vertical-align: top; }
.avizo-jadval th { color: var(--rang-matn-2); font-weight: var(--qalinlik-qalin); background: var(--rang-sirt-2); }
.avizo-jadval tr.nofaol td { color: var(--rang-matn-3); }
/* T-336: pul ustunlari — o'ngga tekislanadi, raqamlar bir qatorda turadi (buxgalter solishtiradi) */
.avizo-jadval th.raqam, .avizo-jadval td.raqam { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.avizo-jadval td:first-child { white-space: nowrap; }
/* T-317: ustun filtri va saralash (JS qo'shadi; JS o'chiq bo'lsa bu qoidalar ishlamaydi) */
.avizo-jadval-saralash { cursor: pointer; user-select: none; }
.avizo-jadval-saralash::after { content: "\2195"; margin-left: 4px; opacity: .35; font-weight: 400; }
.avizo-jadval-saralash[data-yonalish="osish"]::after { content: "\2191"; opacity: 1; }
.avizo-jadval-saralash[data-yonalish="kamayish"]::after { content: "\2193"; opacity: 1; }
.avizo-jadval-saralash:focus-visible { outline: 2px solid var(--rang-aksent); outline-offset: -2px; }
.avizo-jadval-filtr th { padding: 4px 6px; background: var(--rang-sirt-2); }
.avizo-jadval-filtr__kirish { width: 100%; min-width: 60px; box-sizing: border-box; padding: 5px 7px; border: 1px solid var(--rang-chegara-2); border-radius: var(--radius); font: inherit; font-size: 13px; font-weight: 400; background: var(--rang-sirt); color: var(--rang-matn); }
.avizo-jadval-holat { margin: var(--oraliq-2) 0 0; color: var(--rang-matn-2); }
@media (max-width: 600px) { .avizo-jadval-filtr__kirish { min-width: 48px; } }
.avizo-kv { display: grid; grid-template-columns: minmax(140px, 220px) 1fr; gap: var(--oraliq-2) var(--oraliq-4); margin: 0; }
.avizo-kv dt { color: var(--rang-matn-3); }
.avizo-kv dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 600px) { .avizo-kv { grid-template-columns: 1fr; gap: 0; } .avizo-kv dt { margin-top: var(--oraliq-3); font-size: var(--matn-s); } }
.avizo-forma p { margin: 0 0 var(--oraliq-3); }
.avizo-forma label { display: block; font-weight: var(--qalinlik-qalin); margin-bottom: var(--oraliq-1); }
.avizo-forma input:not([type=checkbox]):not([type=radio]), .avizo-forma select, .avizo-forma textarea { width: 100%; max-width: 520px; min-height: var(--teginish); padding: 10px 12px; border: 1px solid var(--rang-chegara-2); border-radius: var(--radius); font: inherit; font-size: var(--matn-m); background: var(--rang-sirt); color: var(--rang-matn); }
.avizo-forma textarea { min-height: 88px; resize: vertical; }
.avizo-forma input[type=file] { padding: 8px; }
.avizo-forma .errorlist, .errorlist { list-style: none; padding: 0; margin: var(--oraliq-1) 0; color: var(--rang-xato); font-size: var(--matn-s); }
.avizo-forma .helptext, .helptext { color: var(--rang-matn-3); font-size: var(--matn-xs); }
.avizo-bosh { color: var(--rang-matn-3); padding: var(--oraliq-5); text-align: center; border: 1px dashed var(--rang-chegara-2); border-radius: var(--radius); }
.avizo-sahifalash { display: flex; gap: var(--oraliq-3); align-items: center; margin-top: var(--oraliq-3); font-size: var(--matn-s); }
.avizo-sahifalash a { min-height: var(--teginish); display: inline-flex; align-items: center; }
.avizo-xabarlar { list-style: none; padding: 0; margin: 0 0 var(--oraliq-4); }
.avizo-xabarlar li { padding: 10px 14px; border-radius: var(--radius); background: var(--rang-ok-fon); color: var(--rang-ok); margin-bottom: var(--oraliq-2); font-size: var(--matn-s); }
.avizo-xabarlar li.error { background: var(--rang-xato-fon); color: var(--rang-xato); }
.avizo-xabarlar li.warning { background: var(--rang-ogoh-fon); color: var(--rang-ogoh); }
.avizo-havolalar { display: flex; flex-wrap: wrap; gap: var(--oraliq-2); list-style: none; padding: 0; }

/* T-104: mas'ullar bloki, kichik ichki formalar */
.avizo-masul { display: flex; flex-wrap: wrap; gap: 6px var(--oraliq-3); align-items: center; margin-bottom: 6px; }
.avizo-ichki-forma { display: inline-flex; gap: 6px; align-items: center; }
.avizo-ichki-forma input { padding: 4px 6px; border: 1px solid var(--rang-chegara-2); border-radius: 6px; font: inherit; font-size: 13px; width: 140px; background: var(--rang-sirt); color: var(--rang-matn); }
.avizo-belgi-katak { flex-direction: row !important; align-items: center; gap: 6px !important; padding-bottom: var(--oraliq-2); }
.avizo-norma { padding: var(--oraliq-2) var(--oraliq-3); border-radius: var(--radius-s); background: var(--rang-sirt-2); margin: 0 0 var(--oraliq-3); }
.avizo-ikki-ustun { display: grid; grid-template-columns: 1fr 1fr; gap: var(--oraliq-4); }
@media (max-width: 760px) { .avizo-ikki-ustun { grid-template-columns: 1fr; } }

/* ---------- 6. Belgilar (badge): prioritet, holat, umumiy ---------- */
.avizo-belgi, .avizo-prioritet, .avizo-holat { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: var(--radius-toliq); font-size: var(--matn-xs); line-height: 18px; white-space: nowrap; vertical-align: middle; }
.avizo-belgi { background: var(--rang-aksent-fon); color: var(--rang-h-yangi); }
.avizo-belgi--nofaol { background: var(--rang-neytral-fon); color: var(--rang-neytral); }
.avizo-belgi--ogoh { background: var(--rang-ogoh-fon); color: var(--rang-ogoh); }
.avizo-belgi--xato { background: var(--rang-xato-fon); color: var(--rang-xato); }
.avizo-belgi--ok, .avizo-belgi--biriktirish { background: var(--rang-ok-fon); color: var(--rang-ok); }
.avizo-prioritet { font-weight: var(--qalinlik-juda); }
.avizo-prioritet--P1 { background: var(--rang-p1-fon); color: var(--rang-p1); }
.avizo-prioritet--P2 { background: var(--rang-p2-fon); color: var(--rang-p2); }
.avizo-prioritet--P3 { background: var(--rang-p3-fon); color: var(--rang-p3); }
.avizo-prioritet--P4 { background: var(--rang-p4-fon); color: var(--rang-p4); }
.avizo-holat--yangi { background: var(--rang-h-yangi-fon); color: var(--rang-h-yangi); }
.avizo-holat--ishda { background: var(--rang-h-ishda-fon); color: var(--rang-h-ishda); }
.avizo-holat--tekshiruvda { background: var(--rang-h-tekshiruvda-fon); color: var(--rang-h-tekshiruvda); }
.avizo-holat--qaytarildi { background: var(--rang-h-qaytarildi-fon); color: var(--rang-h-qaytarildi); }
.avizo-holat--tayyor { background: var(--rang-h-tayyor-fon); color: var(--rang-h-tayyor); }
.avizo-holat--bekor { background: var(--rang-h-bekor-fon); color: var(--rang-h-bekor); text-decoration: line-through; }
.avizo-kechikdi { color: var(--rang-xato); font-weight: var(--qalinlik-qalin); }

/* ---------- 7. Vazifa kartasi (T-106; T-110 da mobil) ---------- */
.avizo-tugmalar { display: flex; flex-wrap: wrap; gap: var(--oraliq-2); align-items: flex-start; margin: var(--oraliq-3) 0; }
.avizo-tugmalar form { margin: 0; }
.avizo-tugmalar details { border: 1px solid var(--rang-chegara); border-radius: var(--radius); padding: 0 var(--oraliq-3); background: var(--rang-sirt); }
.avizo-tugmalar details[open] { width: 100%; max-width: 560px; padding-bottom: var(--oraliq-3); }
.avizo-tugmalar summary { cursor: pointer; font-weight: var(--qalinlik-qalin); min-height: var(--teginish); display: flex; align-items: center; }
.avizo-tugmalar .helptext { display: block; }
.avizo-tarix { list-style: none; padding: 0; margin: 0; }
.avizo-tarix li { padding: var(--oraliq-2) 0; border-bottom: 1px solid var(--rang-chegara); font-size: var(--matn-s); overflow-wrap: anywhere; }
.avizo-tarix li:last-child { border-bottom: 0; }
.avizo-tarix .vaqt { color: var(--rang-matn-3); font-size: var(--matn-xs); }

/* ---------- 8. Xato xabari (HTMX so'rovi muvaffaqiyatsiz — static/js/avizo.js) ---------- */
.avizo-toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--nav-balandlik) + var(--oraliq-4) + env(safe-area-inset-bottom)); z-index: 50; max-width: min(92vw, 480px); padding: var(--oraliq-3) var(--oraliq-4); border-radius: var(--radius); background: var(--rang-matn); color: var(--rang-fon); box-shadow: var(--soya-2); font-size: var(--matn-s); }

/* HTMX indikatori: so'rov ketayotganda qobiq biroz xiralashadi */
.htmx-request.ess-qobiq, .htmx-request .ess-kontent { opacity: .65; transition: opacity .15s ease-in; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }