/*
 * Cubinto админ — апп-ын дизайнтай ижил харагдуулах нэмэлт загвар.
 * Апп: цэнхэр толгой (#3B5BDB) + цагаан бөмбөлөг, #F2F5FA дэвсгэр, Nunito Sans фонт, бөөрөнхий карт.
 * Зөвхөн цайвар горимд хэрэглэнэ (харанхуй горим unfold-ийн анхдагчаар үлдэнэ).
 */
@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,400;6..12,600;6..12,700;6..12,800&display=swap");

:root {
  --cub-blue: #3B5BDB;
  --cub-blue-dark: #2F4AB8;
  --cub-surface: #F2F5FA;
  --cub-text: #10213F;
  --cub-sub: #5A6B87;
  --cub-line: #E3E8F1;
}

/* ── Фонт ба бөөрөнхий булан ─────────────────────────────────────────────── */
body, .font-sans, input, button, select, textarea, h1, h2, h3 {
  font-family: "Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
.rounded-default { border-radius: 12px !important; }

/* ── Зүүн цэс: апп-ын толгой шиг цэнхэр, бөмбөлөгтэй ──────────────────────── */
html:not(.dark) div:has(> #nav-sidebar),
html:not(.dark) #nav-sidebar {
  background: var(--cub-blue) !important;
  border-color: transparent !important;
}
html:not(.dark) #nav-sidebar { overflow: hidden; }
html:not(.dark) #nav-sidebar::before,
html:not(.dark) #nav-sidebar::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  pointer-events: none;
}
html:not(.dark) #nav-sidebar::before { width: 240px; height: 240px; top: -80px; right: -90px; }
html:not(.dark) #nav-sidebar::after { width: 180px; height: 180px; bottom: 40px; left: -70px; background: rgba(255, 255, 255, 0.06); }

html:not(.dark) #nav-sidebar-inner {
  position: relative;
  z-index: 1;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.92) !important;
}
html:not(.dark) #nav-sidebar-inner a,
html:not(.dark) #nav-sidebar-inner h2,
html:not(.dark) #nav-sidebar-inner .text-important,
html:not(.dark) #nav-sidebar-inner .text-subtle,
html:not(.dark) #nav-sidebar-inner .material-symbols-outlined {
  color: rgba(255, 255, 255, 0.92) !important;
}
html:not(.dark) #nav-sidebar-inner .text-subtle { color: rgba(255, 255, 255, 0.72) !important; }

/* Брэнд: цагаан дэвсгэр дээрх лого */
html:not(.dark) #nav-sidebar-inner > div:first-child { border-color: rgba(255, 255, 255, 0.16) !important; }
html:not(.dark) #nav-sidebar-inner > div:first-child img {
  background: #fff;
  border-radius: 12px;
  padding: 4px;
  box-shadow: 0 4px 14px rgba(16, 33, 63, 0.18);
}
html:not(.dark) #site-name a { font-weight: 800 !important; font-size: 16px; }

/* Бүлгийн гарчиг */
html:not(.dark) #nav-sidebar-inner h2 {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62) !important;
}
html:not(.dark) #nav-sidebar-inner hr { border-color: rgba(255, 255, 255, 0.14) !important; }

/* Цэсний мөр: hover — цайвар, идэвхтэй — цагаан "pill" */
html:not(.dark) #nav-sidebar-inner ol a {
  font-weight: 700;
  border-radius: 12px !important;
  background: transparent !important;
}
html:not(.dark) #nav-sidebar-inner ol a:hover { background: rgba(255, 255, 255, 0.12) !important; }
html:not(.dark) #nav-sidebar-inner ol a.active {
  background: #fff !important;
  color: var(--cub-blue) !important;
  box-shadow: 0 6px 16px rgba(16, 33, 63, 0.16);
}
html:not(.dark) #nav-sidebar-inner ol a.active * { color: var(--cub-blue) !important; }

