/* Dashboard layout */
.layout {
  display: flex;
  min-height: calc(100vh - var(--navbar-height));
  margin-top: var(--navbar-height);
}

/* Keep navbar fixed so it never auto-hides on scroll */
.navbar-glass {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1045; /* above sidebar (1020) but below Bootstrap modals (1055) */
}

/* Sidebar */
.sidebar {
  width: 260px;
  background: var(--surface);
  border-right: 1px solid rgba(0,0,0,0.05);
  position: sticky;
  top: var(--navbar-height);
  height: calc(100vh - var(--navbar-height));
  padding-top: .75rem;
  transition: transform .25s ease;
  z-index: 1020; /* below navbar */
}
.sidebar-header { border-bottom: 1px solid rgba(0,0,0,0.05); }
.sidebar .nav-link {
  color: var(--text);
  padding: .65rem .9rem;
  border-radius: 10px;
  margin: .15rem .35rem;
  display: flex;
  align-items: center;
  gap: .35rem;
  transition: background-color .2s ease, color .2s ease;
}
.sidebar .nav-link:hover { background: #f3f4f6; }
.sidebar .nav-link.active { background: #eef2ff; color: var(--primary); }

/* Content */
.content {
  flex: 1;
  padding: 1rem;
}
@media (min-width: 992px) { /* lg */
  .content { padding: 2rem; }
}

/* Sidebar toggle (collapsible on small screens) */
body.sidebar-collapsed .sidebar { transform: translateX(-100%); }

@media (max-width: 991.98px) {
  .sidebar { position: fixed; left: 0; bottom: 0; transform: translateX(-100%); box-shadow: var(--shadow); }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .content { padding-top: 1rem; }

  /* On mobile, ensure sidebar sits below the navbar so the header is not covered */
  .sidebar {
    top: var(--navbar-height);
    height: calc(100vh - var(--navbar-height));
  }
}

/* Ensure navbar stacks above the sidebar on small screens (kept consistent) */
.navbar-glass { z-index: 1045; }

/* Stat cards */
.stat-card .icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #eef2ff;
  color: var(--primary);
}
.stat-value { font-size: 1.4rem; font-weight: 700; }
.stat-label { color: #212529; font-size: .95rem; font-weight: 600; }

/* Widget title used across the dashboard to improve visibility */
.widget-title { color: #0b1220; font-size: 1rem; font-weight: 700; margin-bottom: .25rem; text-transform: uppercase; letter-spacing: 0.03em; }

/* Make small descriptions slightly less muted but still subtle */
.card .small.text-muted { color: #6c757d; }

/* Icon color variants (no inline styles) */
.icon-warning { background: #fff7ed !important; color: #ea580c !important; }
.icon-info { background: #ecfeff !important; color: #0891b2 !important; }
.icon-success { background: #f0fdf4 !important; color: #16a34a !important; }

/* Gradient metric cards (advanced insights) */
.gradient-card {
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  border: 1px solid #e2e8f0;
  transition: box-shadow .2s ease, transform .2s ease;
}
.gradient-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); transform: translateY(-2px); }

/* Trend indication */
.text-success { font-weight: 600; }
.text-danger { font-weight: 600; }

/* Advanced insights toggle button spacing */
#toggleAdvancedInsights { margin-right: .75rem; }

/* Colored stat cards similar to superadmin dashboard */
.stat-card.colored { color: #ffffff; border: none; background-clip: border-box; }
.stat-card.colored .stat-value { font-size: 1.6rem; font-weight: 800; }
.stat-card.colored .stat-label { color: rgba(255,255,255,0.95); }
.stat-card.colored .icon { background: rgba(255,255,255,0.12); color: #ffffff; width:42px; height:42px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; }

/* Gradient utilities used by the superadmin dashboard (copy palette) */
.bg-g1 { background: linear-gradient(135deg, #5f72bd 0%, #9b23ea 100%) !important; }
.bg-g2 { background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%) !important; }
.bg-g3 { background: linear-gradient(135deg, #0ba360 0%, #3cba92 100%) !important; }
.bg-g4 { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important; }
.bg-g5 { background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%) !important; }
.bg-g6 { background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important; }
.bg-g7 { background: linear-gradient(135deg, #fa709a 0%, #fee140 100%) !important; }
.bg-g8 { background: linear-gradient(135deg, #f7971e 0%, #ffd200 100%) !important; }

.stat-card.colored:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.12); transform: translateY(-3px); }