/* =========================================================================
   NanoMed Design System — TDTU Termiz filiali
   Tibbiyot + nanotexnologiya estetikasi. Bitta manba, barcha sahifalar uchun.

   Tuzilishi:
     01. Dizayn tokenlari (ranglar, tipografika, radius, soya, harakat)
     02. Asosiy qatlam (base) va foydalanish imkoniyati (a11y)
     03. Nano-medikal naqshlar (panjara, EKG puls, molekula, DNK)
     04. Bootstrap 5.3 komponentlarini qayta ranglash
     05. Ilova komponentlari (sidebar, hero, metrika, jadval, portal, login)
     06. Qorong'i rejim (dark mode)
     07. Bosma (print) va responsiv
   ========================================================================= */

/* == 01. TOKENLAR ======================================================== */
:root {
    color-scheme: light;

    /* Klinik ko'k — asosiy identifikatsiya rangi (ishonch, tibbiyot) */
    --nm-primary-050: #eef6fd;
    --nm-primary-100: #d6e9fa;
    --nm-primary-200: #a9d0f3;
    --nm-primary-300: #6fb0e8;
    --nm-primary-400: #3a8ed6;
    --nm-primary-500: #1470b8;   /* asosiy */
    --nm-primary-600: #0f5c99;
    --nm-primary-700: #0c4a7c;
    --nm-primary-800: #0a3a61;
    --nm-primary-900: #072844;

    /* Bio-turkuaz — nanobio, sinxronizatsiya, ma'lumot oqimi */
    --nm-bio-050: #e8f8f6;
    --nm-bio-100: #c7efeb;
    --nm-bio-300: #6bd2c9;
    --nm-bio-500: #0e9e96;
    --nm-bio-600: #0b8079;
    --nm-bio-700: #08625d;

    /* Vital yashil — sog'lom holat, tasdiqlangan natija */
    --nm-vital-050: #e9f7ef;
    --nm-vital-100: #c9ecd9;
    --nm-vital-500: #16a46b;
    --nm-vital-600: #128455;
    --nm-vital-700: #0d6641;

    /* Kehribar — diqqat, kutilmoqda */
    --nm-alert-050: #fdf5e6;
    --nm-alert-100: #f9e6bd;
    --nm-alert-500: #c47f07;
    --nm-alert-600: #a06705;
    --nm-alert-700: #7d5104;

    /* Tibbiy qizil — kritik holat (tajovuzkor emas, klinik) */
    --nm-critical-050: #fdeef0;
    --nm-critical-100: #f9d3d8;
    --nm-critical-500: #c92f45;
    --nm-critical-600: #a72639;
    --nm-critical-700: #851d2c;

    /* Binafsha — ilmiy faoliyat aksenti */
    --nm-science-500: #6d5bd0;
    --nm-science-600: #574aad;

    /* Neytral shkala — steril oq va klinik kulrang */
    --nm-ink: #0b1f33;           /* asosiy matn */
    --nm-ink-soft: #2b4055;
    --nm-muted: #56697e;         /* AA: oq fonda 4.9:1 */
    --nm-faint: #7b8ca0;
    --nm-line: #d9e3ee;
    --nm-line-strong: #c2d1e0;
    --nm-surface: #ffffff;       /* kartalar */
    --nm-surface-2: #f7fafd;     /* ichki panellar */
    --nm-canvas: #eef4fa;        /* sahifa foni */
    --nm-inverse: #ffffff;

    /* Semantik taqsimlash */
    --nm-accent: var(--nm-primary-500);
    --nm-accent-strong: var(--nm-primary-700);
    --nm-focus: #1f8fd6;

    /* Tipografika */
    --nm-font: "Inter", "Segoe UI", ui-sans-serif, system-ui, -apple-system,
        "Helvetica Neue", "Noto Sans", Arial, sans-serif;
    --nm-font-mono: ui-monospace, SFMono-Regular, "JetBrains Mono", Menlo, monospace;
    --nm-fs-xs: .75rem;
    --nm-fs-sm: .8125rem;
    --nm-fs-base: .9375rem;
    --nm-fs-md: 1.0625rem;
    --nm-fs-lg: 1.375rem;
    --nm-fs-xl: 1.75rem;
    --nm-fs-2xl: clamp(1.85rem, 3.4vw, 2.6rem);
    --nm-fs-hero: clamp(2.1rem, 5vw, 3.9rem);

    /* Bo'shliq va shakl */
    --nm-space-1: .25rem;
    --nm-space-2: .5rem;
    --nm-space-3: .75rem;
    --nm-space-4: 1rem;
    --nm-space-5: 1.5rem;
    --nm-space-6: 2rem;
    --nm-radius-sm: 8px;
    --nm-radius: 12px;
    --nm-radius-lg: 18px;
    --nm-radius-pill: 999px;

    /* Soyalar — yumshoq, "klinik yorug'lik" */
    --nm-shadow-xs: 0 1px 2px rgba(11, 31, 51, .06);
    --nm-shadow-sm: 0 2px 8px rgba(11, 31, 51, .07);
    --nm-shadow: 0 8px 24px rgba(11, 31, 51, .08);
    --nm-shadow-lg: 0 18px 48px rgba(11, 31, 51, .12);
    --nm-ring: 0 0 0 3px rgba(31, 143, 214, .35);

    /* Harakat */
    --nm-motion-fast: .15s ease;
    --nm-motion: .24s cubic-bezier(.2, .7, .3, 1);

    /* Yarim shaffof yuzalar — eski sahifalardagi oq rgba fonlar o'rniga */
    --nm-glass: rgba(255, 255, 255, .92);
    --nm-glass-soft: rgba(255, 255, 255, .72);

    /* Naqsh intensivligi (qorong'i rejimda qayta belgilanadi) */
    --nm-mesh-line: rgba(20, 112, 184, .10);
    --nm-mesh-node: rgba(14, 158, 150, .22);
    --nm-mesh-node-2: rgba(20, 112, 184, .16);
}

