/* =========================================================
   MMIR — Neumorphism (Soft UI) qatlami
   ---------------------------------------------------------
   style.css dan KEYIN ulanadi. Ranglar logoga mos (qizigan po'lat — olovrang,
   qora metall panel, aksentlar) — faqat shakl va soyalar:
     • element fon bilan bir xil rangda, chegara yo'q
     • bo'rtib chiqqan holat: yorug' soya (yuqori-chap) + qorong'i soya (past-o'ng)
     • bosilgan holat (inputlar, faol tugma/tab): "ichkariga botgan" inset soya
   O'chirish uchun: index.html dan neumorphism.css qatorini olib tashlang.
   ========================================================= */

:root {
    /* Yorug' qism (ish sahifalari) — #f8fafc slate oilasidagi biroz to'qroq tus,
       oq fonda yorug' soya ko'rinmaydi */
    --neu-bg: #eef0f3;
    --neu-light: rgba(255, 255, 255, 0.95);
    --neu-dark: rgba(172, 178, 190, 0.55);
    --neu-raised: 9px 9px 18px var(--neu-dark), -9px -9px 18px var(--neu-light);
    --neu-raised-sm: 5px 5px 10px var(--neu-dark), -5px -5px 10px var(--neu-light);
    --neu-raised-xs: 3px 3px 6px var(--neu-dark), -3px -3px 6px var(--neu-light);
    --neu-inset: inset 5px 5px 10px var(--neu-dark), inset -5px -5px 10px var(--neu-light);
    --neu-inset-sm: inset 3px 3px 6px var(--neu-dark), inset -3px -3px 6px var(--neu-light);

    /* To'q qism (yon panel, login) — #121316 asosida */
    --neu-d-bg: #2a2e35;
    --neu-d-dark: rgba(14, 15, 18, 0.55);
    --neu-d-light: rgba(110, 118, 132, 0.40);
    --neu-d-raised: 7px 7px 14px var(--neu-d-dark), -6px -6px 14px var(--neu-d-light);
    --neu-d-raised-sm: 4px 4px 9px var(--neu-d-dark), -4px -4px 9px var(--neu-d-light);
    --neu-d-inset: inset 4px 4px 9px var(--neu-d-dark), inset -4px -4px 9px var(--neu-d-light);

    --neu-radius: 20px;
    --neu-radius-sm: 14px;
    --neu-green-glow: 0 0 0 3px rgba(249, 115, 22, 0.18);
}

