/* ===================================================================
   Ommaviy sahifalar qobig'i: CHAP yon menyu + asosiy maydon.

   Yuqoridagi gorizontal menyu o'rniga yon menyu — chunki bo'limlar
   soni o'sib boradi (restoran, to'yxona, yangiliklar, profil) va
   gorizontal qatorda ular siqilib qoladi. Yon menyuda esa har bir
   bo'lim o'z nomi bilan to'liq ko'rinadi.
   =================================================================== */
.shell { display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); min-height: 100vh; }

.side-nav {
  position: sticky; top: 0; z-index: var(--z-sidebar);
  height: 100vh; overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: var(--sp-1);
  padding: var(--sp-5) var(--sp-3);
  background: var(--surface);
  border-right: 1px solid var(--line);
}

.side-nav .brand {
  display: flex; align-items: center; gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3) var(--sp-1);
  font-family: var(--font-display); font-weight: 700; font-size: 24px;
  color: var(--ink);
}
.side-nav .brand .dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--gold-shine); box-shadow: var(--gold-glow);
}
.side-nav .brand-sub {
  padding: 0 var(--sp-3) var(--sp-5);
  font-size: var(--fs-xs); color: var(--ink-faint); line-height: 1.35;
}

.nav-group-label {
  padding: var(--sp-4) var(--sp-3) var(--sp-2);
  font-size: var(--fs-2xs); font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-faint);
}

.nav-item {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: 10px var(--sp-3); border-radius: var(--radius-s);
  font-size: var(--fs-base); font-weight: 600; color: var(--ink-soft);
  transition: background var(--transition), color var(--transition);
}
.nav-item:hover { background: var(--surface-2); color: var(--ink); }
.nav-item.active { background: var(--emerald-900); color: var(--white); }
:root[data-theme="dark"] .nav-item.active { background: var(--theme-accent); color: var(--on-accent); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .nav-item.active { background: var(--theme-accent); color: var(--on-accent); }
}
.nav-item .ic { width: 22px; text-align: center; font-size: var(--fs-md); }
.nav-item .count-pill { margin-left: auto; }

.side-nav-bottom {
  margin-top: auto; padding-top: var(--sp-4);
  border-top: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: var(--sp-2);
}

/* Faqat ikonkali tugma — KVADRAT va ixcham boshqaruv balandligida
   (`--ctl-h-sm`). Yuqori paneldagi qo'ng'iroq, til tanlagichi va
   foydalanuvchi tugmasi ham aynan shu balandlikda, ya'ni panel qatori
   tekis chiziqda turadi. */
.icon-btn {
  width: var(--ctl-h-sm); height: var(--ctl-h-sm); flex-shrink: 0;
  display: grid; place-items: center; border-radius: 50%;
  background: var(--surface-2); color: var(--ink-soft); font-size: var(--fs-base);
  transition: all var(--transition);
}
.icon-btn:hover { background: var(--ink); color: var(--surface); }

/* Foydalanuvchi bloki */
.nav-user {
  display: flex; align-items: center; gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-s);
  background: var(--surface-2);
}
.nav-user .meta { min-width: 0; display: flex; flex-direction: column; }
.nav-user .name { font-size: var(--fs-sm); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-user .role { font-size: var(--fs-2xs); color: var(--ink-faint); }

/* Asosiy maydon */
.shell-main { min-width: 0; display: flex; flex-direction: column; background: var(--ground); }

/* Poyloq DOIM pastda tursin.

   Mazmuni kalta sahifada (masalan bo'sh "Bronlarim") poyloq ekran
   o'rtasiga ko'tarilib qolardi — chunki flex ustunda o'sadigan element
   yo'q edi. Asosiy maydonga `flex: 1` berilgach, u bo'sh joyni to'ldiradi
   va poyloq pastga yopishadi. */
.shell-main > main { flex: 1 0 auto; }
.shell-main > .footer { flex-shrink: 0; }
.dash-content { padding: var(--sp-6) var(--sp-8) var(--sp-16); display: flex; flex-direction: column; gap: var(--sp-5); }

/* --- mobil --- */
@media (max-width: 940px) {
  .shell { grid-template-columns: 1fr; }
  .side-nav {
    position: fixed; inset: 0 auto 0 0; width: 268px;
    transform: translateX(-100%); transition: transform var(--transition);
    box-shadow: none;
  }
  .side-nav.open { transform: none; box-shadow: var(--shadow-lg); }
  .dash-content { padding: var(--sp-5) var(--sp-4) var(--sp-12); }
  .nav-scrim {
    position: fixed; inset: 0; z-index: calc(var(--z-sidebar) - 1);
    background: var(--overlay-bg); backdrop-filter: blur(2px);
  }
  .nav-scrim[hidden] { display: none; }
}

/* ===================================================================
   Brend logotipi — yon menyudan tashqarida ham ishlatiladi
   (kirish sahifasi, poyloq). Avval navbar CSS'ida edi.
   =================================================================== */
.logo {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  /* 24 px — `.side-nav .brand` bilan AYNAN bir xil. Ilgari bu yerda
     23 px turardi: bitta brend lokupi ikki joyda bir piksel farq
     bilan chizilardi. Tokenga o'tkazilmadi — `--fs-xl` 26 px, ya'ni
     ikki piksel kattaroq bo'lardi va brend belgisi (28-30 px rasm)
     yonidagi muvozanat buzilardi. */
  font-family: var(--font-display); font-weight: 700; font-size: 24px;
  color: var(--ink); letter-spacing: -.01em;
}
.logo .dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--gold-shine); box-shadow: var(--gold-glow);
}