/* == 02. BASE + A11Y ===================================================== */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }

body {
    margin: 0;
    min-height: 100vh;
    color: var(--nm-ink);
    background-color: var(--nm-canvas);
    font-family: var(--nm-font);
    font-size: var(--nm-fs-base);
    line-height: 1.55;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--nm-ink);
    font-weight: 700;
    letter-spacing: -.01em;
}

a { color: var(--nm-primary-600); text-underline-offset: 2px; }
a:hover { color: var(--nm-primary-700); }

/* Klaviatura fokusi hamma joyda ko'rinadi — sichqonchada bezovta qilmaydi. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--nm-focus);
    outline-offset: 2px;
    border-radius: var(--nm-radius-sm);
}

/* Ekran o'qigich uchun matn */
.nm-sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Kontentga o'tish havolasi — klaviaturada birinchi Tab */
.nm-skip-link {
    position: absolute;
    top: -60px;
    left: 12px;
    z-index: 2000;
    padding: 10px 16px;
    border-radius: var(--nm-radius-sm);
    background: var(--nm-primary-700);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transition: top var(--nm-motion-fast);
}
.nm-skip-link:focus { top: 12px; color: #fff; }

/* Barmoq uchun minimal nishon o'lchami (mobil, keksa foydalanuvchi) */
.nm-tap { min-height: 44px; min-width: 44px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

@media (prefers-contrast: more) {
    :root {
        --nm-muted: #33465a;
        --nm-line: #9db0c4;
        --nm-line-strong: #7e93a9;
    }
}

/* == 03. NANO-MEDIKAL NAQSHLAR =========================================== */
/* Molekulyar panjara: olti burchakli tarmoq + tugun nuqtalari. Fon
   sifatida juda past kontrastda ishlatiladi — matnni hech qachon
   o'qishga xalaqit bermaydi. */
.nm-mesh {
    position: relative;
    isolation: isolate;
}

.nm-mesh::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        linear-gradient(60deg, transparent 0 49.2%, var(--nm-mesh-line) 49.2% 50.2%, transparent 50.2%),
        linear-gradient(-60deg, transparent 0 49.2%, var(--nm-mesh-line) 49.2% 50.2%, transparent 50.2%),
        radial-gradient(circle at 14px 14px, var(--nm-mesh-node) 0 2px, transparent 2.6px),
        radial-gradient(circle at 62px 48px, var(--nm-mesh-node-2) 0 2px, transparent 2.6px);
    background-size: 96px 96px, 96px 96px, 96px 96px, 96px 96px;
    mask-image: linear-gradient(180deg, #000, rgba(0, 0, 0, .55) 55%, transparent);
}

/* Sahifa foni — steril oq-ko'k gradient + nano panjara */
.nm-page-bg {
    background:
        radial-gradient(1100px 520px at 12% -10%, rgba(20, 112, 184, .10), transparent 62%),
        radial-gradient(900px 460px at 92% 4%, rgba(14, 158, 150, .10), transparent 60%),
        var(--nm-canvas);
}

/* EKG puls chizig'i — "tirik tizim" belgisi. Sarlavha ostidagi ajratgich. */
.nm-ecg {
    display: block;
    width: 100%;
    height: 26px;
    color: var(--nm-bio-500);
    opacity: .85;
}
.nm-ecg path {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.nm-ecg .nm-ecg-flat { opacity: .35; }

/* Puls animatsiyasi — faqat harakat ruxsat etilganda */
@media (prefers-reduced-motion: no-preference) {
    .nm-ecg-live path {
        stroke-dasharray: 260;
        stroke-dashoffset: 260;
        animation: nm-ecg-draw 3.6s linear infinite;
    }
    @keyframes nm-ecg-draw {
        to { stroke-dashoffset: -260; }
    }
}

/* Molekula/DNK bog'lami — kartalar ichidagi dekorativ qatlam */
.nm-molecule {
    position: absolute;
    inset: 18px;
    z-index: 0;
    opacity: .5;
    pointer-events: none;
}
.nm-molecule svg { width: 100%; height: 100%; }
.nm-molecule line { stroke: var(--nm-line-strong); stroke-width: 1; }
.nm-molecule circle { fill: var(--nm-surface); stroke: var(--nm-bio-500); stroke-width: 2; }

/* Tibbiy xoch belgisi — brend nishoni */
.nm-cross {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--nm-primary-500), var(--nm-bio-500));
    color: #fff;
    font-weight: 800;
    box-shadow: var(--nm-shadow-sm);
}

/* Spektr chizig'i — karta yuqorisidagi "diagnostik lenta" */
.nm-spectrum {
    height: 4px;
    border-radius: var(--nm-radius-pill);
    background: linear-gradient(90deg,
        var(--nm-primary-500) 0%,
        var(--nm-bio-500) 34%,
        var(--nm-vital-500) 62%,
        var(--nm-alert-500) 84%,
        var(--nm-critical-500) 100%);
}

/* == 04. BOOTSTRAP 5.3 KOMPONENTLARINI QAYTA RANGLASH ====================
   Barcha sahifalar Bootstrap sinflarida yozilgan, shuning uchun mavzu
   shu yerda markazlashtiriladi — har bir Blade faylni tahrirlash shart emas. */
:root {
    --bs-body-font-family: var(--nm-font);
    --bs-body-font-size: var(--nm-fs-base);
    --bs-body-color: var(--nm-ink);
    --bs-body-bg: var(--nm-canvas);
    --bs-emphasis-color: var(--nm-ink);
    --bs-secondary-color: var(--nm-muted);
    --bs-border-color: var(--nm-line);
    --bs-border-radius: var(--nm-radius);
    --bs-border-radius-sm: var(--nm-radius-sm);
    --bs-border-radius-lg: var(--nm-radius-lg);
    --bs-primary: var(--nm-primary-500);
    --bs-primary-rgb: 20, 112, 184;
    --bs-success: var(--nm-vital-500);
    --bs-success-rgb: 22, 164, 107;
    --bs-warning: var(--nm-alert-500);
    --bs-warning-rgb: 196, 127, 7;
    --bs-danger: var(--nm-critical-500);
    --bs-danger-rgb: 201, 47, 69;
    --bs-info: var(--nm-bio-500);
    --bs-info-rgb: 14, 158, 150;
    --bs-link-color: var(--nm-primary-600);
    --bs-link-hover-color: var(--nm-primary-700);
    --bs-link-color-rgb: 15, 92, 153;
    --bs-heading-color: var(--nm-ink);
}

/* Tugmalar */
.btn {
    --bs-btn-border-radius: var(--nm-radius-sm);
    --bs-btn-font-weight: 600;
    --bs-btn-padding-y: .5rem;
    --bs-btn-padding-x: .9rem;
    transition: transform var(--nm-motion-fast), box-shadow var(--nm-motion-fast),
        background-color var(--nm-motion-fast), border-color var(--nm-motion-fast);
}
.btn:active { transform: translateY(1px); }

.btn-primary {
    --bs-btn-bg: var(--nm-primary-500);
    --bs-btn-border-color: var(--nm-primary-500);
    --bs-btn-hover-bg: var(--nm-primary-600);
    --bs-btn-hover-border-color: var(--nm-primary-600);
    --bs-btn-active-bg: var(--nm-primary-700);
    --bs-btn-active-border-color: var(--nm-primary-700);
    --bs-btn-disabled-bg: var(--nm-primary-300);
    --bs-btn-disabled-border-color: var(--nm-primary-300);
    box-shadow: 0 6px 16px rgba(20, 112, 184, .22);
}
.btn-primary:hover { box-shadow: 0 8px 20px rgba(20, 112, 184, .28); }

.btn-outline-primary {
    --bs-btn-color: var(--nm-primary-600);
    --bs-btn-border-color: var(--nm-primary-300);
    --bs-btn-hover-bg: var(--nm-primary-600);
    --bs-btn-hover-border-color: var(--nm-primary-600);
    --bs-btn-active-bg: var(--nm-primary-700);
    --bs-btn-active-border-color: var(--nm-primary-700);
}

.btn-success {
    /* 600-soya: oq matn bilan kontrast 4.7:1 (AA). 500-soya faqat aksent chiziq uchun. */
    --bs-btn-bg: var(--nm-vital-600);
    --bs-btn-border-color: var(--nm-vital-600);
    --bs-btn-hover-bg: var(--nm-vital-700);
    --bs-btn-hover-border-color: var(--nm-vital-700);
    --bs-btn-active-bg: var(--nm-vital-700);
}
.btn-outline-success {
    --bs-btn-color: var(--nm-vital-600);
    --bs-btn-border-color: var(--nm-vital-500);
    --bs-btn-hover-bg: var(--nm-vital-600);
    --bs-btn-hover-border-color: var(--nm-vital-600);
}
.btn-danger {
    --bs-btn-bg: var(--nm-critical-500);
    --bs-btn-border-color: var(--nm-critical-500);
    --bs-btn-hover-bg: var(--nm-critical-600);
    --bs-btn-hover-border-color: var(--nm-critical-600);
    --bs-btn-active-bg: var(--nm-critical-700);
}
.btn-outline-danger {
    --bs-btn-color: var(--nm-critical-600);
    --bs-btn-border-color: var(--nm-critical-100);
    --bs-btn-hover-bg: var(--nm-critical-600);
    --bs-btn-hover-border-color: var(--nm-critical-600);
}
.btn-warning {
    --bs-btn-bg: var(--nm-alert-600);
    --bs-btn-border-color: var(--nm-alert-600);
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--nm-alert-700);
    --bs-btn-hover-border-color: var(--nm-alert-700);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--nm-alert-700);
}
.btn-outline-secondary {
    --bs-btn-color: var(--nm-ink-soft);
    --bs-btn-border-color: var(--nm-line-strong);
    --bs-btn-hover-bg: var(--nm-primary-050);
    --bs-btn-hover-color: var(--nm-primary-700);
    --bs-btn-hover-border-color: var(--nm-primary-300);
}
.btn-light {
    --bs-btn-bg: var(--nm-surface);
    --bs-btn-border-color: var(--nm-line);
    --bs-btn-color: var(--nm-ink);
    --bs-btn-hover-bg: var(--nm-primary-050);
    --bs-btn-hover-border-color: var(--nm-primary-200);
    --bs-btn-hover-color: var(--nm-primary-700);
}