/* ---------- Asos ---------- */
body {
    background: var(--neu-bg);
    background-image: none;
}
::-webkit-scrollbar-track { background: var(--neu-bg); }
::-webkit-scrollbar-thumb { background: #c5c7cc; }

/* ---------- Yon panel (to'q neumorphism) ---------- */
.sidebar {
    background: var(--neu-d-bg);
    border-right: 0;
    box-shadow: 6px 0 24px rgba(0, 0, 0, 0.35);
}
.logo-container,
.sidebar-footer {
    border-color: rgba(255, 255, 255, 0.05);
}
.nav-btn {
    margin: 3px 0;
    border: 0;
    border-radius: var(--neu-radius-sm);
    background: var(--neu-d-bg);
    transition: box-shadow 0.25s var(--ease), color 0.2s ease, transform 0.2s var(--ease);
}
.nav-btn:hover {
    background: var(--neu-d-bg);
    box-shadow: var(--neu-d-raised-sm);
    color: #fff;
}
.nav-btn[class*="active-"] {
    background: var(--neu-d-bg);
    border-color: transparent;
    box-shadow: var(--neu-d-inset);
    color: #fb923c;
}
.nav-btn[class*="active-"] i {
    color: #fb923c;
    filter: drop-shadow(0 0 6px rgba(251, 146, 60, 0.55));
}
.user-role-badge {
    box-shadow: var(--neu-d-raised-sm);
}
.sidebar-footer .btn-outline-danger {
    border: 0;
    border-radius: var(--neu-radius-sm);
    background: var(--neu-d-bg);
    box-shadow: var(--neu-d-raised-sm);
    color: #f87171;
}
.sidebar-footer .btn-outline-danger:hover {
    background: var(--neu-d-bg);
    color: #fca5a5;
}
.sidebar-footer .btn-outline-danger:active {
    box-shadow: var(--neu-d-inset);
}

/* ---------- Yuqori panel ---------- */
.topbar {
    background: rgba(228, 229, 232, 0.88);
    border-bottom: 0;
    box-shadow: 0 6px 14px rgba(158, 161, 170, 0.35), 0 -1px 0 rgba(255, 255, 255, 0.9) inset;
}
.topbar-clock {
    border: 0;
    background: var(--neu-bg);
    box-shadow: var(--neu-inset-sm);
}
.topbar .border-start {
    border-color: transparent !important;
}

/* ---------- Kartochkalar ---------- */
.custom-card,
.list-container,
.kpi-card,
.stat-card-box,
.worker-row,
.material-requirement-card {
    background: var(--neu-bg) !important;
    border: 0 !important;
    border-radius: var(--neu-radius);
    box-shadow: var(--neu-raised) !important;
}
.custom-card:hover {
    box-shadow: var(--neu-raised) !important;
}
.kpi-card:hover,
.worker-row:hover {
    transform: translateY(-2px);
    box-shadow: 12px 12px 22px var(--neu-dark), -12px -12px 22px var(--neu-light) !important;
}
/* KPI kartochkalar: yuqoridagi rangli chiziq o'rniga yumshoq rangli nuqta-chiziq */
.kpi-card::before {
    left: 22px;
    right: auto;
    width: 46px;
    height: 4px;
    top: 12px;
    border-radius: 999px;
}
.kpi-icon {
    border-radius: 14px;
    background: var(--neu-bg) !important;
    box-shadow: var(--neu-raised-xs);
}
.card-header-clean {
    border-bottom-color: rgba(158, 161, 170, 0.35);
}
.stat-card-box h3 {
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8);
}

/* Karta ichidagi "bg-light / bg-white + border" bloklar — botgan panel */
.main-content .bg-light.border,
.main-content .bg-white.border,
.main-content .bg-light.rounded,
.main-content .bg-white.rounded,
.custom-modal-box .bg-light.border,
.custom-modal-box .bg-white.border,
.custom-modal-box .bg-light.rounded,
.custom-modal-box .bg-white.rounded {
    background: var(--neu-bg) !important;
    border: 0 !important;
    border-radius: var(--neu-radius-sm) !important;
    box-shadow: var(--neu-inset-sm) !important;
}
.main-content .custom-card.bg-white,
.main-content .bg-white:not(.border):not(.rounded) {
    background: var(--neu-bg) !important;
}

/* ---------- Formalar: inputlar ichkariga botgan ---------- */
.main-content .form-control,
.main-content .form-select,
.custom-modal-box .form-control,
.custom-modal-box .form-select {
    border: 0;
    border-radius: 12px;
    background-color: var(--neu-bg);
    box-shadow: var(--neu-inset-sm);
    transition: box-shadow 0.2s ease;
}
.main-content .form-control:hover,
.main-content .form-select:hover {
    border: 0;
}
.main-content .form-control:focus,
.main-content .form-select:focus,
.custom-modal-box .form-control:focus,
.custom-modal-box .form-select:focus {
    background-color: var(--neu-bg);
    box-shadow: var(--neu-inset-sm), var(--neu-green-glow);
}
.main-content .form-control[readonly] {
    background-color: var(--neu-bg);
    box-shadow: var(--neu-inset);
}
.main-content .input-group-text {
    border: 0;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-xs);
}
.form-check-input {
    border: 0;
    background-color: var(--neu-bg);
    box-shadow: var(--neu-inset-sm);
}
.form-check-input:checked {
    background-color: var(--primary);
    box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2), 0 0 8px rgba(249, 115, 22, 0.4);
}

