/* Единая шапка (разметку генерирует shared-header.js). */

.navbar {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; gap: 16px;
  height: 52px; padding: 0 16px;
  background: hsl(var(--card));
  border-bottom: 1px solid hsl(var(--border));
}
.navbar-brand {
  font-weight: 700; letter-spacing: .02em; white-space: nowrap;
  color: hsl(var(--foreground)); text-decoration: none;
}
.navbar-brand:hover { color: hsl(var(--primary)); }
.navbar-nav { display: flex; gap: 2px; }
.navbar-link {
  padding: 6px 10px; font-size: 13px; text-decoration: none;
  color: hsl(var(--muted-foreground)); border-bottom: 2px solid transparent;
}
.navbar-link:hover { color: hsl(var(--foreground)); }
.navbar-link.active { color: hsl(var(--primary)); border-bottom-color: hsl(var(--primary)); }
.navbar-spacer { flex: 1; }
.navbar-widgets { display: flex; align-items: center; gap: 12px; font-size: 12px; color: hsl(var(--muted-foreground)); white-space: nowrap; }
.widget-warn { color: hsl(var(--yellow)); }
.widget-bad { color: hsl(var(--red)); font-weight: 600; }
.spark { width: 110px; height: 24px; color: hsl(var(--primary)); border-bottom: 1px solid hsl(var(--border)); }
.navbar-user { font-size: 13px; white-space: nowrap; }

@media (max-width: 1000px) { .spark { display: none; } }
@media (max-width: 820px) { .navbar-widgets { display: none !important; } }
@media (max-width: 560px) {
  .navbar { gap: 8px; padding: 0 10px; }
  .navbar-user { display: none; }
  .navbar-brand { font-size: 13px; }
}