/* Kartalar — "steril panel" */
.card {
    --bs-card-bg: var(--nm-surface);
    --bs-card-border-color: var(--nm-line);
    --bs-card-border-radius: var(--nm-radius);
    --bs-card-inner-border-radius: calc(var(--nm-radius) - 1px);
    --bs-card-cap-bg: transparent;
    box-shadow: var(--nm-shadow-sm);
}
.card-header {
    border-bottom-color: var(--nm-line);
    color: var(--nm-ink);
    font-weight: 700;
}
.card-soft {
    border: 1px solid var(--nm-line) !important;
    box-shadow: var(--nm-shadow) !important;
}

/* Formalar — kirish maydonlari klinik oq fonda */
.form-control,
.form-select {
    border-color: var(--nm-line-strong);
    border-radius: var(--nm-radius-sm);
    color: var(--nm-ink);
    background-color: var(--nm-surface);
    min-height: 42px;
    font-size: var(--nm-fs-base);
    transition: border-color var(--nm-motion-fast), box-shadow var(--nm-motion-fast);
}
.form-control::placeholder { color: var(--nm-faint); }
.form-control:focus,
.form-select:focus {
    border-color: var(--nm-primary-400);
    box-shadow: var(--nm-ring);
}
.form-control:disabled,
.form-select:disabled { background-color: var(--nm-surface-2); color: var(--nm-muted); }
.form-label {
    margin-bottom: .3rem;
    color: var(--nm-ink-soft);
    font-size: var(--nm-fs-sm);
    font-weight: 600;
}
.form-text { color: var(--nm-muted); }
.form-check-input:checked {
    background-color: var(--nm-primary-500);
    border-color: var(--nm-primary-500);
}
.form-check-input:focus { box-shadow: var(--nm-ring); border-color: var(--nm-primary-400); }
.input-group-text {
    border-color: var(--nm-line-strong);
    background-color: var(--nm-surface-2);
    color: var(--nm-muted);
}
.is-invalid, .form-control.is-invalid, .form-select.is-invalid { border-color: var(--nm-critical-500); }
.invalid-feedback, .text-danger { color: var(--nm-critical-600) !important; }