/* ---------- Tugmalar ---------- */
/* Rangli (asosiy) tugmalar — rang saqlanadi, yumshoq bo'rtiq soya */
.btn-green,
.btn-orange,
.btn-primary,
.btn-danger,
.btn-success,
.btn-dark,
.btn-secondary {
    border: 0;
    border-radius: 12px;
    box-shadow: var(--neu-raised-sm);
    transition: transform 0.15s var(--ease), box-shadow 0.2s ease, filter 0.2s ease;
}
.btn-green:hover,
.btn-orange:hover,
.btn-primary:hover,
.btn-danger:hover,
.btn-success:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
    box-shadow: 7px 7px 14px var(--neu-dark), -7px -7px 14px var(--neu-light);
}
.btn-green:active,
.btn-orange:active,
.btn-primary:active,
.btn-danger:active,
.btn-success:active,
.btn-dark:active,
.btn-secondary:active {
    transform: translateY(0);
    box-shadow: inset 3px 3px 7px rgba(0, 0, 0, 0.25), inset -2px -2px 5px rgba(255, 255, 255, 0.15) !important;
}
/* Konturli / ikkinchi darajali tugmalar — fon rangida, matn rangli */
.main-content .btn-outline-primary,
.main-content .btn-outline-danger,
.main-content .btn-outline-success,
.main-content .btn-outline-secondary,
.main-content .btn-outline-custom,
.custom-modal-box .btn-outline-danger,
.custom-modal-box .btn-outline-secondary,
.custom-modal-box .btn-outline-custom,
.btn-quick-action {
    border: 0 !important;
    border-radius: 12px;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-xs);
    transition: box-shadow 0.2s ease, transform 0.15s var(--ease), color 0.2s ease;
}
.main-content .btn-outline-primary { color: var(--accent); }
.main-content .btn-outline-danger,
.custom-modal-box .btn-outline-danger { color: var(--danger); }
.main-content .btn-outline-success { color: var(--primary); }
.main-content .btn-outline-primary:hover,
.main-content .btn-outline-danger:hover,
.main-content .btn-outline-success:hover,
.main-content .btn-outline-secondary:hover,
.main-content .btn-outline-custom:hover,
.custom-modal-box .btn-outline-danger:hover,
.custom-modal-box .btn-outline-secondary:hover,
.custom-modal-box .btn-outline-custom:hover,
.btn-quick-action:hover {
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-sm);
    transform: translateY(-1px);
}
.main-content .btn-outline-primary:hover { color: var(--accent); }
.main-content .btn-outline-danger:hover,
.custom-modal-box .btn-outline-danger:hover { color: var(--danger); }
.main-content .btn-outline-success:hover { color: var(--primary); }
.main-content .btn-outline-primary:active,
.main-content .btn-outline-danger:active,
.main-content .btn-outline-success:active,
.main-content .btn-outline-secondary:active,
.main-content .btn-outline-custom:active,
.btn-quick-action:active {
    box-shadow: var(--neu-inset-sm) !important;
    transform: translateY(0);
    background: var(--neu-bg) !important;
}
/* Tugmalar guruhi (tahrirlash / o'chirish) — bitta bo'rtiq blok */
.main-content .btn-group {
    border-radius: 12px;
    box-shadow: var(--neu-raised-xs);
}
.main-content .btn-group > .btn {
    box-shadow: none;
    border-radius: 0;
}
.main-content .btn-group > .btn:first-child { border-radius: 12px 0 0 12px; }
.main-content .btn-group > .btn:last-child { border-radius: 0 12px 12px 0; }
.main-content .btn-group > .btn:active { box-shadow: var(--neu-inset-sm) !important; }
.btn-remove-row {
    border: 0;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-xs);
}
.btn-remove-row:active { box-shadow: var(--neu-inset-sm); }

