/* ==========================================================================
   BARCHA NATIJALAR — boshqaruvchi paneli (/natijalar, NatijalarView)
   Profil sahifasining bloklari (.profil-stat, .profil-tarix, .korsatkich)
   qayta ishlatiladi; bu yerda faqat ro'yxat, filtr va tafsilot qismi.
   ========================================================================== */

.nt-page { --nt-alo: var(--maydon); --nt-yaxshi: var(--kok); --nt-qoniqarli: var(--oltin); --nt-past: var(--gil); }

/* ---------- sarlavha ---------- */

.nt-bosh {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    padding-bottom: 1.75rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid var(--chiziq);
}

.nt-bosh__matn { flex: 1 1 420px; min-width: 0; }
.nt-bosh__matn h1 { font-size: clamp(1.7rem, 2.6vw, 2.3rem); margin: 0.8rem 0 0.4rem; }
.nt-bosh__matn p { max-width: 62ch; color: var(--siyoh-3); font-size: 0.95rem; }

.nt-bosh__amallar { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.nt-bosh__amallar[hidden] { display: none; }
.nt-bosh__amallar .btn svg { width: 16px; height: 16px; }

/* ---------- asboblar paneli ---------- */

.nt-asbob {
    position: sticky;
    top: calc(var(--navbar-height) + 0.5rem);
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
    padding: 0.6rem;
    margin-bottom: 1.25rem;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(var(--blur-md));
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
}

.nt-tablar {
    display: inline-flex;
    padding: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--qogoz);
    border: 1px solid var(--chiziq);
}

.nt-tablar button {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-pill);
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--siyoh-3);
    transition: background var(--duration-fast), color var(--duration-fast);
}

.nt-tablar button svg { width: 16px; height: 16px; }
.nt-tablar button:hover { color: var(--siyoh); }
.nt-tablar button[aria-selected="true"] { background: var(--kok); color: #fff; box-shadow: var(--shadow-glow); }

.nt-qidiruv {
    flex: 1 1 240px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0.9rem;
    min-height: 42px;
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-pill);
    background: #fff;
    color: var(--siyoh-4);
}

.nt-qidiruv:focus-within { border-color: var(--kok); box-shadow: 0 0 0 3px var(--kok-yumshoq); }
.nt-qidiruv svg { width: 17px; height: 17px; flex: none; }
.nt-qidiruv input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; color: var(--siyoh); }

.nt-tanlov {
    min-height: 42px;
    padding: 0 2.2rem 0 0.9rem;
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-pill);
    font: inherit;
    font-size: 0.9rem;
    color: var(--siyoh);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235b6b82' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 0.9rem center;
    appearance: none;
    cursor: pointer;
}

.nt-tanlov:focus { outline: 0; border-color: var(--kok); box-shadow: 0 0 0 3px var(--kok-yumshoq); }
.nt-tanlov[hidden] { display: none; }

/* ---------- ro'yxat: talaba / topshiriq kartasi ---------- */

.nt-royxat { display: grid; gap: 0.55rem; }

.nt-karta {
    background: var(--qogoz-2);
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--duration-fast), border-color var(--duration-fast);
}

.nt-karta:hover { border-color: var(--chiziq-2); }
.nt-karta.is-ochiq { border-color: rgba(var(--kok-rgb), 0.45); box-shadow: var(--shadow-md); }
.nt-karta.is-bosh .nt-nom b { color: var(--siyoh-3); }

.nt-qator {
    width: 100%;
    display: grid;
    grid-template-columns: 44px minmax(180px, 2.2fr) repeat(4, minmax(70px, 0.8fr)) minmax(130px, 1.2fr) 28px;
    align-items: center;
    gap: 1rem;
    padding: 0.8rem 1rem;
    text-align: left;
    border-radius: inherit;
    cursor: pointer;
}

.nt-qator:focus-visible { outline: 2px solid var(--kok); outline-offset: 2px; }

.nt-avatar {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--kok-yumshoq);
    color: var(--kok);
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 0.95rem;
}