/* Jadvallar — laboratoriya jadvali: yupqa chiziqlar, tinch zebra */
.table {
    --bs-table-color: var(--nm-ink);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--nm-line);
    --bs-table-striped-bg: var(--nm-surface-2);
    --bs-table-striped-color: var(--nm-ink);
    --bs-table-hover-bg: var(--nm-primary-050);
    --bs-table-hover-color: var(--nm-ink);
    font-size: var(--nm-fs-base);
    vertical-align: middle;
}
.table > thead {
    position: sticky;
    top: 0;
    z-index: 2;
}
.table > thead th {
    border-bottom: 1px solid var(--nm-line-strong) !important;
    background: var(--nm-surface-2);
    color: var(--nm-ink-soft);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.table > tbody > tr > td { border-color: var(--nm-line); }
.table-responsive { border-radius: var(--nm-radius-sm); -webkit-overflow-scrolling: touch; }

/* Nishonlar (badge) — holat indikatorlari */
.badge { font-weight: 700; letter-spacing: .01em; }
.text-bg-primary { background-color: var(--nm-primary-500) !important; color: #fff !important; }
.text-bg-success { background-color: var(--nm-vital-600) !important; color: #fff !important; }
.text-bg-warning { background-color: var(--nm-alert-600) !important; color: #fff !important; }
.text-bg-danger  { background-color: var(--nm-critical-500) !important; color: #fff !important; }
.text-bg-info    { background-color: var(--nm-bio-600) !important; color: #fff !important; }
.text-bg-secondary { background-color: var(--nm-muted) !important; color: #fff !important; }
.text-bg-light { background-color: var(--nm-surface-2) !important; color: var(--nm-ink) !important; }
.bg-primary { background-color: var(--nm-primary-500) !important; }
.bg-success { background-color: var(--nm-vital-600) !important; }
.bg-danger  { background-color: var(--nm-critical-500) !important; }
.bg-warning { background-color: var(--nm-alert-600) !important; }
.text-primary { color: var(--nm-primary-600) !important; }
.text-success { color: var(--nm-vital-600) !important; }
.text-warning { color: var(--nm-alert-600) !important; }
.text-muted { color: var(--nm-muted) !important; }

/* Ogohlantirishlar — retsept varaqasi uslubi: chap chekkada rangli chiziq */
.alert {
    border: 1px solid var(--nm-line);
    border-left-width: 4px;
    border-radius: var(--nm-radius-sm);
    box-shadow: var(--nm-shadow-xs);
}
.alert-success { border-left-color: var(--nm-vital-500); background: var(--nm-vital-050); color: var(--nm-vital-700); }
.alert-danger  { border-left-color: var(--nm-critical-500); background: var(--nm-critical-050); color: var(--nm-critical-700); }
.alert-warning { border-left-color: var(--nm-alert-500); background: var(--nm-alert-050); color: var(--nm-alert-700); }
.alert-info    { border-left-color: var(--nm-bio-500); background: var(--nm-bio-050); color: var(--nm-bio-700); }

/* Sahifalash */
.page-link {
    color: var(--nm-primary-600);
    border-color: var(--nm-line);
    min-width: 40px;
    text-align: center;
}
.page-link:hover { background: var(--nm-primary-050); color: var(--nm-primary-700); }
.page-item.active .page-link {
    background-color: var(--nm-primary-500);
    border-color: var(--nm-primary-500);
}
.page-item.disabled .page-link { color: var(--nm-faint); }

/* Progress — "analiz shkalasi" */
.progress { background-color: var(--nm-primary-050); border-radius: var(--nm-radius-pill); }
.progress-bar { background: linear-gradient(90deg, var(--nm-primary-500), var(--nm-bio-500)); }

/* Modal / dropdown */
.modal-content, .dropdown-menu {
    border-color: var(--nm-line);
    border-radius: var(--nm-radius);
    background: var(--nm-surface);
    box-shadow: var(--nm-shadow-lg);
}
.dropdown-item:hover { background: var(--nm-primary-050); color: var(--nm-primary-700); }

/* == 05. ILOVA KOMPONENTLARI ============================================= */

/* --- Yon panel (sidebar): "klinik navigatsiya ustuni" ------------------- */
.sidebar {
    position: relative;
    min-height: 100vh;
    background:
        radial-gradient(520px 260px at 0% 0%, rgba(14, 158, 150, .22), transparent 62%),
        linear-gradient(180deg, var(--nm-primary-800) 0%, var(--nm-primary-900) 100%);
    color: #e8f1fb;
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, .06);
}

/* Yon paneldagi nano panjara — juda past kontrast */
.sidebar::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .5;
    background-image:
        linear-gradient(60deg, transparent 0 49.3%, rgba(255, 255, 255, .06) 49.3% 50.3%, transparent 50.3%),
        radial-gradient(circle at 16px 16px, rgba(107, 210, 201, .18) 0 1.6px, transparent 2.2px);
    background-size: 88px 88px, 88px 88px;
    mask-image: linear-gradient(180deg, #000, transparent 72%);
}

.sidebar > * { position: relative; z-index: 1; }

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
    line-height: 1.15;
}

.sidebar-brand .brand-text { min-width: 0; }

/* Universitetning to'liq nomi uzun — kichik kegl va zich satr oralig'i bilan
   uch qatorga sig'adi, qisqartirilmaydi. */
.sidebar-brand .brand-name {
    display: block;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-wrap: balance;
}

.sidebar-logo {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 50%;
    background: #fff;
    padding: 3px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .28);
}

.sidebar-brand small {
    display: block;
    color: var(--nm-bio-300);
    font-size: var(--nm-fs-xs);
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.sidebar .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .75rem;
    border-radius: var(--nm-radius-sm);
    color: #cfe2f5;
    font-size: var(--nm-fs-base);
    font-weight: 500;
    overflow: hidden;
    transition: background var(--nm-motion-fast), color var(--nm-motion-fast);
}

.sidebar .nav-link::after {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--nm-bio-300), var(--nm-primary-300));
    opacity: 0;
    transition: opacity var(--nm-motion-fast);
}

.sidebar .nav-link:hover,
.sidebar .nav-link:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

.sidebar .nav-link.active {
    color: #fff;
    background: rgba(14, 158, 150, .22);
    font-weight: 600;
}

.sidebar .nav-link.active::after,
.sidebar .nav-link:hover::after { opacity: 1; }

/* Navigatsiya bo'lim sarlavhasi */
.sidebar .nav-section {
    margin: 1rem 0 .35rem;
    padding-left: .75rem;
    color: rgba(207, 226, 245, .62);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* --- Sahifa qobig'i ---------------------------------------------------- */
.page-shell {
    max-width: 1680px;
    margin-inline: auto;
}

/* --- Yuqori panel (topbar): til, mavzu, chiqish ------------------------ */
.nm-topbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1rem;
}

.locale-switcher {
    display: inline-flex;
    gap: 3px;
    padding: 3px;
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius-sm);
    background: var(--nm-surface);
    box-shadow: var(--nm-shadow-xs);
}

.locale-switcher a {
    min-width: 40px;
    padding: 6px 10px;
    border-radius: 7px;
    color: var(--nm-muted);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    transition: background var(--nm-motion-fast), color var(--nm-motion-fast);
}

.locale-switcher a.active,
.locale-switcher a:hover {
    color: #fff;
    background: var(--nm-primary-500);
}

/* Mavzu almashtirgich (yorug'/qorong'i) */
.nm-theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 38px;
    padding: 6px 12px;
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius-sm);
    background: var(--nm-surface);
    color: var(--nm-ink-soft);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
    cursor: pointer;
    box-shadow: var(--nm-shadow-xs);
}
.nm-theme-toggle:hover { border-color: var(--nm-primary-300); color: var(--nm-primary-700); }
.nm-theme-toggle svg { width: 16px; height: 16px; }
[data-bs-theme="dark"] .nm-theme-toggle .nm-icon-sun { display: block; }
[data-bs-theme="dark"] .nm-theme-toggle .nm-icon-moon { display: none; }
.nm-theme-toggle .nm-icon-sun { display: none; }
.nm-theme-toggle .nm-icon-moon { display: block; }