/* ---------- Jadvallar ---------- */
.table-responsive {
    border: 0;
    border-radius: var(--neu-radius-sm);
    background: var(--neu-bg);
    box-shadow: var(--neu-inset-sm);
    padding: 6px;
}
.table {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: transparent;
    background: transparent !important;
    border-collapse: separate;
    border-spacing: 0;
}
.table thead th:first-child { border-top-left-radius: 12px; }
.table thead th:last-child { border-top-right-radius: 12px; }
.table tbody td {
    background: transparent;
    border-color: rgba(158, 161, 170, 0.3);
}
.table-bordered > :not(caption) > * > * {
    border-color: rgba(158, 161, 170, 0.3);
}
.table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.45) !important;
}
.clickable-row:hover td {
    background-color: rgba(249, 115, 22, 0.07) !important;
}
.row-low-stock {
    background-color: rgba(220, 38, 38, 0.06) !important;
}
.main-content .table-light,
.main-content .table-light > * {
    --bs-table-bg: rgba(255, 255, 255, 0.35);
}

/* ---------- Tablar ---------- */
.tab-bar {
    gap: 10px;
    padding: 12px;
    border-bottom: 0;
    background: var(--neu-bg);
}
.ombor-tab,
.worker-tab {
    border-radius: 12px;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-xs);
    transition: box-shadow 0.2s ease, color 0.2s ease;
}
.ombor-tab:hover,
.worker-tab:hover {
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-sm);
}
.ombor-tab.active,
.worker-tab.active {
    background: var(--neu-bg);
    box-shadow: var(--neu-inset-sm);
    color: var(--primary-dark);
}
.ombor-tab.active::after,
.worker-tab.active::after {
    display: none;
}

/* ---------- BOM / ish turi qatorlari ---------- */
.bom-row,
.job-row {
    border: 0;
    border-radius: 12px;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-xs);
}

/* ---------- Avatar va kichik elementlar ---------- */
.worker-avatar-chip {
    border: 0;
    background: var(--neu-bg) !important;
    box-shadow: var(--neu-raised-xs);
}
.pulse-badge {
    box-shadow: var(--neu-raised-xs);
}

/* ---------- Modal oynalar ---------- */
.custom-modal-overlay {
    background: rgba(20, 21, 24, 0.45);
}
.custom-modal-box {
    border: 0;
    border-radius: 24px;
    background: var(--neu-bg);
    box-shadow: 14px 14px 30px rgba(8, 8, 10, 0.35), -10px -10px 24px rgba(255, 255, 255, 0.35);
}
.custom-modal-box .border-bottom,
.custom-modal-box .border-top {
    border-color: rgba(158, 161, 170, 0.4) !important;
}

/* ---------- Bildirishnoma ---------- */
.custom-toast {
    border: 0;
    border-radius: 16px;
    box-shadow: 8px 8px 20px rgba(8, 8, 10, 0.3), -4px -4px 12px rgba(255, 255, 255, 0.4);
}

/* ---------- Yuklanish oynasi ---------- */
.spinner-box {
    border: 0;
    background: var(--neu-d-bg);
    box-shadow: var(--neu-d-raised);
}

/* ---------- Login sahifasi (to'q neumorphism) ---------- */
.auth-card {
    border: 0;
    background: var(--neu-d-bg);
    backdrop-filter: none;
    box-shadow: 14px 14px 30px rgba(0, 0, 0, 0.7), -10px -10px 26px rgba(78, 80, 88, 0.35);
}
.auth-card .form-control {
    border: 0;
    border-radius: 12px;
    background: var(--neu-d-bg);
    box-shadow: var(--neu-d-inset);
}
.auth-card .form-control:focus {
    background: var(--neu-d-bg);
    box-shadow: var(--neu-d-inset), 0 0 0 3px rgba(251, 146, 60, 0.25);
}
.auth-card .input-group-text {
    border: 0 !important;
    border-radius: 12px 0 0 12px;
    background: var(--neu-d-bg) !important;
    box-shadow: var(--neu-d-raised-sm);
    color: #fb923c !important;
}
.auth-card .input-group .form-control {
    border-radius: 0 12px 12px 0;
}
.auth-card .btn-green {
    box-shadow: var(--neu-d-raised-sm);
}
.auth-card .btn-green:hover {
    box-shadow: 6px 6px 14px rgba(0, 0, 0, 0.75), -5px -5px 12px rgba(78, 80, 88, 0.45), 0 0 18px rgba(249, 115, 22, 0.35);
}
.auth-card .btn-green:active {
    box-shadow: inset 3px 3px 8px rgba(0, 0, 0, 0.4) !important;
}
.auth-card .alert {
    border: 0;
    border-radius: 12px;
    box-shadow: var(--neu-d-inset);
}

