/* ═══ shared.css — Common Design Tokens & Components ═══
   Extracted from orderhub.css / intakehub.css / forgehub.css / creativehub.css / voc.css
   Each hub overrides --acc (accent color) in its own :root block.
   Only TRULY duplicated rules live here.                                     */

/* ── Design Tokens (base palette — hubs override --acc) ── */
:root{
  --bg:#0b0d12;--panel:#11141b;--surface:#181c25;--surface2:#1e2330;
  --bdr:rgba(255,255,255,.08);--bdr-md:rgba(255,255,255,.14);--bdr-hi:rgba(255,255,255,.28);
  --t1:rgba(255,255,255,.95);--t2:rgba(255,255,255,.72);--t3:rgba(255,255,255,.48);
  --p0:#ff5c5c;--p1:#ff9f43;--p2:#8fa3bf;
  --acc:#4b8bf5;--acc-bg:rgba(75,139,245,.10);--acc-bd:rgba(75,139,245,.38);
  --acc-glow:rgba(75,139,245,.25);
  --r-s:4px;--r-m:8px;--r-l:14px;
  --brand-h:44px;--action-h:42px;
}

/* ── Reset ── */
*{box-sizing:border-box;margin:0;padding:0}

/* ── Brand Bar (shared across orderhub / intakehub / forgehub / creativehub / voc) ── */
.brand-home{display:flex;align-items:center;text-decoration:none;opacity:.8;transition:opacity .15s}
.brand-home:hover{opacity:1;text-decoration:none}
.brand-wordmark{font-size:15px;font-weight:800;letter-spacing:-.03em;color:rgba(255,255,255,.95);font-family:Inter,'Helvetica Neue',Arial,system-ui,sans-serif;white-space:nowrap}
.brand-dot{color:var(--acc)}

/* ── DB Status Badge (orderhub / intakehub) ── */
.badge-pg{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}
.badge-pg.on{background:rgba(46,204,113,.1);color:#2ecc71;border:1px solid rgba(46,204,113,.3)}
.badge-pg.off{background:rgba(255,92,92,.1);color:#ff5c5c;border:1px solid rgba(255,92,92,.3)}

/* ── Action Bar Shared Components (orderhub / intakehub) ── */
.ab-sep{width:1px;height:16px;background:var(--bdr-md);margin:0 4px;flex-shrink:0}
.ab-group{display:flex;align-items:center;gap:4px}

/* Platform tabs */
.ptab{padding:4px 12px;border-radius:var(--r-s);border:1px solid transparent;background:transparent;color:var(--t2);font-size:12px;cursor:pointer;transition:all .12s;white-space:nowrap}
.ptab:hover{color:var(--t1);background:var(--surface)}
.ptab.is-active{background:var(--surface2);color:var(--t1);border-color:var(--bdr-md)}

/* Action buttons */
.ab-btn{padding:4px 12px;border-radius:var(--r-s);border:1px solid var(--bdr);background:transparent;color:var(--t2);font-size:12px;cursor:pointer;transition:all .12s;white-space:nowrap}
.ab-btn:hover{border-color:var(--acc-bd);color:var(--acc);background:var(--acc-bg)}
.ab-btn--primary{background:var(--acc-bg);color:var(--acc);border-color:var(--acc-bd)}
.ab-btn--primary:hover{background:var(--acc);color:#fff}
.ab-btn:disabled{opacity:.4;cursor:default}

/* ── Spinner Keyframe (intakehub / creativehub / aihub) ── */
@keyframes spin{to{transform:rotate(360deg)}}