/* --- Sahifa hero bloki: "bemor kartasi" sarlavhasi --------------------- */
.nm-hero {
    position: relative;
    isolation: isolate;
    margin-bottom: 1rem;
    padding: 1.35rem 1.5rem;
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius-lg);
    background:
        radial-gradient(680px 240px at 0% 0%, rgba(20, 112, 184, .10), transparent 64%),
        radial-gradient(520px 220px at 100% 10%, rgba(14, 158, 150, .12), transparent 62%),
        var(--nm-surface);
    box-shadow: var(--nm-shadow);
    overflow: hidden;
}

.nm-hero::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 4px;
    background: linear-gradient(90deg,
        var(--nm-primary-500), var(--nm-bio-500) 40%, var(--nm-vital-500) 70%, var(--nm-alert-500));
}

.nm-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .4rem;
    color: var(--nm-bio-700);
    font-size: var(--nm-fs-xs);
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.nm-hero-eyebrow::before {
    content: "";
    width: 26px;
    height: 8px;
    border-radius: var(--nm-radius-pill);
    background: linear-gradient(90deg, var(--nm-bio-500), var(--nm-primary-500));
}

.nm-hero-title {
    margin: 0;
    font-size: var(--nm-fs-xl);
    font-weight: 800;
    line-height: 1.15;
}