.nt-avatar.is-admin { background: var(--siyoh); color: #fff; }
.nt-avatar--top { border-radius: var(--radius-md); }
.nt-avatar svg { width: 21px; height: 21px; }

.nt-nom { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.nt-nom b { font-size: 0.98rem; color: var(--siyoh); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-nom small { font-size: 0.78rem; color: var(--siyoh-4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.nt-kat { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }

.nt-kat::before {
    content: attr(data-yorliq);
    font-family: var(--font-mono);
    font-size: 0.66rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--siyoh-4);
    white-space: nowrap;
}

.nt-kat b { font-family: var(--font-display); font-size: 1rem; color: var(--siyoh); white-space: nowrap; }
.nt-kat--sana b { font-family: var(--font-sans); font-size: 0.86rem; font-weight: 600; color: var(--siyoh-2); }

.nt-strelka { display: grid; place-items: center; color: var(--siyoh-4); transition: transform var(--duration-fast); }
.nt-strelka svg { width: 18px; height: 18px; }
.nt-karta.is-ochiq .nt-strelka { transform: rotate(180deg); color: var(--kok); }

/* foiz — daraja rangida */
.nt-foiz { font-family: var(--font-display); }
.nt-foiz[data-d="alo"] { color: var(--maydon-2); }
.nt-foiz[data-d="yaxshi"] { color: var(--kok); }
.nt-foiz[data-d="qoniqarli"] { color: var(--oltin-2); }
.nt-foiz[data-d="past"] { color: var(--gil); }
.nt-ball { margin-left: 0.35rem; font-size: 0.78rem; color: var(--siyoh-4); }

/* taqsimot chizig'i (topshiriq kartasida) */
.nt-taqsimot {
    display: flex;
    gap: 2px;
    height: 10px;
    margin-top: 0.3rem;
    border-radius: var(--radius-pill);
    overflow: hidden;
    background: var(--chiziq);
}

.nt-taqsimot i, .nt-daraja-yorliq i { display: block; min-width: 4px; }
[data-d="alo"] > i, .nt-taqsimot i[data-d="alo"] { background: var(--nt-alo); }
[data-d="yaxshi"] > i, .nt-taqsimot i[data-d="yaxshi"] { background: var(--nt-yaxshi); }
[data-d="qoniqarli"] > i, .nt-taqsimot i[data-d="qoniqarli"] { background: var(--nt-qoniqarli); }
[data-d="past"] > i, .nt-taqsimot i[data-d="past"] { background: var(--nt-past); }

/* ---------- ochilgan karta ---------- */

.nt-tana:empty { display: none; }
.nt-tana { padding: 0 1rem 1rem; border-top: 1px dashed var(--chiziq); }

.nt-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    align-items: center;
    padding: 0.9rem 0.25rem;
    font-size: 0.85rem;
    color: var(--siyoh-3);
}

.nt-meta > span { display: inline-flex; align-items: center; gap: 0.4rem; }
.nt-meta svg { width: 15px; height: 15px; color: var(--siyoh-4); }

.nt-daraja-yorliq i { width: 10px; height: 10px; border-radius: 3px; }
.nt-daraja-yorliq b { color: var(--siyoh); }

.nt-havola { margin-left: auto; display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 600; color: var(--kok); }
.nt-havola svg { width: 15px; height: 15px; }
.nt-havola:hover { text-decoration: underline; }

.nt-izoh { padding: 0.5rem 0.25rem; color: var(--siyoh-3); font-size: 0.9rem; }

.nt-jadval-wrap { border-radius: var(--radius-lg); box-shadow: none; }
.nt-jadval { min-width: 680px; font-size: 0.88rem; }
.nt-jadval th { padding: 0.65rem 0.9rem; }
.nt-jadval td { padding: 0.6rem 0.9rem; }
.nt-jadval .profil-tarix__nom small { display: block; font-weight: 400; font-size: 0.76rem; color: var(--siyoh-4); }
.nt-jadval__amal { text-align: right; width: 1%; }

.nt-tafsilot-tugma {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.35rem 0.75rem;
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-pill);
    background: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--siyoh-2);
    white-space: nowrap;
}

.nt-tafsilot-tugma svg { width: 14px; height: 14px; transition: transform var(--duration-fast); }
.nt-tafsilot-tugma:hover { border-color: var(--kok); color: var(--kok); }
.nt-tafsilot-tugma.is-ochiq { background: var(--kok); border-color: var(--kok); color: #fff; }
.nt-tafsilot-tugma.is-ochiq svg { transform: rotate(180deg); }

/* ---------- urinish tafsiloti ---------- */

.profil-tarix tbody tr.nt-tafsilot-qator,
.profil-tarix tbody tr.nt-tafsilot-qator:hover { background: var(--kok-yumshoq); }
.nt-tafsilot-qator > td { padding: 0.9rem !important; }

.nt-tafsilot {
    display: grid;
    gap: 0.9rem;
    padding: 1rem 1.1rem;
    background: #fff;
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-md);
    white-space: normal;
}

.nt-tafsilot .loader { padding: 1rem 0; }

.nt-dl {
    display: grid;
    grid-template-columns: minmax(140px, max-content) 1fr;
    gap: 0.35rem 1.25rem;
    font-size: 0.87rem;
}

.nt-dl dt { color: var(--siyoh-4); }
.nt-dl dd { color: var(--siyoh); font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.nt-dl--ichki { font-size: 0.83rem; }

.nt-kichik { font-size: 0.85rem; margin-bottom: 0.4rem; color: var(--siyoh-2); }

/* .profil-tarix ichida turadi — uning qora sarlavhasi va zebrasi bu yerga o'tmasin */
.nt-tafsilot .nt-mini { width: auto; min-width: 0; border-collapse: collapse; font-size: 0.82rem; font-weight: 400; }
.nt-tafsilot .nt-mini th,
.nt-tafsilot .nt-mini td {
    padding: 0.3rem 1.4rem 0.3rem 0;
    text-align: left;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--chiziq);
    color: var(--siyoh);
}
.nt-tafsilot .nt-mini th { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--siyoh-4); font-weight: 500; }
.nt-tafsilot .nt-mini tbody tr,
.nt-tafsilot .nt-mini tbody tr:hover { background: none; }
.nt-tafsilot .nt-mini td:first-child { color: var(--siyoh-3); }

