/*
 * The shared vocabulary — cards, tables, badges, priority colours, niche cards
 * and the pager. Anything used by more than a couple of screens.
 *
 * Part of the ordered atlas stylesheet — the files in this directory are
 * linked in filename order and the order is load-bearing, so a rule moved
 * between them can change what wins.
 */
/* ===================== Common UI ===================== */
.page-title{font-family:'Inter','Segoe UI',sans-serif;font-size:26px;font-weight:600;letter-spacing:-.4px;margin-bottom:4px;color:var(--ink)}
.page-sub{color:var(--muted);margin-bottom:22px;font-size:13px}
.grid{display:grid;gap:13px}
.stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:24px}
.card{background:var(--surface,var(--panel));border:1px solid var(--line);
  border-radius:var(--radius);padding:17px 19px;transition:.18s}
.card.click{cursor:pointer}
.card.click:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.stat{display:flex;align-items:center;gap:14px;position:relative}
.stat-ic{width:46px;height:46px;border-radius:11px;display:grid;place-items:center;flex-shrink:0;
  color:var(--accent-text,var(--accent));background:var(--accent-soft)}
.stat-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sc-niches .stat-ic{color:var(--gold);background:#F2E7CC}
.sc-targets .stat-ic{color:var(--info);background:#DCE4F2}
.sc-opps .stat-ic{color:var(--bad);background:#F1DBDB}
.stat .k{color:var(--muted);font-size:11.5px;font-weight:600;text-transform:none;letter-spacing:0}
.stat .v{font-family:var(--mono);font-size:28px;font-weight:500;line-height:1;margin-top:5px;color:var(--ink)}
.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.client-card h3,.niche-card h3{font-size:17px;margin-bottom:4px}
.client-card .tag,.niche-card .tag{color:var(--muted);font-size:12px}
.card-row{display:flex;gap:18px;margin-top:16px}
.card-row .m{font-size:12px;color:var(--muted)}
.card-row .m b{display:block;font-size:20px;color:var(--txt);font-weight:700}
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;font-size:11px;
  font-weight:700;border:1px solid var(--line2)}
.pill.code{background:rgba(99,102,241,.16);color:#a5b4fc;border-color:transparent}

/* tables */
.tbl-wrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{text-align:left;padding:11px 16px;color:var(--muted);font-weight:600;font-size:10.5px;
  text-transform:uppercase;letter-spacing:.5px;background:var(--panel2);border-bottom:1px solid var(--line)}
tbody td{padding:12px 16px;border-bottom:1px solid var(--line);font-size:13px}
tbody tr{transition:.12s}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--panel2)}
tbody tr.click{cursor:pointer}
.co{font-weight:600;color:var(--ink)}
.note{color:var(--muted);font-size:12px;max-width:340px}

/* badges */
.b{display:inline-block;padding:3px 9px;border-radius:7px;font-size:11px;font-weight:700;white-space:nowrap}
.b-high{background:rgba(248,113,113,.16);color:#fca5a5}
.b-medium{background:rgba(251,191,36,.16);color:#fcd34d}
.b-low{background:rgba(96,165,250,.16);color:#93c5fd}
.b-rating{background:rgba(94,234,212,.14);color:#5eead4}
.b-status{background:var(--panel2);color:var(--muted);border:1px solid var(--line2)}
.b-stake{background:rgba(168,85,247,.16);color:#d8b4fe}

.empty{text-align:center;color:var(--muted);padding:60px 20px}
.empty .atlas-logo{margin:0 auto 16px;opacity:.6;width:60px;height:60px}
.barlist{display:flex;flex-direction:column;gap:13px;margin-top:10px}
.barlist .row{display:flex;align-items:center;gap:13px;font-size:13px}
.barlist .lbl{width:160px;color:var(--txt);font-weight:500;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barlist .track{flex:1;height:11px;background:var(--panel2);border-radius:7px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.barlist .fill{height:100%;border-radius:7px;min-width:10px;transition:width .5s cubic-bezier(.2,.8,.2,1);background:linear-gradient(90deg,#5eead4,#6366f1)}
.barlist .n{width:34px;text-align:right;font-weight:800;font-size:15px;color:var(--txt)}
/* priority colors via parent data-p attribute */
.barlist .row[data-p="High"] .fill{background:linear-gradient(90deg,#fb7185,#ef4444)}
.barlist .row[data-p="Medium"] .fill{background:linear-gradient(90deg,#fbbf24,#f59e0b)}
.barlist .row[data-p="Low"] .fill{background:linear-gradient(90deg,#60a5fa,#3b82f6)}
.barlist .fill.pf-status{background:linear-gradient(90deg,#5eead4,#6366f1)}
html[data-theme="light"] .barlist .track{background:#e7ebf4}
/* ===================== Niche cards (client detail) ===================== */
.niche-card{display:flex;flex-direction:column;gap:12px;min-height:150px}
.nc-top{display:flex;justify-content:space-between;align-items:center}
.nc-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;
  font-weight:800;font-size:15px;letter-spacing:.5px;box-shadow:0 8px 18px -8px rgba(0,0,0,.45)}
.nc-num{text-align:right;line-height:1}
.nc-num b{font-size:24px;font-weight:800;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.nc-num span{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-top:2px}
.niche-card h3{font-size:16px;line-height:1.25}
.nc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}
.nc-sector{font-size:12px;color:var(--muted)}
.nc-go{font-size:12px;font-weight:700;color:var(--accent2);opacity:0;transform:translateX(-4px);transition:.18s}
.niche-card:hover .nc-go{opacity:1;transform:none}

/* ===================== Pager ===================== */
.pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pg-btn{padding:7px 14px;border-radius:9px;border:1px solid var(--line2);background:var(--panel);color:var(--txt);
  font-size:13px;font-weight:600;cursor:pointer;transition:.15s}
.pg-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent2)}
.pg-btn:disabled{opacity:.4;cursor:not-allowed}
.pg-info{font-size:12px;color:var(--muted);font-weight:600}