.nm-hero-subtitle {
    margin: .35rem 0 0;
    color: var(--nm-muted);
    font-size: var(--nm-fs-base);
}

.nm-hero-logo {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 50%;
    background: #fff;
    padding: 4px;
    border: 1px solid var(--nm-line);
    box-shadow: var(--nm-shadow-sm);
}

/* --- Metrika kartalari: "vital ko'rsatkichlar" ------------------------- */
.nm-metric {
    position: relative;
    height: 100%;
    padding: 1rem 1.1rem;
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius);
    background: var(--nm-surface);
    box-shadow: var(--nm-shadow-sm);
    overflow: hidden;
    transition: transform var(--nm-motion), box-shadow var(--nm-motion);
}
.nm-metric:hover { transform: translateY(-2px); box-shadow: var(--nm-shadow); }

.nm-metric::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--nm-metric-accent, var(--nm-primary-500));
}

.nm-metric-label {
    color: var(--nm-muted);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.nm-metric-value {
    color: var(--nm-ink);
    font-size: var(--nm-fs-lg);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.nm-metric-hint { color: var(--nm-faint); font-size: var(--nm-fs-xs); }
.nm-metric-blue   { --nm-metric-accent: var(--nm-primary-500); }
.nm-metric-bio    { --nm-metric-accent: var(--nm-bio-500); }
.nm-metric-vital  { --nm-metric-accent: var(--nm-vital-500); }
.nm-metric-alert  { --nm-metric-accent: var(--nm-alert-500); }
.nm-metric-critic { --nm-metric-accent: var(--nm-critical-500); }

/* Eski sahifalardagi metrika sinflarini ham yagona ko'rinishga keltiramiz */
.dash-metric, .report-metric, .group-stat, .sync-metric,
.audit-metric, .rule-metric, .kpi-stat-card, .metric-card {
    border: 1px solid var(--nm-line) !important;
    border-radius: var(--nm-radius) !important;
    background: var(--nm-surface);
    box-shadow: var(--nm-shadow-sm) !important;
}

/* --- Holat nishonlari (klinik triaj ranglari) -------------------------- */
.nm-status {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .6rem;
    border-radius: var(--nm-radius-pill);
    font-size: var(--nm-fs-xs);
    font-weight: 700;
}
.nm-status::before {
    content: "";
    width: 7px; height: 7px;
    border-radius: 50%;
    background: currentColor;
}
.nm-status-ok      { background: var(--nm-vital-050); color: var(--nm-vital-700); }
.nm-status-wait    { background: var(--nm-alert-050); color: var(--nm-alert-700); }
.nm-status-fail    { background: var(--nm-critical-050); color: var(--nm-critical-700); }
.nm-status-neutral { background: var(--nm-surface-2); color: var(--nm-muted); }

/* --- Bo'sh holat ------------------------------------------------------- */
.nm-empty {
    padding: 2.5rem 1rem;
    border: 1px dashed var(--nm-line-strong);
    border-radius: var(--nm-radius);
    background: var(--nm-surface-2);
    color: var(--nm-muted);
    text-align: center;
}

/* --- Portal (bosh sahifa) kartalari ----------------------------------- */
.nm-portal {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    max-width: 1240px;
    margin: 0 auto;
    padding: 56px 24px 64px;
    display: grid;
    align-content: center;
    gap: 32px;
}

.nm-portal-hero { max-width: 940px; margin: 0 auto; text-align: center; }

.nm-portal-logo {
    width: 108px;
    height: 108px;
    display: block;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: #fff;
    padding: 6px;
    border: 1px solid var(--nm-line);
    box-shadow: var(--nm-shadow-lg);
}

.nm-portal-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    padding: 7px 16px;
    border: 1px solid var(--nm-primary-100);
    border-radius: var(--nm-radius-pill);
    background: var(--nm-surface);
    color: var(--nm-primary-700);
    font-size: var(--nm-fs-xs);
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-shadow: var(--nm-shadow-xs);
}

.nm-portal-title {
    margin: 0;
    font-size: var(--nm-fs-hero);
    font-weight: 900;
    line-height: 1.04;
}
.nm-portal-title span {
    background: linear-gradient(90deg, var(--nm-primary-600), var(--nm-bio-500) 55%, var(--nm-vital-500));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.nm-portal-subtitle {
    max-width: 680px;
    margin: 14px auto 0;
    color: var(--nm-muted);
    font-size: var(--nm-fs-md);
    line-height: 1.6;
}

.nm-system-card {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.25rem;
    height: 100%;
    min-height: 290px;
    padding: 32px;
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius-lg);
    background: var(--nm-surface);
    color: var(--nm-ink);
    text-decoration: none;
    overflow: hidden;
    box-shadow: var(--nm-shadow);
    transition: transform var(--nm-motion), box-shadow var(--nm-motion), border-color var(--nm-motion);
}

.nm-system-card::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 5px;
    background: linear-gradient(90deg, var(--nm-card-a, var(--nm-primary-500)), var(--nm-card-b, var(--nm-bio-500)));
    transform: scaleX(.42);
    transform-origin: left;
    transition: transform var(--nm-motion);
}

