/* ============================================================
   ҮҮРЭГ — даалгаврын системийн шинэ дизайн (мокапын дагуу).
   Хамгийн сүүлд ачаалагдаж, суурь загварыг дарж бичнэ.
   ============================================================ */

/* ---------------- Inter фонт (локал, кирилл дэмжлэгтэй) ----------------
   Variable font тул 400–800 бүх жин нэг файлаас гарна. Интернэтгүй орчинд
   ч ажиллана — Google Fonts-оос нэг удаа татаж, төсөлд хадгалсан. */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/inter-latin.woff2') format('woff2');
    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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/inter-cyrillic.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/inter-cyrillic-ext.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

:root {
    --uu-indigo: #4f46e5;
    --uu-indigo-2: #6366f1;
    --uu-blue: #2563eb;
    --uu-side-bg: #0e1330;
    --uu-side-bg2: #151b3f;
    --uu-side-text: #aab1d6;
    --uu-page-bg: #f7f8fc;
}

/* ---------------- Хажуугийн цэс — цайвар (мокапын дагуу) ---------------- */
.nova_sidebar {
    background: #fff !important;
    border-right: 1px solid #edeef6 !important;
    color: #4b5065;
}
/* Цэсний толгой topbar-тай ижил өндөртэй — хоёр зураас нэг шугаманд. */
.nova_sidebar .nova_brand {
    border-bottom: 1px solid #f1f2f8 !important;
    min-height: 80px;
    display: flex; align-items: center;
    box-sizing: border-box;
}
.nova_sidebar .nova_brand a { color: #171a2b !important; }
.nova_sidebar .nova_brand a { display: flex; align-items: center; gap: 11px; }
.nova_sidebar .nova_logo {
    background: transparent !important;
    width: 48px; height: 48px; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
}
.nova_sidebar .nova_logo img {
    width: 46px; height: 46px; border-radius: 12px; display: block;
    box-shadow: 0 4px 10px rgba(80, 90, 220, .18);
}
.nova_sidebar .nova_brand_text {
    color: #171a2b !important; font-weight: 800; letter-spacing: .2px;
    font-size: 15.5px; line-height: 1.2;
}
.nova_sidebar .nova_brand_text small {
    color: #9aa0b5 !important; font-weight: 500; letter-spacing: 0;
    font-size: 11px; display: block; margin-top: 2px;
}
.nova_sidebar .nova_collapse_btn { color: #9aa0b5 !important; }
.nova_sidebar .nova_collapse_btn:hover { color: #171a2b !important; background: #f3f4fb !important; }

/* Бүлгийн гарчиг — том, тод (мокапын «Тохиргоо» шиг), дээрээ нарийн зураастай. */
.nova_sidebar .nova_nav_title {
    color: #1f2433 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    display: block;
    padding-top: 16px;
    margin-top: 8px;
    border-top: 1px solid #f1f2f8;
}
.nova_sidebar .nova_nav_group:first-child .nova_nav_title { border-top: 0; margin-top: 0; padding-top: 4px; }

.nova_sidebar .nova_nav_item {
    color: #5b6172 !important;
    border-radius: 999px !important;
    margin: 3px 10px;
    font-weight: 600;
    transition: background .14s, color .14s;
}
html .nova_sidebar .nova_nav_item:hover,
html:not([data-theme="dark"]) .nova_sidebar .nova_nav_item:hover {
    color: #171a2b !important;
    background: #f5f6fc !important;
    border-radius: 999px !important;
}
html .nova_sidebar .nova_nav_item:hover .nn_icon,
html .nova_sidebar .nova_nav_item:hover .lu_icon {
    color: #171a2b !important;
    stroke: #171a2b !important;
    background: transparent !important;
}
/* Идэвхтэй цэс — мокапынх шиг цайвар ягаан товруу, икон бичиг хоёул ягаан.
   enhance.css-ийн `html:not([data-theme="dark"]) .nova_nav_item.active`
   (цэнхэр градиент) гэсэн өндөр specificity-тэй дүрмийг давахын тулд
   селекторыг мөн html-ээс эхлүүлж бичив. */
html .nova_sidebar .nova_nav_item.active,
html:not([data-theme="dark"]) .nova_sidebar .nova_nav_item.active {
    color: var(--uu-indigo) !important;
    background: #eef0ff !important;
    box-shadow: none !important;
    border-left-color: transparent !important;
    border-radius: 999px !important;
    font-weight: 700;
}

/* Цэсний иконууд — энгийн шугаман дүрс, чипгүй (мокапын дагуу). */
.nova_sidebar .nova_nav_item .nn_icon {
    width: 24px; height: 24px;
    background: transparent !important;
    border-radius: 0;
    display: inline-flex; align-items: center; justify-content: center;
    color: #8a90a5 !important;
    flex: none;
    transition: color .15s;
}
.nova_sidebar .nova_nav_item .nn_icon svg { width: 20px; height: 20px; }
.nova_sidebar .nova_nav_item:hover .nn_icon { color: #171a2b !important; }
html:not([data-theme="dark"]) .nova_sidebar .nova_nav_item.active .nn_icon,
.nova_sidebar .nova_nav_item.active .nn_icon { color: var(--uu-indigo) !important; background: transparent !important; }
/* enhance.css идэвхтэй мөрийн дүрсийг ЦАГААН болгодог байсныг ягаан руу буцаана
   (хуучин цэнхэр дэвсгэр дээр цагаан байх ёстой байсан; одоо дэвсгэр цайвар). */
html .nova_sidebar .nova_nav_item.active .nn_icon,
html .nova_sidebar .nova_nav_item.active .nn_icon .lu_icon,
html .nova_sidebar .nova_nav_item.active .lu_icon {
    color: var(--uu-indigo) !important;
    stroke: var(--uu-indigo) !important;
}
html .nova_sidebar .nova_nav_item.active .duo_icon [stroke] { stroke: var(--uu-indigo) !important; }
html .nova_sidebar .nova_nav_item.active .duo_icon [fill]:not([fill="none"]) { fill: rgba(79, 70, 229, .18) !important; }

/* Тусламжийн карт (доод) */
.uu_help {
    margin: 14px 12px 6px;
    padding: 14px;
    border-radius: 14px;
    background: #f5f6fc;
    border: 1px solid #eceef8;
}
.uu_help_head { display: flex; align-items: center; justify-content: space-between; }
.uu_help_head b { font-size: 13px; color: #171a2b; }
.uu_help_ic {
    width: 26px; height: 26px; border-radius: 50%; flex: none;
    background: #eef0ff; color: var(--uu-indigo);
    display: flex; align-items: center; justify-content: center;
}
.uu_help_sub { display: block; font-size: 11.5px; color: #9aa0b5; margin: 4px 0 10px; }
.uu_help_btn {
    display: block; text-align: center; padding: 8px;
    border-radius: 9px; background: #fff; border: 1px solid #e3e5f2;
    font-size: 12.5px; font-weight: 700; color: #2c3145; text-decoration: none;
}
.uu_help_btn:hover { border-color: #c9c6f4; color: var(--uu-indigo); }
html.sidebar-collapsed .uu_help { display: none; }

/* Доод хэсэг — хэрэглэгчийн карт + гарах */
.nova_sidebar .nova_sidebar_foot { border-top: 1px solid #f1f2f8 !important; }
.uu_side_user {
    display: flex; align-items: center; gap: 10px;
    margin: 0 0 10px; padding: 10px;
    border-radius: 12px;
    background: #f8f9fd;
    border: 1px solid #eceef8;
    text-decoration: none;
}
.uu_side_user_avatar {
    width: 34px; height: 34px; border-radius: 50%; flex: none;
    background: linear-gradient(135deg, #4da3ff, #7c3aed);
    color: #fff; font-weight: 700; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.uu_side_user_avatar img { width: 100%; height: 100%; object-fit: cover; }
.uu_side_user_meta { min-width: 0; }
.uu_side_user_meta b { display: block; color: #171a2b; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uu_side_user_meta span { display: block; color: #9aa0b5; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.sidebar-collapsed .uu_side_user { display: none; }
.nova_sidebar .sb_logout {
    color: #5b6172 !important;
    border: 1px solid #e6e8f2 !important;
    background: #fff !important;
    border-radius: 10px !important;
}
.nova_sidebar .sb_logout:hover { color: #dc2626 !important; background: #fef2f2 !important; border-color: #fecaca !important; }

/* ---------------- Topbar — мокапын дагуу ---------------- */
.nova_topbar {
    background: #fff;
    border-bottom: 1px solid #edeef6;
    min-height: 80px;
    display: flex; align-items: center;
    padding-top: 12px; padding-bottom: 12px;
}
.tb_page_title { font-size: 16.5px; font-weight: 800; color: #171a2b; margin-left: 4px; }
@media (max-width: 860px) { .tb_page_title { display: none; } }
/* Topbar-ийн товчнууд — дугуй, зөөлөн дэвсгэртэй. */
.nova_topbar .theme_toggle,
.nova_topbar .notification_button {
    width: 46px !important; height: 46px !important;
    border-radius: 50% !important;
    background: #f5f6fc !important;
    border: 0 !important;
    display: inline-flex; align-items: center; justify-content: center;
    color: #4b5065 !important;
}
.nova_topbar .theme_toggle svg,
.nova_topbar .notification_button svg.bell_icon { width: 21px !important; height: 21px !important; }
.nova_topbar .theme_toggle:hover,
.nova_topbar .notification_button:hover { background: #eceef8 !important; color: #171a2b !important; }

/* Хэрэглэгчийн хэсэг — зураг + нэр + албан тушаал + сум (мокапын дагуу). */
.nova_topbar .nova_user {
    display: flex; align-items: center; gap: 10px;
    border-radius: 999px !important;
    background: transparent !important;
    border: 0 !important;
    padding: 4px 6px !important;
    cursor: pointer;
    transition: background .13s;
}
.nova_topbar .nova_user:hover { background: #f5f6fc !important; }
.nova_topbar .nova_user_avatar {
    width: 42px !important; height: 42px !important;
    border-radius: 50% !important;
    border: 2px solid #eceef8;
    font-size: 15px !important;
}
.nova_topbar .nova_user_txt { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.nova_topbar .nova_user_name { font-weight: 700 !important; color: #171a2b !important; font-size: 13.5px !important; }
.nova_topbar .nova_user_pos { font-size: 11.5px; color: #9aa0b5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nova_topbar .nova_caret { color: #9aa0b5; }
.nova_topbar .nova_user_gear { display: none !important; }
@media (max-width: 860px) {
    .nova_topbar .nova_user_txt, .nova_topbar .nova_caret { display: none !important; }
}

/* ---------------- Профайлын dropdown цэс ---------------- */
.nova_user_menu {
    min-width: 250px !important;
    border-radius: 16px !important;
    border: 1px solid #eceef8 !important;
    background: #fff !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .14) !important;
    padding: 8px !important;
    overflow: hidden;
}
.num_head {
    display: flex; align-items: center; gap: 11px;
    padding: 10px 10px 10px;
}
.num_head_avatar {
    width: 42px; height: 42px; border-radius: 50%; flex: none;
    background: linear-gradient(135deg, #4da3ff, #7c3aed);
    color: #fff; font-weight: 700; font-size: 15px;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.num_head_avatar img { width: 100%; height: 100%; object-fit: cover; }
.num_head_meta { min-width: 0; }
.num_head_meta b { display: block; font-size: 13.5px; color: #171a2b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.num_head_meta span { display: block; font-size: 11.5px; color: #9aa0b5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.num_divider { height: 1px; background: #f1f2f8; margin: 2px 6px 6px; }
.nova_user_menu .num_item {
    display: flex !important; align-items: center; gap: 10px;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    font-size: 13.5px !important; font-weight: 600 !important;
    color: #3c4155 !important;
    text-decoration: none;
    transition: background .13s;
    width: 100%;
    border: 0 !important; background: none;
    cursor: pointer; text-align: left;
}
.nova_user_menu .num_item svg { color: #8a90a5; flex: none; }
.nova_user_menu .num_item:hover { background: #f5f6fc !important; color: #171a2b !important; }
.nova_user_menu .num_logout { color: #dc2626 !important; }
.nova_user_menu .num_logout:hover { background: #fef2f2 !important; color: #b91c1c !important; }

/* ---------------- Ерөнхий дэвсгэр, товч ---------------- */
html, body, .nova_main, .nova_content { background: var(--uu-page-bg) !important; }

/* ---------------- Фонт — орчин үеийн, кирилл үсэгт тохирсон ----------------
   Хуучин "SF display" фонт кирилл үсгийг муу дүрсэлдэг байсан тул системийн
   орчин үеийн фонтын багцаар сольсон (Windows: Segoe UI, Mac: SF Pro). */
html, body, button, input, select, textarea,
h1, h2, h3, h4, h5, h6, table {
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, 'Roboto',
        'Helvetica Neue', Arial, sans-serif !important;
}

/* ---------------- Хуудасны толгойн баннер (бүх хуудсанд нэг загвар) ---------------- */
.uu_banner {
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    flex-wrap: wrap; gap: 14px;
    margin: 14px 0 20px !important;
    padding: 22px 24px !important;
    border-radius: 18px !important;
    background:
        radial-gradient(ellipse 60% 140% at 85% 0%, rgba(124, 97, 255, .12), transparent 60%),
        radial-gradient(ellipse 50% 120% at 10% 100%, rgba(59, 130, 246, .09), transparent 55%),
        #fff !important;
    border: 1px solid #e9ecf3 !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .04) !important;
}
.uu_banner_left { display: flex; align-items: center; gap: 16px; min-width: 0; }
.uu_banner_icon {
    flex: none; width: 52px; height: 52px; border-radius: 15px;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
}
.uu_banner_left h1 {
    margin: 0 !important; font-size: 20px !important; font-weight: 800 !important;
    color: #171a2b !important; line-height: 1.25 !important;
}
.uu_banner_sub { margin: 3px 0 0 !important; font-size: 13px !important; color: #7a8095 !important; }
.uu_banner_bc { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: #9aa0b5; flex: none; }
.uu_banner_bc a { color: #9aa0b5; text-decoration: none; font-weight: 600; }
.uu_banner_bc a:hover { color: var(--uu-indigo); }
.uu_banner_bc b { color: #4b5065; font-weight: 700; }
@media (max-width: 640px) { .uu_banner_bc { display: none; } }

/* ---------------- Хяналтын самбар ---------------- */
.uu_dash { max-width: 1240px; margin: 0 auto; }
.uu_hello { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin: 6px 0 18px; }
.uu_hello h1 { margin: 0; font-size: 24px; font-weight: 800; color: #111827; }
.uu_hello p { margin: 4px 0 0; font-size: 13px; color: #6b7280; }
.uu_new_btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 11px 18px; border: 0; border-radius: 11px;
    background: linear-gradient(90deg, var(--uu-indigo), var(--uu-indigo-2));
    color: #fff; font-size: 14px; font-weight: 700; cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(79,70,229,.3);
}

.uu_stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
@media (max-width: 900px) { .uu_stats { grid-template-columns: repeat(2, 1fr); } }
.uu_stat {
    background: #fff; border: 1px solid #e9ecf3; border-radius: 16px;
    padding: 16px 18px;
    box-shadow: 0 1px 3px rgba(15,23,42,.04);
}
.uu_stat_top { display: flex; align-items: center; gap: 10px; }
.uu_stat_icon {
    width: 40px; height: 40px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.uu_stat.red .uu_stat_icon { background: #fee2e2; }
.uu_stat.orange .uu_stat_icon { background: #ffedd5; }
.uu_stat.blue .uu_stat_icon { background: #dbeafe; }
.uu_stat.green .uu_stat_icon { background: #dcfce7; }
.uu_stat_label { font-size: 13px; color: #6b7280; font-weight: 600; }
.uu_stat_num { font-size: 24px; font-weight: 800; color: #111827; }
.uu_stat_num small { font-size: 12px; color: #9ca3af; font-weight: 600; margin-left: 4px; }
.uu_stat_bar { height: 5px; border-radius: 999px; background: #f1f3f8; margin-top: 12px; overflow: hidden; }
.uu_stat_bar i { display: block; height: 100%; border-radius: 999px; }
.uu_stat.red .uu_stat_bar i { background: #ef4444; }
.uu_stat.orange .uu_stat_bar i { background: #f59e0b; }
.uu_stat.blue .uu_stat_bar i { background: #3b82f6; }
.uu_stat.green .uu_stat_bar i { background: #22c55e; }

.uu_cols { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 1000px) { .uu_cols { grid-template-columns: 1fr; } }

.uu_card {
    background: #fff; border: 1px solid #e9ecf3; border-radius: 16px;
    padding: 18px;
    box-shadow: 0 1px 3px rgba(15,23,42,.04);
    margin-bottom: 16px;
}
.uu_card_head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.uu_card_head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #111827; }
.uu_card_head a { font-size: 12px; color: var(--uu-indigo); font-weight: 700; text-decoration: none; }

.uu_tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.uu_tab {
    padding: 6px 13px; border-radius: 999px; border: 1px solid #e5e7eb;
    background: #fff; font-size: 12px; font-weight: 700; color: #6b7280; cursor: pointer;
}
.uu_tab.active { background: #eef2ff; border-color: #c7d2fe; color: var(--uu-indigo); }

.uu_trow {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 4px; border-bottom: 1px solid #f1f3f8;
}
.uu_trow:last-child { border-bottom: 0; }
.uu_trow_check { flex: none; }
.uu_trow_check button {
    width: 22px; height: 22px; border-radius: 50%; border: 2px solid #d1d5db;
    background: #fff; cursor: pointer; font-size: 12px; line-height: 1; color: #fff; padding: 0;
}
.uu_trow.done .uu_trow_check button { background: #22c55e; border-color: #22c55e; }
.uu_trow.overdue .uu_trow_check button { border-color: #ef4444; }
.uu_trow_main { min-width: 0; flex: 1; }
.uu_trow_name { font-size: 13.5px; font-weight: 700; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uu_trow.done .uu_trow_name { text-decoration: line-through; color: #9ca3af; }
.uu_trow_sub { font-size: 11.5px; color: #9ca3af; margin-top: 1px; }
.uu_pill { flex: none; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.uu_pill.red { background: #fee2e2; color: #dc2626; }
.uu_pill.orange { background: #ffedd5; color: #d97706; }
.uu_pill.blue { background: #dbeafe; color: #2563eb; }
.uu_pill.green { background: #dcfce7; color: #16a34a; }
.uu_trow_date { flex: none; font-size: 11.5px; color: #9ca3af; font-variant-numeric: tabular-nums; }
.uu_trow_avatar {
    flex: none; width: 26px; height: 26px; border-radius: 50%;
    background: #e0e7ff; color: #4f46e5; font-size: 11px; font-weight: 700;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.uu_trow_avatar img { width: 100%; height: 100%; object-fit: cover; }

.uu_group_row {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 4px; border-bottom: 1px solid #f1f3f8;
    text-decoration: none;
}
.uu_group_row:last-child { border-bottom: 0; }
.uu_group_icon {
    width: 38px; height: 38px; border-radius: 11px; flex: none;
    display: flex; align-items: center; justify-content: center; font-size: 17px; color: #fff;
}
.uu_group_row:nth-child(4n+1) .uu_group_icon { background: #6366f1; }
.uu_group_row:nth-child(4n+2) .uu_group_icon { background: #f59e0b; }
.uu_group_row:nth-child(4n+3) .uu_group_icon { background: #22c55e; }
.uu_group_row:nth-child(4n+0) .uu_group_icon { background: #ef4444; }
.uu_group_name { font-size: 13.5px; font-weight: 700; color: #111827; }
.uu_group_sub { font-size: 11.5px; color: #9ca3af; }

.uu_act { display: flex; gap: 10px; padding: 8px 4px; border-bottom: 1px solid #f1f3f8; }
.uu_act:last-child { border-bottom: 0; }
.uu_act_avatar {
    flex: none; width: 30px; height: 30px; border-radius: 50%;
    background: #e0e7ff; color: #4f46e5; font-size: 12px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.uu_act_text { font-size: 12.5px; color: #374151; line-height: 1.45; }
.uu_act_text b { color: #111827; }
.uu_act_time { font-size: 11px; color: #9ca3af; margin-top: 1px; }
.uu_empty { font-size: 12.5px; color: #9ca3af; padding: 10px 4px; }

/* Нэвтрэх/бүртгэх хуудасны лого — үсгийн оронд зураг. */
.lg_logo.lg_logo_img { background: transparent !important; box-shadow: none !important; padding: 0 !important; }
.lg_logo.lg_logo_img img { width: 60px; height: 60px; border-radius: 16px; display: block; margin: 0 auto; }

/* ---------------- Модалууд — үргэлж бүтэн дэлгэцийг бүрхэнэ ----------------
   Эцэг элемент transform/animation-тай үед position:fixed тэр элементэд
   харьцангуй болж, саарал дэвсгэр жижигхэн гардаг байв. JS нь модалыг
   <body> руу шилжүүлдэг; энд нэмэлтээр бүх талаас нь бэхэлнэ. */
.gx_modal, .gs_modal, .pf_modal, .gr_modal {
    position: fixed !important;
    top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
    width: 100vw; height: 100vh;
    z-index: 1000 !important;
}