/* test-topshiriq javoblari */
.nt-savollar { display: grid; gap: 0.45rem; }

.nt-savollar li {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 0.7rem;
    padding: 0.6rem 0.75rem;
    border-radius: var(--radius-md);
    border-left: 3px solid var(--chiziq-2);
    background: var(--qogoz);
}

.nt-savollar li[data-holat="togri"] { border-left-color: var(--maydon); }
.nt-savollar li[data-holat="xato"] { border-left-color: var(--gil); background: var(--gil-yumshoq); }

.nt-savollar__raqam {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #fff;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    color: var(--siyoh-3);
}

[data-holat="togri"] .nt-savollar__raqam { background: var(--maydon); color: #fff; }
[data-holat="xato"] .nt-savollar__raqam { background: var(--gil); color: #fff; }

.nt-savollar p { font-size: 0.88rem; color: var(--siyoh); font-weight: 600; margin-bottom: 0.15rem; }
.nt-savollar small { font-size: 0.8rem; color: var(--siyoh-3); }
.nt-savollar small b { color: var(--siyoh-2); }

/* anketa javoblari */
.nt-anketa { display: grid; gap: 0.8rem; counter-reset: nt-anketa; }
.nt-anketa li { counter-increment: nt-anketa; padding-left: 2rem; position: relative; }

.nt-anketa li::before {
    content: counter(nt-anketa);
    position: absolute;
    left: 0;
    top: 0.05rem;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    color: var(--kok);
}

.nt-anketa b { display: block; font-size: 0.87rem; color: var(--siyoh-2); margin-bottom: 0.2rem; }
.nt-anketa p { font-size: 0.92rem; color: var(--siyoh); white-space: pre-wrap; overflow-wrap: anywhere; }
.nt-anketa p.is-neytral { font-weight: 400; font-style: italic; }

/* ---------- guruh (topshiriqlar ko'rinishi) ---------- */

.nt-guruh { margin-bottom: 2rem; }

.nt-guruh__sarlavha {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.8rem;
    font-size: 1.15rem;
}

.nt-guruh__ikon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-md); background: var(--siyoh); color: #fff; }
.nt-guruh__ikon svg { width: 17px; height: 17px; }

/* ---------- sahifalagich ---------- */

.nt-sahifa {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    margin-top: 1rem;
    padding: 0.6rem 0.75rem;
    background: var(--qogoz-2);
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.nt-sahifa__hisob { font-size: 0.86rem; color: var(--siyoh-3); }
.nt-sahifa__hisob b { font-family: var(--font-mono); font-weight: 500; color: var(--siyoh); }

.nt-sahifa__tugmalar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem; }

.nt-sahifa__tugmalar button {
    display: grid;
    place-items: center;
    min-width: 36px;
    height: 36px;
    padding: 0 0.55rem;
    border: 1px solid var(--chiziq);
    border-radius: var(--radius-md);
    background: #fff;
    font-family: var(--font-mono);
    font-size: 0.85rem;
    color: var(--siyoh-2);
    transition: border-color var(--duration-fast), color var(--duration-fast), background var(--duration-fast);
}

.nt-sahifa__tugmalar button svg { width: 16px; height: 16px; }
.nt-sahifa__oldingi svg { transform: rotate(180deg); }
.nt-sahifa__tugmalar button:hover:not(:disabled) { border-color: var(--kok); color: var(--kok); }
.nt-sahifa__tugmalar button[aria-current="page"] { background: var(--kok); border-color: var(--kok); color: #fff; box-shadow: var(--shadow-glow); }
.nt-sahifa__tugmalar button:disabled { opacity: 0.4; cursor: default; }
.nt-sahifa__uzilish { min-width: 20px; text-align: center; color: var(--siyoh-4); }

.nt-tanlov--kichik { min-height: 36px; font-size: 0.85rem; }

/* karta ichidagi jadval ostida — ixchamroq, ramkasiz */
.nt-sahifa--kichik { margin-top: 0.6rem; padding: 0.2rem 0.25rem; background: none; border: 0; box-shadow: none; }
.nt-sahifa--kichik .nt-sahifa__tugmalar button { min-width: 32px; height: 32px; font-size: 0.8rem; }

/* ---------- moslashuvchan ---------- */
/* .nt-qator bolalari: 1 avatar · 2 nom · 3–6 ko'rsatkichlar · 7 sana/taqsimot · 8 strelka */

@media (max-width: 1080px) {
    .nt-qator { grid-template-columns: 44px minmax(0, 1fr) repeat(3, minmax(64px, auto)) 28px; }
    .nt-qator > :nth-child(6), .nt-qator > :nth-child(7) { display: none; }
}

@media (max-width: 720px) {
    .nt-asbob { position: static; }
    .nt-tablar { width: 100%; }
    .nt-tablar button { flex: 1; justify-content: center; }
    .nt-tanlov { flex: 1 1 140px; }

    .nt-qator { grid-template-columns: 40px repeat(3, minmax(0, 1fr)) 24px; row-gap: 0.55rem; column-gap: 0.75rem; }
    .nt-avatar { width: 40px; height: 40px; }
    .nt-nom { grid-column: 2 / 5; }
    .nt-strelka { grid-column: 5; grid-row: 1; }
    .nt-qator > :nth-child(3) { grid-row: 2; grid-column: 2; }
    .nt-qator > :nth-child(4) { grid-row: 2; grid-column: 3; }
    .nt-qator > :nth-child(5) { grid-row: 2; grid-column: 4; }

    .nt-havola { margin-left: 0; }
    .nt-dl { grid-template-columns: 1fr; gap: 0.1rem; }
    .nt-dl dd { margin-bottom: 0.4rem; }
}