.nm-system-card:hover,
.nm-system-card:focus-visible {
    color: var(--nm-ink);
    transform: translateY(-4px);
    border-color: var(--nm-primary-200);
    box-shadow: var(--nm-shadow-lg);
}
.nm-system-card:hover::after,
.nm-system-card:focus-visible::after { transform: scaleX(1); }

.nm-system-badge {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .3rem .7rem;
    border-radius: var(--nm-radius-pill);
    background: var(--nm-surface-2);
    color: var(--nm-card-b, var(--nm-bio-700));
    font-size: var(--nm-fs-xs);
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.nm-system-symbol {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    border-radius: var(--nm-radius);
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--nm-card-a, var(--nm-primary-500)) 14%, transparent),
        color-mix(in srgb, var(--nm-card-b, var(--nm-bio-500)) 14%, transparent));
    color: var(--nm-card-a, var(--nm-primary-600));
}
.nm-system-symbol svg { width: 42px; height: 42px; }
.nm-system-symbol img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }

.nm-system-name {
    margin: 0;
    color: var(--nm-primary-800);
    font-size: clamp(2rem, 4.4vw, 3rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.02em;
}
.nm-system-desc { margin: .5rem 0 0; color: var(--nm-muted); font-size: var(--nm-fs-base); }

.nm-system-go {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: var(--nm-primary-600);
    font-size: var(--nm-fs-sm);
    font-weight: 700;
}
.nm-system-go svg { width: 18px; height: 18px; transition: transform var(--nm-motion-fast); }
.nm-system-card:hover .nm-system-go svg { transform: translateX(4px); }

/* --- Kirish (login) sahifasi ------------------------------------------ */
.nm-login-shell {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    min-height: 100vh;
    padding: 88px 16px 40px;
}

.nm-login-card {
    width: min(100%, 440px);
    border: 1px solid var(--nm-line);
    border-radius: var(--nm-radius-lg);
    background: var(--nm-surface);
    box-shadow: var(--nm-shadow-lg);
    overflow: hidden;
}

.nm-login-card > .nm-spectrum { border-radius: 0; height: 5px; }

.nm-login-logo {
    width: 78px;
    height: 78px;
    display: block;
    margin: 0 auto 12px;
    border-radius: 50%;
    background: #fff;
    padding: 5px;
    border: 1px solid var(--nm-line);
    box-shadow: var(--nm-shadow-sm);
}

.nm-login-title {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: .03em;
    text-align: center;
    text-transform: uppercase;
    text-wrap: balance;
}
.nm-login-sub { margin: .25rem 0 1.25rem; color: var(--nm-muted); font-size: var(--nm-fs-sm); text-align: center; }

/* Parolni ko'rsatish tugmasi */
.nm-password-wrap { position: relative; }
.nm-password-wrap .form-control { padding-right: 46px; }
.nm-password-toggle {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: var(--nm-radius-sm);
    background: transparent;
    color: var(--nm-muted);
    cursor: pointer;
}
.nm-password-toggle:hover { color: var(--nm-primary-600); background: var(--nm-primary-050); }
.nm-password-toggle svg { width: 18px; height: 18px; }

/* == 06. QORONG'I REJIM ==================================================
   Bootstrap 5.3 ning data-bs-theme mexanizmiga ulanadi: <html data-bs-theme="dark">.
   Tokenlar qayta belgilanadi, komponentlar avtomatik moslashadi. */
[data-bs-theme="dark"] {
    color-scheme: dark;

    --nm-ink: #e8f1f9;
    --nm-ink-soft: #c6d8e8;
    --nm-muted: #9db1c4;
    --nm-faint: #7d92a8;
    --nm-line: #21354a;
    --nm-line-strong: #2f4a63;
    --nm-surface: #0f2135;
    --nm-surface-2: #142a41;
    --nm-canvas: #08111d;
    --nm-inverse: #08111d;

    --nm-primary-050: #10283f;
    --nm-primary-100: #16354f;
    --nm-primary-200: #1d4666;
    --nm-primary-300: #3a7fb5;
    --nm-primary-500: #3f9ade;
    --nm-primary-600: #64b1e8;
    --nm-primary-700: #92c9f0;
    --nm-primary-800: #0a2136;
    --nm-primary-900: #061625;

    --nm-bio-050: #0c2b2c;
    --nm-bio-500: #33c2b8;
    --nm-bio-600: #55d3ca;
    --nm-bio-700: #8ae4dd;

    --nm-vital-050: #0c2a1e;
    --nm-vital-500: #3cc78a;
    --nm-vital-600: #5ed6a0;
    --nm-vital-700: #8ce4bd;

    --nm-alert-050: #2e2410;
    --nm-alert-500: #e0a53c;
    --nm-alert-600: #ecbb63;
    --nm-alert-700: #f4d296;

    --nm-critical-050: #2f1219;
    --nm-critical-500: #e8697c;
    --nm-critical-600: #f08b9a;
    --nm-critical-700: #f6b3bd;

    --nm-glass: rgba(15, 33, 53, .92);
    --nm-glass-soft: rgba(15, 33, 53, .74);

    --nm-mesh-line: rgba(107, 210, 201, .08);
    --nm-mesh-node: rgba(107, 210, 201, .16);
    --nm-mesh-node-2: rgba(63, 154, 222, .14);

    --nm-shadow-xs: 0 1px 2px rgba(0, 0, 0, .4);
    --nm-shadow-sm: 0 2px 10px rgba(0, 0, 0, .45);
    --nm-shadow: 0 10px 28px rgba(0, 0, 0, .5);
    --nm-shadow-lg: 0 20px 52px rgba(0, 0, 0, .58);

    --bs-body-bg: var(--nm-canvas);
    --bs-body-color: var(--nm-ink);
    --bs-border-color: var(--nm-line);
    --bs-emphasis-color: var(--nm-ink);
    --bs-secondary-bg: var(--nm-surface-2);
    --bs-tertiary-bg: var(--nm-surface-2);
}

[data-bs-theme="dark"] .nm-page-bg {
    background:
        radial-gradient(1100px 520px at 12% -10%, rgba(63, 154, 222, .12), transparent 62%),
        radial-gradient(900px 460px at 92% 4%, rgba(51, 194, 184, .10), transparent 60%),
        var(--nm-canvas);
}

[data-bs-theme="dark"] .sidebar {
    background:
        radial-gradient(520px 260px at 0% 0%, rgba(51, 194, 184, .16), transparent 62%),
        linear-gradient(180deg, #0a1c2d 0%, #061321 100%);
}

/* Qorong'i rejimda to'ldirilgan tugmalar ochiq rangda bo'ladi — matn quyuq bo'lishi kerak. */
[data-bs-theme="dark"] .btn-primary,
[data-bs-theme="dark"] .btn-success,
[data-bs-theme="dark"] .btn-warning,
[data-bs-theme="dark"] .btn-danger {
    --bs-btn-color: #04121f;
    --bs-btn-hover-color: #04121f;
    --bs-btn-active-color: #04121f;
}

[data-bs-theme="dark"] .text-bg-primary,
[data-bs-theme="dark"] .text-bg-success,
[data-bs-theme="dark"] .text-bg-warning,
[data-bs-theme="dark"] .text-bg-danger,
[data-bs-theme="dark"] .text-bg-info,
[data-bs-theme="dark"] .text-bg-secondary { color: #04121f !important; }
[data-bs-theme="dark"] .btn-light {
    --bs-btn-bg: var(--nm-surface-2);
    --bs-btn-color: var(--nm-ink);
    --bs-btn-border-color: var(--nm-line-strong);
    --bs-btn-hover-bg: var(--nm-primary-100);
    --bs-btn-hover-color: var(--nm-ink);
}
[data-bs-theme="dark"] .text-bg-light {
    background-color: var(--nm-surface-2) !important;
    color: var(--nm-ink) !important;
}
[data-bs-theme="dark"] .nm-portal-logo,
[data-bs-theme="dark"] .nm-login-logo,
[data-bs-theme="dark"] .nm-hero-logo { background: #f2f7fc; }

/* Bosma va PDF hisobotlarida qorong'i rejim qo'llanmaydi */
[data-bs-theme="dark"] img:not([src$=".svg"]) { filter: brightness(.94); }

/* == 07. RESPONSIV + BOSMA =============================================== */
@media (max-width: 991.98px) {
    .container-fluid { padding-left: 0; padding-right: 0; }
    .container-fluid > .row { --bs-gutter-x: 0; }

    /* Yon panel yuqoriga o'tadi va gorizontal lentaga aylanadi */
    .sidebar {
        position: sticky;
        top: 0;
        z-index: 1030;
        min-height: auto !important;
        padding: .75rem !important;
        box-shadow: 0 10px 26px rgba(6, 22, 46, .22);
    }
    .sidebar::before { mask-image: none; opacity: .28; }
    .sidebar-brand {
        margin-bottom: .6rem;
        padding-bottom: .6rem;
    }

    .sidebar-brand .brand-name { font-size: 11px; line-height: 1.25; }
    .sidebar-brand small { font-size: 10.5px; }
    .sidebar-logo { width: 34px; height: 34px; flex-basis: 34px; }
    .sidebar .nav-section { display: none; }
    .sidebar nav {
        flex-direction: row !important;
        gap: .4rem !important;
        overflow-x: auto;
        padding-bottom: .2rem;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .sidebar nav::-webkit-scrollbar { display: none; }
    .sidebar .nav-link {
        flex: 0 0 auto;
        white-space: nowrap;
        padding: .5rem .8rem;
    }
    .sidebar .nav-link::after { inset: auto 0 0 0; width: 100%; height: 3px; }

    .page-shell { max-width: 100%; padding: 1rem !important; }
    .nm-hero { padding: 1.1rem 1.15rem; }
    .nm-portal { align-content: start; padding-top: 72px; }
}

@media (max-width: 575.98px) {
    :root { --nm-fs-base: .9375rem; }
    .page-shell { padding: .75rem !important; }
    .card-header, .card-body { padding: .85rem; }
    .nm-hero { border-radius: var(--nm-radius); }
    .nm-hero-title { font-size: var(--nm-fs-md); }
    .nm-system-card { min-height: 240px; padding: 24px 20px; }
    .nm-portal { padding: 68px 14px 40px; gap: 22px; }
    .nm-portal-logo { width: 84px; height: 84px; }
    .btn { white-space: normal; }
    .table-responsive > .table { min-width: 680px; }
    .locale-switcher a { min-width: 36px; padding: 6px 8px; }
}

@media print {
    .sidebar, .nm-topbar, .nm-skip-link, .nm-theme-toggle,
    .locale-switcher, .btn, form.d-inline, .pagination { display: none !important; }
    body { background: #fff !important; color: #000 !important; }
    .card, .nm-hero, .nm-metric {
        border: 1px solid #b9c6d4 !important;
        box-shadow: none !important;
        break-inside: avoid;
    }
    .page-shell { padding: 0 !important; max-width: 100% !important; }
    a[href]::after { content: ""; }
    .table > thead th { background: #eef2f7 !important; color: #000 !important; }
}