/* =====================================================================
   site-m3.css — BARCHA CSS bitta joyda (Material Design 3)
   _Layout'da bir marta ulanadi -> butun saytga taalluqli.
   Bo'limlar:
     1. M3 ranglar (tokens)        6. select2 (global)
     2. Body / tipografika         7. Til almashtirgich (.m3-lang-switch)
     3. Top app bar (navbar)       8. Eski card_box (kommentlangan blok)
     4. E'lon banneri              9. .m3-page komponentlari (Mandat/Stat)
     5. Footer                    10. Mobil moslashuv
   ===================================================================== */

/* ---------------- 0. Inter shrifti (self-host, tashqi bog'liqliksiz) ---------------- */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url('../fonts/inter-latin.woff2') format('woff2');
    /* Lotin + o'zbek maxsus belgilari (U+02BB ʻ, U+2018 ' va h.k.) */
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
        U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
        U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url('../fonts/inter-cyrillic.woff2') format('woff2');
    /* Kirill (rus tili) */
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* ---------------- 1. M3 ranglar ---------------- */
:root {
    /* Sokin ko'k (Calm Blue) — 700k+ xavotirli foydalanuvchi uchun ko'zga yoqimli */
    --md-primary: #305cab;
    --md-primary-hover: #2a5099;
    --md-on-primary: #ffffff;
    --md-primary-container: #dce6f8;
    --md-on-primary-container: #0a2a55;
    --md-secondary-container: #dde3ee;
    --md-surface: #ffffff;
    --md-surface-variant: #f5f7fb;
    --md-on-surface: #1f2429;
    --md-on-surface-variant: #545863;
    --md-outline: #c2c7d2;
    --md-outline-variant: #e5e8ef;
    /* Holat ranglari — yumshatilgan (semantika saqlanadi) */
    --md-success-container: #d7efda;
    --md-warning-container: #fbebc0;
    --md-error-container: #f7dbd8;
    --md-neutral-container: #e6e8ee;
    /* Banner — juda yumshoq, sokin (yorqin emas) */
    --md-banner-bg: #e8eef9;
    --md-banner-fg: #1f3a66;
    /* Yumshoq elevation (ko'zni charchatmaydigan soyalar) */
    --md-elev-1: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06);
    --md-elev-2: 0 2px 8px rgba(16,24,40,.06), 0 8px 20px rgba(16,24,40,.05);
    --md-shape-card: 16px;
    --md-shape-field: 12px;
    --md-shape-button: 999px;
}

/* Honeypot (bot tuzog'i) — ko'rinmas, lekin display:none emas (botlar to'ldirsin) */
.m3-hp {
    position: absolute !important; left: -9999px !important; top: -9999px !important;
    width: 1px; height: 1px; opacity: 0; pointer-events: none;
}

/* ---------------- 2. Body / tipografika ---------------- */
body.hold-transition,
body.layout-top-nav {
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
    background: var(--md-surface-variant);
    color: var(--md-on-surface);
}

/* ---------------- 3. Top app bar (navbar) ---------------- */
.main-header.navbar {
    background: var(--md-surface) !important;
    border: none;
    border-bottom: 1px solid var(--md-outline-variant);
    box-shadow: var(--md-elev-1);
    min-height: 64px;
    padding: 6px 0;
}
.main-header .container { align-items: center; max-width: 1320px; }
.main-header .navbar-brand { display: flex; align-items: center; padding: 4px 0; }
.main-header .navbar-brand img.brand-image {
    height: 44px !important; max-height: 44px; width: auto; margin: 0;
}
.main-header .navbar-collapse label {
    font-family: "Inter", "Segoe UI", sans-serif !important;
    font-weight: 600; font-size: 18px !important; line-height: 1.3;
    color: var(--md-on-surface); margin: 0;
}

/* ---------------- 4. E'lon banneri (marquee o'rniga) ---------------- */
.m3-banner {
    overflow: hidden;
    background: var(--md-banner-bg);
    color: var(--md-banner-fg);
    border-bottom: 1px solid var(--md-outline-variant);
    padding: 9px 0; white-space: nowrap;
    font-size: 14px; font-weight: 500; letter-spacing: .2px;
}
.m3-banner__track {
    display: inline-flex; white-space: nowrap;
    animation: m3-marquee 32s linear infinite; will-change: transform;
}
.m3-banner:hover .m3-banner__track { animation-play-state: paused; }
.m3-banner__item { padding-right: 64px; }
@keyframes m3-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .m3-banner__track { animation: none; white-space: normal; }
    .m3-banner { white-space: normal; text-align: center; }
    .m3-banner__item + .m3-banner__item { display: none; }
}

.content-wrapper { background: var(--md-surface-variant); }

/* Bo'sh sahifada ortiqcha scroll chiqmasligi uchun. AdminLTE JS
   .content-wrapper'ga inline min-height (100vh - navbar - footer) beradi,
   lekin e'lon banneri .wrapper'dan tashqarida turadi -> jami balandlik
   100vh dan oshib, kontent bo'sh bo'lsa ham scroll paydo bo'lardi.
   Flex bilan: banner + wrapper birgalikda roppa-rosa 100vh; kontent kam
   bo'lsa footer pastga yopishadi, scroll faqat kerak bo'lganda chiqadi. */
body.layout-top-nav { display: flex; flex-direction: column; min-height: 100vh; }
body.layout-top-nav > .wrapper { flex: 1 1 auto; display: flex; flex-direction: column; }
body.layout-top-nav .content-wrapper { flex: 1 1 auto; min-height: auto !important; }

/* ---------------- 5. Footer ---------------- */
.main-footer {
    background: var(--md-surface);
    border-top: 1px solid var(--md-outline-variant);
    color: var(--md-on-surface-variant);
    border-radius: 18px 18px 0 0; margin-top: 24px; padding: 18px 16px;
}
.main-footer a { color: var(--md-primary); text-decoration: none; font-weight: 500; }
.main-footer a:hover { text-decoration: underline; }