/* Хайлтын талбар */
html:not(.dark) #nav-sidebar-inner .shadow-xs.bg-white {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
}
html:not(.dark) #nav-filter { color: #fff !important; background: transparent !important; }
html:not(.dark) #nav-filter::placeholder { color: rgba(255, 255, 255, 0.72) !important; }
html:not(.dark) #nav-sidebar-inner kbd {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* Доод хэрэглэгчийн хэсэг */
html:not(.dark) #nav-sidebar-inner > div:last-child { border-color: rgba(255, 255, 255, 0.16) !important; }
html:not(.dark) #nav-sidebar-inner > div:last-child > div.cursor-pointer:hover { background: rgba(255, 255, 255, 0.1) !important; }
html:not(.dark) #nav-sidebar-inner > div:last-child > div.cursor-pointer > div:first-child {
  background: #fff !important;
  color: var(--cub-blue) !important;
}

/* Цэс доторх цагаан цонхнууд (хэрэглэгчийн цэс, хайлтын үр дүн) — бичгийг харанхуй хэвээр үлдээнэ */
html:not(.dark) #nav-sidebar-inner nav.absolute,
html:not(.dark) #nav-sidebar-inner nav.absolute a,
html:not(.dark) #nav-sidebar-inner nav.absolute span,
html:not(.dark) #nav-sidebar-inner nav.absolute button,
html:not(.dark) #search-results,
html:not(.dark) #search-results a,
html:not(.dark) #search-results span {
  color: var(--cub-text) !important;
}
html:not(.dark) #nav-sidebar-inner nav.absolute .text-red-700 { color: #b91c1c !important; }

/* ── Ажлын талбар: апп шиг саарал-цэнхэр дэвсгэр, цагаан карт ──────────────── */
html:not(.dark) #main { background: var(--cub-surface) !important; }
html:not(.dark) #main > div:first-child {
  background: #fff !important;
  border-color: var(--cub-line) !important;
}
html:not(.dark) #content .border-base-200 { border-color: var(--cub-line) !important; }
html:not(.dark) #content .shadow-xs { box-shadow: 0 6px 22px rgba(59, 91, 219, 0.06) !important; }
html:not(.dark) #content a.shadow-xs:hover { box-shadow: 0 10px 28px rgba(59, 91, 219, 0.14) !important; }

/* Товч, оролтын талбар */
html:not(.dark) button[type="submit"], html:not(.dark) .bg-primary-600 { font-weight: 800 !important; }
html:not(.dark) input:focus, html:not(.dark) textarea:focus, html:not(.dark) select:focus {
  outline-color: var(--cub-blue) !important;
}

/* ── Хянах самбарын толгой (апп-ын нүүр шиг) ──────────────────────────────── */
.cub-hero {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background: var(--cub-blue);
  color: #fff;
  padding: 28px 28px 72px;
}
.cub-hero::before, .cub-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  pointer-events: none;
}
.cub-hero::before { width: 260px; height: 260px; top: -110px; right: -60px; }
.cub-hero::after { width: 160px; height: 160px; bottom: -70px; left: 30%; background: rgba(255, 255, 255, 0.06); }
.cub-hero-row { position: relative; z-index: 1; display: flex; align-items: center; gap: 16px; }
.cub-hero-avatar {
  width: 52px; height: 52px; border-radius: 16px; background: #fff; color: var(--cub-blue);
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 22px;
}
.cub-hero-hi { font-size: 13px; opacity: 0.85; font-weight: 600; }
.cub-hero-name { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.cub-hero-sub { font-size: 13px; opacity: 0.85; margin-top: 2px; }
.cub-hero-chip {
  margin-left: auto; position: relative; z-index: 1;
  background: rgba(255, 255, 255, 0.16); border-radius: 12px; padding: 8px 12px;
  font-size: 13px; font-weight: 700; white-space: nowrap;
}
.cub-kpis { margin-top: -56px; padding: 0 16px; position: relative; z-index: 2; }
@media (max-width: 767px) {
  .cub-hero-chip { display: none; }
  .cub-hero { padding: 22px 20px 68px; }
}
