/* Tryb demo: pasek u góry strony (stała wysokość 46 px) i przesunięcie układu aplikacji pod nim. Ładowany tylko przez demo. */
.demo-mode { padding-top: 46px; }
.demo-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 70; height: 46px; display: flex; align-items: center; gap: 10px;
  padding: 0 14px; background: #121a2b; color: #fff; font-size: .85rem;
}
.demo-badge { background: var(--accent); color: #fff; border-radius: 6px; padding: 2px 8px; font-weight: 700; letter-spacing: .06em; flex: none; }
.demo-bar select {
  width: auto; min-width: 0; max-width: 170px; min-height: 32px; padding: 0 8px; border-radius: 8px; font-size: .85rem;
  background: #1f2a44; color: #fff; border: 1px solid #3a4a6e;
}
.demo-note { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #b8c2d8; }
.demo-bar .btn { min-height: 32px; padding: 0 12px; flex: none; }
.demo-bar .demo-reset { color: #fff; font-size: 1.1rem; padding: 0 8px; }
.demo-bar .demo-reset:hover { background: rgba(255, 255, 255, .12); }
.demo-mode .sidebar { top: 46px; height: calc(100vh - 46px); }
.demo-mode .topbar { top: 46px; }
.demo-mode .logout-btn { display: none !important; }
.demo-fail { padding: 24px; max-width: 520px; text-align: center; line-height: 1.6; }
@media (max-width: 760px) {
  .demo-bar { padding: 0 10px; gap: 8px; }
  .demo-note { display: none; }
  .demo-bar .demo-reset { margin-left: auto; }
}
@media print { .demo-bar { display: none; } .demo-mode { padding-top: 0; } }