/* ---------- Mobil ---------- */
@media (max-width: 576px) {
    :root {
        --neu-raised: 6px 6px 12px var(--neu-dark), -6px -6px 12px var(--neu-light);
    }
    .table-responsive { padding: 3px; }
}

/* ---------- Chop etish: soyalarsiz ---------- */
@media print {
    body { background: #fff; }
    .custom-card, .stat-card-box, .table-responsive, .worker-row { box-shadow: none !important; background: #fff !important; }
}

/* =========================================================
   "Qizigan po'lat" uslubi — yangi MMIR logosiga mos
   (qora metall, kumushrang po'lat, olovrang cho'g')
   ========================================================= */
:root {
    --forge: #ea580c;
    --forge-light: #f97316;
    --forge-glow: rgba(249, 115, 22, 0.45);
    --steel-1: #5b616b;
    --steel-2: #353940;
    --steel-3: #1f2227;
}

/* Yon panel: qora metall, ingichka olovrang chiziq */
.sidebar {
    background: linear-gradient(180deg, #30353d 0%, #23272d 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}
.sidebar-logo { filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.45)); }
.nav-btn[class*="active-"] {
    color: #fdba74;
    box-shadow: var(--neu-d-inset), inset 3px 0 0 var(--forge-light);
}
.nav-btn[class*="active-"] i { color: #fb923c; filter: drop-shadow(0 0 7px var(--forge-glow)); }

/* Sarlavha belgilari va "primary" matn — cho'g' rangi */
.text-primary { color: var(--forge) !important; }

/* Asosiy tugmalar — po'lat */
.btn-primary {
    color: #fff;
    border: 0;
    background: linear-gradient(180deg, var(--steel-1), var(--steel-2));
    box-shadow: var(--neu-raised-sm);
}
.btn-primary:hover, .btn-primary:focus {
    color: #fff;
    background: linear-gradient(180deg, #6b717c, #3d4149);
    box-shadow: var(--neu-raised-sm), 0 0 0 3px rgba(249, 115, 22, 0.18);
}
.btn-primary:active { background: linear-gradient(180deg, var(--steel-2), var(--steel-1)); }
.bg-primary { background-color: var(--steel-2) !important; }
.btn-outline-primary { color: var(--steel-2); border-color: transparent; }
.btn-outline-primary:hover { color: #fff; background: var(--steel-2); }

/* Brend tugma (oldin yashil) — cho'g' gradienti */
.btn-green {
    color: #fff;
    border: 0;
    background: linear-gradient(180deg, #ff8a2b, #ea580c);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}
.btn-green:hover { color: #fff; background: linear-gradient(180deg, #ff8a33, #d4500f); box-shadow: 0 8px 22px var(--forge-glow); }

/* Kirish sahifasi: logo ostida cho'g' nuri */
.auth-brand-logo { filter: drop-shadow(0 14px 34px rgba(0, 0, 0, 0.5)); }

/* Yon paneldagi logo kattaroq — yangi logoda yozuv rasmning o'zida */
.sidebar-logo { width: 100%; max-width: 165px; height: auto; }

/* =========================================================
   Yuklanish: butun ekranni xiralashtirmaydi — tepada ingichka chiziq
   ========================================================= */
.loader-overlay {
    inset: 0 0 auto 0;
    height: 3px;
    display: block;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
    overflow: hidden;
}
.loader-overlay .spinner-box { display: none; }
.loader-overlay::before {
    content: "";
    position: absolute;
    top: 0;
    left: -40%;
    width: 40%;
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, transparent, #f97316, #fdba74, #f97316, transparent);
    box-shadow: 0 0 10px rgba(249, 115, 22, 0.7);
    animation: loaderSlide 1s ease-in-out infinite;
}
@keyframes loaderSlide { to { left: 100%; } }

/* =========================================================
   Ixcham menyu (o'rtacha kattalik, tekis bandlar)
   ========================================================= */
.logo-container { padding: 2px 8px 12px; }
.sidebar-logo { max-width: 128px; }
.logo-container .mt-3 { margin-top: 0.5rem !important; }
.user-role-badge { font-size: 0.7rem; padding: 4px 12px; }
.nav-menu { gap: 1px; padding-top: 10px; }
.nav-btn {
    margin: 0;
    padding: 9px 12px;
    gap: 10px;
    font-size: 0.88rem;
    font-weight: 500;
    color: #c9ced6;
    border-radius: 8px;
    background: transparent;
    box-shadow: none;
}
.nav-btn i { width: 18px; font-size: 0.9rem; }
.nav-btn:hover {
    transform: none;
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
    box-shadow: none;
}
.nav-btn[class*="active-"] {
    color: #fff;
    background: linear-gradient(180deg, #f97316, #ea580c);
    box-shadow: 0 4px 12px rgba(234, 88, 12, 0.35);
}
.nav-btn[class*="active-"] i { color: #fff; filter: none; }
.nav-btn.nav-sub { padding: 7px 10px; font-size: 0.84rem; }
.nav-group-items { margin: 1px 0 4px 18px; padding-left: 8px; gap: 1px; }
.nav-num { width: 18px; height: 18px; font-size: 0.68rem; }
.nav-btn[class*="active-"] .nav-num { color: #ea580c; background: #fff; }
.sidebar-footer { padding-top: 10px; }
.sidebar-footer .btn { padding: 7px 10px !important; font-size: 0.85rem; }

/* Telefon/planshetdagi menyu tugmasi */
.mobile-nav-toggle {
    border: 0;
    border-radius: 10px;
    background: var(--neu-bg);
    box-shadow: var(--neu-raised-sm);
    color: #2a2e35;
}

/* =========================================================
   Aylantirish chiziqlari (scrollbar): odatda ko'rinmaydi,
   sichqoncha kelganda chiqadi, ketganda yana yashirinadi.
   Joyi doim band (scrollbar-gutter) — sahifa kengligi o'zgarmaydi.
   ========================================================= */
html, .nav-menu, .table-responsive, .custom-modal-box {
    scrollbar-gutter: stable;
}
/* Firefox */
html, .nav-menu, .table-responsive { scrollbar-width: thin; scrollbar-color: transparent transparent; }
html.show-scroll { scrollbar-color: #b9bec7 transparent; }
.nav-menu:hover { scrollbar-color: rgba(255, 255, 255, 0.28) transparent; }
.table-responsive:hover { scrollbar-color: #b9bec7 transparent; }
/* Chrome, Edge, Yandex */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
html.show-scroll::-webkit-scrollbar-thumb { background-color: #b9bec7; }
html.show-scroll::-webkit-scrollbar-thumb:hover { background-color: #9aa0aa; }
.nav-menu:hover::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.28); }
.table-responsive:hover::-webkit-scrollbar-thumb,
.custom-modal-box:hover::-webkit-scrollbar-thumb { background-color: #b9bec7; }

/* =========================================================
   Yig'iladigan yon panel (kompyuterda):
   odatda faqat belgilar (ingichka), sichqoncha kelganda nomlari bilan
   kengayib chiqadi (kontent ustidan), ketganda yana yig'iladi.
   Kontent hech qachon siljimaydi.
   ========================================================= */
@media (min-width: 993px) {
    .sidebar {
        width: 64px;
        padding: 12px 8px;
        overflow: hidden;
        box-shadow: none;
        transition: width 0.22s var(--ease), box-shadow 0.22s ease;
    }
    .sidebar:hover {
        width: 260px;
        box-shadow: 14px 0 40px rgba(15, 17, 20, 0.38);
    }
    .main-wrapper { margin-left: 64px; }
    .nav-btn, .sidebar-footer .btn, .user-role-badge { white-space: nowrap; }

    /* --- Yig'ilgan holat --- */
    .sidebar:not(:hover) .logo-container { padding: 0 0 10px; }
    .sidebar:not(:hover) .sidebar-logo { max-width: 46px; }
    .sidebar:not(:hover) .user-role-badge { font-size: 0; padding: 5px 7px; }
    .sidebar:not(:hover) .user-role-badge i { font-size: 0.72rem; margin: 0 !important; }
    .sidebar:not(:hover) .nav-menu { overflow: hidden; scrollbar-gutter: auto; }
    .sidebar:not(:hover) .nav-btn {
        justify-content: center;
        gap: 0;
        padding: 10px 0;
        font-size: 0;
    }
    .sidebar:not(:hover) .nav-btn i { font-size: 0.95rem; }
    .sidebar:not(:hover) .nav-caret,
    .sidebar:not(:hover) .nav-num,
    .sidebar:not(:hover) .nav-group-items { display: none !important; }
    .sidebar:not(:hover) .nav-count {
        position: absolute;
        top: 3px;
        right: 4px;
        min-width: 16px;
        height: 16px;
        padding: 0 4px;
        font-size: 0.6rem;
    }
    /* Faol sahifa papka ichida bo'lsa — papka belgisi olovrang */
    .sidebar:not(:hover) .nav-group.has-active > .nav-group-toggle {
        color: #fff;
        background: linear-gradient(180deg, #f97316, #ea580c);
        box-shadow: 0 4px 12px rgba(234, 88, 12, 0.35);
    }
    .sidebar:not(:hover) .sidebar-footer .btn { font-size: 0; padding: 8px 0 !important; }
    .sidebar:not(:hover) .sidebar-footer .btn i { font-size: 0.95rem; margin: 0 !important; }
}

/* Kirish sahifasida aylantirish chizig'i uchun joy ajratilmaydi (o'ngda oq yo'l qolmasin) */
html:has(#auth-screen[style*="flex"]) { scrollbar-gutter: auto; background: #22252b; }

/* Arxiv: 4 ta filtr tugmasi */
.sales-filter-btn {
    font-weight: 700;
    font-size: 0.95rem;
    padding: 8px 16px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    opacity: 0.72;
    box-shadow: var(--neu-raised-sm);
    transition: opacity 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.sales-filter-btn:hover { color: #fff; opacity: 0.95; transform: translateY(-1px); }
.sales-filter-btn.active { opacity: 1; box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.35), var(--neu-raised-sm); }
.btn-sf-archived { background: linear-gradient(180deg, #f97316, #ea580c); }
.btn-sf-all { background: linear-gradient(180deg, #22a06b, #16784f); }
.btn-sf-cash { background: linear-gradient(180deg, #4b5058, #2f3238); }
.btn-sf-card { background: linear-gradient(180deg, #22b5d0, #138aa3); }
.archived-badge { color: #fff; background: linear-gradient(180deg, #f97316, #ea580c); padding: 5px 9px; }

/* Arxiv qidiruvi: [Ism|Telefon|Mahsulot ▾] [🔍 ............] */
.archive-search {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 340px;
    min-width: 260px;
    max-width: 520px;
}
.archive-search > select {
    flex: 0 0 132px;
    height: 42px;
    border-radius: 12px;
}
.archive-search-field { position: relative; flex: 1 1 auto; }
.archive-search-field > i {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #64748b;
    pointer-events: none;
    z-index: 2;
}
.archive-search-field input,
.archive-search-field select {
    height: 42px;
    padding-left: 40px;
    border-radius: 12px;
    font-weight: 600;
}
/* Arxiv sarlavhasi bir qatorda: nom | qidiruv | sanalar */
#archive .card-header-clean { flex-wrap: nowrap; }
#archive .card-header-clean > h5 { flex: 0 0 auto; white-space: nowrap; }
#archive .card-header-clean > .d-flex { flex: 0 0 auto; flex-wrap: nowrap !important; }
#archive .card-header-clean input[type="date"] { width: 132px !important; }
.archive-search { flex: 1 1 300px; min-width: 200px; max-width: 460px; }
.archive-search > select { flex: 0 0 116px; }
@media (max-width: 1200px) { #archive .card-header-clean { flex-wrap: wrap; } }