/* ==========================================================================
   MODERN 2026  —  theme-modern.css
   --------------------------------------------------------------------------
   iOS uslubidagi yagona, izchil dizayn qatlami.
   style.css ga TEGMAYDI — faqat uning ustidan tushadi.
   Faqat <html data-theme="biznes"> bo'lganda ishlaydi.
   ========================================================================== */

html[data-theme="biznes"] {
    /* ---- Palitra ---- */
    --m-ink:        #0A0F1C;
    --m-ink-2:      #3C4658;
    --m-muted:      #7B8698;
    --m-line:       rgba(10, 15, 28, 0.07);
    --m-line-2:     rgba(10, 15, 28, 0.13);

    --m-glass:      rgba(255, 255, 255, 0.72);
    --m-glass-2:    rgba(255, 255, 255, 0.55);
    --m-solid:      #FFFFFF;

    --m-blue:       #0A84FF;   /* iOS systemBlue  */
    --m-green:      #30B061;   /* iOS systemGreen */
    /* Yashil MATN uchun alohida, to'qroq ton: #30B061 oq fonda atigi 2.8
       kontrast beradi (kamida 4.5 kerak). Tugmalar, chiziqlar va fonlar
       --m-green da qoladi — bu faqat yozuvlar uchun. */
    --m-green-matn: #1E8348;
    --m-red:        #FF3B30;
    --m-orange:     #FF9500;
    --m-purple:     #7B5CFF;
    --m-teal:       #30B0C7;
    --m-indigo:     #5E5CE6;

    /* ---- Shakl ---- */
    --m-r-xl: 28px;
    --m-r-lg: 22px;
    --m-r-md: 16px;
    --m-r-sm: 11px;

    /* ---- Soyalar: yumshoq, ko'p qatlamli ---- */
    --m-sh-1: 0 1px 2px rgba(10,15,28,.04), 0 2px 8px rgba(10,15,28,.04);
    --m-sh-2: 0 2px 4px rgba(10,15,28,.05), 0 8px 24px -6px rgba(10,15,28,.10);
    --m-sh-3: 0 4px 8px rgba(10,15,28,.06), 0 20px 48px -12px rgba(10,15,28,.18);
    --m-sh-4: 0 8px 16px rgba(10,15,28,.08), 0 40px 80px -20px rgba(10,15,28,.28);

    /* ---- Harakat ---- */
    --m-spring: cubic-bezier(0.34, 1.42, 0.64, 1);
    --m-ease:   cubic-bezier(0.32, 0.72, 0, 1);

    /* style.css tokenlari */
    --bg-color: #F2F4F8;  --color-bg: #F2F4F8;
    --card-bg: var(--m-solid); --color-card-bg: var(--m-solid);
    --text-main: var(--m-ink); --text-muted: var(--m-muted);
    --primary-color: var(--m-blue); --color-primary: var(--m-blue); --primary-hover: #0070E0;
    --success-color: var(--m-green); --color-success: var(--m-green);
    --danger-color: var(--m-red);   --color-danger: var(--m-red);
    --border-color: var(--m-line);  --input-border: var(--m-line-2);
    --border-radius-lg: var(--m-r-lg);
    --border-radius-md: var(--m-r-md);
    --border-radius-sm: var(--m-r-sm);
    --shadow-sm: var(--m-sh-1); --shadow-md: var(--m-sh-2); --shadow-lg: var(--m-sh-3);
    --font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
}

/* ========================================================== ASOS */
html[data-theme="biznes"] body {
    background:
        radial-gradient(1100px 620px at 8% -8%,  rgba(10,132,255,.13), transparent 62%),
        radial-gradient(900px 560px at 100% 0%,  rgba(123,92,255,.11), transparent 58%),
        radial-gradient(900px 620px at 50% 108%, rgba(48,176,199,.10), transparent 62%),
        #F2F4F8 !important;
    background-attachment: fixed !important;
    color: var(--m-ink);
    font-family: var(--font-family);
    letter-spacing: -0.014em;
    -webkit-font-smoothing: antialiased;
}

html[data-theme="biznes"] h1, html[data-theme="biznes"] h2,
html[data-theme="biznes"] h3, html[data-theme="biznes"] h4 {
    color: var(--m-ink);
    font-weight: 700;
    letter-spacing: -0.03em;
}

html[data-theme="biznes"] .text-muted { color: var(--m-muted); }
html[data-theme="biznes"] .text-success, html[data-theme="biznes"] .text-green-500 { color: var(--m-green) !important; }
html[data-theme="biznes"] .text-danger,  html[data-theme="biznes"] .text-red-500   { color: var(--m-red) !important; }

/* Pul raqamlari tik ustun bo'lib tursin */
html[data-theme="biznes"] .stat-card .fw-bold,
html[data-theme="biznes"] .table td, html[data-theme="biznes"] .table th,
html[data-theme="biznes"] .modern-table td, html[data-theme="biznes"] .modern-table th,
html[data-theme="biznes"] .kassa-table td, html[data-theme="biznes"] .kassa-table th,
html[data-theme="biznes"] .debt-amount, html[data-theme="biznes"] .savdo-card-debt-value,
html[data-theme="biznes"] #total-balance-amount {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1, "cv01" 1;
}

/* ========================================================== YUQORI PANEL — shisha */
html[data-theme="biznes"] .top-nav {
    background: rgba(255,255,255,.62) !important;
    backdrop-filter: saturate(180%) blur(24px);
    -webkit-backdrop-filter: saturate(180%) blur(24px);
    border-bottom: 1px solid var(--m-line);
    box-shadow: none;
    padding: 13px 22px;
    /* MUHIM: balandlik (padding) scroll paytida O'ZGARMASLIGI kerak.
       Sticky panel balandligi o'zgarsa, ostidagi kontent siljiydi, scroll
       o'rni o'zgaradi va qoida qayta-qayta yoqilib-o'chadi — panel qaltiraydi.
       Shuning uchun faqat fon va soya o'zgaradi. */
    transition: background-color .28s var(--m-ease), box-shadow .28s var(--m-ease);
}
html[data-theme="biznes"] .top-nav.is-stuck {
    background: rgba(255,255,255,.82) !important;
    box-shadow: 0 1px 0 var(--m-line), 0 10px 30px -12px rgba(10,15,28,.20);
}
html[data-theme="biznes"] #user-name-display { color: var(--m-ink-2) !important; font-weight: 600; white-space: nowrap; }

/* ========================================================== KARTALAR — shisha */
html[data-theme="biznes"] .card,
html[data-theme="biznes"] .widget-card {
    background: var(--m-glass);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: 1px solid rgba(255,255,255,.65);
    border-radius: var(--m-r-xl);
    box-shadow: var(--m-sh-2);
}
html[data-theme="biznes"] .widget-header,
html[data-theme="biznes"] .list-header { border-bottom: 1px solid var(--m-line); }

/* ========================================================== YUQORI PANEL: brend + foydalanuvchi */
/* style.css .nav-brand va #user-name-display ga gradient-matn beradi
   (-webkit-text-fill-color: transparent) — yangi tuzilmada uni bekor qilamiz */
html[data-theme="biznes"] .nav-brand,
html[data-theme="biznes"] .brand-text,
html[data-theme="biznes"] .brand-name,
html[data-theme="biznes"] .brand-sub,
html[data-theme="biznes"] #user-name-display {
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
}
html[data-theme="biznes"] .nav-brand { display: flex; align-items: center; gap: 11px; }
html[data-theme="biznes"] .brand-mark {
    width: 34px; height: 34px; flex: none;
    display: grid; place-items: center;
    border-radius: 11px; color: #fff;
    background: linear-gradient(140deg, #2A94FF 0%, var(--m-indigo) 55%, var(--m-purple) 100%);
    box-shadow: 0 2px 5px rgba(10,132,255,.32), 0 8px 18px -8px rgba(94,92,230,.55);
}
html[data-theme="biznes"] .brand-text { display: flex; flex-direction: column; line-height: 1.1; }
html[data-theme="biznes"] .brand-name {
    font-size: 1.01rem; font-weight: 700; color: var(--m-ink);
    letter-spacing: -0.032em; white-space: nowrap;
}
html[data-theme="biznes"] .brand-sub {
    font-size: .66rem; font-weight: 550; color: var(--m-muted);
    letter-spacing: .04em; margin-top: 2px;
}
html[data-theme="biznes"] .nav-actions { display: flex; align-items: center; gap: 10px; }
html[data-theme="biznes"] .user-chip {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 5px 13px 5px 5px; border-radius: 999px;
    background: rgba(10,15,28,.05);
    font-size: .83rem; font-weight: 600; color: var(--m-ink-2);
}
html[data-theme="biznes"] .user-avatar {
    width: 25px; height: 25px; border-radius: 50%; flex: none;
    background: linear-gradient(140deg, #2A94FF, var(--m-purple));
    color: #fff; font-size: .72rem; font-weight: 700;
    display: grid; place-items: center;
}

/* ========================================================== STAT KARTOCHKALARI */
html[data-theme="biznes"] .stats-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));   /* 6 tasi BIR QATORDA */
    gap: 10px;
}
/* Planshet va telefonda bir qatorga sig'maydi — bosqichma-bosqich kamayadi */
@media (max-width: 759px) {
    html[data-theme="biznes"] .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}
@media (max-width: 520px) {
    html[data-theme="biznes"] .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
html[data-theme="biznes"] .stat-card {
    --m-c: var(--m-blue);
    position: relative;
    display: flex; flex-direction: column;
    background: var(--m-solid);
    border: 1px solid rgba(10,15,28,.055);
    border-radius: 16px;
    padding: 13px 13px 11px;
    box-shadow: var(--m-sh-1);
    overflow: hidden;
    min-width: 0;
    transition: transform .42s var(--m-spring), box-shadow .42s var(--m-ease), border-color .3s var(--m-ease);
    will-change: transform;
}
html[data-theme="biznes"] .stat-card[data-accent="blue"]   { --m-c: var(--m-blue); }
html[data-theme="biznes"] .stat-card[data-accent="green"]  { --m-c: var(--m-green); }
html[data-theme="biznes"] .stat-card[data-accent="purple"] { --m-c: var(--m-purple); }
html[data-theme="biznes"] .stat-card[data-accent="orange"] { --m-c: var(--m-orange); }
html[data-theme="biznes"] .stat-card[data-accent="red"]    { --m-c: var(--m-red); }
html[data-theme="biznes"] .stat-card[data-accent="indigo"] { --m-c: var(--m-indigo); }

/* Yuqori o'ng burchakdagi yumshoq rangli nur */
html[data-theme="biznes"] .stat-card::before {
    content: ""; position: absolute; top: -42px; right: -42px;
    width: 100px; height: 100px; border-radius: 50%;
    background: var(--m-c); opacity: .09;
    transition: opacity .42s var(--m-ease), transform .42s var(--m-ease);
    pointer-events: none;
}
html[data-theme="biznes"] .stat-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--m-c) 26%, transparent);
    box-shadow: 0 10px 22px -10px color-mix(in srgb, var(--m-c) 40%, transparent), var(--m-sh-3);
}
html[data-theme="biznes"] .stat-card:hover::before { opacity: .15; transform: scale(1.12); }