/* Zamonaviy footer (M3) + ijtimoiy tarmoq dumaloq ikona-tugmalari */
.m3-footer { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; padding-top: 6px; }
.m3-footer__head {
    display: flex; align-items: center; justify-content: center; gap: 14px;
    width: 100%; max-width: 460px;
    font-size: 12.5px; font-weight: 600; letter-spacing: .3px;
    color: var(--md-on-surface-variant); text-transform: uppercase;
}
.m3-footer__line { flex: 1 1 auto; height: 1px; background: var(--md-outline-variant); }
.m3-footer__social { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.m3-social {
    position: relative; width: 48px; height: 48px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--md-surface-variant); border: 1px solid var(--md-outline-variant);
    color: var(--md-on-surface-variant) !important; text-decoration: none !important;
    transition: transform .18s cubic-bezier(.2,0,0,1), box-shadow .18s ease,
                background .18s ease, border-color .18s ease, color .18s ease;
}
.m3-social i { font-size: 20px; line-height: 1; transition: color .18s ease; }
.m3-social:hover { transform: translateY(-3px); box-shadow: var(--md-elev-2); color: #fff !important; }
.m3-social:hover i { color: #fff !important; }
.m3-social:active { transform: translateY(-1px); }
.m3-social:focus-visible { outline: 2px solid var(--md-primary); outline-offset: 2px; }
.m3-social--tg i { color: #229ED9; } .m3-social--tg:hover { background: #229ED9; border-color: #229ED9; }
.m3-social--fb i { color: #1877F2; } .m3-social--fb:hover { background: #1877F2; border-color: #1877F2; }
.m3-social--ig i { color: #E1306C; }
.m3-social--ig:hover { border-color: #E1306C;
    background: radial-gradient(circle at 30% 110%, #ffd600 0%, #ff7a00 22%, #ff0069 45%, #d300c5 70%, #7638fa 100%); }
.m3-social--yt i { color: #FF0000; } .m3-social--yt:hover { background: #FF0000; border-color: #FF0000; }
/* M3 tooltip (handle hover'da) */
.m3-social::after {
    content: attr(data-tip);
    position: absolute; bottom: calc(100% + 9px); left: 50%;
    transform: translateX(-50%) translateY(4px);
    background: #2f3033; color: #f1f0f4;
    font-size: 11.5px; font-weight: 500; padding: 5px 10px; border-radius: 8px;
    white-space: nowrap; opacity: 0; pointer-events: none; z-index: 6;
    box-shadow: var(--md-elev-2);
    transition: opacity .16s ease, transform .16s ease;
}
.m3-social:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }
.m3-footer__copy { font-size: 13px; color: var(--md-on-surface-variant); }
.m3-footer__copy a { font-weight: 600; }
@media (max-width: 768px) {
    .m3-footer__head { font-size: 11.5px; gap: 10px; }
    .m3-social { width: 44px; height: 44px; }
    .m3-social i { font-size: 18px; }
}

/* =====================================================================
   22. Bakalavr2025/Stat — M3 statistika sahifasi
   ===================================================================== */
.m3-stat { display: flex; flex-direction: column; gap: 18px; }
.m3-stat-note {
    display: flex; align-items: flex-start; gap: 12px;
    background: var(--md-primary-container); color: var(--md-on-primary-container);
    border: 1px solid var(--md-outline-variant);
    border-radius: 14px; padding: 14px 16px;
    font-weight: 600; font-size: 14px; line-height: 1.45;
}
.m3-stat-note i { font-size: 18px; margin-top: 1px; flex: 0 0 auto; }
.m3-stat-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.m3-stat-field { display: flex; flex-direction: column; gap: 7px; }
.m3-stat-field > label {
    display: flex; align-items: center; gap: 7px; margin: 0;
    font-size: 13px; font-weight: 600; color: var(--md-on-surface-variant);
}
.m3-stat-field > label i { color: var(--md-primary); font-size: 13px; }
#tumdev, #subdev { margin: 0; }
#tumdev .row, #subdev .row { margin: 0; }

/* Uzun izoh/eslatma bloki (Imtiyoz QQ va h.k.) */
.m3-note-info {
    display: flex; align-items: flex-start; gap: 12px;
    background: var(--md-primary-container); color: var(--md-on-primary-container);
    border: 1px solid var(--md-outline-variant);
    border-radius: 14px; padding: 14px 16px; margin: 6px 0;
    font-size: 13.5px; line-height: 1.55; text-align: left;
}
.m3-note-info i { font-size: 18px; margin-top: 2px; flex: 0 0 auto; }

/* =====================================================================
   24. Bakalavr2025/Details — M3 (natija sahifasi)
   ===================================================================== */
/* card-div bu sahifada bosiladigan tab emas — neytrallashtiramiz */
.m3-details .card-div { cursor: default; user-select: text; }
.m3-details .card-div:hover { background: var(--md-surface); color: inherit; }
.m3-details .card-header { background: var(--md-surface); }
.m3-details hr { border-color: var(--md-outline-variant); margin: 10px 0; }

/* Hero — abituriyent sarlavhasi */
.m3-det-hero {
    display: flex; align-items: center; gap: 18px;
    background: var(--md-primary-container); color: var(--md-on-primary-container);
    border: 1px solid var(--md-outline-variant);
    border-radius: 20px; padding: 18px 22px; margin-bottom: 16px; box-shadow: var(--md-elev-1);
}
.m3-det-hero__avatar {
    width: 60px; height: 60px; border-radius: 50%; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    background: var(--md-primary); color: var(--md-on-primary); font-size: 26px;
}
.m3-det-hero__name { font-size: 22px; font-weight: 800; line-height: 1.2; }
.m3-det-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 8px; font-size: 14px; }
.m3-det-hero__meta i { color: var(--md-primary); margin-right: 5px; }
html.theme-dark .m3-det-hero__meta i { color: #9ec0ff; }

/* Fan kartalari */
.m3-det-subj {
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: 16px; padding: 14px 16px; margin-bottom: 14px; box-shadow: var(--md-elev-1);
    height: calc(100% - 14px);
}
.m3-det-subj__lbl {
    display: flex; align-items: center; gap: 7px;
    font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px;
    color: var(--md-on-surface-variant); margin-bottom: 9px;
}
.m3-det-subj__lbl i { color: var(--md-primary); }
.m3-det-subj__val { font-size: 15px; font-weight: 700; color: var(--md-on-surface); }

/* Bo'lim sarlavhasi */
.m3-det-title {
    display: flex; align-items: center; gap: 9px; margin: 8px 2px 12px;
    font-size: 15px; font-weight: 700; color: var(--md-on-surface);
}
.m3-det-title i { color: var(--md-primary); }

/* Javoblar to'ri (90 ta) — kompakt, sokin ranglar */
.m3-details .list-group { gap: 5px; }
.m3-details .list-group-item {
    border: 1px solid transparent !important; border-radius: 10px !important;
    margin: 0 0 5px 0; padding: 7px 12px; font-weight: 600; font-size: 13.5px;
    display: flex; align-items: center; gap: 8px;
}
.m3-details .list-group-item-success {
    background: var(--md-success-container) !important; color: #1c5224 !important;
}
.m3-details .list-group-item-danger {
    background: #efdcdc !important; color: #7a3a3a !important;
}
html.theme-dark .m3-details .list-group-item-success { background: #28412c !important; color: #a8ecb2 !important; }
html.theme-dark .m3-details .list-group-item-danger { background: #43302f !important; color: #f0bcbc !important; }
.m3-details .list-group-item-success::before {
    content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    font-size: 11px; color: #4a8a52; flex: 0 0 auto;
}
.m3-details .list-group-item-danger::before {
    content: "\f00d"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    font-size: 11px; color: #a96a6e; flex: 0 0 auto;
}

/* Ball kartalaridagi label ikonalari */
.m3-details .card-div i.m3-ic { color: var(--md-primary); margin-right: 6px; }
.m3-details .card-div.bg-success i.m3-ic,
.m3-details .bg-success .m3-ic { color: #fff; }

/* bg-success (to'plangan ball) — sokin yashil (yorqin bootstrap o'rniga) */
.m3-details .bg-success { background: #527e58 !important; }
.m3-details .bg-info { background: var(--md-primary-container) !important; color: var(--md-on-primary-container) !important; }

@media (max-width: 768px) {
    .m3-det-hero { flex-direction: column; text-align: center; gap: 12px; }
    .m3-det-hero__meta { justify-content: center; }
}

/* =====================================================================
   23. Natija kartalari + ball indikatori (Bakalavr2025 qidiruv natijasi)
   ===================================================================== */
.m3-reslist { display: flex; flex-direction: column; gap: 12px; }
.m3-rescard {
    position: relative;
    display: flex; align-items: center; gap: 18px;
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: 18px; padding: 14px 18px; box-shadow: var(--md-elev-1);
    transition: box-shadow .15s ease, transform .15s ease;
}
.m3-rescard:hover { box-shadow: var(--md-elev-2); transform: translateY(-1px); }
.m3-rescard--hi {
    border-color: var(--md-primary);
    box-shadow: 0 0 0 1px var(--md-primary), var(--md-elev-2);
    background: var(--md-primary-container);
}
/* Chap ustun — ism / ID */
.m3-rescard__body { flex: 0 0 230px; min-width: 150px; }
.m3-rescard__name {
    display: flex; align-items: center; gap: 8px;
    font-weight: 700; font-size: 16px; color: var(--md-on-surface); overflow-wrap: anywhere;
}
.m3-rescard__name i { color: var(--md-primary); font-size: 14px; flex: 0 0 auto; }
.m3-rescard__id { font-size: 13px; color: var(--md-on-surface-variant); margin-top: 3px; }

/* Asosiy ustun — "To'plangan ball" + zamonaviy progress bar */
.m3-rescard__main { flex: 1 1 auto; min-width: 230px; display: flex; flex-direction: column; gap: 9px; }
.m3-rescard__main--na { justify-content: center; align-items: flex-start; }

.m3-score-head { display: flex; align-items: baseline; gap: 11px; flex-wrap: wrap; }
.m3-score-label {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 12px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase;
    color: var(--md-on-surface-variant);
}
.m3-score-label i { color: var(--md-primary); font-size: 12px; }
.m3-score-val { font-weight: 800; font-size: 27px; line-height: 1; }
.m3-score-chip {
    display: inline-flex; align-items: center; gap: 6px; margin-left: auto;
    font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: 999px; white-space: nowrap;
}
.m3-chip--pass { background: var(--md-success-container); color: #145a1e; }
.m3-chip--fail { background: var(--md-error-container); color: #7a1a16; }
html.theme-dark .m3-chip--pass { color: #a8ecb2; }
html.theme-dark .m3-chip--fail { color: #ffb4ab; }

/* Progress bar — jilolangan, rangli glow bilan */
.m3-pbar { display: flex; flex-direction: column; gap: 6px; }
.m3-pbar__track {
    position: relative; height: 18px; border-radius: 999px;
    background: var(--md-surface-variant);
    box-shadow: inset 0 1.5px 3px rgba(0,0,0,.18);
}
.m3-pbar__fill {
    position: relative; height: 100%; border-radius: 999px; min-width: 10px;
    transform-origin: left center; animation: m3-grow 1s cubic-bezier(.2, 0, 0, 1);
}
.m3-pbar__fill--pass { background: linear-gradient(90deg, #6f9d75, #527e58); }
.m3-pbar__fill--fail { background: linear-gradient(90deg, #c08488, #a96a6e); }
/* Yengil gloss (juda yumshoq, ko'zni qamashtirmaydi) */
.m3-pbar__fill::after {
    content: ''; position: absolute; inset: 0; border-radius: 999px; pointer-events: none;
    background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 60%);
}
.m3-pbar__knob {
    position: absolute; right: -7px; top: 50%; transform: translateY(-50%);
    width: 15px; height: 15px; border-radius: 50%; background: #fff;
    box-shadow: 0 0 0 2px rgba(255,255,255,.25), 0 1px 4px rgba(0,0,0,.32);
}
.m3-pbar__fill--pass .m3-pbar__knob { box-shadow: 0 0 0 2px rgba(82,126,88,.45), 0 1px 4px rgba(0,0,0,.32); }
.m3-pbar__fill--fail .m3-pbar__knob { box-shadow: 0 0 0 2px rgba(169,106,110,.45), 0 1px 4px rgba(0,0,0,.32); }
@keyframes m3-grow { from { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) { .m3-pbar__fill { animation: none; } }
/* Chegara markeri (56.7 / 189 = 30%) */
.m3-pbar__thmark {
    position: absolute; top: -3px; bottom: -3px; left: 30%; width: 3px;
    background: var(--md-on-surface); opacity: .35; border-radius: 3px;
}
/* Shkala (0 · 56.7 chegara · 189) */
.m3-pbar__scale { position: relative; height: 15px; font-size: 11px; color: var(--md-on-surface-variant); }
.m3-pbar__scale > span:first-child { position: absolute; left: 0; }
.m3-pbar__scale > span:last-child { position: absolute; right: 0; }
.m3-pbar__th {
    position: absolute; left: 30%; transform: translateX(-50%);
    display: inline-flex; align-items: center; gap: 4px; font-weight: 700; white-space: nowrap;
}
.m3-pbar__th i { font-size: 10px; color: var(--md-primary); }

.m3-status--pass { color: #2e7d32; }
.m3-status--fail { color: #b3261e; }
.m3-status--neutral { color: var(--md-on-surface-variant); }
html.theme-dark .m3-status--pass { color: #7fd98a; }
html.theme-dark .m3-status--fail { color: #ffb4ab; }
.m3-rescard__action { flex: 0 0 auto; }
.m3-rescard__action .btn { white-space: nowrap; }
.m3-rescard__banned { color: #e5484d; font-size: 22px; }

/* Chap status accent chizig'i */
.m3-rescard::before {
    content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
    border-radius: 18px 0 0 18px; background: var(--rescard-accent, transparent);
}
.m3-rescard--pass { --rescard-accent: #43a047; }
.m3-rescard--fail { --rescard-accent: #e5484d; }
.m3-rescard--neutral { --rescard-accent: #b8860b; }

/* Hover'da progress bar knob'i kuchayadi */
.m3-pbar__knob { transition: transform .18s ease, box-shadow .18s ease; }
.m3-rescard:hover .m3-pbar__knob { transform: translateY(-50%) scale(1.2); }

/* Kartalar ketma-ket (stagger) kirishi */
.m3-rescard { animation: m3-card-in .45s ease backwards; }
@keyframes m3-card-in { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .m3-rescard { animation: none; } }
@media (max-width: 640px) {
    .m3-rescard { flex-direction: column; align-items: stretch; gap: 12px; }
    .m3-rescard__body { flex-basis: auto; width: 100%; text-align: center; }
    .m3-rescard__name { justify-content: center; }
    .m3-rescard__main { width: 100%; min-width: 0; }
    .m3-score-val { font-size: 24px; }
    .m3-rescard__action { width: 100%; }
    .m3-rescard__action .btn { width: 100%; }
}

.m3-stat-chartcard {
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: 18px; box-shadow: var(--md-elev-1); overflow: hidden;
}
.m3-stat-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px; border-bottom: 1px solid var(--md-outline-variant);
}
.m3-stat-toolbar__title { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 15px; color: var(--md-on-surface); }
.m3-stat-toolbar__title i { color: var(--md-primary); }
.m3-stat-chartwrap { position: relative; padding: 14px; min-height: 360px; }
#chartContainer { height: 440px; }
.m3-stat-loading, .m3-stat-empty {
    position: absolute; inset: 0; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 12px;
}
.m3-stat-loading { background: var(--md-surface); }
.m3-stat-empty { color: var(--md-on-surface-variant); }
.m3-stat-empty i { font-size: 42px; opacity: .5; color: var(--md-primary); }
.m3-stat-empty p { margin: 0; font-weight: 600; }
.m3-spinner {
    width: 44px; height: 44px; border-radius: 50%;
    border: 4px solid var(--md-outline-variant); border-top-color: var(--md-primary);
    animation: m3-spin .8s linear infinite;
}
@keyframes m3-spin { to { transform: rotate(360deg); } }
.is-hidden { display: none !important; }
@media (max-width: 768px) {
    .m3-stat-filters { grid-template-columns: 1fr; }
    #chartContainer { height: 360px; }
    .m3-stat-chartwrap { padding: 8px; min-height: 320px; }
    .m3-stat-toolbar { padding: 12px 14px; }
}

/* ---------------- 6. select2 (layout'da init) ---------------- */
.select2-container--default .select2-selection--single {
    border: 1px solid var(--md-outline) !important;
    border-radius: var(--md-shape-field) !important;
    height: 48px !important; display: flex; align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 46px !important; color: var(--md-on-surface);
}
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px !important; }
.select2-dropdown { border: 1px solid var(--md-outline); border-radius: var(--md-shape-field); overflow: hidden; }

/* ---------------- 7. Til almashtirgich ---------------- */
.m3-lang-switch { margin: 0; }
.m3-lang-switch .m3-seg {
    display: inline-flex; align-items: stretch;
    border: 1px solid var(--md-outline); border-radius: 999px;
    overflow: hidden; background: #fff;
}
.m3-lang-switch .m3-seg-btn {
    display: inline-flex; align-items: center; gap: 6px;
    border: none; background: transparent; color: var(--md-on-surface-variant);
    padding: 6px 14px; font-size: 14px; font-weight: 500; letter-spacing: .3px;
    cursor: pointer; line-height: 1; transition: background .15s ease, color .15s ease;
}
.m3-lang-switch .m3-seg-btn + .m3-seg-btn { border-left: 1px solid var(--md-outline); }
.m3-lang-switch .m3-seg-btn:hover { background: var(--md-primary-container); }
.m3-lang-switch .m3-seg-btn.active { background: var(--md-primary); color: var(--md-on-primary); }
.m3-lang-switch .m3-seg-btn img {
    width: 20px; height: 14px; object-fit: cover; border-radius: 2px; display: block;
}

/* ---------------- 8. Eski card_box (kommentlangan blok uchun) ---------------- */
#card_box {
    cursor: pointer; background-color: #fff; border-radius: 20px;
    box-shadow: 0 2px 2px 0 #74838f23; display: flex; align-items: center;
    text-decoration: none; color: #323232; padding: 16px 14px; height: 100%;
}
.TextFond { font-weight: 500; font-size: 16px; display: block; font-family: "Inter", sans-serif; }

/* =====================================================================
   9. .m3-page komponentlari (Mandat Index, Bakalavr Stat va h.k.)
   ===================================================================== */
.m3-page {
    font-family: "Inter", "Segoe UI", system-ui, sans-serif;
    color: var(--md-on-surface);
    padding-bottom: 32px;
}
.m3-page .container { max-width: 1320px; }

/* Kartalar */
.m3-page .card {
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: var(--md-shape-card);
    box-shadow: var(--md-elev-1);
    margin-bottom: 16px; overflow: hidden; transition: box-shadow .2s ease;
}
.m3-page .card:hover { box-shadow: var(--md-elev-2); }
.m3-page .card-body { padding: 20px; }
.m3-page .card-header {
    background: var(--md-surface); border-bottom: 1px solid var(--md-outline-variant);
}

/* Qidiruv rejimi tablari */
.m3-page .card-div {
    cursor: pointer; border-radius: 12px; padding: 14px 12px;
    font-weight: 500; letter-spacing: .2px; color: var(--md-on-surface-variant);
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    transition: background .15s ease, color .15s ease, box-shadow .15s ease; user-select: none;
}
.m3-page .card-div:hover { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.m3-page .card-div.selected {
    background: var(--md-primary); color: var(--md-on-primary);
    border-color: var(--md-primary); box-shadow: 0 1px 3px rgba(21,101,192,.4);
}
.m3-page [id^="col-div"] > .card { box-shadow: none; background: transparent; margin-bottom: 8px; }

/* Input / Select */
.m3-page .form-control {
    border: 1px solid var(--md-outline); border-radius: var(--md-shape-field);
    background: var(--md-surface); color: var(--md-on-surface);
    min-height: 48px; padding: 10px 14px; font-size: 16px;
    transition: border-color .15s ease, box-shadow .15s ease; box-shadow: none;
}
.m3-page .form-control:focus {
    border-color: var(--md-primary); box-shadow: 0 0 0 2px rgba(21,101,192,.25); outline: none;
}
.m3-page select.form-control {
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2344474e' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat: no-repeat; background-position: right 12px center; padding-right: 40px;
}
.m3-page .form-control:disabled { background: var(--md-surface-variant); color: var(--md-on-surface-variant); opacity: .7; }

/* Tugmalar */
.m3-page .btn {
    border-radius: var(--md-shape-button); min-height: 48px; padding: 10px 24px;
    font-weight: 500; letter-spacing: .3px; border: none; box-shadow: none;
    transition: box-shadow .15s ease, background .15s ease, filter .15s ease;
}
.m3-page .btn-info { background: var(--md-primary); color: var(--md-on-primary); }
.m3-page .btn-info:hover:not(:disabled) {
    background: var(--md-primary-hover);
    box-shadow: var(--md-elev-1);
    color: var(--md-on-primary);
}
.m3-page .btn-info:disabled { background: rgba(26,28,30,.12); color: rgba(26,28,30,.38); }
.m3-page .btn-default { background: var(--md-secondary-container); color: var(--md-on-primary-container); }
.m3-page .btn-default:hover { filter: brightness(.97); box-shadow: 0 1px 3px rgba(0,0,0,.2); color: var(--md-on-primary-container); }

/* Jadval */
.m3-page .table {
    background: var(--md-surface); border-collapse: separate; border-spacing: 0; margin-bottom: 0;
    width: 100%; table-layout: auto;
}
.m3-page .table thead th {
    background: var(--md-surface-variant); color: var(--md-on-surface-variant);
    font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .3px;
    border: none; border-bottom: 1px solid var(--md-outline-variant); padding: 12px 8px;
    white-space: normal; vertical-align: middle;
}
.m3-page .table tbody td {
    border: none; border-bottom: 1px solid var(--md-outline-variant);
    padding: 12px 8px; vertical-align: middle;
    white-space: normal; word-break: break-word; font-size: 14px;
}
/* Qisqa ustunlar siqilmasin, uzun nomlar (F.I.Sh/Fakultet/OTM) o'ralsin */
.m3-page .table td .m3-chip { white-space: nowrap; }
.m3-page .table-responsive { overflow-x: visible; }
@media (min-width: 641px) {
    .m3-page .table-responsive { overflow-x: auto; }
}
.m3-page .table tbody tr { transition: background .12s ease; }
.m3-page .table.table-hover tbody tr:hover { background: rgba(48, 92, 171, .05); }
.m3-page .table tbody tr.table-success td { background: var(--md-success-container); }
.m3-page .table tbody tr.table-warning td { background: var(--md-warning-container); }
.m3-page .table tbody tr.table-danger  td { background: var(--md-error-container); }
.m3-page .table tbody tr.table-secondary td { background: var(--md-neutral-container); }
.m3-page .table tbody tr.table-info td { background: var(--md-primary-container); }
.m3-page .custom-border-info { box-shadow: inset 0 0 0 2px var(--md-primary); }
.m3-page .custom-border-info-imt td:first-child { border-left: 4px solid var(--md-primary) !important; }
.m3-page .table .btn-info {
    min-height: 36px; padding: 6px 16px; font-size: 14px;
    white-space: nowrap; word-break: normal;
    display: inline-flex; align-items: center; justify-content: center;
}
.m3-page .table td .btn { white-space: nowrap; word-break: normal; }

/* Paginatsiya */
.m3-page .pagination { flex-wrap: wrap; gap: 6px; justify-content: center; padding-top: 8px; }
.m3-page .pagination .page-item .page-link, .m3-page .pagination form .page-link {
    border: 1px solid var(--md-outline-variant); border-radius: 999px; color: var(--md-primary);
    background: var(--md-surface); min-width: 40px; min-height: 40px; padding: 8px 14px;
    font-weight: 500; display: inline-flex; align-items: center; gap: 6px; transition: background .12s ease, color .12s ease;
}
.m3-page .pagination .page-item .page-link:hover { background: var(--md-primary-container); }
.m3-page .pagination .page-item.active .page-link { background: var(--md-primary); color: var(--md-on-primary); border-color: var(--md-primary); }

/* Stat sahifasi: sarlavha izohi va grafik konteyner */
.m3-page .card-header p { color: var(--md-on-surface-variant); }
.m3-page [id^="chartContainer"] { background: var(--md-surface); border-radius: 12px; }

/* =====================================================================
   10. Mobil moslashuv
   ===================================================================== */
@media (max-width: 768px) {
    .main-header.navbar { min-height: 56px; }
    .main-header .navbar-brand img.brand-image { height: 34px !important; }
    .main-header .navbar-collapse label { font-size: 14px !important; }
    .m3-banner { font-size: 13px; }
    .main-footer { font-size: 13px; text-align: center; }
    .m3-page .card-body { padding: 16px; }
    .m3-page .table thead th, .m3-page .table tbody td { padding: 10px 8px; font-size: 14px; }
    .m3-page .card-div { padding: 12px 8px; font-size: 14px; }
    .m3-page .btn { width: 100%; }
    .m3-page .table-responsive { -webkit-overflow-scrolling: touch; border-radius: var(--md-shape-card); }
}
@media (max-width: 480px) {
    .main-header .container { padding-left: 10px; padding-right: 10px; }
    .m3-page .container { padding-left: 12px; padding-right: 12px; }
    .m3-lang-switch .m3-seg-btn .m3-lang-text { display: none; }
    .m3-lang-switch .m3-seg-btn { padding: 8px 12px; }
}

/* =====================================================================
   11. Holat chiplari (badge) — rang + ikona + matn (rang ko'rligiga chidamli)
   ===================================================================== */
.m3-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 12px; border-radius: 999px;
    font-size: 13px; font-weight: 600; line-height: 1.4;
    white-space: nowrap; border: 1px solid transparent;
}
.m3-chip i { font-size: 12px; }
.m3-chip--grant    { background: var(--md-success-container); color: #145a1e; }
.m3-chip--contract { background: var(--md-warning-container); color: #5a4300; }
.m3-chip--rejected { background: var(--md-error-container);   color: #7a1a16; }
.m3-chip--other    { background: var(--md-neutral-container); color: #44474e; }
.m3-chip--none     { background: transparent; color: #9aa0ac; font-weight: 500; }
.m3-chip--imt      { background: var(--md-primary-container); color: var(--md-on-primary-container); }
html.theme-dark .m3-chip--imt { color: #cfe0ff; }

/* Legend — dumaloq ichida mos ikona (mos rangda) */
.m3-legend .col-6, .m3-legend [class*="col-"] { margin-bottom: 6px; }
.m3-legend-ic {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 50%; font-size: 14px;
    vertical-align: middle; margin-right: 7px;
}
.m3-legend-ic--grant    { background: var(--md-success-container); color: #145a1e; }
.m3-legend-ic--contract { background: var(--md-warning-container); color: #5a4300; }
.m3-legend-ic--rejected { background: var(--md-error-container);   color: #7a1a16; }
.m3-legend-ic--other    { background: var(--md-neutral-container); color: #44474e; }
.m3-legend-ic--imt      { background: var(--md-primary-container); color: var(--md-on-primary-container); }
html.theme-dark .m3-legend-ic--grant    { color: #a8ecb2; }
html.theme-dark .m3-legend-ic--contract { color: #f4d98a; }
html.theme-dark .m3-legend-ic--rejected { color: #ffb4ab; }
html.theme-dark .m3-legend-ic--other    { color: #dfe3ec; }
html.theme-dark .m3-legend-ic--imt      { color: #cfe0ff; }

/* Ball (eng muhim raqam) — ko'zga tashlanadigan */
.m3-score { font-weight: 700; font-size: 16px; color: var(--md-on-surface); }

/* Qidirilgan abituriyent qatori — yaqqol ajraladi */
.m3-page .table tbody tr.m3-row-highlight td { background: #eaf1fd; }
.m3-page .table tbody tr.m3-row-highlight td:first-child { box-shadow: inset 4px 0 0 var(--md-primary); }

/* =====================================================================
   12. Natija "hero" kartasi (ID qidiruvda javob darrov ko'rinadi)
   ===================================================================== */
.m3-hero {
    border-radius: var(--md-shape-card); padding: 22px 24px; margin-bottom: 16px;
    box-shadow: var(--md-elev-1); border: 1px solid var(--md-outline-variant);
    display: flex; flex-wrap: wrap; align-items: center; gap: 18px;
    background: var(--md-surface);
}
.m3-hero__icon {
    width: 56px; height: 56px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 26px; flex: 0 0 auto;
}
.m3-hero__body { flex: 1 1 220px; min-width: 0; }
.m3-hero__name { font-size: 18px; font-weight: 700; color: var(--md-on-surface); margin: 0 0 2px; }
.m3-hero__id   { font-size: 13.5px; color: var(--md-on-surface-variant); margin: 0 0 4px; }
.m3-hero__id i { color: var(--md-primary); margin-right: 5px; }
.m3-hero__id b { color: var(--md-on-surface); letter-spacing: .3px; }
.m3-hero__sub  { font-size: 14px; color: var(--md-on-surface-variant); margin: 0; }
.m3-hero__score { text-align: center; flex: 0 0 auto; padding: 0 8px; }
.m3-hero__score b { display: block; font-size: 30px; font-weight: 800; line-height: 1; color: var(--md-primary); }
.m3-hero__score span { font-size: 12px; color: var(--md-on-surface-variant); text-transform: uppercase; letter-spacing: .5px; }
.m3-hero--grant    { border-left: 6px solid #2e7d32; }
.m3-hero--grant    .m3-hero__icon { background: var(--md-success-container); color: #145a1e; }
.m3-hero--contract { border-left: 6px solid #b8860b; }
.m3-hero--contract .m3-hero__icon { background: var(--md-warning-container); color: #5a4300; }
.m3-hero--rejected { border-left: 6px solid #c0392b; }
.m3-hero--rejected .m3-hero__icon { background: var(--md-error-container); color: #7a1a16; }
.m3-hero--other    { border-left: 6px solid #7a7f8c; }
.m3-hero--other    .m3-hero__icon { background: var(--md-neutral-container); color: #44474e; }
.m3-hero__status { font-weight: 700; }

/* =====================================================================
   13. Bo'sh holat (empty state)
   ===================================================================== */
.m3-empty {
    text-align: center; padding: 48px 20px; color: var(--md-on-surface-variant);
}
.m3-empty i { font-size: 52px; color: var(--md-outline); margin-bottom: 14px; }
.m3-empty h5 { font-weight: 600; color: var(--md-on-surface); margin-bottom: 6px; }
.m3-empty p { font-size: 14px; margin: 0; }

/* =====================================================================
   14. Yuklanish (loading overlay + spinner)
   ===================================================================== */
.m3-loading-overlay {
    position: fixed; inset: 0; z-index: 1080;
    background: rgba(245,247,251,.7); backdrop-filter: blur(2px);
    display: none; align-items: center; justify-content: center; flex-direction: column; gap: 14px;
}
.m3-loading-overlay.show { display: flex; }
.m3-spinner {
    width: 46px; height: 46px; border-radius: 50%;
    border: 4px solid var(--md-primary-container); border-top-color: var(--md-primary);
    animation: m3-spin .8s linear infinite;
}
.m3-loading-overlay span { color: var(--md-on-surface-variant); font-weight: 500; }
@keyframes m3-spin { to { transform: rotate(360deg); } }

/* =====================================================================
   15. Mobil "karta" ko'rinishi (jadval -> kartalar)
   ===================================================================== */
@media (max-width: 640px) {
    .m3-cards-table thead { display: none; }
    .m3-cards-table tbody, .m3-cards-table tr, .m3-cards-table td { display: block; width: 100%; }
    .m3-cards-table tbody tr {
        margin: 0 0 12px; border: 1px solid var(--md-outline-variant);
        border-radius: 14px; padding: 8px 14px; background: var(--md-surface);
        box-shadow: var(--md-elev-1);
    }
    .m3-cards-table tbody tr td {
        background: transparent !important; border: none;
        border-bottom: 1px dashed var(--md-outline-variant);
        display: flex; justify-content: space-between; align-items: center;
        gap: 12px; padding: 8px 0; text-align: right;
    }
    .m3-cards-table tbody tr td:last-child { border-bottom: none; }
    .m3-cards-table tbody tr td::before {
        content: attr(data-label); font-weight: 600; color: var(--md-on-surface-variant);
        text-align: left; flex: 0 0 42%;
    }
    /* Holatni kartaning chap chizig'i bilan ko'rsatamiz */
    .m3-cards-table tbody tr.table-success  { border-left: 5px solid #2e7d32; }
    .m3-cards-table tbody tr.table-warning  { border-left: 5px solid #b8860b; }
    .m3-cards-table tbody tr.table-danger   { border-left: 5px solid #c0392b; }
    .m3-cards-table tbody tr.table-secondary{ border-left: 5px solid #7a7f8c; }
    .m3-cards-table tbody tr.m3-row-highlight { border-left: 5px solid var(--md-primary); }
    .m3-cards-table tbody tr td:last-child .btn { width: 100%; }
    .m3-hero { flex-direction: column; text-align: center; align-items: center; }
}

/* =====================================================================
   16. Focus (klaviatura/skrinrider) — aniq halqa
   ===================================================================== */
.m3-page a:focus-visible,
.m3-page button:focus-visible,
.m3-page .form-control:focus-visible,
.m3-lang-switch button:focus-visible {
    outline: 3px solid rgba(48, 92, 171, .45);
    outline-offset: 2px;
    border-radius: 8px;
}

/* =====================================================================
   17. Dark mode (tungi rejim) — html.theme-dark (navbar tugmasi orqali)
   ===================================================================== */
html.theme-dark {
    --md-primary: #adc6ff;
    --md-primary-hover: #c6d9ff;
    --md-on-primary: #002e69;
    --md-primary-container: #284777;
    --md-on-primary-container: #dbe5ff;
    --md-secondary-container: #3b4254;
    --md-surface: #1c2026;          /* karta yuzasi — yumshoq ko'k-kulrang */
    --md-surface-variant: #12151a;  /* sahifa foni — biroz to'qroq */
    --md-on-surface: #e6e9f0;
    --md-on-surface-variant: #c5cad6;
    --md-outline: #474d59;
    --md-outline-variant: #2d323c;
    --md-success-container: #23502d;
    --md-warning-container: #4c3c14;
    --md-error-container: #5f2723;
    --md-neutral-container: #3b4350; /* surface'dan YAQQOL farqli (boshqa yo'nalish) */
    --md-banner-bg: #1e2c44;
    --md-banner-fg: #d3e0f7;
    --md-elev-1: 0 1px 2px rgba(0,0,0,.45), 0 1px 3px rgba(0,0,0,.35);
    --md-elev-2: 0 2px 10px rgba(0,0,0,.55), 0 10px 24px rgba(0,0,0,.45);
}
html.theme-dark body,
html.theme-dark body.hold-transition,
html.theme-dark body.layout-top-nav,
html.theme-dark .content-wrapper { background: var(--md-surface-variant); color: var(--md-on-surface); }

/* Chip matnlari — yorqin, kontrastli */
html.theme-dark .m3-chip--grant    { background: var(--md-success-container); color: #a8ecb2; }
html.theme-dark .m3-chip--contract { background: var(--md-warning-container); color: #f4d98a; }
html.theme-dark .m3-chip--rejected { background: var(--md-error-container);   color: #ffb4ab; }
html.theme-dark .m3-chip--other    { background: var(--md-neutral-container); color: #e3e7f0; }
html.theme-dark .m3-chip--none     { color: #828a96; }

/* Qidirilgan qator va overlay */
html.theme-dark .m3-page .table tbody tr.m3-row-highlight td { background: #26344f; }
html.theme-dark .m3-loading-overlay { background: rgba(8,10,13,.72); }

/* Select va <option> ranglari (tungi rejimda "ahmoqona" oq fon muammosi) */
html.theme-dark select.form-control {
    background-color: var(--md-surface);
    color: var(--md-on-surface);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c5cad6' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
}
html.theme-dark .form-control option { background-color: #20252d; color: var(--md-on-surface); }

/* select2 tungi rejimda */
html.theme-dark .select2-container--default .select2-selection--single { background: var(--md-surface); }
html.theme-dark .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--md-on-surface); }
html.theme-dark .select2-dropdown { background: #20252d; border-color: var(--md-outline); }
html.theme-dark .select2-container--default .select2-results__option { color: var(--md-on-surface); background: #20252d; }
html.theme-dark .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--md-primary-container); color: var(--md-on-primary-container);
}
html.theme-dark .select2-search--dropdown .select2-search__field {
    background: #181c22; color: var(--md-on-surface); border-color: var(--md-outline);
}

/* Mobil kartada "boshqa yo'nalish" chap chizig'i yorqinroq */
html.theme-dark .m3-cards-table tbody tr.table-secondary { border-left-color: #98a3b6; }

/* Navbar tungi rejim tugmasi */
.m3-theme-toggle {
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid var(--md-outline); background: var(--md-surface);
    color: var(--md-on-surface-variant); cursor: pointer; font-size: 16px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s ease, color .15s ease;
}
.m3-theme-toggle:hover { background: var(--md-primary-container); color: var(--md-on-primary-container); }

/* =====================================================================
   18. Chop etish (print) — toza, ranglar saqlanadi
   ===================================================================== */
@media print {
    .main-header, .main-footer, .m3-banner, .m3-lang-switch,
    .pagination, nav, #collapseAdvancedSearch, #collapseAdvancedSearch2,
    .m3-loading-overlay { display: none !important; }
    body, .content-wrapper, .m3-page { background: #fff !important; }
    .m3-page .card { box-shadow: none !important; border: 1px solid #ccc; }
    .m3-chip, .m3-page .table tbody tr td {
        -webkit-print-color-adjust: exact; print-color-adjust: exact;
    }
}

/* Banner yopish tugmasi */
.m3-banner { position: relative; }
.m3-banner__close {
    position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
    background: transparent; border: none; color: var(--md-banner-fg);
    cursor: pointer; font-size: 16px; line-height: 1; padding: 4px 8px; opacity: .7;
}
.m3-banner__close:hover { opacity: 1; }

/* =====================================================================
   19. Details sahifasi (M3)
   ===================================================================== */
.m3-page .btn-primary {
    background: var(--md-primary); color: var(--md-on-primary);
    border-radius: var(--md-shape-button); min-height: 38px; padding: 7px 18px;
    font-weight: 500; border: none; white-space: nowrap;
}
.m3-page .btn-primary:hover {
    background: var(--md-primary-hover); color: var(--md-on-primary); box-shadow: var(--md-elev-1);
}

/* Alert'lar -> M3 container ranglari (hardcoded #bee5eb/lavender o'rniga) */
.m3-page .alert { border: none; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; }
.m3-page .alert h4, .m3-page .alert h5 { margin: 0; font-weight: 600; }
.m3-page .alert-success { background: var(--md-success-container); color: #145a1e; }
.m3-page .alert-warning { background: var(--md-warning-container); color: #5a4300; }
.m3-page .alert-danger  { background: var(--md-error-container);   color: #7a1a16; }
.m3-page .alert-info    { background: var(--md-primary-container); color: var(--md-on-primary-container); }

/* table-bold / table-striped */
.m3-page .table-bold td, .m3-page .table-bold th { font-weight: 500; }
/* Zebra faqat status'siz qatorlarga (grant/kontrakt rangini o'chirmasligi uchun) */
.m3-page .table-striped tbody tr:not([class*="table-"]):nth-of-type(odd) td { background: rgba(0,0,0,.02); }

/* Details header xulosasi */
.m3-page .card-header .text-center b { color: var(--md-primary); }

/* Dark mode — Details */
html.theme-dark .m3-page .alert-success { color: #a8ecb2; }
html.theme-dark .m3-page .alert-warning { color: #f4d98a; }
html.theme-dark .m3-page .alert-danger  { color: #ffb4ab; }
html.theme-dark .m3-page .alert-info    { color: var(--md-on-primary-container); }
html.theme-dark .m3-page .table-striped tbody tr:not([class*="table-"]):nth-of-type(odd) td { background: rgba(255,255,255,.025); }

/* Details jadvallari -> mobilda karta ko'rinishi (data-label JS bilan qo'yiladi) */
@media (max-width: 768px) {
    .m3-details-table thead { display: none; }
    .m3-details-table tbody, .m3-details-table tr, .m3-details-table td { display: block; width: 100%; }
    .m3-details-table tbody tr {
        margin: 0 0 14px; border: 1px solid var(--md-outline-variant);
        border-radius: 14px; padding: 6px 14px; background: var(--md-surface);
        box-shadow: var(--md-elev-1); text-align: left !important;
    }
    .m3-details-table tbody tr td {
        background: transparent !important; border: none;
        border-bottom: 1px dashed var(--md-outline-variant) !important;
        display: flex; justify-content: space-between; align-items: center; gap: 12px;
        padding: 9px 0 !important; text-align: right !important;
    }
    .m3-details-table tbody tr td:last-child { border-bottom: none !important; }
    .m3-details-table tbody tr td[data-label]::before {
        content: attr(data-label); font-weight: 600; color: var(--md-on-surface-variant);
        text-align: left; flex: 0 0 44%; white-space: normal;
    }
    /* "Batafsil" tugma katakchasi (data-label'siz) — to'liq kenglik */
    .m3-details-table tbody tr td:not([data-label]) { justify-content: center; }
    .m3-details-table tbody tr td form,
    .m3-details-table tbody tr td:not([data-label]) .btn { width: 100%; }
    /* Status (kirgan yo'nalish) — kartaning chap rangli chizig'i */
    .m3-details-table tbody tr.table-success { border-left: 5px solid #2e7d32; }
    .m3-details-table tbody tr.table-warning { border-left: 5px solid #b8860b; }
}
html.theme-dark .m3-details-table tbody tr.table-success { border-left-color: #66bb6a; }
html.theme-dark .m3-details-table tbody tr.table-warning { border-left-color: #d4a017; }

/* Hero amallari (orqaga/chop) va bo'sag'a deltasi */
.m3-hero__actions { display: flex; gap: 8px; flex: 0 0 auto; }
.m3-hero__actions .btn { min-width: 46px; min-height: 46px; padding: 8px 14px; font-size: 16px; }

/* Kirgan yo'nalish belgisi (JS qo'yadi) */
.m3-accepted-badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: var(--md-primary); color: #fff; font-size: 11px; font-weight: 700;
    padding: 3px 10px; border-radius: 999px; margin-left: 8px; white-space: nowrap;
    vertical-align: middle;
}

/* Ball — sizning ballingiz o'tish ballidan yuqorimi (JS) */
.m3-details-table td.m3-ball-ok { color: #2e7d32; font-weight: 700; }
html.theme-dark .m3-details-table td.m3-ball-ok { color: #82d68c; }

@media (max-width: 768px) {
    .m3-accepted-badge { margin-left: 0; }
}

/* =====================================================================
   20. Tanlovlar TIMELINE'i (M3 kartalar, ikonalar bilan) — JS quradi
   ===================================================================== */
.m3-timeline { position: relative; padding: 6px 0; width: 100%; flex: 1 1 100%; text-align: left; }
.m3-tl-card * { text-align: left; }

.m3-tl-item { position: relative; padding-left: 58px; padding-bottom: 20px; }
.m3-tl-item:last-child { padding-bottom: 0; }
.m3-tl-item:not(:last-child)::before {
    content: ''; position: absolute; left: 20px; top: 44px; bottom: -2px;
    width: 2px; background: var(--md-outline-variant);
}
.m3-tl-node {
    position: absolute; left: 0; top: 4px; width: 42px; height: 42px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 17px; z-index: 1;
    background: var(--md-surface); border: 2px solid var(--md-outline); color: var(--md-on-surface-variant);
    box-shadow: var(--md-elev-1);
}
.m3-tl-node .fas { font-size: 18px; }
.m3-tl-item--grant .m3-tl-node    { background: #2e7d32; border-color: #2e7d32; color: #fff; }
.m3-tl-item--contract .m3-tl-node { background: #b8860b; border-color: #b8860b; color: #fff; }

.m3-tl-card {
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: 16px; padding: 18px 20px; box-shadow: var(--md-elev-1);
    transition: box-shadow .15s ease; text-align: left;
    display: grid; grid-template-columns: 1fr auto; column-gap: 18px; align-items: start;
}
.m3-tl-card:hover { box-shadow: var(--md-elev-2); }
.m3-tl-item--grant .m3-tl-card {
    border-left: 6px solid #2e7d32;
    box-shadow: 0 2px 16px rgba(46,125,50,.28), 0 1px 4px rgba(46,125,50,.20);
}
.m3-tl-item--contract .m3-tl-card {
    border-left: 6px solid #b8860b;
    box-shadow: 0 2px 16px rgba(184,134,11,.32), 0 1px 4px rgba(184,134,11,.22);
}
.m3-tl-item--grant .m3-tl-card:hover {
    box-shadow: 0 4px 22px rgba(46,125,50,.36), 0 2px 6px rgba(46,125,50,.24);
}
.m3-tl-item--contract .m3-tl-card:hover {
    box-shadow: 0 4px 22px rgba(184,134,11,.40), 0 2px 6px rgba(184,134,11,.24);
}

.m3-tl-main { grid-column: 1; grid-row: 1; min-width: 0; }
.m3-tl-aside {
    grid-column: 2; grid-row: 1; align-self: start;
    display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.m3-tl-aside .btn { min-height: 38px; white-space: nowrap; }

.m3-tl-title {
    font-weight: 700; font-size: 18px; color: var(--md-on-surface);
    margin: 0 0 6px; line-height: 1.35; overflow-wrap: anywhere;
}
.m3-tl-title .fas { color: var(--md-primary); font-size: 17px; margin-right: 9px; }

.m3-tl-sub {
    font-size: 18px; font-weight: 600; color: var(--md-on-surface);
    margin: 0 0 8px; line-height: 1.35; overflow-wrap: anywhere;
}
.m3-tl-sub .fas { color: var(--md-primary); opacity: 1; font-size: 17px; margin-right: 9px; }

.m3-tl-metarow { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.m3-tl-meta { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: var(--md-on-surface-variant); }
.m3-tl-meta .fas { opacity: .65; font-size: 13px; }

.m3-tl-prio {
    font-size: 13px; font-weight: 700; color: var(--md-on-surface-variant);
    background: var(--md-surface-variant); border: 1px solid var(--md-outline-variant);
    padding: 4px 12px; border-radius: 999px; white-space: nowrap; flex: 0 0 auto;
}
.m3-tl-tag {
    display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: 0 0 auto;
    font-size: 13px; font-weight: 700; padding: 5px 13px; border-radius: 999px;
}
.m3-tl-tag--grant    { background: var(--md-success-container); color: #145a1e; }
.m3-tl-tag--contract { background: var(--md-warning-container); color: #5a4300; }

/* O'tish ballari — bitta karta, ichida grant/kontrakt alohida kartalar */
.m3-tl-scores {
    grid-column: 1 / -1; margin-top: 14px; width: 100%; box-sizing: border-box; background: var(--md-surface-variant);
    border: 1px solid var(--md-outline-variant); border-radius: 14px; padding: 14px;
}
.m3-tl-scores-title {
    font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
    color: var(--md-on-surface-variant); margin-bottom: 10px;
}
.m3-tl-stats { display: flex; flex-wrap: wrap; gap: 12px; }
.m3-tl-stat {
    display: flex; align-items: center; gap: 12px; flex: 1 1 150px; min-width: 140px;
    background: var(--md-surface); border: 1px solid var(--md-outline-variant);
    border-radius: 12px; padding: 10px 14px;
}
.m3-tl-stat-ic {
    width: 36px; height: 36px; border-radius: 10px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    background: var(--md-surface-variant); color: var(--md-on-surface-variant); font-size: 16px;
}
.m3-tl-stat-bd { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.m3-tl-stat-lb { font-size: 13px; color: var(--md-on-surface-variant); }
.m3-tl-stat-val { font-size: 20px; font-weight: 800; color: var(--md-on-surface); }

.m3-tl-actions { margin-top: 14px; }
.m3-tl-actions .btn { min-height: 40px; }

/* Dark mode */
html.theme-dark .m3-tl-tag--grant    { color: #a8ecb2; }
html.theme-dark .m3-tl-tag--contract { color: #f4d98a; }

@media (max-width: 768px) {
    .m3-tl-item { padding-left: 42px; }
    .m3-tl-node { width: 34px; height: 34px; font-size: 14px; top: 2px; }
    .m3-tl-item:not(:last-child)::before { left: 16px; top: 36px; }
    .m3-tl-card { display: flex; flex-direction: column; padding: 16px; }
    .m3-tl-main { order: 1; }
    .m3-tl-scores { order: 2; }
    .m3-tl-aside { order: 3; width: 100%; align-self: stretch; margin-top: 14px; }
    .m3-tl-title { font-size: 16px; }
    .m3-tl-sub { font-size: 16px; }
    .m3-tl-stat { flex: 1 1 100%; }
    .m3-tl-aside form, .m3-tl-aside .btn { width: 100%; }
}

/* =====================================================================
   21. Leaderboard — reyting kartalari (jadval o'rniga)
   ===================================================================== */
.m3-rank-list { display: flex; flex-direction: column; }
.m3-rank-item {
    display: flex; align-items: center; gap: 16px;
    padding: 14px 10px; border-bottom: 1px solid var(--md-outline-variant);
    border-left: 4px solid transparent; transition: background .12s ease;
}
.m3-rank-item:last-child { border-bottom: none; }
.m3-rank-item:hover { background: rgba(48, 92, 171, .04); }
html.theme-dark .m3-rank-item:hover { background: rgba(173, 198, 255, .06); }

/* Status chap aksent rangi */
.m3-rank--grant    { border-left-color: #2e7d32; }
.m3-rank--contract { border-left-color: #b8860b; }
.m3-rank--rejected { border-left-color: #c0392b; }
.m3-rank--other    { border-left-color: #9aa4b6; }

/* Qidirilgan abituriyent (SIZ) — ajralib turadi */
.m3-rank--me {
    background: #eaf1fd; border-radius: 14px; margin: 6px 0;
    box-shadow: inset 0 0 0 2px var(--md-primary); border-bottom-color: transparent;
}
html.theme-dark .m3-rank--me { background: #26344f; }

.m3-rank-pos {
    flex: 0 0 auto; width: 44px; height: 44px; border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 19px; color: var(--md-on-surface-variant);
    background: var(--md-surface-variant); border: 1px solid var(--md-outline-variant);
}
/* Dumaloq status rangida (grant/kontrakt/...) */
.m3-rank-pos--grant    { background: var(--md-success-container); color: #145a1e; border-color: transparent; }
.m3-rank-pos--contract { background: var(--md-warning-container); color: #5a4300; border-color: transparent; }
.m3-rank-pos--rejected { background: var(--md-error-container);   color: #7a1a16; border-color: transparent; }
.m3-rank-pos--other    { background: var(--md-neutral-container); color: #44474e; border-color: transparent; }
html.theme-dark .m3-rank-pos--grant    { color: #a8ecb2; }
html.theme-dark .m3-rank-pos--contract { color: #f4d98a; }
html.theme-dark .m3-rank-pos--rejected { color: #ffb4ab; }
html.theme-dark .m3-rank-pos--other    { color: #dfe3ec; }

.m3-rank-main { flex: 1 1 auto; min-width: 0; }
.m3-rank-name {
    font-weight: 700; font-size: 17px; color: var(--md-on-surface); margin: 0 0 4px;
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap; line-height: 1.3;
}
.m3-rank-you { font-size: 11px; font-weight: 700; background: var(--md-primary); color: #fff; padding: 2px 9px; border-radius: 999px; }
.m3-rank-id { font-size: 13px; color: var(--md-on-surface-variant); margin: 0 0 6px; line-height: 1.3; }
.m3-rank-id i { color: var(--md-primary); margin-right: 5px; }
.m3-rank-id b { color: var(--md-on-surface); font-weight: 700; letter-spacing: .3px; }
.m3-rank-sub { font-size: 14px; color: var(--md-on-surface-variant); margin: 0 0 8px; line-height: 1.5; }
.m3-rank-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.m3-rank-sub .fas { opacity: .7; }
.m3-rank-sub .m3-rank-sep { opacity: .4; margin: 0 7px; }

.m3-rank-score { flex: 0 0 auto; text-align: center; padding: 0 6px; min-width: 80px; }
.m3-rank-score b { display: block; font-size: 25px; font-weight: 800; line-height: 1; color: var(--md-primary); }
.m3-rank-score span { font-size: 11px; color: var(--md-on-surface-variant); text-transform: uppercase; letter-spacing: .5px; }

.m3-rank-btn { flex: 0 0 auto; min-height: 38px; white-space: nowrap; }

@media (max-width: 768px) {
    .m3-rank-item { flex-wrap: wrap; gap: 10px 12px; padding: 14px 8px; }
    .m3-rank-pos { min-width: 34px; height: 34px; font-size: 14px; }
    .m3-rank-main { flex: 1 1 55%; }
    .m3-rank-name { font-size: 16px; }
    .m3-rank-score b { font-size: 22px; }
    .m3-rank-btn { flex: 1 1 100%; width: 100%; }
}