/* --- AIO Portal: Global Tokens & Phase 1 styles -------------------------- */

/* Design tokens (light theme baseline) */
:root{
  /* Colors */
  --color-bg:#ffffff;
  --color-surface:#f8f9fb;
  --color-text:#1b1f23;
  --color-muted:#6b7280; /* secondary text */
  --color-border:#e5e7eb;

  /* Accent + semantic */
  --accent:#0d6efd;      /* brand/interactive blue */
  --success:#198754;
  --warning:#ffc107;
  --danger:#dc3545;
  --info:#0dcaf0;

  /* Typography */
  --font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --fs-1:12px; --fs-2:14px; --fs-3:16px; --fs-4:18px; --fs-5:20px; --fs-6:24px;

  /* Spacing (4px scale) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;

  /* Shape & elevation */
  --radius:6px;
  --shadow-1:0 1px 2px rgba(0,0,0,.06);
  --shadow-2:0 4px 8px rgba(0,0,0,.08);
}

/* Base text/background (non-destructive to Bootstrap defaults) */
body{
  background:var(--color-bg);
  color:var(--color-text);
  font-family:var(--font-family);
}

/* Focus visibility for keyboard users */
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

/* --- Phase 1: nav tabs & side-list hover/active -------------------------- */

/* Tabs (Bootstrap .nav-tabs) */
.nav-tabs .nav-link{
  border:none;
  color:var(--color-muted);
}
.nav-tabs .nav-link:hover{
  color:var(--accent);
}
.nav-tabs .nav-link.active{
  color:var(--accent);
  border-bottom:2px solid var(--accent);
}

/* Generic tabs helper for non-tab navs */
.aio-tabs .nav-link{
  color:var(--color-muted);
}
.aio-tabs .nav-link:hover{ color:var(--accent); }
.aio-tabs .nav-link.active{
  color:var(--accent);
  border-bottom:2px solid var(--accent);
}

/* Left sidebar list-group links (section menus) */
.list-group-item-action:hover{
  color:var(--accent);
}
.list-group-item-action.active{
  background:rgba(13,110,253,.08); /* subtle blue wash */
  color:var(--accent);
  border-color:rgba(13,110,253,.25);
}

/* Utility: muted text */
.text-muted{ color:var(--color-muted) !important; }

/* --- Phase 3: Table unification ----------------------------------------- */
.table-aio th{ font-weight:600; color:var(--color-muted); vertical-align:middle; }
.table-aio tbody tr:hover{ background:rgba(0,0,0,.02); }
.table-aio td.actions{ white-space:nowrap; }
.table-aio .col-hidden{ display:none !important; }
.table-aio-wrap{ overflow-x:auto; -webkit-overflow-scrolling: touch; }
.table-aio{ white-space:nowrap; }
.table-aio-controls{ display:flex; gap:8px; justify-content:flex-end; margin-bottom:8px; }
.tc-drag{ cursor:grab; opacity:.8; }
.tc-item{ display:flex; align-items:center; justify-content:space-between; padding:6px 8px; border:1px solid var(--color-border); border-radius:6px; margin-bottom:6px; background:#fff; }
.tc-item.dragging{ opacity:.6; border-style:dashed; }
.table-aio th.sorted-asc::after{ content:' \2191'; color:var(--accent); }
.table-aio th.sorted-desc::after{ content:' \2193'; color:var(--accent); }