html[data-theme="biznes"] .stat-clickable {
    all: unset;
    display: flex; flex-direction: column; gap: 2px;
    cursor: pointer; position: relative; z-index: 1;
    min-width: 0;
}
html[data-theme="biznes"] .stat-clickable:focus-visible {
    outline: 2px solid var(--m-c); outline-offset: 4px; border-radius: 10px;
}
html[data-theme="biznes"] .stat-icon {
    width: 27px; height: 27px; margin-bottom: 6px;
    display: grid; place-items: center;
    border-radius: 9px;
    color: var(--m-c);
    background: color-mix(in srgb, var(--m-c) 12%, transparent);
}
html[data-theme="biznes"] .stat-label {
    font-size: .685rem; font-weight: 600; color: var(--m-muted);
    letter-spacing: .008em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html[data-theme="biznes"] .stat-value {
    /* Ekran kengligiga qarab o'zi moslashadi — 6 ta kartochka bir qatorda qolsin.
       Joy yetmasa "so'm" pastki qatorga o'tadi, raqam kesilmaydi. */
    font-size: clamp(.78rem, 1.22vw, 1.26rem);
    font-weight: 720; color: var(--m-ink);
    letter-spacing: -0.045em; line-height: 1.22;
    font-variant-numeric: tabular-nums;
    overflow-wrap: break-word;
}
@media (max-width: 759px) {
    html[data-theme="biznes"] .stat-value { font-size: 1.22rem; }
}

/* Prognoz — pastdagi nozik tugma (eski vertikal yozuv o'rniga) */
html[data-theme="biznes"] .prognoz-btn {
    all: unset;
    margin-top: 10px; padding: 5px 10px;
    align-self: flex-start;
    display: inline-flex; align-items: center; gap: 5px;
    border-radius: 999px; cursor: pointer;
    font-size: .665rem; font-weight: 620; letter-spacing: .01em;
    color: var(--m-muted);
    background: rgba(10,15,28,.045);
    position: relative; z-index: 1;
    transition: background .24s var(--m-ease), color .24s var(--m-ease), transform .3s var(--m-spring);
}
html[data-theme="biznes"] .prognoz-btn:hover {
    background: color-mix(in srgb, var(--m-c) 13%, transparent);
    color: var(--m-c);
}
html[data-theme="biznes"] .prognoz-btn:active { transform: scale(.93); }
html[data-theme="biznes"] .prognoz-btn:focus-visible { outline: 2px solid var(--m-c); outline-offset: 3px; }

/* "Barchasi" — to'q kartochka */
html[data-theme="biznes"] .stat-card--dark {
    background: linear-gradient(150deg, #1B2135 0%, #0A0F1C 100%);
    border-color: rgba(255,255,255,.09);
}
html[data-theme="biznes"] .stat-card--dark::before { opacity: .22; }
html[data-theme="biznes"] .stat-card--dark .stat-label { color: rgba(255,255,255,.58); }
html[data-theme="biznes"] .stat-card--dark .stat-value { color: #fff; }
html[data-theme="biznes"] .stat-card--dark .stat-icon {
    background: rgba(255,255,255,.1); color: #C7D2FE;
}
html[data-theme="biznes"] .stat-card--dark .prognoz-btn {
    background: rgba(255,255,255,.09); color: rgba(255,255,255,.72);
}
html[data-theme="biznes"] .stat-card--dark .prognoz-btn:hover { background: rgba(255,255,255,.18); color: #fff; }

/* ========================================================== BO'LIM SARLAVHALARI */
html[data-theme="biznes"] .section-title {
    display: flex; align-items: center; gap: 9px;
    font-size: 1.12rem; font-weight: 700;
    letter-spacing: -0.028em; color: var(--m-ink);
}
html[data-theme="biznes"] .section-title svg { color: var(--m-muted); }

/* ========================================================== TUGMALAR */
html[data-theme="biznes"] .btn {
    border-radius: 999px;
    font-weight: 600;
    letter-spacing: -0.012em;
    position: relative;
    overflow: hidden;
    transition: transform .3s var(--m-spring), background .22s var(--m-ease),
                box-shadow .22s var(--m-ease), color .22s var(--m-ease), border-color .22s var(--m-ease);
}
html[data-theme="biznes"] .btn:active:not(:disabled) { transform: scale(.94); }
html[data-theme="biznes"] .btn-primary {
    background: linear-gradient(180deg, #2A94FF, var(--m-blue));
    border-color: transparent; color: #fff;
    box-shadow: 0 1px 2px rgba(10,132,255,.35), 0 8px 20px -8px rgba(10,132,255,.55);
}
html[data-theme="biznes"] .btn-primary:hover { filter: brightness(1.06); box-shadow: 0 2px 4px rgba(10,132,255,.4), 0 14px 28px -10px rgba(10,132,255,.6); }
html[data-theme="biznes"] .btn-outline,
html[data-theme="biznes"] .btn-primary-outline,
html[data-theme="biznes"] .btn-success-outline,
html[data-theme="biznes"] .btn-danger-outline,
html[data-theme="biznes"] .btn-warning-outline {
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--m-line-2);
}
html[data-theme="biznes"] .btn-outline         { color: var(--m-ink-2); }
html[data-theme="biznes"] .btn-primary-outline { color: var(--m-blue); }
html[data-theme="biznes"] .btn-success-outline { color: var(--m-green); }
html[data-theme="biznes"] .btn-danger-outline  { color: var(--m-red); }
html[data-theme="biznes"] .btn-warning-outline { color: #C77700; }
html[data-theme="biznes"] .btn-primary-outline:hover:not(:disabled) { background: var(--m-blue);  border-color: var(--m-blue);  color: #fff; }
html[data-theme="biznes"] .btn-success-outline:hover:not(:disabled) { background: var(--m-green); border-color: var(--m-green); color: #fff; }
html[data-theme="biznes"] .btn-danger-outline:hover:not(:disabled)  { background: var(--m-red);   border-color: var(--m-red);   color: #fff; }
html[data-theme="biznes"] .btn-warning-outline:hover:not(:disabled) { background: var(--m-orange);border-color: var(--m-orange);color: #fff; }
html[data-theme="biznes"] .btn-outline:hover:not(:disabled)         { background: #fff; border-color: var(--m-muted); }

/* Ripple (JS qo'shadi) */
html[data-theme="biznes"] .m-ripple {
    position: absolute; border-radius: 50%;
    transform: scale(0); opacity: .38;
    background: currentColor; pointer-events: none;
    animation: m-ripple .62s var(--m-ease) forwards;
}
@keyframes m-ripple { to { transform: scale(2.6); opacity: 0; } }

/* ========================================================== MAYDONLAR */
html[data-theme="biznes"] .form-control,
html[data-theme="biznes"] select.form-control {
    border-radius: var(--m-r-sm);
    border: 1px solid var(--m-line-2);
    background: rgba(255,255,255,.9);
    color: var(--m-ink);
    transition: border-color .2s var(--m-ease), box-shadow .2s var(--m-ease), background .2s var(--m-ease);
}
html[data-theme="biznes"] .form-control:focus,
html[data-theme="biznes"] select.form-control:focus {
    border-color: var(--m-blue);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(10,132,255,.16);
    outline: none;
}
html[data-theme="biznes"] .form-group label {
    color: var(--m-ink-2); font-weight: 600; font-size: .82rem; letter-spacing: -0.008em;
}

/* ========================================================== JADVALLAR (yorug') */
html[data-theme="biznes"] .table th {
    background: transparent;
    color: var(--m-muted);
    font-size: .68rem; font-weight: 650;
    text-transform: uppercase; letter-spacing: .085em;
    border-bottom: 1px solid var(--m-line-2);
}
html[data-theme="biznes"] .table td { border-bottom: 1px solid var(--m-line); color: var(--m-ink-2); }
html[data-theme="biznes"] .table tbody tr { transition: background .18s var(--m-ease); }
html[data-theme="biznes"] .table tbody tr:hover { background: rgba(10,132,255,.045); }

/* ========================================================== KASSA DAFTARI */
html[data-theme="biznes"] #kassa-kirim-col,
html[data-theme="biznes"] #kassa-chiqim-col {
    background: rgba(255,255,255,.7) !important;
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.8) !important;
    border-radius: var(--m-r-lg) !important;
    box-shadow: var(--m-sh-1);
    position: relative; overflow: hidden;
}
html[data-theme="biznes"] #kassa-kirim-col::before,
html[data-theme="biznes"] #kassa-chiqim-col::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
}
html[data-theme="biznes"] #kassa-kirim-col::before  { background: linear-gradient(90deg, var(--m-green), transparent 90%); }
html[data-theme="biznes"] #kassa-chiqim-col::before { background: linear-gradient(90deg, var(--m-red),   transparent 90%); }
html[data-theme="biznes"] .kassa-table th {
    color: var(--m-muted); font-size: .64rem; font-weight: 650;
    text-transform: uppercase; letter-spacing: .08em;
}
html[data-theme="biznes"] .kassa-table td { color: var(--m-ink-2); }
html[data-theme="biznes"] .kassa-table tfoot tr:first-child td { border-top: 1px solid var(--m-line-2) !important; }

/* ========================================================== SAVDO NUQTALARI */
html[data-theme="biznes"] .savdo-toolbar {
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 999px;
    box-shadow: var(--m-sh-1);
}
html[data-theme="biznes"] .savdo-grid-card,
html[data-theme="biznes"] .dealer-card,
html[data-theme="biznes"] .dealer-list-item {
    background: var(--m-solid);
    border: 1px solid rgba(255,255,255,.9);
    border-radius: var(--m-r-lg);
    box-shadow: var(--m-sh-1);
    transition: transform .42s var(--m-spring), box-shadow .42s var(--m-ease);
}
html[data-theme="biznes"] .savdo-grid-card:hover,
html[data-theme="biznes"] .dealer-card:hover,
html[data-theme="biznes"] .dealer-list-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--m-sh-3);
}
html[data-theme="biznes"] .savdo-grid-card:active { transform: translateY(-1px) scale(.99); }
html[data-theme="biznes"] .savdo-card-name, html[data-theme="biznes"] .dealer-list-name {
    color: var(--m-ink); font-weight: 680; letter-spacing: -0.024em;
}
html[data-theme="biznes"] .savdo-card-debt-label, html[data-theme="biznes"] .debt-label {
    color: var(--m-muted); text-transform: uppercase;
    font-size: .63rem; letter-spacing: .09em; font-weight: 620;
}
html[data-theme="biznes"] .savdo-card-debt-value { letter-spacing: -0.032em; font-weight: 720; }

/* iOS segment boshqaruvi */
html[data-theme="biznes"] .kind-switch,
html[data-theme="biznes"] .savdo-segment-ctrl {
    background: rgba(10,15,28,.055);
    border-radius: 999px; padding: 3px; border: none;
}
html[data-theme="biznes"] .kind-switch-btn,
html[data-theme="biznes"] .savdo-segment-label {
    border-radius: 999px; border: none; background: transparent;
    color: var(--m-ink-2); font-weight: 600;
    transition: background .3s var(--m-ease), color .3s var(--m-ease), box-shadow .3s var(--m-ease), transform .3s var(--m-spring);
}
html[data-theme="biznes"] .kind-switch-btn.active,
html[data-theme="biznes"] .savdo-segment-ctrl input[type="radio"]:checked + .savdo-segment-label {
    background: #fff !important;
    color: var(--m-ink) !important;
    box-shadow: 0 1px 3px rgba(10,15,28,.14), 0 3px 8px -2px rgba(10,15,28,.10);
}
html[data-theme="biznes"] .savdo-search-wrap,
html[data-theme="biznes"] .savdo-sort-wrap {
    background: rgba(10,15,28,.05); border: none; border-radius: 999px;
}
html[data-theme="biznes"] .savdo-search-input { background: transparent; }
html[data-theme="biznes"] .savdo-search-wrap:focus-within {
    background: #fff; box-shadow: 0 0 0 4px rgba(10,132,255,.16);
}

/* ========================================================== OYNALAR — "bottom sheet" */
html[data-theme="biznes"] .modal { backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
html[data-theme="biznes"] .modal-content {
    border-radius: var(--m-r-xl);
    border: 1px solid rgba(255,255,255,.7);
    box-shadow: var(--m-sh-4);
    animation: m-pop .46s var(--m-spring) both;
}
@keyframes m-pop { from { opacity: 0; transform: translateY(18px) scale(.965); } to { opacity: 1; transform: none; } }
html[data-theme="biznes"] .modal-header { border-bottom: 1px solid var(--m-line); }
html[data-theme="biznes"] .modal-footer { border-top: 1px solid var(--m-line); background: rgba(10,15,28,.022); }

/* .modern-modal — to'qdan yorug' shishaga o'tkazamiz */
html[data-theme="biznes"] .modern-modal {
    background-color: rgba(10,15,28,.34);
    backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
}
html[data-theme="biznes"] .modern-modal-content {
    background: rgba(252,253,255,.92) !important;
    backdrop-filter: saturate(180%) blur(30px);
    -webkit-backdrop-filter: saturate(180%) blur(30px);
    border: 1px solid rgba(255,255,255,.85) !important;
    border-radius: 30px 30px 0 0;
    box-shadow: 0 -10px 60px rgba(10,15,28,.3);
}
@media (min-width: 768px) {
    html[data-theme="biznes"] .modern-modal-content { border-radius: var(--m-r-xl); }
}
/* Tortish dastagi */
html[data-theme="biznes"] .modern-modal-header { position: relative; color: var(--m-ink); border-bottom: 1px solid var(--m-line); }
html[data-theme="biznes"] .modern-modal-header::before {
    content: ""; position: absolute; top: 9px; left: 50%; transform: translateX(-50%);
    width: 38px; height: 5px; border-radius: 999px; background: rgba(10,15,28,.16);
}
html[data-theme="biznes"] .modern-modal-header h1, html[data-theme="biznes"] .modern-modal-header h2,
html[data-theme="biznes"] .modern-modal-header h3, html[data-theme="biznes"] .modern-modal-header h4,
html[data-theme="biznes"] .modern-modal-header > div { color: var(--m-ink); }
html[data-theme="biznes"] .modern-btn-icon {
    background: rgba(10,15,28,.06); color: var(--m-ink-2);
    transition: background .22s var(--m-ease), transform .3s var(--m-spring);
}
html[data-theme="biznes"] .modern-btn-icon:hover  { background: rgba(10,15,28,.12); }
html[data-theme="biznes"] .modern-btn-icon:active { transform: scale(.9); }
html[data-theme="biznes"] .modern-date-picker {
    background: rgba(10,15,28,.05); border: 1px solid transparent; border-radius: var(--m-r-sm);
}
html[data-theme="biznes"] .modern-date-picker input { color: var(--m-ink); }
html[data-theme="biznes"] .modern-date-picker input::-webkit-calendar-picker-indicator { filter: none; }
html[data-theme="biznes"] .modern-date-picker span { color: var(--m-muted) !important; }

html[data-theme="biznes"] .modern-table { color: var(--m-ink-2); }
html[data-theme="biznes"] .modern-table th {
    background: rgba(248,250,253,.96);
    color: var(--m-muted);
    font-size: .68rem; font-weight: 650; letter-spacing: .085em;
    border-bottom: 1px solid var(--m-line-2);
}
html[data-theme="biznes"] .modern-table td { border-bottom: 1px solid var(--m-line); }
html[data-theme="biznes"] .modern-table tbody tr { transition: background .18s var(--m-ease); }
html[data-theme="biznes"] .modern-table tbody tr:hover { background: rgba(10,132,255,.05); }
html[data-theme="biznes"] .modern-table tfoot th,
html[data-theme="biznes"] .modern-table tfoot td {
    background: rgba(248,250,253,.97);
    color: var(--m-ink); font-weight: 700;
    border-top: 1px solid var(--m-line-2);
}
html[data-theme="biznes"] .modern-filter-btn {
    background: rgba(10,15,28,.05); color: var(--m-ink-2);
    border: 1px solid transparent; border-radius: 999px;
    transition: background .22s var(--m-ease);
}
html[data-theme="biznes"] .modern-filter-btn:hover { background: rgba(10,15,28,.1); }
html[data-theme="biznes"] .modern-filter-dropdown {
    background: rgba(252,253,255,.96);
    backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
    border: 1px solid var(--m-line-2); border-radius: var(--m-r-md);
    box-shadow: var(--m-sh-3); color: var(--m-ink-2);
}
html[data-theme="biznes"] .modern-filter-item { color: var(--m-ink-2); border-radius: 9px; }
html[data-theme="biznes"] .modern-filter-item:hover { background: rgba(10,132,255,.09); }
html[data-theme="biznes"] .sortable-th:hover { color: var(--m-blue); }

/* ========================================================== BELGILAR */
html[data-theme="biznes"] .badge {
    border-radius: 999px; font-weight: 650;
    text-transform: uppercase; font-size: .62rem; letter-spacing: .07em;
}
html[data-theme="biznes"] .badge-success { background: rgba(48,176,97,.14);  color: #1E8348; }
html[data-theme="biznes"] .badge-danger  { background: rgba(255,59,48,.13);  color: #CC2F26; }
html[data-theme="biznes"] .progress-bar-container { border-radius: 999px; background: rgba(10,15,28,.07); }
html[data-theme="biznes"] .progress-bar { border-radius: 999px; transition: width .9s var(--m-ease); }
html[data-theme="biznes"] .progress-bar.bg-green  { background: linear-gradient(90deg, #34D07A, var(--m-green)); }
html[data-theme="biznes"] .progress-bar.bg-yellow { background: linear-gradient(90deg, #FFB340, var(--m-orange)); }
html[data-theme="biznes"] .progress-bar.bg-red    { background: linear-gradient(90deg, #FF6B62, var(--m-red)); }

/* ========================================================== YUKLANISH */
html[data-theme="biznes"] #global-loader {
    background: rgba(242,244,248,.72);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
html[data-theme="biznes"] .loader-box {
    background: rgba(255,255,255,.9); border-radius: var(--m-r-lg);
    box-shadow: var(--m-sh-3); border: 1px solid rgba(255,255,255,.8);
}
html[data-theme="biznes"] .loader-spinner { border-top-color: var(--m-blue); }
html[data-theme="biznes"] .loading-state {
    background: linear-gradient(100deg, rgba(10,15,28,.045) 28%, rgba(10,15,28,.085) 44%, rgba(10,15,28,.045) 60%);
    background-size: 220% 100%;
    animation: m-shimmer 1.5s linear infinite;
    border-radius: var(--m-r-md); color: transparent !important;
}
@keyframes m-shimmer { from { background-position: 180% 0; } to { background-position: -80% 0; } }

/* ========================================================== KIRISH SAHIFASI */
html[data-theme="biznes"] .login-container {
    position: relative;
    min-height: 100vh;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 24px 16px;
    /* Kunduzgi: ilovaning qolgan qismi bilan bir xil yorug' fon */
    background:
        radial-gradient(900px 620px at 14% 8%,  rgba(10,132,255,.18), transparent 60%),
        radial-gradient(820px 620px at 88% 88%, rgba(123,92,255,.16), transparent 60%),
        radial-gradient(700px 520px at 50% 50%, rgba(48,176,199,.12), transparent 62%),
        #F2F4F8;
    transition: background-color .35s var(--m-ease);
}
/* Yumshoq donador qatlam — tekis gradient "yasama" ko'rinmasligi uchun */
html[data-theme="biznes"] .login-container::before {
    content: "";
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(10,15,28,.045) 1px, transparent 1px);
    background-size: 3px 3px;
    pointer-events: none;
}
html[data-theme="biznes"][data-mode="dark"] .login-container::before {
    background-image: radial-gradient(rgba(255,255,255,.055) 1px, transparent 1px);
}

html[data-theme="biznes"] .login-card {
    position: relative; z-index: 1;
    width: 100%; max-width: 392px;
    padding: 34px 30px 30px;
    background: rgba(255,255,255,.88);
    backdrop-filter: saturate(180%) blur(30px);
    -webkit-backdrop-filter: saturate(180%) blur(30px);
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 26px;
    box-shadow: 0 2px 6px rgba(10,15,28,.06), 0 26px 60px -22px rgba(10,15,28,.28);
    animation: m-pop .62s var(--m-spring) both;
}
html[data-theme="biznes"] .login-header { text-align: center; margin-bottom: 28px; }
html[data-theme="biznes"] .login-brand-mark {
    width: 52px; height: 52px;
    margin: 0 auto 16px;
    border-radius: 16px;
    box-shadow: 0 3px 8px rgba(10,132,255,.35), 0 14px 28px -10px rgba(94,92,230,.6);
}
html[data-theme="biznes"] .login-header h1 {
    font-size: 1.44rem; font-weight: 750;
    letter-spacing: -0.038em; color: var(--m-ink);
    margin: 0;
}
html[data-theme="biznes"] .login-card .form-group { margin-bottom: 15px; }
html[data-theme="biznes"] .login-card label {
    display: block; margin-bottom: 7px;
    font-size: .79rem; font-weight: 620; color: var(--m-ink-2);
}

/* Ikonkali maydon */
html[data-theme="biznes"] .input-icon-wrap { position: relative; display: block; }
html[data-theme="biznes"] .input-icon {
    position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
    color: var(--m-muted); pointer-events: none;
    transition: color .2s var(--m-ease);
}
html[data-theme="biznes"] .input-icon-wrap input {
    width: 100%;
    padding: 12px 14px 12px 40px !important;
    border-radius: 13px !important;
    font-size: .95rem;
}
html[data-theme="biznes"] #password { padding-right: 44px !important; }
html[data-theme="biznes"] .input-icon-wrap:focus-within .input-icon { color: var(--m-blue); }

html[data-theme="biznes"] .pw-toggle {
    all: unset;
    position: absolute; right: 7px; top: 50%; transform: translateY(-50%);
    width: 30px; height: 30px; border-radius: 9px;
    display: grid; place-items: center; cursor: pointer;
    color: var(--m-muted);
    transition: background .2s var(--m-ease), color .2s var(--m-ease);
}
html[data-theme="biznes"] .pw-toggle:hover { background: rgba(10,15,28,.07); color: var(--m-ink-2); }
html[data-theme="biznes"] .pw-toggle:focus-visible { outline: 2px solid var(--m-blue); outline-offset: 1px; }
html[data-theme="biznes"] .pw-toggle .icon-eye-off { display: none; }
html[data-theme="biznes"] .pw-toggle.is-shown .icon-eye { display: none; }
html[data-theme="biznes"] .pw-toggle.is-shown .icon-eye-off { display: block; }

html[data-theme="biznes"] #login-btn {
    width: 100%; margin-top: 10px;
    padding: 13px 20px;
    font-size: .95rem; font-weight: 650;
}
html[data-theme="biznes"] .login-card .error-message {
    border-radius: 12px; padding: 11px 14px;
    font-size: .845rem; margin-bottom: 4px;
}

/* Kirish sahifasida tungi rejim */
html[data-theme="biznes"][data-mode="dark"] .login-container {
    background:
        radial-gradient(900px 620px at 14% 8%,  rgba(10,132,255,.32), transparent 58%),
        radial-gradient(820px 620px at 88% 88%, rgba(123,92,255,.3),  transparent 58%),
        radial-gradient(700px 520px at 50% 50%, rgba(48,176,199,.14), transparent 62%),
        #060A12;
}
html[data-theme="biznes"][data-mode="dark"] .login-card {
    background: rgba(21,27,41,.92) !important;
    border-color: rgba(255,255,255,.09) !important;
}
html[data-theme="biznes"][data-mode="dark"] .pw-toggle:hover { background: rgba(255,255,255,.1); }

/* ========================================================== KIRISH ANIMATSIYALARI */
@keyframes m-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
html[data-theme="biznes"] .m-anim { animation: m-rise .62s var(--m-ease) both; }
html[data-theme="biznes"] .m-reveal { opacity: 0; transform: translateY(22px); transition: opacity .68s var(--m-ease), transform .68s var(--m-ease); }
html[data-theme="biznes"] .m-reveal.m-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
    html[data-theme="biznes"] *,
    html[data-theme="biznes"] *::before,
    html[data-theme="biznes"] *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* ==========================================================================
   INLINE RANGLARNI QAYTARISH
   dealer.js jadval kataklariga to'q fon uchun mo'ljallangan OCH ranglarni
   inline yozadi (color:#f1f5f9 va h.k.). Oyna endi yorug' bo'lgani uchun
   ular ko'rinmay qoladi — shu sababli !important bilan qaytaramiz.
   (JS fayllarga tegilmaydi.)
   ========================================================================== */
html[data-theme="biznes"] .modern-table td { color: var(--m-ink-2) !important; }
html[data-theme="biznes"] .modern-table td[style*="f1f5f9"] { color: var(--m-ink) !important; font-weight: 560; }
html[data-theme="biznes"] .modern-table td[style*="e2e8f0"] { color: var(--m-ink-2) !important; }
html[data-theme="biznes"] .modern-table td[style*="fca5a5"] { color: var(--m-red) !important; font-weight: 620; }
html[data-theme="biznes"] .modern-table td[style*="monospace"] {
    font-family: var(--font-family) !important;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.018em;
}
html[data-theme="biznes"] .modern-table .text-slate-400 { color: var(--m-muted) !important; }
html[data-theme="biznes"] .modern-modal-body { color: var(--m-ink-2); }

/* ========================================================== IKONKALAR */
html[data-theme="biznes"] .btn svg { vertical-align: -2px; }
html[data-theme="biznes"] .btn-sm { padding: 6px 11px; }
html[data-theme="biznes"] .btn-edit,
html[data-theme="biznes"] .btn-delete,
html[data-theme="biznes"] .edit-transaction-btn,
html[data-theme="biznes"] .delete-transaction-btn,
html[data-theme="biznes"] .preset-delete-btn {
    display: inline-grid; place-items: center;
    width: 32px; height: 32px; padding: 0;
}
html[data-theme="biznes"] .point-avatar {
    width: 34px; height: 34px; flex: none;
    display: grid; place-items: center;
    border-radius: 10px; color: var(--m-muted);
    background: rgba(10,15,28,.05);
}
html[data-theme="biznes"] #toggle-daromad-visibility {
    display: inline-grid; place-items: center;
    width: 24px; height: 24px; border-radius: 7px;
    color: var(--m-muted);
    transition: background .2s var(--m-ease), color .2s var(--m-ease);
}
html[data-theme="biznes"] #toggle-daromad-visibility:hover { background: rgba(10,15,28,.06); color: var(--m-ink-2); }
html[data-theme="biznes"] .kind-switch-btn svg { vertical-align: -2px; margin-right: 2px; }

/* ========================================================== TUGMA ICHIDAGI ORALIQ */
html[data-theme="biznes"] .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
}
html[data-theme="biznes"] .btn-block { display: flex; width: 100%; }

/* ========================================================== JORIY BALANS
   "Quti ichida quti" bo'lmasin: tashqi ramka butunlay yo'q.
   Summa va tugmalar to'g'ridan-to'g'ri sahifada turadi,
   bosish mumkinligini summa yonidagi kichik ko'rsatkich bildiradi. */
html[data-theme="biznes"] #btn-open-balance-breakdown {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-radius: 0 !important;
    padding: 4px 2px !important;
    transform: none !important;
}
html[data-theme="biznes"] #btn-open-balance-breakdown::after { content: none; }
/* Ko'rsatkich — summaning o'ng yonida */
html[data-theme="biznes"] #dealer-personal-balance::after {
    content: "";
    display: inline-block;
    width: 9px; height: 9px;
    margin-left: 14px;
    vertical-align: 4px;
    border-right: 2.2px solid var(--m-muted);
    border-bottom: 2.2px solid var(--m-muted);
    transform: rotate(-45deg);
    transition: transform .28s var(--m-ease), border-color .28s var(--m-ease);
}
html[data-theme="biznes"] #btn-open-balance-breakdown:hover #dealer-personal-balance::after {
    border-color: var(--m-blue);
    transform: rotate(-45deg) translate(3px, 3px);
}
html[data-theme="biznes"] #btn-open-balance-breakdown:hover .text-uppercase { color: var(--m-blue); }

/* ==========================================================================
   TEKISLASH — "quti ichida quti" ni yo'qotish
   Tashqi oq kartochka olib tashlanadi; ichki bloklar sahifa fonida
   mustaqil kartochka bo'lib turadi.
   ========================================================================== */
html[data-theme="biznes"] .flat-section {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}
/* Grafik endi o'zi mustaqil kartochka */
html[data-theme="biznes"] .prognoz-chart-box {
    background: var(--m-glass) !important;
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: 1px solid rgba(255,255,255,.65) !important;
    border-radius: var(--m-r-xl) !important;
    box-shadow: var(--m-sh-2);
    padding: 18px !important;
    margin-top: 13px;
}
/* Kassa Daftari sarlavhasi va asboblar paneli fonda turadi */
html[data-theme="biznes"] .kassa-toolbar {
    background: var(--m-glass);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 999px;
    box-shadow: var(--m-sh-1);
    padding: 8px 10px;
}
html[data-theme="biznes"] .kassa-remaining-box {
    background: var(--m-glass) !important;
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.7) !important;
    border-radius: var(--m-r-lg) !important;
    box-shadow: var(--m-sh-1);
}
/* Bo'limlar orasidagi nafas */
html[data-theme="biznes"] .flat-section + .flat-section,
html[data-theme="biznes"] .flat-section { margin-bottom: 26px !important; }

/* ==========================================================================
   SAVDO NUQTALARI — kartochka dizayni (tuzilma o'zgarmaydi)
   ========================================================================== */
html[data-theme="biznes"] .savdo-grid-card {
    position: relative;
    background: var(--m-solid);
    border: 1px solid rgba(10,15,28,.055);
    border-left: none;
    border-radius: 18px;
    padding: 17px 18px 15px;
    gap: 0;
    box-shadow: var(--m-sh-1);
    overflow: hidden;
    transition: transform .42s var(--m-spring), box-shadow .42s var(--m-ease), border-color .3s var(--m-ease);
}
/* Chap chetdagi qalin yashil chiziq o'rniga — yuqori o'ngda yumshoq nur */
html[data-theme="biznes"] .savdo-grid-card::before {
    content: "";
    position: absolute; top: -52px; right: -52px;
    width: 122px; height: 122px; border-radius: 50%;
    background: var(--m-green); opacity: .08;
    transition: opacity .42s var(--m-ease), transform .42s var(--m-ease);
    pointer-events: none;
}
html[data-theme="biznes"] .savdo-grid-card:hover {
    transform: translateY(-4px);
    border-color: rgba(48,176,97,.3);
    box-shadow: 0 10px 22px -10px rgba(48,176,97,.4), var(--m-sh-3);
}
html[data-theme="biznes"] .savdo-grid-card:hover::before { opacity: .14; transform: scale(1.1); }
html[data-theme="biznes"] .savdo-grid-card:active { transform: translateY(-1px) scale(.99); }

html[data-theme="biznes"] .savdo-card-header {
    align-items: flex-start; gap: 10px; position: relative; z-index: 1;
}
html[data-theme="biznes"] .savdo-card-name {
    font-size: 1.02rem; font-weight: 680; color: var(--m-ink);
    letter-spacing: -0.026em; line-height: 1.28;
}
html[data-theme="biznes"] .savdo-card-date {
    font-size: .68rem; font-weight: 550; color: var(--m-muted);
    white-space: nowrap; padding-top: 3px;
    font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .savdo-card-location {
    font-size: .8rem; color: var(--m-muted);
    margin-top: 3px; position: relative; z-index: 1;
    display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
html[data-theme="biznes"] .savdo-card-footer {
    margin-top: 15px; padding-top: 13px;
    border-top: 1px solid var(--m-line);
    display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
    position: relative; z-index: 1;
}
html[data-theme="biznes"] .savdo-card-debt-value {
    font-size: 1.16rem; font-weight: 720; letter-spacing: -0.034em;
    color: var(--m-ink);
}

/* "Kichik" (ro'yxat) ko'rinishi */
html[data-theme="biznes"] .dealer-list-item {
    background: var(--m-solid);
    border: 1px solid rgba(10,15,28,.055);
    border-radius: 14px;
    padding: 11px 15px;
    margin-bottom: 8px;
    box-shadow: var(--m-sh-1);
    gap: 14px;
    transition: transform .3s var(--m-spring), box-shadow .3s var(--m-ease), border-color .24s var(--m-ease);
}
html[data-theme="biznes"] .dealer-list-item:hover {
    background: var(--m-solid);
    transform: translateX(3px);
    border-color: rgba(48,176,97,.32);
    box-shadow: var(--m-sh-2);
}
html[data-theme="biznes"] .dealer-list-name {
    font-size: .93rem; font-weight: 640; color: var(--m-ink); letter-spacing: -0.022em;
}
html[data-theme="biznes"] .dealer-list-location { color: var(--m-muted); font-weight: 450; }
html[data-theme="biznes"] .dealer-list-right { text-align: right; }
html[data-theme="biznes"] .dealer-list-debt {
    font-size: .95rem; font-weight: 700; color: var(--m-ink);
    letter-spacing: -0.028em; font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .dealer-list-date {
    font-size: .68rem; color: var(--m-muted); font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .dealers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
    gap: 13px;
}

/* ==========================================================================
   TUNGI REJIM  —  <html data-mode="dark">
   Faqat tugma orqali yoqiladi, tanlov brauzerda eslab qolinadi.
   ========================================================================== */
html[data-theme="biznes"][data-mode="dark"] {
    --m-ink:     #F2F5F9;
    --m-ink-2:   #C3CBD9;
    --m-muted:   #8C97A8;
    --m-line:    rgba(255,255,255,.075);
    --m-line-2:  rgba(255,255,255,.145);

    --m-glass:   rgba(23,29,43,.72);
    --m-glass-2: rgba(23,29,43,.55);
    --m-solid:   #171D2B;

    --m-blue:    #0A84FF;
    --m-green:   #32D583;
    --m-green-matn: var(--m-green);   /* to'q fonda yorqin yashil yaxshi o'qiladi */
    --m-red:     #FF453A;
    --m-orange:  #FF9F0A;
    --m-purple:  #9B7BFF;
    --m-teal:    #40C8E0;
    --m-indigo:  #7D7AFF;

    --m-sh-1: 0 1px 2px rgba(0,0,0,.35);
    --m-sh-2: 0 2px 6px rgba(0,0,0,.4), 0 10px 26px -10px rgba(0,0,0,.6);
    --m-sh-3: 0 4px 10px rgba(0,0,0,.45), 0 22px 50px -16px rgba(0,0,0,.7);
    --m-sh-4: 0 8px 18px rgba(0,0,0,.5), 0 44px 90px -22px rgba(0,0,0,.8);

    --bg-color: #0B0F1A; --color-bg: #0B0F1A;
    --card-bg: var(--m-solid); --color-card-bg: var(--m-solid);
    --text-main: var(--m-ink); --text-muted: var(--m-muted);
    --border-color: var(--m-line); --input-border: var(--m-line-2);
}
html[data-theme="biznes"][data-mode="dark"] body {
    background:
        radial-gradient(1100px 620px at 8% -8%,  rgba(10,132,255,.17), transparent 62%),
        radial-gradient(900px 560px at 100% 0%,  rgba(123,92,255,.15), transparent 58%),
        radial-gradient(900px 620px at 50% 108%, rgba(48,176,199,.11), transparent 62%),
        #0B0F1A !important;
}

/* --- Yuzalar --- */
html[data-theme="biznes"][data-mode="dark"] .top-nav {
    background: rgba(13,18,30,.7) !important;
    border-bottom-color: var(--m-line);
}
html[data-theme="biznes"][data-mode="dark"] .top-nav.is-stuck {
    background: rgba(13,18,30,.88) !important;
    box-shadow: 0 1px 0 var(--m-line), 0 10px 30px -12px rgba(0,0,0,.6);
}
html[data-theme="biznes"][data-mode="dark"] .card,
html[data-theme="biznes"][data-mode="dark"] .widget-card,
html[data-theme="biznes"][data-mode="dark"] .prognoz-chart-box,
html[data-theme="biznes"][data-mode="dark"] .kassa-toolbar,
html[data-theme="biznes"][data-mode="dark"] .kassa-remaining-box,
html[data-theme="biznes"][data-mode="dark"] .savdo-toolbar,
html[data-theme="biznes"][data-mode="dark"] #kassa-kirim-col,
html[data-theme="biznes"][data-mode="dark"] #kassa-chiqim-col {
    background: var(--m-glass) !important;
    border-color: var(--m-line) !important;
}
html[data-theme="biznes"][data-mode="dark"] .stat-card,
html[data-theme="biznes"][data-mode="dark"] .savdo-grid-card,
html[data-theme="biznes"][data-mode="dark"] .dealer-list-item,
html[data-theme="biznes"][data-mode="dark"] .dealer-card {
    background: var(--m-solid) !important;
    border-color: var(--m-line) !important;
}
html[data-theme="biznes"][data-mode="dark"] .stat-card--dark {
    background: linear-gradient(150deg, #232B42 0%, #141A28 100%) !important;
}
html[data-theme="biznes"][data-mode="dark"] .user-chip,
html[data-theme="biznes"][data-mode="dark"] .kind-switch,
html[data-theme="biznes"][data-mode="dark"] .savdo-segment-ctrl,
html[data-theme="biznes"][data-mode="dark"] .savdo-search-wrap,
html[data-theme="biznes"][data-mode="dark"] .savdo-sort-wrap,
html[data-theme="biznes"][data-mode="dark"] .prognoz-btn,
html[data-theme="biznes"][data-mode="dark"] .point-avatar,
html[data-theme="biznes"][data-mode="dark"] .modern-filter-btn,
html[data-theme="biznes"][data-mode="dark"] .modern-date-picker,
html[data-theme="biznes"][data-mode="dark"] .modern-btn-icon {
    background: rgba(255,255,255,.07) !important;
    color: var(--m-ink-2);
}
html[data-theme="biznes"][data-mode="dark"] .kind-switch-btn.active,
html[data-theme="biznes"][data-mode="dark"] .savdo-segment-ctrl input[type="radio"]:checked + .savdo-segment-label {
    background: rgba(255,255,255,.15) !important;
    color: var(--m-ink) !important;
    box-shadow: none;
}
html[data-theme="biznes"][data-mode="dark"] .btn-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-primary-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-success-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-danger-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-warning-outline,
html[data-theme="biznes"][data-mode="dark"] .form-control,
html[data-theme="biznes"][data-mode="dark"] select.form-control {
    background: rgba(255,255,255,.06);
    border-color: var(--m-line-2);
    color: var(--m-ink);
}
html[data-theme="biznes"][data-mode="dark"] .btn-outline:hover:not(:disabled) {
    background: rgba(255,255,255,.12); border-color: var(--m-line-2);
}
html[data-theme="biznes"][data-mode="dark"] .form-control:focus,
html[data-theme="biznes"][data-mode="dark"] select.form-control:focus {
    background: rgba(255,255,255,.09);
}
html[data-theme="biznes"][data-mode="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1) opacity(.65); }

/* --- Oynalar --- */
html[data-theme="biznes"][data-mode="dark"] .modal { background-color: rgba(0,0,0,.6) !important; }
html[data-theme="biznes"][data-mode="dark"] .modal-content,
html[data-theme="biznes"][data-mode="dark"] .modern-modal-content {
    background: #141A28 !important;
    border-color: var(--m-line) !important;
}
html[data-theme="biznes"][data-mode="dark"] .modal-footer { background: rgba(255,255,255,.03); }
html[data-theme="biznes"][data-mode="dark"] .modern-modal { background-color: rgba(0,0,0,.55); }
html[data-theme="biznes"][data-mode="dark"] .modern-modal-header::before { background: rgba(255,255,255,.2); }
html[data-theme="biznes"][data-mode="dark"] .modern-table th,
html[data-theme="biznes"][data-mode="dark"] .modern-table tfoot th,
html[data-theme="biznes"][data-mode="dark"] .modern-table tfoot td {
    background: #1B2231 !important;
}
html[data-theme="biznes"][data-mode="dark"] .modern-table tbody tr:hover,
html[data-theme="biznes"][data-mode="dark"] .table tbody tr:hover { background: rgba(255,255,255,.04); }
html[data-theme="biznes"][data-mode="dark"] .modern-filter-dropdown {
    background: #1B2231; border-color: var(--m-line-2); color: var(--m-ink-2);
}
html[data-theme="biznes"][data-mode="dark"] .modern-filter-item:hover { background: rgba(255,255,255,.08); }
html[data-theme="biznes"][data-mode="dark"] #global-loader { background: rgba(11,15,26,.75); }
html[data-theme="biznes"][data-mode="dark"] .loader-box { background: #171D2B; border-color: var(--m-line); }

/* --- Inline (HTML/JS ichidagi) och ranglarni qoraytirish --- */
html[data-theme="biznes"][data-mode="dark"] [style*="background: #ffffff"],
html[data-theme="biznes"][data-mode="dark"] [style*="background:#ffffff"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: white"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #fff;"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #fefefe"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #f8fafc"],
html[data-theme="biznes"][data-mode="dark"] [style*="background:#f8fafc"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #f1f5f9"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #f0fdf4"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #fef2f2"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #faf5ff"],
html[data-theme="biznes"][data-mode="dark"] [style*="background:#dbeafe"],
html[data-theme="biznes"][data-mode="dark"] [style*="background:#d1fae5"],
html[data-theme="biznes"][data-mode="dark"] [style*="background:#fee2e2"] {
    background: rgba(255,255,255,.05) !important;
    border-color: var(--m-line) !important;
}
html[data-theme="biznes"][data-mode="dark"] [style*="color: #0f172a"],
html[data-theme="biznes"][data-mode="dark"] [style*="color:#0f172a"],
html[data-theme="biznes"][data-mode="dark"] [style*="color: #1e293b"],
html[data-theme="biznes"][data-mode="dark"] [style*="color:#1e293b"],
html[data-theme="biznes"][data-mode="dark"] [style*="color: #111827"] {
    color: var(--m-ink) !important;
}
html[data-theme="biznes"][data-mode="dark"] [style*="color: #475569"],
html[data-theme="biznes"][data-mode="dark"] [style*="color:#475569"],
html[data-theme="biznes"][data-mode="dark"] [style*="color: #64748b"],
html[data-theme="biznes"][data-mode="dark"] [style*="color:#64748b"] {
    color: var(--m-muted) !important;
}

/* --- Rejim almashtirish tugmasi --- */
html[data-theme="biznes"] .mode-toggle {
    all: unset;
    width: 34px; height: 34px; flex: none;
    display: grid; place-items: center;
    border-radius: 50%; cursor: pointer;
    color: var(--m-ink-2);
    background: rgba(10,15,28,.05);
    transition: background .22s var(--m-ease), color .22s var(--m-ease), transform .42s var(--m-spring);
}
html[data-theme="biznes"] .mode-toggle:hover { background: rgba(10,15,28,.1); color: var(--m-ink); }
html[data-theme="biznes"] .mode-toggle:active { transform: scale(.88) rotate(-18deg); }
html[data-theme="biznes"] .mode-toggle:focus-visible { outline: 2px solid var(--m-blue); outline-offset: 3px; }
html[data-theme="biznes"][data-mode="dark"] .mode-toggle {
    background: rgba(255,255,255,.08); color: #FFD770;
}
html[data-theme="biznes"][data-mode="dark"] .mode-toggle:hover { background: rgba(255,255,255,.15); }
html[data-theme="biznes"] .mode-toggle .icon-moon { display: none; }
html[data-theme="biznes"][data-mode="dark"] .mode-toggle .icon-sun  { display: none; }
html[data-theme="biznes"][data-mode="dark"] .mode-toggle .icon-moon { display: block; }

/* Rejim almashganda silliq o'tish */
html[data-theme="biznes"] body,
html[data-theme="biznes"] .card, html[data-theme="biznes"] .widget-card,
html[data-theme="biznes"] .stat-card, html[data-theme="biznes"] .top-nav,
html[data-theme="biznes"] .savdo-grid-card, html[data-theme="biznes"] .dealer-list-item {
    transition-property: background-color, background-image, border-color, color, box-shadow, transform;
}

/* --- Qidiruv va saralash maydonlari (style.css da !important bor) --- */
html[data-theme="biznes"] .savdo-search-input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--m-ink);
}
html[data-theme="biznes"] .savdo-search-input:focus { background: transparent !important; box-shadow: none !important; }
html[data-theme="biznes"] .savdo-search-input::placeholder { color: var(--m-muted); }
html[data-theme="biznes"] .savdo-sort-select { color: var(--m-ink-2); }
html[data-theme="biznes"][data-mode="dark"] .savdo-sort-select option { background: #1B2231; color: var(--m-ink); }
html[data-theme="biznes"][data-mode="dark"] .savdo-search-icon { color: var(--m-muted); }

/* ==========================================================================
   TUZATISHLAR
   ========================================================================== */

/* 1) .justify-center style.css da UMUMAN yo'q edi — shuning uchun "Kunlik qoldiq"
      va taminotchilar jamlanmasi chap chekkaga tiqilib qolgandi. */
html[data-theme="biznes"] .justify-center { justify-content: center; }
html[data-theme="biznes"] .justify-start  { justify-content: flex-start; }
html[data-theme="biznes"] #kassa-remaining-content,
html[data-theme="biznes"] #supplier-summary {
    justify-content: center;
    gap: 34px;
    text-align: center;
}

/* 2) .btn-success va .btn-danger ham ta'riflanmagan edi — "+ Kirim", "- Chiqim",
      "+ Qo'shish", "- Ayirish" oddiy kulrang quti bo'lib qolgandi. */
html[data-theme="biznes"] .btn-success {
    background: linear-gradient(180deg, #3BC172, var(--m-green));
    border-color: transparent; color: #fff;
    box-shadow: 0 1px 2px rgba(48,176,97,.35), 0 8px 18px -8px rgba(48,176,97,.5);
}
html[data-theme="biznes"] .btn-danger {
    background: linear-gradient(180deg, #FF5A50, var(--m-red));
    border-color: transparent; color: #fff;
    box-shadow: 0 1px 2px rgba(255,59,48,.35), 0 8px 18px -8px rgba(255,59,48,.5);
}
html[data-theme="biznes"] .btn-success:hover:not(:disabled),
html[data-theme="biznes"] .btn-danger:hover:not(:disabled) { filter: brightness(1.07); }

/* 3) "Quti ichida quti": ichki panel o'z foniga ega bo'lmasin —
      asboblar paneli endi sahifa fonida turadi, faqat tugmalar ko'rinadi. */
html[data-theme="biznes"] .kassa-toolbar,
html[data-theme="biznes"] .savdo-toolbar {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}
/* Kassa ustunlari ichidagi jadval ham ustun foni bilan bir xil */
html[data-theme="biznes"] .kassa-table,
html[data-theme="biznes"] .kassa-table thead,
html[data-theme="biznes"] .kassa-table tbody,
html[data-theme="biznes"] .kassa-table tfoot,
html[data-theme="biznes"] .kassa-table th,
html[data-theme="biznes"] .kassa-table td { background: transparent !important; }

/* 4) Jadval sarlavhasi scroll paytida tepada qotib tursin */
@media (min-width: 760px) {
    html[data-theme="biznes"] .table-responsive { overflow: visible; }
    html[data-theme="biznes"] .table thead th {
        position: sticky;
        top: 46px;               /* siqilgan yuqori panel balandligi */
        z-index: 5;
        background: var(--m-solid) !important;
        box-shadow: 0 1px 0 var(--m-line-2);
    }
}

/* 5) Oddiy input/select/textarea (.form-control sinfisiz) ham mavzuga bo'ysunsin —
      tungi rejimda oq bo'lib qolayotgan edi. */
html[data-theme="biznes"] input:not([type="checkbox"]):not([type="radio"]):not(.savdo-search-input),
html[data-theme="biznes"] textarea,
html[data-theme="biznes"] select {
    background: rgba(255,255,255,.92);
    border: 1px solid var(--m-line-2);
    border-radius: var(--m-r-sm);
    color: var(--m-ink);
    font-family: var(--font-family);
    transition: border-color .2s var(--m-ease), box-shadow .2s var(--m-ease), background .2s var(--m-ease);
}
html[data-theme="biznes"] input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="biznes"] textarea:focus,
html[data-theme="biznes"] select:focus {
    border-color: var(--m-blue);
    box-shadow: 0 0 0 4px rgba(10,132,255,.16);
    outline: none;
}
html[data-theme="biznes"] input::placeholder,
html[data-theme="biznes"] textarea::placeholder { color: var(--m-muted); }

html[data-theme="biznes"][data-mode="dark"] input:not([type="checkbox"]):not([type="radio"]):not(.savdo-search-input),
html[data-theme="biznes"][data-mode="dark"] textarea,
html[data-theme="biznes"][data-mode="dark"] select {
    background: rgba(255,255,255,.06) !important;
    border-color: var(--m-line-2) !important;
    color: var(--m-ink) !important;
}
html[data-theme="biznes"][data-mode="dark"] input:focus,
html[data-theme="biznes"][data-mode="dark"] textarea:focus,
html[data-theme="biznes"][data-mode="dark"] select:focus {
    background: rgba(255,255,255,.1) !important;
}
html[data-theme="biznes"][data-mode="dark"] select option { background: #1B2231; color: var(--m-ink); }
html[data-theme="biznes"][data-mode="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="biznes"][data-mode="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
    filter: invert(1) opacity(.6);
}
html[data-theme="biznes"][data-mode="dark"] input[type="checkbox"],
html[data-theme="biznes"][data-mode="dark"] input[type="radio"] { accent-color: var(--m-blue); }

/* ==========================================================================
   OYNA KARTOCHKA RANGIDA
   Qaysi kartochka bosilsa, ochilgan oyna o'sha kartochkaning rangida bo'ladi.
   Rang JS orqali data-accent sifatida qo'yiladi.
   ========================================================================== */
html[data-theme="biznes"] .modern-modal[data-accent="blue"]   { --m-c: var(--m-blue); }
html[data-theme="biznes"] .modern-modal[data-accent="green"]  { --m-c: var(--m-green); }
html[data-theme="biznes"] .modern-modal[data-accent="purple"] { --m-c: var(--m-purple); }
html[data-theme="biznes"] .modern-modal[data-accent="orange"] { --m-c: var(--m-orange); }
html[data-theme="biznes"] .modern-modal[data-accent="red"]    { --m-c: var(--m-red); }
html[data-theme="biznes"] .modern-modal[data-accent="indigo"] { --m-c: var(--m-indigo); }

/* Orqa fon ham shu tusda */
html[data-theme="biznes"] .modern-modal[data-accent] {
    background-color: color-mix(in srgb, var(--m-c) 22%, rgba(10,15,28,.42));
}
/* Oynaning o'zi */
html[data-theme="biznes"] .modern-modal[data-accent] .modern-modal-content {
    background: color-mix(in srgb, var(--m-c) 6%, #FCFDFF) !important;
    border-color: color-mix(in srgb, var(--m-c) 26%, transparent) !important;
    box-shadow: 0 -12px 70px color-mix(in srgb, var(--m-c) 26%, transparent),
                0 -10px 60px rgba(10,15,28,.28);
}
/* Yuqori qism — rangli to'lqin */
html[data-theme="biznes"] .modern-modal[data-accent] .modern-modal-header {
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--m-c) 16%, transparent) 0%,
        transparent 100%);
    border-bottom-color: color-mix(in srgb, var(--m-c) 20%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-modal-header::before {
    background: color-mix(in srgb, var(--m-c) 55%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-modal-header h3,
html[data-theme="biznes"] .modern-modal[data-accent] .modern-modal-header > div {
    color: color-mix(in srgb, var(--m-c) 72%, var(--m-ink));
}
/* Tugma va maydonlar */
html[data-theme="biznes"] .modern-modal[data-accent] .modern-btn-icon,
html[data-theme="biznes"] .modern-modal[data-accent] .modern-filter-btn,
html[data-theme="biznes"] .modern-modal[data-accent] .modern-date-picker {
    background: color-mix(in srgb, var(--m-c) 13%, transparent) !important;
    color: color-mix(in srgb, var(--m-c) 68%, var(--m-ink));
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-btn-icon:hover,
html[data-theme="biznes"] .modern-modal[data-accent] .modern-filter-btn:hover {
    background: color-mix(in srgb, var(--m-c) 24%, transparent) !important;
}
/* Jadval */
html[data-theme="biznes"] .modern-modal[data-accent] .modern-table th {
    background: color-mix(in srgb, var(--m-c) 11%, #FCFDFF) !important;
    border-bottom-color: color-mix(in srgb, var(--m-c) 24%, transparent);
    color: color-mix(in srgb, var(--m-c) 60%, var(--m-muted));
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-table td {
    border-bottom-color: color-mix(in srgb, var(--m-c) 13%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-table tbody tr:hover {
    background: color-mix(in srgb, var(--m-c) 9%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-table tfoot th,
html[data-theme="biznes"] .modern-modal[data-accent] .modern-table tfoot td {
    background: color-mix(in srgb, var(--m-c) 14%, #FCFDFF) !important;
    border-top-color: color-mix(in srgb, var(--m-c) 34%, transparent);
    color: color-mix(in srgb, var(--m-c) 70%, var(--m-ink));
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-filter-dropdown {
    background: color-mix(in srgb, var(--m-c) 7%, #FCFDFF);
    border-color: color-mix(in srgb, var(--m-c) 26%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .modern-filter-item:hover {
    background: color-mix(in srgb, var(--m-c) 14%, transparent);
}
html[data-theme="biznes"] .modern-modal[data-accent] .sortable-th:hover { color: var(--m-c); }

/* --- Tungi rejimda ham shu rang, lekin quyuq fonda --- */
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-modal-content {
    background: color-mix(in srgb, var(--m-c) 11%, #121826) !important;
    border-color: color-mix(in srgb, var(--m-c) 30%, transparent) !important;
}
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table th,
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table tfoot th,
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table tfoot td {
    background: color-mix(in srgb, var(--m-c) 17%, #161D2C) !important;
}
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-modal-header h3,
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-modal-header > div,
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table tfoot th,
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table tfoot td {
    color: color-mix(in srgb, var(--m-c) 45%, #FFFFFF);
}
html[data-theme="biznes"][data-mode="dark"] .modern-modal[data-accent] .modern-table th {
    color: color-mix(in srgb, var(--m-c) 40%, var(--m-muted));
}

/* Kirish sahifasidagi rejim tugmasi — .mode-toggle dagi `all: unset` faylda
   keyinroq turgani uchun joylashuvni oxirida qayta beramiz.
   Rangi fonga qarab o'zgaradi: kunduzgi fonda to'q, tungi fonda och. */
html[data-theme="biznes"] .login-mode-toggle {
    position: absolute;
    top: 22px; right: 22px;
    z-index: 2;
    background: rgba(10,15,28,.06) !important;
    color: var(--m-ink-2) !important;
}
html[data-theme="biznes"] .login-mode-toggle:hover {
    background: rgba(10,15,28,.12) !important;
    color: var(--m-ink) !important;
}
html[data-theme="biznes"][data-mode="dark"] .login-mode-toggle {
    background: rgba(255,255,255,.1) !important;
    color: #FFD770 !important;
}
html[data-theme="biznes"][data-mode="dark"] .login-mode-toggle:hover {
    background: rgba(255,255,255,.2) !important;
    color: #FFE08F !important;
}

/* ==========================================================================
   ADMIN VA YORDAMCHI SAHIFALARI
   ========================================================================== */
/* Bosilmaydigan stat kartochka (yordamchi panelida) */
html[data-theme="biznes"] .stat-card .stat-body {
    display: flex; flex-direction: column; gap: 2px;
    position: relative; z-index: 1; min-width: 0;
}
html[data-theme="biznes"] .stats-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 759px) {
    html[data-theme="biznes"] .stats-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Admin: baza hajmi vidjeti va ro'yxat sarlavhasi */
html[data-theme="biznes"] .db-widget { padding: 18px 20px; }
html[data-theme="biznes"] .widget-header h3 {
    font-size: .98rem; font-weight: 680; letter-spacing: -0.022em;
}
html[data-theme="biznes"] .list-header h2,
html[data-theme="biznes"] .add-dealer-section h2 {
    font-size: 1.12rem; font-weight: 700; letter-spacing: -0.028em;
}
html[data-theme="biznes"] .search-box input {
    border-radius: 999px !important;
    padding-left: 16px !important;
}
html[data-theme="biznes"] .credentials-box {
    background: rgba(10,15,28,.04);
    border: 1px solid var(--m-line);
    border-radius: var(--m-r-md);
}
html[data-theme="biznes"] .selectable-text {
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
}

/* Admin balans tarixi oynasi tungi rejimda oq qolmasin
   (inline `background-color: #ffffff` ishlatilgan) */
html[data-theme="biznes"][data-mode="dark"] [style*="background-color: #ffffff"],
html[data-theme="biznes"][data-mode="dark"] [style*="background-color:#ffffff"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #fff;"],
html[data-theme="biznes"][data-mode="dark"] [style*="background: #f8fafc;"] {
    background: #141A28 !important;
    border-color: var(--m-line) !important;
}
html[data-theme="biznes"][data-mode="dark"] #admin-history-list,
html[data-theme="biznes"][data-mode="dark"] #balance-history-list {
    background: #10141F !important;
}

/* ==========================================================================
   TUNGI REJIM — TEKISLANGAN BLOKLAR
   Yuqoridagi `[data-mode="dark"] .card { background: ... !important }` qoidasi
   `.flat-section` va asboblar panellariga ham tushib, burchaksiz to'rtburchak
   "quti"lar hosil qilardi. Bu yerda ularni yana shaffof qilamiz.
   (Fayl oxirida turgani uchun bir xil kuchdagi qoidalardan ustun keladi.)
   ========================================================================== */
html[data-theme="biznes"][data-mode="dark"] .flat-section,
html[data-theme="biznes"][data-mode="dark"] .kassa-toolbar,
html[data-theme="biznes"][data-mode="dark"] .savdo-toolbar,
html[data-theme="biznes"][data-mode="dark"] #btn-open-balance-breakdown {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* Mustaqil kartochkalar bir xil tusda bo'lsin */
html[data-theme="biznes"][data-mode="dark"] .prognoz-chart-box,
html[data-theme="biznes"][data-mode="dark"] .kassa-remaining-box {
    background: var(--m-glass) !important;
    border: 1px solid var(--m-line) !important;
    border-radius: var(--m-r-lg) !important;
}

/* ==========================================================================
   KASSA DAFTARI — yozuvlarni yiriklashtirish
   Jadval va kataklar o'lchami HTML/JS ichida inline yozilgan,
   shuning uchun bu yerda !important bilan qayta beriladi.
   ========================================================================== */
html[data-theme="biznes"] .kassa-table { font-size: .95rem !important; }
html[data-theme="biznes"] .kassa-table tbody td,
html[data-theme="biznes"] .kassa-table tfoot td {
    padding: 9px 10px !important;
    line-height: 1.35;
}
html[data-theme="biznes"] .kassa-table thead th {
    padding: 8px 10px !important;
    font-size: .72rem;
    letter-spacing: .07em;
}
/* Bo'sh joyni egallovchi qator kattalashmasligi kerak */
html[data-theme="biznes"] .kassa-table .kassa-spacer-row td {
    padding: 0 !important;
    line-height: 0;
}
/* Ustun sarlavhasi va "Kunlik qoldiq" ham mutanosib bo'lsin */
html[data-theme="biznes"] #kassa-kirim-col > .fw-bold,
html[data-theme="biznes"] #kassa-chiqim-col > .fw-bold {
    font-size: 1.02rem !important;
    letter-spacing: -0.015em;
}
html[data-theme="biznes"] #kassa-remaining-content .fw-bold,
html[data-theme="biznes"] #kassa-remaining-content > div > div:last-child {
    font-size: 1.16rem;
    letter-spacing: -0.03em;
}

/* Tranzaksiyalar Tarixi jadvali — yopishqoq sarlavha tungi rejimda ham to'q bo'lsin
   (inline `background:#f8fafc` shaffof emas, lekin quyuq fonda oq bo'lib qolardi) */
html[data-theme="biznes"][data-mode="dark"] .history-table thead th {
    background: #1B2231 !important;
    color: var(--m-muted) !important;
    border-bottom-color: var(--m-line) !important;
}
/* Faqat nomlar qatori qotib turadi; filtr qatori oddiy holda scroll bo'ladi */
html[data-theme="biznes"] .history-table thead tr:first-child th { box-shadow: 0 1px 0 var(--m-line); }

/* Yopishqoq sarlavha ro'yxatning eng tepasiga tegib tursin —
   konteynerning ustki bo'shlig'i bo'lsa, uning ostidan qatorlar ko'rinib qolardi */
html[data-theme="biznes"] #balance-history-list,
html[data-theme="biznes"] #admin-history-list { padding-top: 0 !important; }
html[data-theme="biznes"] .history-table { margin-top: 0; }

/* ==========================================================================
   QALTIRASHNI YO'QOTISH — backdrop-filter dan voz kechish
   --------------------------------------------------------------------------
   `backdrop-filter` brauzerni HAR KADRDA element ortidagi tasvirni qayta
   o'qib, qaytadan xiralashtirishga majbur qiladi. Yopishqoq (sticky) panelda
   bu ayniqsa yomon: kontent ortidan siljiganda xiralashgan fon kechikib
   yangilanadi va panel "qaltiraganday" ko'rinadi.

   Yechim: sahifa ichida siljiydigan barcha elementlardan blur olib
   tashlanadi, o'rniga fon biroz quyuqroq qilinadi — ko'rinish deyarli
   o'zgarmaydi, lekin chizish yuki yo'qoladi.
   Blur faqat OYNALARDA qoladi: ular ochilganda orqa fon qimirlamaydi.
   ========================================================================== */
html[data-theme="biznes"] .top-nav,
html[data-theme="biznes"] .top-nav.is-stuck,
html[data-theme="biznes"] .btn,
html[data-theme="biznes"] .btn-outline,
html[data-theme="biznes"] .btn-primary-outline,
html[data-theme="biznes"] .btn-success-outline,
html[data-theme="biznes"] .btn-danger-outline,
html[data-theme="biznes"] .btn-warning-outline,
html[data-theme="biznes"] .card,
html[data-theme="biznes"] .widget-card,
html[data-theme="biznes"] .prognoz-chart-box,
html[data-theme="biznes"] .kassa-remaining-box,
html[data-theme="biznes"] .savdo-toolbar,
html[data-theme="biznes"] #kassa-kirim-col,
html[data-theme="biznes"] #kassa-chiqim-col,
html[data-theme="biznes"] .deleted-points-details,
html[data-theme="biznes"] .modern-table tfoot th,
html[data-theme="biznes"] .modern-table tfoot td {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Blur ketgani uchun fonlar biroz quyuqroq — ko'rinish saqlanadi */
html[data-theme="biznes"] .top-nav { background: rgba(252, 253, 255, .94) !important; }
html[data-theme="biznes"] .top-nav.is-stuck { background: rgba(252, 253, 255, .98) !important; }
html[data-theme="biznes"][data-mode="dark"] .top-nav { background: rgba(14, 19, 31, .94) !important; }
html[data-theme="biznes"][data-mode="dark"] .top-nav.is-stuck { background: rgba(14, 19, 31, .98) !important; }

html[data-theme="biznes"] .card,
html[data-theme="biznes"] .widget-card,
html[data-theme="biznes"] .prognoz-chart-box,
html[data-theme="biznes"] .kassa-remaining-box,
html[data-theme="biznes"] .savdo-toolbar,
html[data-theme="biznes"] #kassa-kirim-col,
html[data-theme="biznes"] #kassa-chiqim-col { background: rgba(255, 255, 255, .88) !important; }
html[data-theme="biznes"][data-mode="dark"] .card,
html[data-theme="biznes"][data-mode="dark"] .widget-card,
html[data-theme="biznes"][data-mode="dark"] .prognoz-chart-box,
html[data-theme="biznes"][data-mode="dark"] .kassa-remaining-box,
html[data-theme="biznes"][data-mode="dark"] #kassa-kirim-col,
html[data-theme="biznes"][data-mode="dark"] #kassa-chiqim-col { background: rgba(23, 29, 43, .92) !important; }

/* Tekislangan bloklar shaffofligicha qolsin (yuqoridagi qoidadan yuqori turadi) */
html[data-theme="biznes"] .flat-section,
html[data-theme="biznes"] .kassa-toolbar,
html[data-theme="biznes"] #btn-open-balance-breakdown,
html[data-theme="biznes"][data-mode="dark"] .flat-section,
html[data-theme="biznes"][data-mode="dark"] .kassa-toolbar,
html[data-theme="biznes"][data-mode="dark"] #btn-open-balance-breakdown {
    background: none !important;
}

/* Tugmalarning oq shaffof foni — blursiz ham xuddi shunday ko'rinadi */
html[data-theme="biznes"] .btn-outline,
html[data-theme="biznes"] .btn-primary-outline,
html[data-theme="biznes"] .btn-success-outline,
html[data-theme="biznes"] .btn-danger-outline,
html[data-theme="biznes"] .btn-warning-outline { background: rgba(255, 255, 255, .92); }
html[data-theme="biznes"][data-mode="dark"] .btn-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-primary-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-success-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-danger-outline,
html[data-theme="biznes"][data-mode="dark"] .btn-warning-outline { background: rgba(255, 255, 255, .07); }

/* `will-change` doimiy qatlam yaratadi — faqat kursor ustida turganda kerak */
html[data-theme="biznes"] .stat-card { will-change: auto; }
html[data-theme="biznes"] .stat-card:hover { will-change: transform; }

/* Yopiq oyna ham butun ekranni qoplab turadi (opacity: 0 bo'lsa-da).
   Blur unda yoqilgan bo'lsa, brauzer sahifa siljiganda fonni bekorga
   qayta xiralashtiraveradi — bu ham qaltirash sababi.
   Shuning uchun blur faqat oyna OCHIQ bo'lgandagina ishlaydi. */
html[data-theme="biznes"] .modern-modal:not(.show),
html[data-theme="biznes"] .modern-modal:not(.show) .modern-modal-content {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
html[data-theme="biznes"] .modal[style*="display: none"] {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* ==========================================================================
   ISH KUNI (business day) ko'rsatkichi
   ========================================================================== */
html[data-theme="biznes"] .ish-kuni-banner {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 7px 8px 7px 14px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--m-blue) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--m-blue) 26%, transparent);
    font-size: .84rem; font-weight: 600; color: var(--m-ink-2);
}
html[data-theme="biznes"] .ish-kuni-banner .ish-kuni-nuqta {
    width: 8px; height: 8px; border-radius: 50%; flex: none;
    background: var(--m-green);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--m-green) 22%, transparent);
}
html[data-theme="biznes"] .ish-kuni-banner #btn-yop-ish-kuni {
    background: var(--m-blue); color: #fff; border: none;
    padding: 5px 14px; font-size: .78rem; font-weight: 620;
}
html[data-theme="biznes"] .ish-kuni-banner #btn-yop-ish-kuni:hover { filter: brightness(1.08); }

/* Kun kechikib qolgan bo'lsa — diqqat tortadigan holat */
html[data-theme="biznes"] .ish-kuni-banner.kechikkan {
    background: color-mix(in srgb, var(--m-orange) 13%, transparent);
    border-color: color-mix(in srgb, var(--m-orange) 34%, transparent);
    color: var(--m-ink);
}
html[data-theme="biznes"] .ish-kuni-banner.kechikkan .ish-kuni-nuqta {
    background: var(--m-orange);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--m-orange) 24%, transparent);
}
html[data-theme="biznes"] .ish-kuni-banner.kechikkan #btn-yop-ish-kuni { background: var(--m-orange); }

/* Yopilgan kun ogohlantirishi */
html[data-theme="biznes"] .kassa-qulf {
    padding: 11px 16px;
    border-radius: var(--m-r-md);
    background: color-mix(in srgb, var(--m-muted) 12%, transparent);
    border: 1px solid var(--m-line-2);
    color: var(--m-ink-2);
    font-size: .86rem; font-weight: 550;
    text-align: center;
}

/* ==========================================================================
   TOAST
   ========================================================================== */
html[data-theme="biznes"] #toast-konteyner {
    position: fixed;
    top: 74px; right: 18px;
    z-index: 2000;
    display: flex; flex-direction: column; gap: 10px;
    pointer-events: none;
    max-width: min(380px, calc(100vw - 32px));
}
html[data-theme="biznes"] .toast {
    pointer-events: auto;
    display: flex; align-items: flex-start; gap: 12px;
    padding: 13px 14px 13px 16px;
    border-radius: 14px;
    background: var(--m-solid);
    border: 1px solid var(--m-line-2);
    box-shadow: var(--m-sh-3);
    color: var(--m-ink);
    font-size: .88rem; font-weight: 550; line-height: 1.45;
    opacity: 0; transform: translateX(16px);
    transition: opacity .26s var(--m-ease), transform .26s var(--m-spring);
    border-left: 4px solid var(--m-muted);
}
html[data-theme="biznes"] .toast--kirdi { opacity: 1; transform: none; }
html[data-theme="biznes"] .toast--ketmoqda { opacity: 0; transform: translateX(16px); }
html[data-theme="biznes"] .toast--success { border-left-color: var(--m-green); }
html[data-theme="biznes"] .toast--error   { border-left-color: var(--m-red); }
html[data-theme="biznes"] .toast--info    { border-left-color: var(--m-blue); }
html[data-theme="biznes"] .toast-matn { flex: 1; white-space: pre-line; }
html[data-theme="biznes"] .toast-yopish {
    all: unset;
    cursor: pointer; flex: none;
    width: 22px; height: 22px; border-radius: 7px;
    display: grid; place-items: center;
    color: var(--m-muted); font-size: 1.1rem; line-height: 1;
    transition: background .18s var(--m-ease), color .18s var(--m-ease);
}
html[data-theme="biznes"] .toast-yopish:hover { background: rgba(10,15,28,.07); color: var(--m-ink); }
html[data-theme="biznes"][data-mode="dark"] .toast { background: #1B2231; }
html[data-theme="biznes"][data-mode="dark"] .toast-yopish:hover { background: rgba(255,255,255,.1); }
@media (max-width: 520px) {
    html[data-theme="biznes"] #toast-konteyner { top: auto; bottom: 16px; left: 16px; right: 16px; max-width: none; }
}

/* Tranzaksiyalar Tarixi — qator ustiga sichqoncha borganda.
   Ilgari bu rang JS'da inline `#f8fafc` qilib qo'yilardi: tungi rejimda
   qator oppoq bo'lib, ustidagi yozuvlar o'qilmay qolardi. Yarim shaffof
   qatlam esa ikkala rejimda ham to'g'ri ishlaydi — yorug'da biroz
   to'qlashtiradi, qorong'uda biroz yoritadi. */
.history-table tbody tr { transition: background-color 0.18s; }
.history-table tbody tr:hover { background-color: rgba(148, 163, 184, 0.16); }

/* "Jami" qatori — ro'yxatdan ANIQ ajralib turishi uchun ko'k tusli yo'lak.
   Oddiy qatorlar bilan bir xil fon bo'lsa, ko'z uni ilg'amaydi; shuning uchun
   uch xil ishora birga ishlatiladi: tusli fon, qalin ko'k chiziq va ustidan
   tushadigan soya (soya uni ro'yxat ustida "suzib turgandek" ko'rsatadi). */
.history-table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 3;
    background: color-mix(in srgb, var(--m-blue) 10%, var(--m-solid));
    border-top: 2px solid color-mix(in srgb, var(--m-blue) 40%, transparent);
    box-shadow: 0 -10px 20px -10px rgba(10, 15, 28, 0.22);
    padding: 15px 12px;
    font-weight: 800;
}
.history-table tfoot .jami-nom {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.78rem;
    color: var(--m-ink-2);
    white-space: nowrap;
}
.history-table tfoot .jami-summa {
    font-size: 1.06rem;
    letter-spacing: -0.015em;
    white-space: nowrap;   /* raqam ikki qatorga sinmasin */
}
html[data-theme="biznes"][data-mode="dark"] .history-table tfoot td {
    background: color-mix(in srgb, var(--m-blue) 18%, var(--m-solid));
    border-top-color: color-mix(in srgb, var(--m-blue) 55%, transparent);
    box-shadow: 0 -10px 22px -8px rgba(0, 0, 0, 0.55);
}

/* ==========================================================================
   DAVR PANELI — kartochkalar ustidagi sana oralig'i
   --------------------------------------------------------------------------
   Nega kerak: kartochkalar ilgari BOSHIDAN BUYON hisoblardi va faqat
   o'sib borardi. Bir yildan keyin "Umumiy savdo: 4 mlrd" degan raqam
   biznes egasiga hech narsa aytmaydi. Endi 5 tasi tanlangan davr bo'yicha.
   "Joriy qarz" bundan mustasno — u qoldiq ko'rsatkich (.stat-izoh bilan
   belgilangan), shuning uchun doim bugungi holatni ko'rsatadi.
   ========================================================================== */
html[data-theme="biznes"] .davr-panel {
    display: flex; align-items: center; flex-wrap: wrap;
    justify-content: space-between; gap: 10px 14px;
}
html[data-theme="biznes"] .davr-tezkor { display: flex; flex-wrap: wrap; gap: 6px; }
html[data-theme="biznes"] .davr-btn {
    all: unset;
    padding: 6px 13px;
    border-radius: 999px; cursor: pointer;
    font-size: .73rem; font-weight: 620; letter-spacing: .01em;
    color: var(--m-muted);
    background: rgba(10,15,28,.045);
    white-space: nowrap;
    transition: background .24s var(--m-ease), color .24s var(--m-ease);
}
html[data-theme="biznes"] .davr-btn:hover { background: rgba(10,15,28,.085); color: var(--m-ink-2); }
html[data-theme="biznes"] .davr-btn:focus-visible { outline: 2px solid var(--m-blue); outline-offset: 2px; }
html[data-theme="biznes"] .davr-btn.is-active {
    background: color-mix(in srgb, var(--m-blue) 13%, transparent);
    color: var(--m-blue);
}
html[data-theme="biznes"] .davr-sana { display: flex; align-items: center; gap: 7px; }
html[data-theme="biznes"] .davr-sana input[type="date"] {
    font-size: .76rem; padding: 5px 9px; height: auto;
    border-radius: 10px;
    border: 1px solid var(--m-line-2);
    background: var(--m-solid); color: var(--m-ink-2);
    font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .davr-tire { color: var(--m-muted); font-size: .8rem; }

/* "Joriy qarz" kartochkasidagi kichik izoh — davrga bog'liq emasligini bildiradi */
html[data-theme="biznes"] .stat-izoh {
    margin-top: 2px;
    font-size: .6rem; font-weight: 600; letter-spacing: .02em;
    color: var(--m-muted);   /* ilgari opacity .85 ham bor edi: kontrast 2.9 */
    white-space: nowrap;
}
html[data-theme="biznes"] .stat-card--dark .stat-izoh { color: rgba(255,255,255,.5); }

html[data-theme="biznes"][data-mode="dark"] .davr-btn { background: rgba(255,255,255,.07); }
html[data-theme="biznes"][data-mode="dark"] .davr-btn:hover {
    background: rgba(255,255,255,.12); color: var(--m-ink);
}
html[data-theme="biznes"][data-mode="dark"] .davr-btn.is-active {
    background: color-mix(in srgb, var(--m-blue) 26%, transparent);
    color: #7FBBFF;
}

/* Telefonda tugmalar o'ralib tushadi, sanalar esa butun kenglikni egallaydi */
@media (max-width: 620px) {
    html[data-theme="biznes"] .davr-sana { width: 100%; }
    html[data-theme="biznes"] .davr-sana input[type="date"] { flex: 1 1 0; min-width: 0; }
}

/* Kartochka ostidagi o'sish ko'rsatkichi — tanlangan davr vs oldingi teng davr.
   Xarajatlarda rang TESKARI: xarajat o'ssa bu yomon, shuning uchun qizil. */
html[data-theme="biznes"] .stat-osish {
    margin-top: 2px;
    display: block;
    font-size: .645rem; font-weight: 700; letter-spacing: .01em;
    white-space: nowrap;
    color: var(--m-muted);
}
html[data-theme="biznes"] .stat-osish:empty { display: none; }
html[data-theme="biznes"] .stat-osish.yaxshi  { color: var(--m-green-matn); }
html[data-theme="biznes"] .stat-osish.yomon   { color: var(--m-red); }
html[data-theme="biznes"] .stat-osish.betaraf { color: var(--m-muted); font-weight: 600; }
html[data-theme="biznes"] .stat-card--dark .stat-osish.betaraf { color: rgba(255,255,255,.5); }

/* ==========================================================================
   KALENDAR (Air Datepicker) — loyiha dizayniga moslash
   --------------------------------------------------------------------------
   Kutubxonaning o'z CSS'i --adp-* o'zgaruvchilari orqali sozlanadi, shuning
   uchun uning faylini tahrirlash shart emas: faqat o'zgaruvchilarni o'zimizning
   --m-* ranglarimizga bog'laymiz. Shu bois tungi rejim ham o'z-o'zidan to'g'ri
   bo'ladi.
   ========================================================================== */
html[data-theme="biznes"] .air-datepicker {
    --adp-font-family: inherit;
    --adp-font-size: .82rem;
    --adp-border-radius: 14px;
    --adp-cell-border-radius: 10px;
    --adp-day-cell-height: 34px;

    --adp-background-color: var(--m-solid);
    --adp-color: var(--m-ink);
    --adp-color-secondary: var(--m-muted);
    --adp-accent-color: var(--m-blue);
    --adp-border-color: var(--m-line-2);
    --adp-border-color-inner: var(--m-line);
    --adp-day-name-color: var(--m-muted);
    --adp-color-other-month: color-mix(in srgb, var(--m-muted) 55%, transparent);
    --adp-color-disabled: color-mix(in srgb, var(--m-muted) 45%, transparent);
    --adp-color-current-date: var(--m-blue);

    --adp-cell-background-color-hover: color-mix(in srgb, var(--m-blue) 10%, transparent);
    --adp-cell-background-color-selected: var(--m-blue);
    --adp-cell-background-color-selected-hover: color-mix(in srgb, var(--m-blue) 86%, #000);
    --adp-cell-background-color-in-range: color-mix(in srgb, var(--m-blue) 13%, transparent);
    --adp-cell-background-color-in-range-hover: color-mix(in srgb, var(--m-blue) 20%, transparent);
    --adp-cell-border-color-in-range: transparent;

    --adp-btn-color: var(--m-blue);
    --adp-btn-color-hover: var(--m-blue);
    --adp-btn-border-radius: 10px;
    --adp-btn-background-color-hover: color-mix(in srgb, var(--m-blue) 10%, transparent);
    --adp-btn-background-color-active: color-mix(in srgb, var(--m-blue) 18%, transparent);

    box-shadow: 0 18px 44px -16px rgba(10, 15, 28, .34), 0 0 0 1px var(--m-line);
    z-index: 1200;
}
html[data-theme="biznes"][data-mode="dark"] .air-datepicker {
    box-shadow: 0 18px 44px -14px rgba(0, 0, 0, .62), 0 0 0 1px var(--m-line-2);
}
/* Ko'rsatkich uchburchakning foni kutubxonada #fff deb qotirib qo'yilgan —
   tungi rejimda oq uchburchak bo'lib qolardi. */
html[data-theme="biznes"] .air-datepicker--pointer:after {
    background: var(--adp-background-color);
    border-top-color: var(--adp-border-color);
    border-right-color: var(--adp-border-color);
}
/* Oy/yil sarlavhasi bosh harfda, o'zbekcha nomlar uzun bo'lgani uchun kichikroq */
html[data-theme="biznes"] .air-datepicker-nav--title { font-weight: 700; letter-spacing: -.01em; }
html[data-theme="biznes"] .air-datepicker-nav--action:hover { background: var(--adp-cell-background-color-hover); }

/* Kalendar ochiladigan maydon — o'qish uchun, qo'lda yozish uchun emas */
html[data-theme="biznes"] .kalendar-maydon { cursor: pointer; }
html[data-theme="biznes"] .kalendar-maydon::placeholder { color: var(--m-muted); opacity: .85; }
/* Oraliq maydoni ikkita sanani bitta qatorda ko'rsatadi — kengroq joy kerak */
html[data-theme="biznes"] .kalendar-oraliq { min-width: 192px; }

/* ==========================================================================
   OYLIK BALANS — "Barchasi" kartochkasidagi ikkinchi tugma va uning oynasi
   ========================================================================== */
html[data-theme="biznes"] .stat-tugmalar {
    display: flex; gap: 6px; flex-wrap: wrap;
    margin-top: 10px; align-self: flex-start;
    position: relative; z-index: 1;
}
html[data-theme="biznes"] .stat-tugmalar .prognoz-btn { margin-top: 0; }

/* "Oylik" tugmasi — Prognoz bilan bir xil uslubda, lekin boshqa rangda */
html[data-theme="biznes"] .oylik-btn {
    all: unset;
    padding: 5px 10px;
    display: inline-flex; align-items: center; gap: 5px;
    border-radius: 999px; cursor: pointer;
    font-size: .665rem; font-weight: 620; letter-spacing: .01em;
    color: var(--m-muted);
    background: rgba(10,15,28,.045);
    transition: background .24s var(--m-ease), color .24s var(--m-ease);
}
html[data-theme="biznes"] .oylik-btn:hover {
    background: color-mix(in srgb, var(--m-teal) 15%, transparent);
    color: var(--m-teal);
}
html[data-theme="biznes"] .oylik-btn:focus-visible { outline: 2px solid var(--m-teal); outline-offset: 2px; }
html[data-theme="biznes"] .stat-card--dark .oylik-btn {
    background: rgba(255,255,255,.09); color: rgba(255,255,255,.72);
}
html[data-theme="biznes"] .stat-card--dark .oylik-btn:hover {
    background: rgba(255,255,255,.16); color: #fff;
}
html[data-theme="biznes"][data-mode="dark"] .oylik-btn { background: rgba(255,255,255,.07); }

/* Oy nomi sananing ostida kichik matn bo'lib turadi */
html[data-theme="biznes"] .oylik-oy { display: block; font-size: .7rem; color: var(--m-muted); margin-top: 2px; }
html[data-theme="biznes"] .oylik-jadval td { white-space: nowrap; font-variant-numeric: tabular-nums; }
html[data-theme="biznes"] .oylik-jadval .oylik-balans-uya { font-weight: 700; }
/* Tugamagan oy — raqamlar hali to'liq emasligini bildiradi */
html[data-theme="biznes"] .oylik-tugamagan {
    display: inline-block; margin-left: 6px; padding: 1px 7px;
    border-radius: 999px; font-size: .62rem; font-weight: 650;
    background: color-mix(in srgb, var(--m-orange) 16%, transparent);
    color: var(--m-orange);
}

/* Oylik Balans oynasi TO'LIQ ekranni qoplaydi — "qo'shimcha oyna" emas,
   alohida sahifa kabi. Shu sababli tepadagi bo'shliq, yumaloq burchak va
   "tortish dastagi" olib tashlanadi. Boshqa oynalar o'z ko'rinishida qoladi. */
html[data-theme="biznes"] #oylik-balans-modal {
    padding: 0;              /* chetlardagi 12px bo'shliqni olib tashlaymiz */
    align-items: stretch;
}
html[data-theme="biznes"] #oylik-balans-modal {
    /* Yopishqoq ustun va qator foni aynan shu rangdan oladi — shaffof bo'lsa
       ustma-ust tushgan matn ko'rinib qolardi. */
    --oylik-yuza: #FBFCFF;
}
html[data-theme="biznes"][data-mode="dark"] #oylik-balans-modal { --oylik-yuza: #141A28; }
html[data-theme="biznes"] #oylik-balans-modal .modern-modal-content {
    height: 100%;
    max-height: 100%;
    width: 100%;
    max-width: 100%;         /* style.css dagi 1400px cheklovini bekor qiladi */
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none;
    /* Butun ekranni qoplagan oyna ortida ko'radigan narsa yo'q — shaffoflik
       faqat matnni xiralashtiradi va yopishqoq ustunga xalaqit beradi. */
    background: var(--oylik-yuza) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
html[data-theme="biznes"] #oylik-balans-modal .modern-modal-header::before { display: none; }
html[data-theme="biznes"] #oylik-balans-modal .modern-modal-header { padding-top: 18px; }

/* Ustun ranglari — sarlavha so'zi ham, raqamlar ham o'z rangida.
   Mavzu o'zgaruvchilaridan olinadi, shuning uchun tungi rejimda ham to'g'ri. */
html[data-theme="biznes"] .oylik-jadval .oy-qosh    { color: var(--m-green-matn) !important; }
html[data-theme="biznes"] .oylik-jadval .oy-ayir    { color: var(--m-red)    !important; }
html[data-theme="biznes"] .oylik-jadval .oy-daromad { color: var(--m-blue)   !important; }
html[data-theme="biznes"] .oylik-jadval .oy-xarajat { color: var(--m-purple) !important; }
html[data-theme="biznes"] .oylik-jadval thead th.oy-qosh,
html[data-theme="biznes"] .oylik-jadval thead th.oy-ayir,
html[data-theme="biznes"] .oylik-jadval thead th.oy-daromad,
html[data-theme="biznes"] .oylik-jadval thead th.oy-xarajat { font-weight: 750; }
html[data-theme="biznes"] .oylik-jadval tbody td.oy-qosh,
html[data-theme="biznes"] .oylik-jadval tbody td.oy-ayir,
html[data-theme="biznes"] .oylik-jadval tbody td.oy-daromad,
html[data-theme="biznes"] .oylik-jadval tbody td.oy-xarajat { font-weight: 650; }

/* Oylik Balans — 1-QATOR: kalendar bilan sozlanadigan ixtiyoriy davr.
   Chapdagi kalendar "Davr boshi", o'ngdagisi "Davr oxiri" ustunida.
   Pastdagi oy qatorlari bunga bog'liq emas — ular doim butun tarix. */
/* O'ram o'lchami yuqorida (kalendar belgisi bloki) beriladi.
   Uya o'ngga tekislangani uchun o'ng tomondagi kalendar o'zi o'ngga tushadi. */
html[data-theme="biznes"] .oylik-kal input {
    font-size: .82rem !important; padding: 7px 10px !important;
    width: 100%; min-width: 118px; max-width: 150px; height: auto !important;
    border-radius: 11px; border: 1px solid var(--m-line-2);
    background: var(--m-solid); color: var(--m-ink);
    font-variant-numeric: tabular-nums; font-weight: 700;
    box-sizing: border-box;
}
html[data-theme="biznes"] .oylik-kal input::placeholder {
    color: var(--m-muted); font-weight: 600; opacity: .9;
}
html[data-theme="biznes"] .oylik-kal-qator .oylik-oy { margin-top: 5px; }

/* Bu qator pastdagi oy qatorlariga tegishli emas — shuning uchun u
   ajratilgan fon va qalin ostki chiziq bilan ajratib qo'yiladi. */
html[data-theme="biznes"] .oylik-kal-qator td {
    background: color-mix(in srgb, var(--m-blue) 6%, transparent);
    border-bottom: 2px solid color-mix(in srgb, var(--m-blue) 32%, transparent);
    padding-top: 16px; padding-bottom: 16px;
    vertical-align: top;
}
html[data-theme="biznes"] .oylik-kal-qator .oylik-balans-uya { font-size: 1.04rem; }
html[data-theme="biznes"][data-mode="dark"] .oylik-kal-qator td {
    background: color-mix(in srgb, var(--m-blue) 13%, transparent);
    border-bottom-color: color-mix(in srgb, var(--m-blue) 45%, transparent);
}
/* Sana tanlanmagan holat: uyalar bo'm-bo'sh qoladi, lekin qator yassilanib
   ketmasligi uchun balandligi saqlanadi. */
html[data-theme="biznes"] .oylik-kal-qator td:empty::after {
    content: ""; display: inline-block; min-height: 1.2em;
}
/* Chekka ustunlar kalendar sig'adigan darajada keng bo'lsin */
html[data-theme="biznes"] .oylik-jadval thead th:first-child,
html[data-theme="biznes"] .oylik-jadval thead th:last-child { min-width: 152px; }

/* Jami qatori — bitta qator bo'lgani uchun ko'zga yaqqol tashlansin */
html[data-theme="biznes"] .oylik-jadval tr.oylik-jami td {
    background: color-mix(in srgb, var(--m-blue) 7%, transparent);
    padding-top: 20px; padding-bottom: 20px;
}
html[data-theme="biznes"] .oylik-jadval tr.oylik-jami .oylik-balans-uya { font-size: 1.1rem; }

/* To'liq bo'lmagan oy — qirqilgani bilinib tursin */
html[data-theme="biznes"] .oylik-qirqilgan {
    /* Sana yonida tursa uni markazdan siljitib yuborardi, shu sababli
       ostiga tushadi — xuddi birinchi ustundagi oy nomi kabi. */
    display: block; width: fit-content; margin: 5px auto 0; padding: 1px 7px;
    border-radius: 999px; font-size: .62rem; font-weight: 650; white-space: nowrap;
    background: color-mix(in srgb, var(--m-orange) 16%, transparent);
    color: #A35200;   /* --m-orange oq fonda 1.9 edi; bu 4.9 */
}
/* Gorizontal scroll FAQAT jadvalga tegishli bo'lsin.
   Ilgari u butun oyna tanasida edi: shu sababli sana paneli va izohlar ham
   jadval kengligiga cho'zilib, telefonda ekrandan chiqib ketardi. */
html[data-theme="biznes"] #oylik-balans-modal .modern-modal-body { overflow-x: hidden; }
html[data-theme="biznes"] #oylik-balans-modal .modern-table-container { overflow-x: auto; }

/* ==========================================================================
   JAMLANMA HISOBOT — jadval o'qishligi
   --------------------------------------------------------------------------
   Moliyaviy jadvalda raqamlar O'NGGA tekislanishi shart: shundagina birlik
   birlik ostida, mingtalik mingtalik ostida tushadi va ikki raqamni ko'z
   bilan solishtirish mumkin bo'ladi. Chapga tekislanganda 46,071,300 va
   127,680,000 bir xil uzunlikda ko'rinib, qaysi biri kattaligini darrov
   aytib bo'lmaydi.
   ========================================================================== */

/* Hamma ustun markazda — jadval yaxlit va bir tekis ko'rinadi. */
html[data-theme="biznes"] .oylik-jadval th,
html[data-theme="biznes"] .oylik-jadval td { text-align: center; }

/* Sarlavha matni jadvalning qolgan qismiga nisbatan juda kichik edi —
   biroz kattalashtirildi, ustun nomlari uzoqdan ham o'qiladi. */
html[data-theme="biznes"] .oylik-jadval thead th {
    font-size: .78rem; letter-spacing: .07em;
    white-space: nowrap;      /* "YANGI BALANS" ikki qatorga sinib ketmasin */
}

/* Nol qiymat — so'ngan. Yorqin yashil "0" ko'zni oladi, lekin hech narsa
   demaydi. Bu qoida ranglilaridan KEYIN turishi shart. */
html[data-theme="biznes"] .oylik-jadval tbody td.oy-nol {
    /* Ustun ranglari !important bilan berilgan (1914-qator), shuning uchun
       bu yerda ham shunday bo'lishi shart — aks holda nol yashil qolaveradi. */
    color: var(--m-muted) !important; font-weight: 600; opacity: .45;
}

/* Birinchi ustun yopishqoq: telefonda jadval yon tomonga surilganda ham
   qaysi oyga qarayotganingiz ko'rinib turadi. */
html[data-theme="biznes"] .oylik-jadval th:first-child,
html[data-theme="biznes"] .oylik-jadval td:first-child {
    position: sticky; left: 0; z-index: 2;
    background: var(--oylik-yuza);
    box-shadow: 1px 0 0 var(--m-line);
}
html[data-theme="biznes"] .oylik-jadval thead th:first-child { z-index: 4; }
html[data-theme="biznes"] .oylik-kal-qator td:first-child {
    background: color-mix(in srgb, var(--m-blue) 6%, var(--oylik-yuza));
}
html[data-theme="biznes"][data-mode="dark"] .oylik-kal-qator td:first-child {
    background: color-mix(in srgb, var(--m-blue) 13%, var(--oylik-yuza));
}

/* Qatorni kuzatib borish oson bo'lsin — 8 ta ustunni ko'z bilan ushlab
   turish qiyin. Fon ATAYIN noshaffof: yopishqoq ustun ostidan matn
   ko'rinib qolmasligi uchun. */
html[data-theme="biznes"] #oylik-balans-tbody tr:hover td,
html[data-theme="biznes"] #oylik-balans-tbody tr:hover td:first-child {
    background: color-mix(in srgb, var(--m-blue) 4%, var(--oylik-yuza));
}
html[data-theme="biznes"][data-mode="dark"] #oylik-balans-tbody tr:hover td,
html[data-theme="biznes"][data-mode="dark"] #oylik-balans-tbody tr:hover td:first-child {
    background: color-mix(in srgb, var(--m-blue) 9%, var(--oylik-yuza));
}

/* Kalendar maydoni bosiladigan ekani ko'rinib tursin — ichida kalendar
   belgisi, ustiga borganda esa chekkasi jonlanadi. */
html[data-theme="biznes"] .oylik-kal {
    position: relative;
    display: inline-block;
    width: 100%; max-width: 150px;
}
html[data-theme="biznes"] .oylik-kal::after {
    content: ""; position: absolute; right: 10px; top: 50%;
    width: 14px; height: 14px; margin-top: -7px; pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%237B8698' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M8 3v4M16 3v4M3 10h18'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
    opacity: .85;
}
html[data-theme="biznes"] .oylik-kal input {
    padding-right: 30px !important;
    transition: border-color .2s var(--m-ease), box-shadow .2s var(--m-ease);
}
html[data-theme="biznes"] .oylik-kal input:hover {
    border-color: color-mix(in srgb, var(--m-blue) 45%, transparent);
}
html[data-theme="biznes"] .oylik-kal input:focus-visible {
    outline: none;
    border-color: var(--m-blue);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--m-blue) 18%, transparent);
}

/* Telefonda kalendar uyalari torayadi — jadvalning o'zi gorizontal
   skroll qilgani uchun ular ham jadval bilan birga suriladi. */
@media (max-width: 620px) {
    /* Barmoq uchun nishon: Apple ham, Google ham eng kami 44px tavsiya qiladi.
       Avval maydon 29px edi — telefonda aniq bosish qiyin, yonidagi uyaga
       tegib ketardi. Kenglik o'zgarmaydi, faqat balandlik. */
    html[data-theme="biznes"] .oylik-kal input {
        font-size: .78rem !important;
        padding: 10px 30px 10px 12px !important;
        min-height: 44px; max-width: 136px;
    }
    /* Oynaning "orqaga" tugmasi ham xuddi shunday sababga ko'ra */
    html[data-theme="biznes"] #oylik-balans-modal .modern-btn-icon {
        width: 44px; height: 44px; min-width: 44px;
    }
}

/* ==========================================================================
   RO'YXATDAN O'TISH — forma va zaxira kod ekrani
   ========================================================================== */

/* Maydon ostidagi kichik tushuntirish */
html[data-theme="biznes"] .maydon-izoh {
    margin: 6px 2px 0; font-size: .72rem; line-height: 1.45;
    color: var(--m-muted);
}

/* Kartochka tagidagi havola ("Hisobingiz yo'qmi?") */
html[data-theme="biznes"] .karta-tag {
    margin: 18px 0 0; text-align: center;
    font-size: .82rem; color: var(--m-muted);
}
html[data-theme="biznes"] .karta-tag a {
    color: var(--m-blue); font-weight: 650; text-decoration: none;
}
html[data-theme="biznes"] .karta-tag a:hover { text-decoration: underline; }

/* Hisob ochilgandagi yashil belgi */
html[data-theme="biznes"] .kod-belgi {
    background: color-mix(in srgb, var(--m-green) 16%, transparent) !important;
    color: var(--m-green) !important;
}

html[data-theme="biznes"] .kod-sarlavha {
    margin: 4px 0 8px; text-align: center;
    font-size: .74rem; font-weight: 700; letter-spacing: .09em;
    text-transform: uppercase; color: var(--m-muted);
}

/* Kodning o'zi — eng ko'zga tashlanadigan joy, chunki uni yozib olish kerak */
/* Kod va tugma ustma-ust turadi: yonma-yon qo'yilganda tor kartochkada
   kod ikki qatorga sinib ketardi — yozib olish kerak bo'lgan narsa uchun
   bu yaramaydi. */
html[data-theme="biznes"] .kod-quti {
    display: flex; flex-direction: column; align-items: center; gap: 12px;
    padding: 18px 14px; border-radius: 16px; text-align: center;
    background: color-mix(in srgb, var(--m-blue) 8%, var(--m-solid));
    border: 1px solid color-mix(in srgb, var(--m-blue) 28%, transparent);
}
html[data-theme="biznes"][data-mode="dark"] .kod-quti {
    background: color-mix(in srgb, var(--m-blue) 15%, var(--m-solid));
}
html[data-theme="biznes"] .kod-matn {
    /* Tor ekranda ham bitta qatorda tursin */
    font-size: clamp(1.02rem, 5.4vw, 1.36rem);
    font-weight: 800; letter-spacing: .06em; white-space: nowrap;
    font-variant-numeric: tabular-nums; color: var(--m-ink);
    user-select: all;            /* bitta bosishda butun kod belgilanadi */
}
html[data-theme="biznes"] .kod-nusxa {
    all: unset; cursor: pointer; flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 12px; border-radius: 999px;
    font-size: .74rem; font-weight: 650; white-space: nowrap;
    color: var(--m-blue);
    background: color-mix(in srgb, var(--m-blue) 12%, transparent);
    transition: background .2s var(--m-ease), color .2s var(--m-ease);
}
html[data-theme="biznes"] .kod-nusxa:hover {
    background: color-mix(in srgb, var(--m-blue) 20%, transparent);
}
html[data-theme="biznes"] .kod-nusxa.nusxalandi {
    color: var(--m-green);
    background: color-mix(in srgb, var(--m-green) 16%, transparent);
}

/* Ogohlantirish — kod boshqa ko'rsatilmasligini aytadi */
html[data-theme="biznes"] .kod-ogoh {
    margin: 14px 0 0; padding: 12px 14px; border-radius: 14px;
    font-size: .8rem; line-height: 1.55; color: var(--m-ink-2);
    background: color-mix(in srgb, var(--m-orange) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--m-orange) 26%, transparent);
}
html[data-theme="biznes"] .kod-ogoh b { color: var(--m-ink); font-weight: 700; }

/* "Yozib oldim" belgisi — bosilmaguncha davom etib bo'lmaydi */
html[data-theme="biznes"] .kod-tasdiq {
    display: flex; align-items: center; gap: 10px; cursor: pointer;
    margin: 16px 2px 14px; font-size: .86rem; color: var(--m-ink-2);
}
html[data-theme="biznes"] .kod-tasdiq input {
    width: 18px; height: 18px; accent-color: var(--m-blue);
    cursor: pointer; flex-shrink: 0;
}

/* Kirish sahifasida ikkita havola ketma-ket turadi — orasi zichroq */
html[data-theme="biznes"] .karta-tag-zich { margin-top: 7px; }

/* Kodni qo'lda yozish maydoni — kod bir xil kenglikdagi belgilar bilan
   yozilsa, uni o'qish va tekshirish osonroq */
html[data-theme="biznes"] .kod-kirit {
    letter-spacing: .12em; font-weight: 700;
    font-variant-numeric: tabular-nums; text-transform: uppercase;
}

/* Kod yozib olinmaguncha "Kirish" havolasi o'chiq ko'rinadi */
html[data-theme="biznes"] .btn-ochiq-emas {
    opacity: .5; cursor: not-allowed;
}
/* Tugma ko'rinishidagi havola: ostidagi chiziq kerak emas */
html[data-theme="biznes"] a.btn,
html[data-theme="biznes"] a.btn:hover { text-decoration: none; }

/* ==========================================================================
   XAVFSIZLIK OYNASI — diler panelida
   ========================================================================== */

/* Foydalanuvchi belgisi endi bosiladi — bu bilinib tursin */
html[data-theme="biznes"] .user-chip-btn {
    cursor: pointer; border: none; font: inherit;
    transition: background .2s var(--m-ease);
}
html[data-theme="biznes"] .user-chip-btn:hover {
    background: color-mix(in srgb, var(--m-blue) 12%, transparent);
}
html[data-theme="biznes"] .user-chip-gear { opacity: .55; flex-shrink: 0; }
html[data-theme="biznes"] .user-chip-btn:hover .user-chip-gear { opacity: .9; }

/* Oyna ichidagi ikkita bo'lim */
html[data-theme="biznes"] .xf-bolim {
    padding: 18px; border-radius: 18px; margin-bottom: 16px;
    border: 1px solid var(--m-line);
    background: color-mix(in srgb, var(--m-ink) 2%, transparent);
}
html[data-theme="biznes"][data-mode="dark"] .xf-bolim {
    background: rgba(255,255,255,.025);
}
html[data-theme="biznes"] .xf-sarlavha {
    display: flex; align-items: center; gap: 9px; margin-bottom: 6px;
    color: var(--m-blue);
}
html[data-theme="biznes"] .xf-sarlavha h4 {
    margin: 0; font-size: .98rem; font-weight: 700; color: var(--m-ink);
}
html[data-theme="biznes"] .xf-bolim .maydon-izoh { margin-bottom: 14px; }
html[data-theme="biznes"] .xf-bolim .form-group { margin-bottom: 12px; }

/* Natija xabari — xato qizil, muvaffaqiyat yashil */
html[data-theme="biznes"] .xf-xabar {
    margin: 0 0 12px; padding: 10px 13px; border-radius: 12px;
    font-size: .82rem; line-height: 1.5;
}
html[data-theme="biznes"] .xf-xabar.xato {
    color: var(--m-red);
    background: color-mix(in srgb, var(--m-red) 11%, transparent);
    border: 1px solid color-mix(in srgb, var(--m-red) 26%, transparent);
}
html[data-theme="biznes"] .xf-xabar.ok {
    color: var(--m-green);
    background: color-mix(in srgb, var(--m-green) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--m-green) 28%, transparent);
}

/* Oyna juda keng cho'zilmasin — o'qish qulay bo'lsin */
html[data-theme="biznes"] #xavfsizlik-modal .modern-modal-content { max-width: 560px; }

/* ----- Xavfsizlik oynasidagi yordamchi bo'limi ----- */
html[data-theme="biznes"] .yrd-karta {
    padding: 13px 15px; border-radius: 14px; margin-bottom: 12px;
    background: var(--m-solid); border: 1px solid var(--m-line);
}
html[data-theme="biznes"] .yrd-ism {
    display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
    font-size: .95rem; color: var(--m-ink);
}
html[data-theme="biznes"] .yrd-login {
    margin-top: 4px; font-size: .8rem; color: var(--m-muted);
}
html[data-theme="biznes"] .yrd-login b { color: var(--m-ink-2); }

/* Holat belgisi — faol yashil, muzlatilgan sariq */
html[data-theme="biznes"] .yrd-holat {
    padding: 2px 9px; border-radius: 999px;
    font-size: .68rem; font-weight: 700; letter-spacing: .04em;
    color: var(--m-green);
    background: color-mix(in srgb, var(--m-green) 15%, transparent);
}
html[data-theme="biznes"] .yrd-holat.muzlatilgan {
    color: var(--m-orange);
    background: color-mix(in srgb, var(--m-orange) 16%, transparent);
}

/* Login va parol bir marta ko'rsatiladigan quti */
html[data-theme="biznes"] .yrd-maxfiy-quti { gap: 2px; }
html[data-theme="biznes"] .yrd-maxfiy-quti .kod-matn { font-size: 1.1rem; }
html[data-theme="biznes"] .yrd-maxfiy-quti .kod-nusxa { margin-top: 12px; }

/* Taminotchilar jamlanmasi bosiladigan bo'ldi — bu bilinib tursin */
html[data-theme="biznes"] #supplier-summary {
    cursor: pointer;
    transition: border-color .2s var(--m-ease), box-shadow .2s var(--m-ease), transform .2s var(--m-ease);
}
html[data-theme="biznes"] #supplier-summary:hover {
    border-color: #a78bfa !important;
    box-shadow: 0 6px 18px -8px rgba(124, 58, 237, .45);
    transform: translateY(-1px);
}
html[data-theme="biznes"] #supplier-summary:focus-visible {
    outline: 2px solid var(--m-blue); outline-offset: 2px;
}

/* ==========================================================================
   PROFIL MENYUSI — tepadagi ism bosilganda ochiladi
   ========================================================================== */
html[data-theme="biznes"] .profil-oram { position: relative; }

html[data-theme="biznes"] .profil-strelka {
    opacity: .5; transition: transform .22s var(--m-ease), opacity .2s var(--m-ease);
}
html[data-theme="biznes"] .user-chip-btn[aria-expanded="true"] .profil-strelka {
    transform: rotate(180deg); opacity: .9;
}

html[data-theme="biznes"] .profil-menyu {
    position: absolute; top: calc(100% + 8px); right: 0; z-index: 1200;
    min-width: 232px; padding: 7px;
    border-radius: 16px; border: 1px solid var(--m-line);
    background: var(--m-solid);
    box-shadow: 0 18px 44px -14px rgba(10, 15, 28, .28), 0 0 0 1px rgba(10, 15, 28, .03);
    animation: profilOchil .16s var(--m-ease);
}
html[data-theme="biznes"][data-mode="dark"] .profil-menyu {
    box-shadow: 0 18px 44px -12px rgba(0, 0, 0, .6), 0 0 0 1px var(--m-line-2);
}
@keyframes profilOchil {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

html[data-theme="biznes"] .profil-element {
    all: unset; box-sizing: border-box; cursor: pointer;
    display: flex; align-items: center; gap: 11px; width: 100%;
    padding: 10px 12px; border-radius: 11px;
    font-size: .88rem; font-weight: 550; color: var(--m-ink);
    transition: background .16s var(--m-ease);
}
html[data-theme="biznes"] .profil-element:hover {
    background: color-mix(in srgb, var(--m-blue) 9%, transparent);
}
html[data-theme="biznes"] .profil-element:focus-visible {
    outline: 2px solid var(--m-blue); outline-offset: -2px;
}
html[data-theme="biznes"] .profil-ikon {
    display: inline-flex; flex-shrink: 0; color: var(--m-blue);
}

html[data-theme="biznes"] .profil-chiziq {
    height: 1px; margin: 6px 10px; background: var(--m-line);
}
html[data-theme="biznes"] .profil-chiqish { color: var(--m-red); }
html[data-theme="biznes"] .profil-chiqish .profil-ikon { color: var(--m-red); }
html[data-theme="biznes"] .profil-chiqish:hover {
    background: color-mix(in srgb, var(--m-red) 10%, transparent);
}

/* Qo'ng'iroq: o'qilmagan xabarlar SONI chiqadi (9 dan ko'p bo'lsa "9+") */
html[data-theme="biznes"] #bildirishnoma-btn { position: relative; overflow: visible; }
html[data-theme="biznes"] .bildirishnoma-nishon {
    position: absolute; top: 1px; right: 0;
    display: flex; align-items: center; justify-content: center;
    min-width: 16px; height: 16px; padding: 0 4px;
    border-radius: 999px;
    font-size: .63rem; font-weight: 800; line-height: 1;
    font-variant-numeric: tabular-nums;
    color: #fff; background: var(--m-red);
    box-shadow: 0 0 0 2px var(--m-solid);
}
html[data-theme="biznes"] .bildirishnoma-nishon[hidden] { display: none; }

/* Hali tayyor bo'lmagan bo'limlar uchun bo'sh holat */
html[data-theme="biznes"] .bosh-holat {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 46px 22px; gap: 4px;
}
html[data-theme="biznes"] .bosh-holat-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; margin-bottom: 10px; border-radius: 50%;
    color: var(--m-blue);
    background: color-mix(in srgb, var(--m-blue) 11%, transparent);
}
html[data-theme="biznes"] .bosh-holat h4 {
    margin: 0; font-size: 1.02rem; font-weight: 700; color: var(--m-ink);
}
html[data-theme="biznes"] .bosh-holat p {
    margin: 0; max-width: 340px; font-size: .85rem; line-height: 1.55; color: var(--m-muted);
}

/* Telefonda menyu ekrandan chiqib ketmasin */
@media (max-width: 480px) {
    html[data-theme="biznes"] .profil-menyu { min-width: 204px; }
}

/* Telefonda ism chipi headerdan chiqib ketardi (uzun ism 195px joy olardi).
   Tor ekranda faqat avatar va strelka qoladi — menyu baribir o'sha joyda
   ochiladi, ism esa menyu ichida kerak emas. */
@media (max-width: 560px) {
    html[data-theme="biznes"] .user-chip-btn #user-name-display { display: none; }
    html[data-theme="biznes"] .user-chip-btn { padding-left: 4px; padding-right: 8px; gap: 4px; }
}

/* ==========================================================
   XABARLAR (admin paneli)
   Chapda matn yoziladi, o'ngda oluvchilar belgilanadi, pastda
   yuborilganlar ro'yxati. Tungi rejim uchun alohida qoida kerak
   emas — hamma rang `--m-*` o'zgaruvchilaridan olinadi.
   ========================================================== */
/* Bo'lim YIG'ILADI: odatda bitta qator bo'lib turadi, bosilganda
   yozish maydoni va yuborilganlar ro'yxati ochiladi. Admin panelining
   asosiy ishi dilerlar ro'yxati, xabar yuborish esa ora-sira. */
html[data-theme="biznes"] .xabar-bolim {
    padding: 0;
    margin: 18px 0;
    overflow: hidden;
}
html[data-theme="biznes"] .xabar-tanasi { padding: 18px 22px 18px; }

/* --- Sarlavha (bosiladigan qator) --- */
html[data-theme="biznes"] .xabar-bosh {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 20px; margin: 0;
    cursor: pointer; list-style: none;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .xabar-bosh::-webkit-details-marker { display: none; }
html[data-theme="biznes"] .xabar-bosh:hover {
    background: color-mix(in srgb, var(--m-blue) 5%, transparent);
}
html[data-theme="biznes"] .xabar-bolim[open] > .xabar-bosh {
    border-bottom: 1px solid var(--m-line);
}
html[data-theme="biznes"] .xabar-bosh::after {
    content: ''; flex: 0 0 auto; width: 8px; height: 8px; margin-left: 2px;
    border-right: 2px solid var(--m-muted);
    border-bottom: 2px solid var(--m-muted);
    transform: rotate(45deg) translate(-2px, -2px);
    transition: transform .22s var(--m-ease);
}
html[data-theme="biznes"] .xabar-bolim[open] > .xabar-bosh::after {
    transform: rotate(-135deg) translate(-2px, -2px);
}
html[data-theme="biznes"] .xabar-bosh-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; flex: 0 0 auto;
    border-radius: 12px;
    color: var(--m-blue);
    background: color-mix(in srgb, var(--m-blue) 12%, transparent);
}
html[data-theme="biznes"] .xabar-bosh-matn {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px;
}
html[data-theme="biznes"] .xabar-bosh-nom {
    font-size: 1.04rem; font-weight: 700;
    letter-spacing: -0.028em; color: var(--m-ink);
}
html[data-theme="biznes"] .xabar-bosh-izoh {
    font-size: .81rem; color: var(--m-muted);
}
html[data-theme="biznes"] .xabar-bosh-son {
    flex: 0 0 auto; font-size: .74rem; font-weight: 650;
    padding: 4px 10px; border-radius: 999px;
    color: var(--m-muted);
    background: color-mix(in srgb, var(--m-ink) 6%, transparent);
    white-space: nowrap;
}
html[data-theme="biznes"] .xabar-bosh-son[hidden] { display: none; }

/* Tor ekranda sarlavhada joy kam — izoh va son yashiriladi */
@media (max-width: 560px) {
    html[data-theme="biznes"] .xabar-bosh-izoh { display: none; }
    html[data-theme="biznes"] .xabar-tanasi { padding: 16px 15px; }
    html[data-theme="biznes"] .xabar-bosh { padding: 13px 15px; }
}

/* --- Ikki ustun: matn | oluvchilar --- */
html[data-theme="biznes"] .xabar-tana {
    display: grid; gap: 18px;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    align-items: start;
}
html[data-theme="biznes"] .xabar-yozuv {
    display: flex; flex-direction: column; gap: 14px;
}
html[data-theme="biznes"] .xabar-maydon {
    display: flex; flex-direction: column; gap: 6px;
}
html[data-theme="biznes"] .xabar-maydon label {
    font-size: .8rem; font-weight: 650; color: var(--m-ink-2);
    margin: 0; letter-spacing: -0.01em;
}
html[data-theme="biznes"] .xabar-maydon textarea {
    min-height: 162px; line-height: 1.58; resize: vertical;
}
html[data-theme="biznes"] .xabar-sanoq {
    align-self: flex-end; font-size: .73rem; color: var(--m-muted);
    font-variant-numeric: tabular-nums;
}

/* --- Oluvchilarni tanlash --- */
html[data-theme="biznes"] .xabar-oluvchi {
    display: flex; flex-direction: column; gap: 9px;
    padding: 13px; border: 1px solid var(--m-line);
    border-radius: var(--m-r-md);
    background: color-mix(in srgb, var(--m-ink) 2.5%, transparent);
}
html[data-theme="biznes"] .xabar-oluvchi-bosh {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
html[data-theme="biznes"] .xabar-kimga-yorliq {
    font-size: .8rem; font-weight: 650; color: var(--m-ink-2);
}
html[data-theme="biznes"] .xabar-belgi {
    font-size: .71rem; font-weight: 650; padding: 3px 9px;
    border-radius: 999px; color: var(--m-muted);
    background: color-mix(in srgb, var(--m-ink) 6%, transparent);
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
html[data-theme="biznes"] .xabar-belgi-faol {
    color: var(--m-blue);
    background: color-mix(in srgb, var(--m-blue) 13%, transparent);
}
html[data-theme="biznes"] .xabar-tanlov {
    max-height: 232px; overflow-y: auto;
    display: flex; flex-direction: column; gap: 1px;
}
html[data-theme="biznes"] .xabar-qator {
    display: flex; align-items: center; gap: 9px;
    min-height: 38px; padding: 7px 9px; margin: 0;
    border-radius: var(--m-r-sm); cursor: pointer;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .xabar-qator:hover {
    background: color-mix(in srgb, var(--m-blue) 8%, transparent);
}
html[data-theme="biznes"] .xabar-qator input[type="checkbox"] {
    width: 17px; height: 17px; flex: 0 0 auto; margin: 0;
    accent-color: var(--m-blue); cursor: pointer;
}
html[data-theme="biznes"] .xabar-qator-hammasi {
    font-weight: 700;
    border-bottom: 1px dashed var(--m-line-2);
    border-radius: var(--m-r-sm) var(--m-r-sm) 0 0;
    margin-bottom: 3px;
}
html[data-theme="biznes"] .xabar-ism {
    flex: 1; min-width: 0; font-size: .86rem; color: var(--m-ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .xabar-muz {
    flex: 0 0 auto; font-size: .67rem; font-weight: 650;
    padding: 2px 7px; border-radius: 999px;
    color: var(--m-orange);
    background: color-mix(in srgb, var(--m-orange) 14%, transparent);
}

/* --- Yuborish qatori --- */
html[data-theme="biznes"] .xabar-amal {
    display: flex; align-items: center; justify-content: flex-end; gap: 12px;
    margin-top: 16px; padding-top: 14px;
    border-top: 1px solid var(--m-line);
}
html[data-theme="biznes"] .xabar-holat {
    margin-right: auto; font-size: .82rem; color: var(--m-muted);
}
html[data-theme="biznes"] .xabar-holat-ok { color: var(--m-green); font-weight: 600; }
html[data-theme="biznes"] .xabar-holat-xato { color: var(--m-red); font-weight: 600; }
html[data-theme="biznes"] .xabar-yubor {
    display: inline-flex; align-items: center; gap: 7px;
}

/* --- Yuborilganlar ro'yxati --- */
html[data-theme="biznes"] .xabar-tarix {
    margin-top: 20px; padding-top: 16px;
    border-top: 1px solid var(--m-line);
}
html[data-theme="biznes"] .xabar-tarix h4 {
    margin: 0 0 11px; font-size: .92rem; font-weight: 700;
    letter-spacing: -0.022em; color: var(--m-ink);
}
html[data-theme="biznes"] .xabar-tarix-royxat {
    display: flex; flex-direction: column; gap: 7px;
}
html[data-theme="biznes"] .xabar-element {
    border: 1px solid var(--m-line); border-radius: var(--m-r-md);
    background: var(--m-solid); overflow: hidden;
}
html[data-theme="biznes"] .xabar-element summary {
    display: flex; align-items: center; gap: 11px; flex-wrap: wrap;
    padding: 11px 14px; cursor: pointer; list-style: none;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .xabar-element summary::-webkit-details-marker { display: none; }
html[data-theme="biznes"] .xabar-element summary:hover {
    background: color-mix(in srgb, var(--m-blue) 6%, transparent);
}
html[data-theme="biznes"] .xabar-element summary::after {
    content: ''; flex: 0 0 auto; width: 7px; height: 7px;
    border-right: 1.8px solid var(--m-muted);
    border-bottom: 1.8px solid var(--m-muted);
    transform: rotate(45deg); margin-left: 2px;
    transition: transform .2s var(--m-ease);
}
html[data-theme="biznes"] .xabar-element[open] summary::after { transform: rotate(-135deg); }
html[data-theme="biznes"] .xabar-element[open] summary { border-bottom: 1px solid var(--m-line); }
html[data-theme="biznes"] .xabar-el-sarlavha {
    flex: 1; min-width: 0; font-size: .88rem; font-weight: 650;
    color: var(--m-ink); word-break: break-word;
}
html[data-theme="biznes"] .xabar-el-meta {
    flex: 0 0 auto; font-size: .74rem; color: var(--m-muted);
    font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .xabar-el-tana {
    display: flex; flex-direction: column; gap: 10px;
    padding: 12px 14px 13px;
}
html[data-theme="biznes"] .xabar-el-matn {
    margin: 0; font-size: .85rem; line-height: 1.6; color: var(--m-ink-2);
    white-space: pre-wrap; word-break: break-word;
}
html[data-theme="biznes"] .xabar-el-kimga {
    display: flex; flex-wrap: wrap; gap: 5px;
}
html[data-theme="biznes"] .xabar-chip {
    font-size: .72rem; padding: 3px 9px; border-radius: 999px;
    color: var(--m-ink-2);
    background: color-mix(in srgb, var(--m-ink) 6%, transparent);
}
html[data-theme="biznes"] .xabar-el-amal {
    display: flex; justify-content: flex-end;
}
html[data-theme="biznes"] .xabar-ochir {
    display: inline-flex; align-items: center; gap: 6px;
}
html[data-theme="biznes"] .xabar-bosh-qator {
    padding: 17px 10px; text-align: center;
    font-size: .83rem; color: var(--m-muted);
}

/* Tor ekranda ikki ustun bitta bo'lib qoladi */
@media (max-width: 860px) {
    html[data-theme="biznes"] .xabar-tana { grid-template-columns: minmax(0, 1fr); }
    html[data-theme="biznes"] .xabar-maydon textarea { min-height: 130px; }
    html[data-theme="biznes"] .xabar-tanlov { max-height: 196px; }
}

/* ==========================================================
   BILDIRISHNOMA KARTALARI (diler oynasi)
   Yopiq holatda sarlavha va sana, ochilganda matn va o'chirish.
   O'qilmagani chapdan ko'k chiziq bilan ajralib turadi.
   ========================================================== */
html[data-theme="biznes"] .bildirishnoma-royxat {
    display: flex; flex-direction: column; gap: 8px;
}
html[data-theme="biznes"] .xabar-karta {
    border: 1px solid var(--m-line); border-radius: var(--m-r-md);
    background: var(--m-solid); overflow: hidden;
}
html[data-theme="biznes"] .xabar-karta summary {
    display: flex; align-items: center; gap: 10px;
    padding: 13px 15px; cursor: pointer; list-style: none;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .xabar-karta summary::-webkit-details-marker { display: none; }
html[data-theme="biznes"] .xabar-karta summary:hover {
    background: color-mix(in srgb, var(--m-blue) 6%, transparent);
}
html[data-theme="biznes"] .xabar-karta summary::after {
    content: ''; flex: 0 0 auto; width: 7px; height: 7px;
    border-right: 1.8px solid var(--m-muted);
    border-bottom: 1.8px solid var(--m-muted);
    transform: rotate(45deg);
    transition: transform .2s var(--m-ease);
}
html[data-theme="biznes"] .xabar-karta[open] summary::after { transform: rotate(-135deg); }
html[data-theme="biznes"] .xabar-karta[open] summary { border-bottom: 1px solid var(--m-line); }
html[data-theme="biznes"] .xabar-karta-bosh {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px;
}
html[data-theme="biznes"] .xabar-karta-sarlavha {
    font-size: .92rem; font-weight: 650; color: var(--m-ink);
    word-break: break-word;
}
html[data-theme="biznes"] .xabar-karta-sana {
    font-size: .74rem; color: var(--m-muted);
    font-variant-numeric: tabular-nums;
}

/* O'qilmagan: chapda ko'k chiziq, sarlavha to'qroq */
html[data-theme="biznes"] .xabar-karta-yangi {
    border-color: color-mix(in srgb, var(--m-blue) 32%, var(--m-line));
    background: color-mix(in srgb, var(--m-blue) 5%, var(--m-solid));
}
html[data-theme="biznes"] .xabar-karta-yangi summary {
    border-left: 3px solid var(--m-blue);
    padding-left: 12px;
}
html[data-theme="biznes"] .xabar-karta-yangi .xabar-karta-sarlavha { font-weight: 750; }

html[data-theme="biznes"] .xabar-karta-tana {
    display: flex; flex-direction: column; gap: 12px;
    padding: 13px 15px 14px;
}
html[data-theme="biznes"] .xabar-karta-matn {
    margin: 0; font-size: .9rem; line-height: 1.62; color: var(--m-ink-2);
    white-space: pre-wrap; word-break: break-word;
}
html[data-theme="biznes"] .xabar-karta-amal {
    display: flex; justify-content: flex-end;
}
html[data-theme="biznes"] .xabar-karta-ochir {
    display: inline-flex; align-items: center; gap: 6px;
    min-height: 36px; padding: 7px 13px;
    border: 1px solid color-mix(in srgb, var(--m-red) 30%, transparent);
    border-radius: 999px; cursor: pointer;
    font-size: .82rem; font-weight: 600; font-family: inherit;
    color: var(--m-red); background: transparent;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .xabar-karta-ochir:hover {
    background: color-mix(in srgb, var(--m-red) 10%, transparent);
}

@media (max-width: 620px) {
    html[data-theme="biznes"] .xabar-karta summary { padding: 14px 15px; }
    html[data-theme="biznes"] .xabar-karta-ochir { min-height: 44px; }
}

/* ==========================================================
   QO'LLAB-QUVVATLASH — menyu yonida ochiladigan kichik panel
   O'rni (left/top) js/dealer.js da hisoblanadi.
   ========================================================== */
html[data-theme="biznes"] .qollab-panel {
    position: absolute; z-index: 1200;
    display: flex; flex-direction: column; gap: 4px;
    width: max-content; min-width: 206px; padding: 6px;
    border: 1px solid var(--m-line-2); border-radius: 16px;
    background: var(--m-solid);
    box-shadow: var(--m-sh-3);
    animation: qollabKirish .18s var(--m-ease);
}
html[data-theme="biznes"] .qollab-panel[hidden] { display: none; }
@keyframes qollabKirish {
    from { opacity: 0; transform: translateY(-4px) scale(.97); }
    to   { opacity: 1; transform: none; }
}
html[data-theme="biznes"] .qollab-qator {
    display: flex; align-items: center; gap: 10px;
    padding: 7px 10px 7px 7px; text-decoration: none;
    border-radius: 11px;
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .qollab-qator:hover {
    background: color-mix(in srgb, var(--m-blue) 9%, transparent);
}
html[data-theme="biznes"] .qollab-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; flex: 0 0 auto; border-radius: 10px;
}
html[data-theme="biznes"] .qollab-ikon-tel {
    color: var(--m-purple);
    background: color-mix(in srgb, var(--m-purple) 14%, transparent);
}
html[data-theme="biznes"] .qollab-ikon-tg { color: #fff; background: #2AABEE; }
html[data-theme="biznes"] .qollab-matn {
    font-size: .89rem; font-weight: 600; color: var(--m-ink);
    letter-spacing: -0.01em; white-space: nowrap;
}

/* ==========================================================
   ADMIN: DILER KARTOCHKASI
   Ilgari ichki uslublar (#475569, #64748b...) ishlatilardi —
   ular tungi rejimda o'zgarmay, matn o'qilmay qolardi. Endi
   hamma rang `--m-*` o'zgaruvchilaridan keladi.
   ========================================================== */
html[data-theme="biznes"] .diler-karta {
    display: flex; flex-direction: column; gap: 12px;
    padding: 16px;
    border-left: 1px solid rgba(255,255,255,.9);   /* style.css dagi 4px rangli chiziq o'rniga */
}
html[data-theme="biznes"][data-mode="dark"] .diler-karta { border-left-color: var(--m-line) !important; }

/* --- Sarlavha: avatar + ism + holat --- */
html[data-theme="biznes"] .diler-bosh {
    display: flex; align-items: center; gap: 11px;
}
html[data-theme="biznes"] .diler-avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex: 0 0 auto; border-radius: 13px;
    font-size: .84rem; font-weight: 750; letter-spacing: .01em;
}
html[data-theme="biznes"] .diler-avatar[data-rang="0"] { color: var(--m-blue);   background: color-mix(in srgb, var(--m-blue) 14%, transparent); }
html[data-theme="biznes"] .diler-avatar[data-rang="1"] { color: var(--m-purple); background: color-mix(in srgb, var(--m-purple) 14%, transparent); }
html[data-theme="biznes"] .diler-avatar[data-rang="2"] { color: var(--m-green);  background: color-mix(in srgb, var(--m-green) 15%, transparent); }
html[data-theme="biznes"] .diler-avatar[data-rang="3"] { color: var(--m-orange); background: color-mix(in srgb, var(--m-orange) 15%, transparent); }
html[data-theme="biznes"] .diler-avatar[data-rang="4"] { color: var(--m-teal);   background: color-mix(in srgb, var(--m-teal) 15%, transparent); }

html[data-theme="biznes"] .diler-nom { flex: 1; min-width: 0; }
html[data-theme="biznes"] .diler-nom h3 {
    margin: 0; font-size: .98rem; font-weight: 700; letter-spacing: -0.025em;
    color: var(--m-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .diler-pastki {
    display: flex; align-items: center; gap: 7px; margin-top: 2px;
}
html[data-theme="biznes"] .diler-login {
    display: flex; align-items: center; gap: 3px; min-width: 0;
    font-size: .78rem; color: var(--m-muted);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .diler-login svg { flex: 0 0 auto; opacity: .75; }

html[data-theme="biznes"] .diler-holat {
    display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto;
    padding: 3px 9px 3px 7px; border-radius: 999px;
    font-size: .69rem; font-weight: 700; letter-spacing: .01em;
}
html[data-theme="biznes"] .diler-holat::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor;
}
html[data-theme="biznes"] .diler-holat-faol {
    color: var(--m-green); background: color-mix(in srgb, var(--m-green) 13%, transparent);
}
html[data-theme="biznes"] .diler-holat-muz {
    color: var(--m-orange); background: color-mix(in srgb, var(--m-orange) 15%, transparent);
}

/* --- Telefon --- */
html[data-theme="biznes"] .diler-tel {
    display: flex; align-items: center; gap: 7px;
    font-size: .85rem; font-weight: 600; color: var(--m-ink-2);
    font-variant-numeric: tabular-nums;
}
html[data-theme="biznes"] .diler-tel svg { flex: 0 0 auto; color: var(--m-muted); }

/* --- Yordamchi --- */
html[data-theme="biznes"] .diler-yordamchi {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 10px; border-radius: var(--m-r-sm);
    background: color-mix(in srgb, var(--m-ink) 4%, transparent);
}
html[data-theme="biznes"] .diler-yordamchi-ikon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; flex: 0 0 auto; border-radius: 9px;
    color: var(--m-indigo);
    background: color-mix(in srgb, var(--m-indigo) 14%, transparent);
}
html[data-theme="biznes"] .diler-yordamchi-matn {
    flex: 1; min-width: 0; display: flex; flex-direction: column;
}
html[data-theme="biznes"] .diler-yordamchi-matn strong {
    font-size: .82rem; font-weight: 650; color: var(--m-ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .diler-yordamchi-matn span {
    font-size: .73rem; color: var(--m-muted);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .diler-yordamchi-yoq .diler-yordamchi-ikon {
    color: var(--m-muted);
    background: color-mix(in srgb, var(--m-ink) 7%, transparent);
}
html[data-theme="biznes"] .diler-yordamchi-yoq .diler-yordamchi-matn strong {
    font-weight: 600; color: var(--m-ink-2);
}

/* --- Eslatma --- */
html[data-theme="biznes"] .diler-eslatma label {
    display: block; margin-bottom: 5px;
    font-size: .75rem; font-weight: 650; color: var(--m-muted);
}
html[data-theme="biznes"] .diler-eslatma-qator { display: flex; gap: 7px; }
html[data-theme="biznes"] .diler-eslatma-qator .note-input {
    flex: 1; min-width: 0; font-size: .84rem !important; padding: 8px 11px !important;
}
html[data-theme="biznes"] .diler-saqlash {
    flex: 0 0 auto; padding: 0 13px; min-height: 36px;
    border: 1px solid color-mix(in srgb, var(--m-blue) 30%, transparent);
    border-radius: var(--m-r-sm); cursor: pointer;
    font-size: .8rem; font-weight: 650; font-family: inherit;
    color: var(--m-blue); background: color-mix(in srgb, var(--m-blue) 9%, transparent);
    transition: background-color .16s var(--m-ease);
}
html[data-theme="biznes"] .diler-saqlash:hover:not(:disabled) {
    background: color-mix(in srgb, var(--m-blue) 17%, transparent);
}
html[data-theme="biznes"] .diler-saqlash:disabled { opacity: .6; cursor: default; }

/* --- Amallar: ikkita matnli tugma + o'chirish belgisi --- */
html[data-theme="biznes"] .diler-amallar {
    display: flex; align-items: center; gap: 7px;
    margin-top: auto; padding-top: 11px;
    border-top: 1px solid var(--m-line);
}
html[data-theme="biznes"] .diler-amal {
    flex: 1; min-width: 0;
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    min-height: 36px; padding: 6px 8px;
    border: 1px solid var(--m-line-2); border-radius: var(--m-r-sm);
    cursor: pointer; font-family: inherit;
    font-size: .76rem; font-weight: 650; letter-spacing: -0.01em;
    color: var(--m-ink-2); background: transparent;
    transition: background-color .16s var(--m-ease), border-color .16s var(--m-ease), color .16s var(--m-ease);
}
html[data-theme="biznes"] .diler-amal span {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
html[data-theme="biznes"] .diler-amal svg { flex: 0 0 auto; opacity: .85; }
html[data-theme="biznes"] .diler-amal:hover {
    color: var(--m-blue);
    border-color: color-mix(in srgb, var(--m-blue) 34%, transparent);
    background: color-mix(in srgb, var(--m-blue) 8%, transparent);
}
html[data-theme="biznes"] .diler-amal-sariq { color: var(--m-orange); border-color: color-mix(in srgb, var(--m-orange) 28%, transparent); }
html[data-theme="biznes"] .diler-amal-sariq:hover {
    color: var(--m-orange);
    border-color: color-mix(in srgb, var(--m-orange) 45%, transparent);
    background: color-mix(in srgb, var(--m-orange) 11%, transparent);
}
html[data-theme="biznes"] .diler-amal-yashil { color: var(--m-green); border-color: color-mix(in srgb, var(--m-green) 28%, transparent); }
html[data-theme="biznes"] .diler-amal-yashil:hover {
    color: var(--m-green);
    border-color: color-mix(in srgb, var(--m-green) 45%, transparent);
    background: color-mix(in srgb, var(--m-green) 11%, transparent);
}

html[data-theme="biznes"] .diler-ikon-tugma {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; flex: 0 0 auto;
    border: 1px solid var(--m-line-2); border-radius: var(--m-r-sm);
    cursor: pointer; color: var(--m-muted); background: transparent;
    transition: background-color .16s var(--m-ease), border-color .16s var(--m-ease), color .16s var(--m-ease);
}
html[data-theme="biznes"] .diler-ikon-xavf:hover {
    color: var(--m-red);
    border-color: color-mix(in srgb, var(--m-red) 40%, transparent);
    background: color-mix(in srgb, var(--m-red) 10%, transparent);
}
html[data-theme="biznes"] .diler-yordamchi .diler-ikon-tugma { width: 30px; height: 30px; }

/* Muzlatilgan kartochka: style.css kulrang fon beradi, bu yerda
   mavzuga mos holga keltiramiz */
html[data-theme="biznes"] .diler-karta.frozen {
    background: color-mix(in srgb, var(--m-orange) 4%, var(--m-solid)) !important;
    border-color: color-mix(in srgb, var(--m-orange) 20%, var(--m-line)) !important;
    opacity: 1;
}

@media (max-width: 620px) {
    html[data-theme="biznes"] .diler-amal { min-height: 42px; }
    html[data-theme="biznes"] .diler-ikon-tugma { width: 42px; height: 42px; }
    html[data-theme="biznes"] .diler-saqlash { min-height: 42px; }
}

html[data-theme="biznes"][data-mode="dark"] .oylik-qirqilgan { color: var(--m-orange); }

/* style.css dagi .text-green-500 (#22c55e) oq fonda 2.3 edi */
html[data-theme="biznes"] .text-green-500 { color: var(--m-green-matn) !important; }

/* ==========================================================
   TRANZAKSIYALAR TARIXI — tur belgilari va summalar
   Ilgari ichki uslub edi (och fon + to'q matn). Tungi rejim fonni
   to'qlashtirar, matn esa to'qligicha qolib, ko'rinmay qolardi.
   Kunduzgi ranglar avvalgidek; tungi rejimda yorqin matn.
   ========================================================== */
html[data-theme="biznes"] .tur-belgi {
    display: inline-block; padding: 2px 8px; border-radius: 50px;
    font-size: .7rem; font-weight: 600;
}
html[data-theme="biznes"] .tur-summa { font-weight: 700; }

html[data-theme="biznes"] .tur-belgi.tur-qosh    { background: #d1fae5; color: #065f46; }
html[data-theme="biznes"] .tur-belgi.tur-daromad { background: #dbeafe; color: #2563eb; }
html[data-theme="biznes"] .tur-belgi.tur-xarajat { background: #f3e8ff; color: #6b21a8; }
html[data-theme="biznes"] .tur-belgi.tur-ayir    { background: #fee2e2; color: #991b1b; }

html[data-theme="biznes"] .tur-summa.tur-qosh    { color: var(--m-green-matn); }
html[data-theme="biznes"] .tur-summa.tur-daromad { color: #2563eb; }
html[data-theme="biznes"] .tur-summa.tur-xarajat { color: #a855f7; }
html[data-theme="biznes"] .tur-summa.tur-ayir    { color: #ef4444; }

html[data-theme="biznes"][data-mode="dark"] .tur-qosh    { --tur-rang: #32D583; }
html[data-theme="biznes"][data-mode="dark"] .tur-daromad { --tur-rang: #5AA9FF; }
html[data-theme="biznes"][data-mode="dark"] .tur-xarajat { --tur-rang: #B49CFF; }
html[data-theme="biznes"][data-mode="dark"] .tur-ayir    { --tur-rang: #FF6B61; }
html[data-theme="biznes"][data-mode="dark"] .tur-summa   { color: var(--tur-rang); }
html[data-theme="biznes"][data-mode="dark"] .tur-belgi {
    color: var(--tur-rang);
    background: color-mix(in srgb, var(--tur-rang) 18%, transparent);
}

/* ==========================================================
   TELEFON (620px gacha)
   1) Sahifa yon tomonga surilmasin — ikki aybdor bor edi:
      "Savdo nuqtalari | Taminotchilar" (319px) va kassadagi
      "← sana → Hisobot" qatori (444px). Ekranda esa 343px joy.
      Ikkinchisi tufayli "←" (oldingi kun) ekranning chap chetidan
      tashqarida qolib, telefonda umuman bosib bo'lmasdi.
   7) Barmoq uchun kattaroq tugmalar.
   8) Tor kartochkada yolg'iz qolgan "so'm" — kichik birlik.
   Kompyuterdagi ko'rinishga tegmaydi.
   ========================================================== */
@media (max-width: 620px) {
    /* 1a) Ikki tugma qolgan joyni teng bo'lib oladi */
    html[data-theme="biznes"] .savdo-toolbar-left { min-width: 0; flex: 1 1 100%; }
    html[data-theme="biznes"] .kind-switch { flex: 1 1 auto; min-width: 0; }
    html[data-theme="biznes"] .kind-switch-btn {
        flex: 1 1 0; min-width: 0; justify-content: center;
        padding: 8px 6px; font-size: .86rem; min-height: 44px;
    }

    /* 1b) Kassa: sana maydoni qolgan joyga moslashadi (ilgari brauzerning
       standart ~20 belgilik kengligini olardi — 252px) */
    html[data-theme="biznes"] .kassa-toolbar > .d-flex { width: 100%; }
    html[data-theme="biznes"] .kassa-toolbar .kalendar-maydon {
        flex: 1 1 0; min-width: 0 !important; width: auto !important;
    }

    /* 7) Barmoq uchun kattaroq tugmalar */
    html[data-theme="biznes"] #kassa-day-prev,
    html[data-theme="biznes"] #kassa-day-next,
    html[data-theme="biznes"] #btn-kunlik-hisobot,
    html[data-theme="biznes"] #btn-yop-ish-kuni,
    html[data-theme="biznes"] .kassa-toolbar .kalendar-maydon { min-height: 44px; }
    html[data-theme="biznes"] .top-nav .mode-toggle { width: 40px; height: 40px; }
    html[data-theme="biznes"] .user-chip-btn { min-height: 40px; }
    html[data-theme="biznes"] .davr-btn { min-height: 38px; }
    html[data-theme="biznes"] .savdo-sort-wrap select,
    html[data-theme="biznes"] .savdo-sort-wrap button { min-height: 40px; }
    /* Kartochkadagi kichik tugmalar ko'rinishda o'zgarmaydi —
       faqat bosiladigan maydoni atrofga kengayadi */
    html[data-theme="biznes"] .prognoz-btn,
    html[data-theme="biznes"] .oylik-btn { position: relative; }
    html[data-theme="biznes"] .prognoz-btn::after,
    html[data-theme="biznes"] .oylik-btn::after {
        content: ''; position: absolute; inset: -9px -4px;
    }

    /* 8) "so'm" — kichik birlik (raqam asosiy bo'lib qoladi) */
    html[data-theme="biznes"] .stat-birlik {
        font-size: .62em; font-weight: 650; color: var(--m-muted); letter-spacing: 0;
    }
    html[data-theme="biznes"] .stat-card--dark .stat-birlik { color: rgba(255,255,255,.6); }
}

/* Joriy qarz manfiy bo'lsa (ortiqcha to'langan) — yashil MATN, to'q tonda.
   Umumiy .text-success ga tegilmadi: u boshqa joylarda ham ishlatiladi. */
html[data-theme="biznes"] #total-debt-amount.text-success { color: var(--m-green-matn) !important; }
/* style.css dagi #total-debt-amount qoidasi (id — kuchliroq) harflar oralig'i
   va qalinlikni o'zgartirib, raqamni qo'shnilaridan 4px kengroq qilardi:
   "so'm" pastga tushib, butun qatorni cho'zardi. Qo'shnilari bilan tenglashadi. */
html[data-theme="biznes"] #total-debt-amount.stat-value { letter-spacing: -0.045em; font-weight: 720; }

/* ==========================================================
   YORDAMCHI PANELI — telefonda sarlavha sig'sin
   Ism + "Chiqish" bilan sarlavha ~495px edi: telefon sahifani 474px
   qilib chizar va "Chiqish" ekranning o'ng chetidan tashqarida qolardi.
   Biznes panelidagidek tor ekranda ism yashiriladi. Faqat .yordamchi-nav
   ga tegishli — boshqa panellarning sarlavhasi o'zgarmaydi.
   ========================================================== */
@media (max-width: 560px) {
    html[data-theme="biznes"] .yordamchi-nav { padding-left: 14px; padding-right: 14px; }
    html[data-theme="biznes"] .yordamchi-nav #user-name-display { display: none; }
    html[data-theme="biznes"] .yordamchi-nav .user-chip { padding-left: 4px; padding-right: 4px; }
    html[data-theme="biznes"] .yordamchi-nav #logout-btn { padding-left: 12px; padding-right: 12px; }
}

/* ==========================================================
   NUQTA JADVALI — eski yozuvlar ko'rsatilmaganda izoh
   Baza bir so'rovda ko'pi bilan 1000 qator beradi: undan eski yozuvlar
   jadvalda chiqmaydi (ularning qarzi esa "Joriy qarz"da hisobga olingan).
   Izoh faqat shunday nuqtada ko'rinadi — loadPointDetails boshqaradi.
   ========================================================== */
html[data-theme="biznes"] .yozuv-qirqildi {
    display: flex; gap: 10px; align-items: flex-start;
    margin-top: 14px; padding: 11px 14px;
    border-radius: var(--m-r-md, 12px);
    background: color-mix(in srgb, var(--m-blue) 8%, transparent);
    color: var(--m-ink-2); font-size: .84rem; line-height: 1.5;
}
html[data-theme="biznes"] .yozuv-qirqildi[hidden] { display: none; }
html[data-theme="biznes"] .yozuv-qirqildi svg { flex: none; margin-top: 2px; color: var(--m-blue); }
html[data-theme="biznes"] .yozuv-qirqildi b { color: var(--m-ink); font-weight: 650; }

/* ==========================================================================
   KO'RINISH TEKSHIRUVI TUZATISHLARI (2026-10-30)
   108 ta ekran (kompyuter/telefon × qora/oq) ko'rib chiqilgandan keyingi
   tuzatishlar. Raqamlar — hisobotdagi band raqami.
   ========================================================================== */

/* 10) Oynalar mazmuniga qarab o'lchanadi: 2 qatorli jadval yoki bo'sh
   bildirishnoma uchun butun ekran ochilmaydi. Mazmun ko'p bo'lsa — eng
   ko'pi ekran balandligigacha o'sadi va ichi aylanadi. */
html[data-theme="biznes"] .modern-modal-content { height: auto; max-height: 96vh; }
html[data-theme="biznes"] .modern-modal-body { min-height: 0; }
html[data-theme="biznes"] #bildirishnoma-modal .modern-modal-content,
html[data-theme="biznes"] #sozlamalar-modal .modern-modal-content,
html[data-theme="biznes"] #tez-orada-modal .modern-modal-content { max-width: 560px; }
@media (min-width: 768px) {
    /* ilgari oyna atay butun ekranga cho'zilardi (align-items: stretch) */
    html[data-theme="biznes"] #oylik-balans-modal { align-items: center; padding: 12px; }
    html[data-theme="biznes"] #oylik-balans-modal .modern-modal-content {
        height: auto; max-height: 96vh; max-width: 1400px;
        border-radius: var(--m-r-xl) !important;
        border: 1px solid var(--m-line-2) !important;
        box-shadow: var(--m-sh-4);
    }
}

/* 4) Oq rejimda "Balans taqsimoti" ham oq. Oynaning ranglari HTML va JS
   ichida qotirib yozilgan (faqat to'q fon uchun), shuning uchun oq
   rejimda ular shu yerda almashtiriladi. */
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal {
    background: linear-gradient(180deg, #F5F7FC 0%, #EBEFF7 100%) !important;
    color: var(--m-ink) !important;
}
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal input {
    background: var(--m-solid) !important;
    border: 1px solid var(--m-line-2) !important;
    color: var(--m-ink) !important;
    color-scheme: light !important;
}
html[data-theme="biznes"]:not([data-mode="dark"]) #breakdown-today-btn {
    background: var(--m-solid) !important; color: var(--m-ink) !important;
    box-shadow: var(--m-sh-1);
}
html[data-theme="biznes"]:not([data-mode="dark"]) #close-balance-breakdown,
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal [style*="#94a3b8"] { color: var(--m-muted) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal [style*="color: #64748b"] { color: var(--m-ink-2) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal [style*="border-top: 1px solid rgba(255,255,255"] { border-top-color: var(--m-line-2) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) #balance-breakdown-modal [style*="background: rgba(255,255,255,0.05)"] {
    background: var(--m-solid) !important; border-color: var(--m-line-2) !important;
}
html[data-theme="biznes"]:not([data-mode="dark"]) #breakdown-add-row { color: var(--m-blue) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) #breakdown-add-row > span:first-child { border-color: var(--m-blue) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) #breakdown-confirm-dialog > div {
    background: var(--m-solid) !important; color: var(--m-ink) !important; border-color: var(--m-line-2) !important;
}
html[data-theme="biznes"]:not([data-mode="dark"]) #breakdown-confirm-cancel { background: rgba(10,15,28,.06) !important; color: var(--m-ink) !important; }
html[data-theme="biznes"]:not([data-mode="dark"]) .breakdown-row:hover { background: rgba(10,15,28,.05); }

/* 5) Qora rejimda ta'minotchilar jamlanmasi ham to'q (avval oppoq qolardi) */
html[data-theme="biznes"][data-mode="dark"] #supplier-summary {
    background: color-mix(in srgb, var(--m-purple) 10%, var(--m-solid)) !important;
    border-color: color-mix(in srgb, var(--m-purple) 35%, transparent) !important;
}

/* 18) Oq rejimda "To'liq hisobot" kartasi qora emas — boshqalar bilan bir
   tusda, lekin och ko'k fon bilan ajralib turadi */
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark {
    background: linear-gradient(150deg, #EEF4FF 0%, #E3ECFF 100%);
    border-color: rgba(10,132,255,.22);
}
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-label { color: var(--m-muted); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-value { color: var(--m-ink); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-icon { background: rgba(10,132,255,.12); color: var(--m-blue); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .prognoz-btn { background: rgba(10,132,255,.1); color: var(--m-blue); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .prognoz-btn:hover { background: rgba(10,132,255,.18); color: var(--m-blue); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-birlik { color: var(--m-muted); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .oylik-btn { background: rgba(10,132,255,.1); color: var(--m-blue); border-color: rgba(10,132,255,.18); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .oylik-btn:hover { background: rgba(10,132,255,.18); color: var(--m-blue); }
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-izoh,
html[data-theme="biznes"]:not([data-mode="dark"]) .stat-card--dark .stat-osish.betaraf { color: var(--m-muted); }

/* 7) "Nuqtani o'chirish" — "Orqaga" bilan adashtirib bo'lmaydigan qizil matnli tugma.
   Qora rejimda u oddiy oq tugmaga aylanib qolgandi. */
html[data-theme="biznes"][data-mode="dark"] #btn-delete-point,
html[data-theme="biznes"][data-mode="dark"] .btn-danger-outline { color: var(--m-red); }
html[data-theme="biznes"] #btn-delete-point {
    background: transparent; border-color: color-mix(in srgb, var(--m-red) 35%, transparent);
}

/* 16) Tarix jadvalida summalar bir qatorda (kompyuterda "so'm" pastga tushardi) */
@media (min-width: 641px) {
    html[data-theme="biznes"] #entries-tbody td:nth-child(-n+6) { white-space: nowrap; }
    /* bir qatorga tushgan summalar jadvalni kengaytirmasin — kataklar biroz zichroq */
    html[data-theme="biznes"] #entries-tbody td,
    html[data-theme="biznes"] #entries-tbody ~ thead th,
    html[data-theme="biznes"] #view-point-details .table thead th { padding-left: 7px !important; padding-right: 7px !important; }
}

/* 8) Tarix: oxirgi kunlar, qolgani "Yana ko'rsatish" bilan */
html[data-theme="biznes"] #entries-tbody tr.tarix-yashirin { display: none !important; }
html[data-theme="biznes"] .tarix-yana {
    display: flex; justify-content: center; margin-top: 14px;
}
html[data-theme="biznes"] .tarix-yana[hidden] { display: none; }

/* 17) Izoh shablonlari: ro'yxat davomi borligi pastdagi soyadan bilinadi */
html[data-theme="biznes"] #presets-list {
    -webkit-mask-image: linear-gradient(#000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(#000 calc(100% - 26px), transparent);
    padding-bottom: 18px;
}

/* 11) Tayyor bo'lmagan menyu bandlari yashirin (.profil-element display:flex qiladi) */
html[data-theme="biznes"] .profil-element[hidden] { display: none; }

/* 12) Sarlavhadagi belgi — Repora «R» */
html[data-theme="biznes"] .brand-mark:has(img) { background: none !important; padding: 0 !important; box-shadow: none !important; overflow: hidden; }
html[data-theme="biznes"] .brand-mark img { display: block; width: 100%; height: 100%; border-radius: inherit; }

/* ==========================================================================
   TELEFON (620px gacha) — 2, 3, 6, 7, 9, 13
   ========================================================================== */
@media (max-width: 620px) {
    /* 2) Kassa: har bir yozuv — ixcham ikki qatorli qator.
       Yuqorida: nom | so'm.  Pastda: vaqt · turi | $.
       Ilgari "$" ustuni ekrandan chiqib ketib, dollarli yozuv summasiz ko'rinardi. */
    html[data-theme="biznes"] .kassa-table,
    html[data-theme="biznes"] .kassa-table tbody,
    html[data-theme="biznes"] .kassa-table tfoot { display: block; width: 100%; height: auto; }
    html[data-theme="biznes"] .kassa-table thead { display: none; }
    html[data-theme="biznes"] .kassa-table .kassa-spacer-row { display: none; }
    html[data-theme="biznes"] .kassa-table tr:has(> td:nth-child(5)) {
        display: grid; grid-template-columns: auto auto minmax(0,1fr) auto;
        column-gap: 8px; row-gap: 2px; align-items: baseline;
        padding: 9px 2px; border-bottom: 1px solid var(--m-line) !important;
    }
    html[data-theme="biznes"] .kassa-table tr:has(> td:nth-child(5)) > td { padding: 0 !important; border: 0 !important; }
    html[data-theme="biznes"] .kassa-table tr:has(> td:nth-child(5)) > td:empty { display: none; }
    /* Kirim: 1 vaqt, 2 turi, 3 nom, 4 so'm, 5 $ */
    html[data-theme="biznes"] #kassa-kirim-col tr > td:nth-child(3) { grid-column: 1 / 4; grid-row: 1; font-weight: 600; color: var(--m-ink); }
    html[data-theme="biznes"] #kassa-kirim-col tr > td:nth-child(4) { grid-column: 4; grid-row: 1; }
    html[data-theme="biznes"] #kassa-kirim-col tr > td:nth-child(5) { grid-column: 4; grid-row: 2; }
    html[data-theme="biznes"] #kassa-kirim-col tr > td:nth-child(1) { grid-column: 1; grid-row: 2; }
    html[data-theme="biznes"] #kassa-kirim-col tr > td:nth-child(2) { grid-column: 2; grid-row: 2; }
    /* Chiqim: 1 $, 2 so'm, 3 nom, 4 turi, 5 vaqt */
    html[data-theme="biznes"] #kassa-chiqim-col tr > td:nth-child(3) { grid-column: 1 / 4; grid-row: 1; font-weight: 600; color: var(--m-ink); }
    html[data-theme="biznes"] #kassa-chiqim-col tr > td:nth-child(2) { grid-column: 4; grid-row: 1; }
    html[data-theme="biznes"] #kassa-chiqim-col tr > td:nth-child(1) { grid-column: 4; grid-row: 2; }
    html[data-theme="biznes"] #kassa-chiqim-col tr > td:nth-child(5) { grid-column: 1; grid-row: 2; }
    html[data-theme="biznes"] #kassa-chiqim-col tr > td:nth-child(4) { grid-column: 2; grid-row: 2; }
    /* summalar o'ngda, bir qatorda; vaqt va tur — kichik kulrang */
    html[data-theme="biznes"] #kassa-kirim-col tbody td:nth-child(4),
    html[data-theme="biznes"] #kassa-kirim-col tbody td:nth-child(5),
    html[data-theme="biznes"] #kassa-chiqim-col tbody td:nth-child(1),
    html[data-theme="biznes"] #kassa-chiqim-col tbody td:nth-child(2),
    html[data-theme="biznes"] #kassa-kirim-col tfoot td:nth-child(4),
    html[data-theme="biznes"] #kassa-kirim-col tfoot td:nth-child(5),
    html[data-theme="biznes"] #kassa-chiqim-col tfoot td:nth-child(1),
    html[data-theme="biznes"] #kassa-chiqim-col tfoot td:nth-child(2) {
        text-align: right !important; white-space: nowrap; font-weight: 650; font-variant-numeric: tabular-nums;
    }
    html[data-theme="biznes"] #kassa-kirim-col tbody td:nth-child(5):not(:empty)::before,
    html[data-theme="biznes"] #kassa-chiqim-col tbody td:nth-child(1):not(:empty)::before { content: "$"; }
    html[data-theme="biznes"] #kassa-kirim-col tbody td:nth-child(1),
    html[data-theme="biznes"] #kassa-kirim-col tbody td:nth-child(2),
    html[data-theme="biznes"] #kassa-chiqim-col tbody td:nth-child(4),
    html[data-theme="biznes"] #kassa-chiqim-col tbody td:nth-child(5) { font-size: .8rem; color: var(--m-muted); }

    /* 6) Kassa tugmalari: Kirim va Chiqim yonma-yon, sana ostida */
    html[data-theme="biznes"] .kassa-toolbar {
        display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px;
    }
    html[data-theme="biznes"] .kassa-toolbar > #btn-kassa-add { grid-column: 1; grid-row: 1; min-height: 44px; }
    html[data-theme="biznes"] .kassa-toolbar > #btn-kassa-sub { grid-column: 2; grid-row: 1; min-height: 44px; }
    html[data-theme="biznes"] .kassa-toolbar > .d-flex { grid-column: 1 / -1; grid-row: 2; }

    /* 3) Hisobot oynalari: sarlavha bitta qator, filtr va sana ostida, sana sig'adi */
    html[data-theme="biznes"] .modern-modal-header { flex-wrap: wrap; gap: 10px; padding: 14px 16px; }
    html[data-theme="biznes"] .modern-modal-header > div:first-child { min-width: 0; flex: 1 1 100%; }
    html[data-theme="biznes"] .modern-modal-header > div:first-child h3 {
        font-size: 1.05rem !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
    }
    html[data-theme="biznes"] .modern-modal-header > div:nth-child(2) { flex: 1 1 100%; min-width: 0; flex-wrap: nowrap !important; }
    html[data-theme="biznes"] .modern-modal-header .modern-date-picker { flex: 1 1 auto; min-width: 0; padding: 6px 10px; }
    /* "SANA ORALIG'I" yozuvi telefonda joy olardi — maydonning o'zi sanadan bilinadi */
    html[data-theme="biznes"] .modern-modal-header .modern-date-picker > span { display: none !important; }
    html[data-theme="biznes"] .modern-modal-header .modern-filter-btn { white-space: nowrap; }
    html[data-theme="biznes"] .modern-modal-header .kalendar-maydon {
        width: 100% !important; min-width: 0 !important; font-size: .82rem !important; padding-inline: 4px !important; text-align: center; letter-spacing: -0.01em;
    }
    html[data-theme="biznes"] .modern-modal-header .modern-date-picker input { min-width: 0; width: 100%; }
    /* jadval yonga suriladi — o'ng chetdagi xiralashish davomi borligini bildiradi
       (oxiriga yetganda yo'qoladi; eski brauzerlarda shunchaki chiqmaydi) */
    html[data-theme="biznes"] .modern-table-container { overflow-x: auto; }
    @supports (animation-timeline: scroll(self inline)) {
        html[data-theme="biznes"] .modern-table-container {
            -webkit-mask-image: linear-gradient(to right, #000 calc(100% - var(--chet-soya)), transparent);
            mask-image: linear-gradient(to right, #000 calc(100% - var(--chet-soya)), transparent);
            animation: chet-soya linear both; animation-timeline: scroll(self inline);
        }
    }

    /* 13) Barmoq uchun: orqaga tugmasi, kassa oynasidagi tanlagichlar, kirish havolalari */
    html[data-theme="biznes"] .modern-btn-icon { flex: none; width: 40px; height: 40px; }
    html[data-theme="biznes"] .modal input[type="radio"],
    html[data-theme="biznes"] .modal input[type="checkbox"] { width: 20px; min-width: 20px; height: 20px; flex: none; }
    /* parolni ko'rsatish "ko'z"i — ko'rinishi o'zgarmaydi, bosiladigan joyi kattaroq */
    html[data-theme="biznes"] .pw-toggle::after { content: ""; position: absolute; inset: -6px; }
    /* tranzaksiyalar tarixidagi saralash/filtr maydonlari */
    html[data-theme="biznes"] #dealer-history-modal select.form-control,
    html[data-theme="biznes"] #history-note-filter-btn { min-height: 40px; }
    html[data-theme="biznes"] .karta-tag a { display: inline-block; padding-block: 10px; }

    /* 7) Nuqta sahifasi: "Orqaga" va "O'chirish" bitta qatorda, kichik */
    html[data-theme="biznes"] #view-point-details .widget-card > .d-flex.justify-between.mb-3 {
        flex-direction: row !important; align-items: center !important;
    }
    html[data-theme="biznes"] #view-point-details .widget-card > .d-flex.justify-between.mb-3 > button { width: auto !important; min-height: 40px; }
    html[data-theme="biznes"] #btn-delete-point { font-size: .85rem; padding-inline: 12px; }

    /* 9) "Kichik" ro'yxat: nom va qarz bitta qatorda, manzil ostida kichik */
    html[data-theme="biznes"] .dealer-list-item { align-items: center; gap: 10px; }
    html[data-theme="biznes"] .dealer-list-left { min-width: 0; flex: 1 1 auto; }
    html[data-theme="biznes"] .dealer-list-name { min-width: 0; line-height: 1.3; }
    html[data-theme="biznes"] .dealer-list-location {
        display: block; font-size: .78rem; color: var(--m-muted);
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    /* o'ng tomon ustun: qarz tepada, sana ostida (yonma-yon bo'lsa nomni bosib ketardi) */
    html[data-theme="biznes"] .dealer-list-right { flex: none; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
    html[data-theme="biznes"] .dealer-list-debt { white-space: nowrap; font-size: .9rem; }
    html[data-theme="biznes"] .dealer-list-date { white-space: nowrap; font-size: .72rem; }
}
@property --chet-soya { syntax: "<length>"; inherits: false; initial-value: 0px; }
@keyframes chet-soya { from { --chet-soya: 36px; } to { --chet-soya: 0px; } }

/* 9) Ro'yxat ko'rinishi: kompyuterda manzil avvalgidek qavs ichida, telefonda alohida qatorda */
@media (min-width: 621px) {
    html[data-theme="biznes"] .dealer-list-location::before { content: "["; }
    html[data-theme="biznes"] .dealer-list-location::after { content: "]"; }
}