
/* ===== DEV TOOLBAR ===== */
#dev-toolbar {
  display: none;
  background: #0f172a;
  color: #e2e8f0;
  padding: 6px 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 13px;
  border-bottom: 1px solid #1e293b;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  z-index: 9999;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}
#dev-toolbar.visible { display: flex; }
#dev-toolbar .tb-section { display: flex; align-items: center; gap: 8px; }
#dev-toolbar .tb-divider { width: 1px; height: 20px; background: #334155; }
#dev-toolbar .tb-user { font-weight: 600; color: #7dd3fc; }
#dev-toolbar .tb-tenant { color: #94a3b8; font-size: 11px; }
#dev-toolbar .tb-btn {
  background: #1e293b; border: 1px solid #334155; color: #e2e8f0;
  padding: 3px 10px; border-radius: 4px; cursor: pointer; font-size: 12px;
  transition: all 0.15s;
}
#dev-toolbar .tb-btn:hover { background: #334155; }
#dev-toolbar .tb-btn.danger { border-color: #ef4444; color: #fca5a5; }
#dev-toolbar .tb-btn.success { border-color: #22c55e; color: #86efac; }
#dev-toolbar #tb-clock-btn {
  background: #1e3a5f; border-color: #3b82f6; color: #93c5fd;
  font-weight: 600; min-width: 90px;
}
#dev-toolbar #tb-clock-btn.clocked-in {
  background: #1e3a1e; border-color: #22c55e; color: #86efac;
}
#dev-toolbar #tb-timer { font-variant-numeric: tabular-nums; color: #fbbf24; min-width: 52px; }
#dev-toolbar .tb-notif-bell {
  position: relative; cursor: pointer; font-size: 16px; padding: 2px 6px;
}
#dev-toolbar .tb-notif-badge {
  position: absolute; top: -4px; right: -2px; background: #ef4444;
  color: white; font-size: 9px; padding: 0 4px; border-radius: 10px;
  min-width: 14px; text-align: center; display: none;
}
#dev-toolbar .tb-notif-badge.visible { display: block; }
#dev-notif-panel {
  display: none; position: fixed; top: 36px; right: 16px;
  background: #1e293b; border: 1px solid #334155; border-radius: 8px;
  width: 340px; max-height: 400px; overflow-y: auto;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5); z-index: 10000;
}
#dev-notif-panel.visible { display: block; }
#dev-notif-panel .np-header {
  padding: 10px 14px; border-bottom: 1px solid #334155;
  font-weight: 600; color: #7dd3fc; font-size: 13px;
}
#dev-notif-panel .np-item {
  padding: 10px 14px; border-bottom: 1px solid #1e293b;
  cursor: pointer; transition: background 0.1s; font-size: 12px;
}
#dev-notif-panel .np-item:hover { background: #0f172a; }
#dev-notif-panel .np-item .np-msg { color: #e2e8f0; margin-bottom: 3px; }
#dev-notif-panel .np-item .np-time { color: #64748b; font-size: 11px; }
#dev-notif-panel .np-item.unread { border-left: 3px solid #3b82f6; }
#dev-notif-panel .np-empty { padding: 20px; text-align: center; color: #64748b; }
