/* ────────────────────────────────────────────────────────────────
   Standalone tab styling for admin pages whose nav sits OUTSIDE a
   `header.unified-admin`.

   _admin_nav.css scopes every rule to `header.unified-admin nav.tabs`,
   so a page with a plain <header> and the nav after it gets no styling
   at all — the tabs render as bare underlined links. That is exactly how
   broadcast.html, affiliate_leads.html and reels.html looked.

   Deliberately NOT scoped, and safe to load anywhere: pages that already
   style .tabs inline declare their rules after this file and win on
   source order.
   ──────────────────────────────────────────────────────────────── */
nav.tabs {
  display: flex;
  gap: 4px;
  padding: 10px 24px 0;
  /* ⚠️ NOT overflow-x:auto. A scrolling container clips absolutely-positioned
     children, so the dropdown panels rendered INSIDE the scroll area and were
     invisible — and the container grew scrollbars of its own. Grouping cut the
     bar to six top-level items, so wrapping is enough and nothing needs to
     scroll. Any overflow here breaks the menus again. */
  overflow: visible;
  align-items: center;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border, rgba(99,102,241,0.16));
}
nav.tabs a {
  padding: 8px 13px;
  border-radius: 8px 8px 0 0;
  color: var(--text-2, #9a9ab0);
  text-decoration: none;
  font-size: 0.84rem;
  font-weight: 600;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: background .15s, color .15s;
}
nav.tabs a:hover { background: var(--card, #1a1a26); color: var(--text, #f0f0f5); }
nav.tabs a.active {
  color: var(--text, #f0f0f5);
  background: var(--card, #1a1a26);
  border-bottom-color: var(--accent, #6366f1);
}