/* intel.css — Priming Hub (clean, unified) */
/* Scope everything to #intel and #phModal to avoid leaks */
/* Palette: neutral, enterprise */
:root{
  --ink:#0f172a; --ink-2:#1f2937; --muted:#64748b;
  --line:#e5e7eb; --line-2:#eef2f7; --bg:#ffffff; --bg-sub:#f8fafc;
  --brand:#2563eb;
}

/* ---------- Canvas / table (left-screen list) ---------- */
#intel{ padding:0 2rem 2.2rem; max-width:1400px; margin:0 auto; font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
#intel h2{ margin:0; font:800 22px/1.25 Inter,system-ui; color:var(--ink); }
.ph-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:18px 0 10px; }
.pill{ display:inline-flex; gap:6px; align-items:center; background:#eef2ff; color:#1e3a8a; border:1px solid #c7d2fe; padding:4px 10px; border-radius:999px; font-size:12px; }
.ph-tools{ margin-bottom:10px; }
.ph-input{ border:1px solid #cbd5e1; border-radius:6px; padding:8px 10px; width:320px; }
.ph-scroll{ overflow:auto; border:1px solid var(--line); border-radius:10px; background:#fff; }
.ph-table{ width:100%; border-collapse:collapse; font:14px/1.35 Inter,system-ui; min-width:980px; }
.ph-table thead th{ text-align:left; background:#f3f4f6; color:var(--ink); padding:8px 10px; border-bottom:1px solid var(--line); }
.ph-table tbody td{ padding:8px 10px; border-top:1px solid var(--line-2); vertical-align:top; }
.ph-table tbody tr:nth-child(even){ background:#fcfdff; }
.ph-table td.name a{ color:var(--ink); text-decoration:none; font-weight:700; }
.ph-table td.name a:hover{ text-decoration:underline; }
.stage.center, .ph-table td.center{ text-align:center; }
.pct{ display:inline-flex; align-items:center; justify-content:center; min-width:54px; padding:4px 10px; border-radius:999px; border:1px solid #cbd5e1; background:#fff; font-weight:700; }
.pct.low{ color:#991b1b; background:#fef2f2; border-color:#fecaca; }
.pct.mid{ color:#7c2d12; background:#fffbeb; border-color:#fde68a; }
.pct.ok{  color:#065f46; background:#ecfdf5; border-color:#a7f3d0; }
.ph-btn{ border:1px solid #cbd5e1; background:#fff; color:var(--ink); border-radius:6px; padding:6px 10px; cursor:pointer; }
.ph-btn-mini{ font-size:12px; padding:4px 10px; }

/* ---------- Modal shell ---------- */
#phModal, #phModal *{ box-sizing:border-box; font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
#phModal{ position:fixed; inset:0; z-index:3000; display:none; }
#phModal.open{ display:block; }
body.modal-open{ overflow:hidden; }
#phModal .ph-backdrop{ position:absolute; inset:0; background:rgba(2,6,23,.55); }

/* Panel with robust internal scroll */
#phModal .ph-panel{
  position:relative; width:min(1420px,92vw); margin:40px auto; background:#fff; border-radius:12px;
  box-shadow:0 18px 60px rgba(0,0,0,.35); display:flex; flex-direction:column; overflow:hidden;
  max-height:92vh;
}
#phModal .ph-hdr{ display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:1px solid var(--line-2); }
#phModal .ph-hdr h3{ margin:0; font-weight:800; font-size:18px; color:var(--ink); }
#phModal .x{ margin-left:auto; border:none; background:transparent; font-size:22px; color:#374151; cursor:pointer; }
#phModal .ph-foot{ padding:12px 16px; border-top:1px solid var(--line-2); display:flex; gap:8px; justify-content:flex-end; }
#phModal .ph-btn{ border:1px solid #cbd5e1; background:#fff; color:var(--ink); border-radius:6px; padding:7px 12px; cursor:pointer; }
#phModal .ph-btn.brand{ background:var(--brand); border-color:var(--brand); color:#fff; }

/* Split columns (independent scroll) */
#phModal .ph-split{
  display:grid; grid-template-columns:40% 60%;
  flex:1; min-height:0; overflow:hidden;
}
#phModal .ph-left,
#phModal .ph-right{
  padding:12px 14px; overflow:auto;
  -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
}
#phModal .ph-left{ border-right:1px solid var(--line-2); background:#fafafa; }

/* ---------- Left column (overview cards) ---------- */
#phModal .ov-card{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:12px; margin-bottom:12px; }
#phModal .ov-card h4{ margin:0 0 8px; font-weight:800; font-size:14px; color:var(--ink-2); }
#phModal .ov-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px 12px; }
#phModal .ov-grid .muted{ color:var(--muted); font-size:12px; }
#phModal .ov-summary{ margin:10px 0 6px; color:#111827; font-size:13px; line-height:1.45; }
#phModal .fitbar{ position:relative; height:10px; background:#f1f5f9; border-radius:999px; overflow:hidden; }
#phModal .fitbar i{ position:absolute; inset:0 auto 0 0; width:var(--w); background:#2563eb22; }
#phModal .fitbar span{ display:block; text-align:right; font-size:11px; color:#374151; margin-top:4px; }

/* Bars / funnel (kept for overview) */
#phModal .bars>div{ display:flex; align-items:center; gap:8px; margin:6px 0; }
#phModal .bars>div span{ min-width:110px; color:#374151; }
#phModal .bars>div i{ flex:1; height:8px; background:#e5e7eb; border-radius:999px; position:relative; }
#phModal .bars>div i::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:var(--w); background:#1f2937; border-radius:999px; }
#phModal .barline{ display:flex; align-items:center; gap:8px; margin:8px 0; }
#phModal .barline span{ flex:0 0 140px; color:#374151; }
#phModal .barline i{ flex:1; height:8px; background:#e5e7eb; border-radius:999px; position:relative; }
#phModal .barline i::after{ content:""; position:absolute; inset:0 auto 0 0; width:var(--w); background:#334155; border-radius:999px; }
#phModal .barline b{ min-width:70px; text-align:right; font-weight:700; color:#111827; }
#phModal .fun-row{ display:flex; align-items:center; gap:8px; margin:6px 0; }
#phModal .fun-row span{ flex:0 0 60px; color:#374151; }
#phModal .fun-row i{ flex:1; height:8px; background:#e5e7eb; border-radius:999px; position:relative; }
#phModal .fun-row i::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:var(--w); background:#1d4ed8; border-radius:999px; }

/* Heat mini-grid (country exposure) */
#phModal .heat9{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
#phModal .heat9 i{ aspect-ratio:1/1; border-radius:6px; background:rgb(29 78 216 / calc(var(--v) * .6)); }

/* ---------- Right column (consistent type) ---------- */
#phModal .ph-right{ font-size:13px; color:#0f172a; }
#phModal .stage-card{ border:1px solid var(--line); border-radius:10px; padding:12px; background:#fff; margin-bottom:12px; }
#phModal .stage-card h4{ margin:0 0 10px; font-weight:800; font-size:14px; color:var(--ink-2); }

/* Suggested contacts table — NO hover */
#phModal .sugg-table{ width:100%; border-collapse:collapse; font-size:13px; }
#phModal .sugg-table thead th{ text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); color:#111827; background:#f8fafc; }
#phModal .sugg-table tbody td{ padding:8px 10px; border-top:1px solid var(--line-2); color:#111827; }
#phModal .sugg-table.no-hover tbody tr:hover{ background:transparent; }

/* Pill palette */
#phModal .palette-row{ margin-bottom:8px; }
#phModal .contact-palette{ display:flex; flex-wrap:wrap; gap:6px; }
#phModal .pill-pill{
  border:1px solid #d1d5db; background:#fff; color:#111827; padding:6px 10px; border-radius:999px; font-size:13px; cursor:pointer;
}
#phModal .pill-pill.armed{ border-color:#1d4ed8; box-shadow:0 0 0 2px #1d4ed822; }

/* Distinct “Not relevant” pill/chip */
#phModal .pill-pill.pill-nr{ background:#eef2f6; border:1px solid #cbd5e1; color:#334155; }
#phModal .chip.nr{ background:#f1f5f9; border:1px dashed #cbd5e1; color:#334155; }

/* AC rows (label left, picks right) */
#phModal .ac-rows{ display:flex; flex-direction:column; gap:8px; }
#phModal .ac-row{ display:grid; grid-template-columns:120px 1fr; align-items:center; gap:10px; padding:6px 0; border-top:1px dashed var(--line-2); }
#phModal .ac-row:first-child{ border-top:none; }
#phModal .ac-label{ font-weight:700; color:#111827; }
#phModal .ac-picks{ display:flex; flex-wrap:wrap; gap:6px; min-height:34px; padding:6px; border:1px dashed #e5e7eb; border-radius:8px; background:#fafafa; }
#phModal .ac-picks .muted{ color:#6b7280; font-size:12px; pointer-events:none; }

/* Chips (selected items inside AC or product cards) */
#phModal .chip{ display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; background:#eef2f7; color:#111827; border:1px solid #d1d5db; font-size:13px; }
#phModal .chip .chip-x{ border:none; background:transparent; font-size:14px; line-height:1; cursor:pointer; color:#6b7280; }
#phModal .chip .chip-x:hover{ color:#374151; }

/* Tier groups (header row for wide list variant) */
#phModal .tg-wrap{ display:flex; flex-direction:column; gap:10px; margin-top:8px; }
#phModal .tier-group.hidden{ display:none; }
#phModal .q-head-row{ display:grid; grid-template-columns:2fr 2fr 1.2fr 120px 1.2fr; gap:10px; padding:8px; border-radius:8px; background:#f8fafc; border:1px solid var(--line); font-weight:600; color:#111827; font-size:12px; }

/* ---------- Product cards: compact square layout ---------- */
#phModal .card-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:12px; margin-top:10px;
}
#phModal .q-card.square{
  border:1px solid var(--line); border-radius:12px; background:#fff;
  padding:10px; display:flex; flex-direction:column; gap:8px;
  box-shadow:0 1px 0 rgba(15,23,42,.03);
}
#phModal .q-card.square:hover{ box-shadow:0 2px 10px rgba(2,6,23,.06); }
#phModal .q-card.square.is-nr{ opacity:.9; background:#fafafa; }

#phModal .q-top{ display:grid; gap:6px; }
#phModal .q-name{ font-weight:800; letter-spacing:.1px; font-size:13px; color:#0f172a; }
#phModal .q-team, #phModal .q-met{ font-size:12px; color:#475569; }
#phModal .q-ctl{ display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; }
#phModal .q-ctl label{ font-size:12px; color:#475569; }
#phModal .q-ctl .q-up{ font-size:12px; color:#64748b; justify-self:end; }
#phModal .q-tier select{ width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:6px 8px; background:#fff; font-size:13px; }
#phModal .q-body-label{ font-size:12px; color:#475569; }
#phModal .q-card .chip-wrap{ display:flex; flex-wrap:wrap; gap:6px; min-height:28px; }

/* Team badge */
#phModal .badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 8px; border-radius:999px;
  border:1px solid var(--line);
  background:#f8fafc; color:#334155; font-weight:600; font-size:12px;
}
#phModal .badge i{ display:inline-block; width:6px; height:6px; border-radius:50%; background:#94a3b8; }

/* ---------- Identify grid (if used) ---------- */
#phModal .id-grid{ width:100%; border-collapse:collapse; font-size:13px; }
#phModal .id-grid thead th{ text-align:left; background:#f8fafc; color:#111827; padding:8px 10px; border-bottom:1px solid var(--line); }
#phModal .id-grid tbody td{ padding:8px 10px; border-top:1px solid var(--line-2); color:#111827; }
#phModal .id-grid .c{ text-align:center; }
#phModal .id-grid .add-row input{ width:100%; border:1px solid #cbd5e1; border-radius:6px; padding:6px 8px; }
#phModal .id-grid .nr-row .nr-badge{ display:inline-flex; align-items:center; gap:6px; background:#f1f5f9; border:1px solid #d1d5db; border-radius:999px; padding:4px 10px; font-weight:700; color:#334155; }
#phModal .id-grid .nr-row .nr-help{ color:#6b7280; margin-left:8px; font-size:12px; }
#phModal .id-grid .nr-cell{ padding:8px 10px; }

/* ---------- Utilities & responsive ---------- */
#phModal .muted{ color:var(--muted); }
@media (max-width:1100px){
  #phModal .ph-split{ grid-template-columns:1fr; }
  #phModal .ph-left{ border-right:none; border-bottom:1px solid var(--line-2); }
}



/* Product row layout additions */
#phModal .q-head-row.wide{
  display:grid; grid-template-columns:2fr 1.2fr 2fr 1.2fr 1.4fr 1.2fr 1.4fr;
  gap:10px; padding:8px; border-radius:8px; background:#f8fafc; border:1px solid var(--line);
  font-weight:600; color:#111827; font-size:12px; margin-top:8px;
}
#phModal .q-row{
  display:grid; grid-template-columns:2fr 1.2fr 2fr 1.2fr 1.4fr 1.2fr 1.4fr;
  gap:10px; align-items:center; padding:10px; border-bottom:1px solid var(--line-2);
}
#phModal .q-row:last-child{ border-bottom:none; }
#phModal .q-row .q-cell{ min-width:0; }
#phModal .q-row .tier select{ width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:6px 8px; background:#fff; font-size:13px; }
#phModal .q-row .contacts{ display:flex; flex-direction:column; gap:6px; }

/* Micro initials + remove */
#phModal .micro-wrap{ display:flex; flex-wrap:wrap; gap:6px; }
#phModal .micro{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
}
#phModal .micro i{
  display:inline-grid; place-items:center; width:22px; height:22px; border-radius:999px;
  background:var(--bg, #e5e7eb); color:#fff; font-size:11px; font-weight:800; letter-spacing:.3px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}
#phModal .micro i{ background:var(--bg); }
#phModal .micro-x{
  position:absolute; top:-6px; right:-6px; width:16px; height:16px; border-radius:999px;
  border:1px solid #cbd5e1; background:#fff; color:#334155; line-height:12px; font-size:12px;
  cursor:pointer; display:none;
}
#phModal .micro:hover .micro-x{ display:block; }

#phModal .micro-more{
  border:1px dashed #cbd5e1; background:#f8fafc; color:#334155; border-radius:999px;
  padding:0 8px; height:22px; font-size:12px; cursor:pointer;
}

#phModal .micro-drawer{ display:flex; flex-wrap:wrap; gap:6px; padding:6px; border:1px dashed #e5e7eb; border-radius:8px; background:#fafafa; }

/* Team badge (kept) */
#phModal .badge{ display:inline-flex; align-items:center; gap:6px; padding:3px 8px; border-radius:999px; border:1px solid var(--line); background:#f8fafc; color:#334155; font-weight:600; font-size:12px; }
#phModal .badge i{ width:6px; height:6px; border-radius:50%; background:#94a3b8; }

/* Keep columns scrolling */
#phModal .ph-split{ flex:1; min-height:0; }
#phModal .ph-left, #phModal .ph-right{ overflow:auto; -webkit-overflow-scrolling:touch; }

/* Color dot inside AC chips (matches product initials badges) */
#phModal .chip { position:relative; }
#phModal .chip .dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--chip, #94a3b8);
  display:inline-block; margin-right:8px;
}

/* Product initials badge uses --bg (already set inline) */
#phModal .micro i{
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; border-radius:999px;
  background:var(--bg, #475569); color:#fff; font-size:11px; font-weight:700;
}
#phModal .micro { display:inline-flex; align-items:center; gap:4px; }
#phModal .micro .micro-x{
  border:none; background:transparent; cursor:pointer; color:#6b7280; font-size:14px; line-height:1;
}
#phModal .micro .micro-x:hover{ color:#374151; }

/* 5-col product grid (Strategy | Met | Tier | Updated | Contacts) */
#phModal .q-head-row.five,
#phModal .q-row.five{
  display:grid;
  grid-template-columns: 2fr 1.2fr 160px 1.2fr 1.6fr;
  gap:10px;
  align-items:center;
}
#phModal .q-head-row.five{
  padding:8px; border:1px solid var(--line); border-radius:8px;
  background:#f8fafc; font-weight:600; color:#111827; font-size:12px;
}
#phModal .q-row.five .q-cell.tier select{
  width:100%; border:1px solid #cbd5e1; border-radius:6px; padding:6px 8px; background:#fff;
}
#phModal .q-row .micro-wrap{ display:flex; flex-wrap:wrap; gap:6px; }
#phModal .micro i{
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; border-radius:999px;
  background:var(--bg,#475569); color:#fff; font-size:11px; font-weight:700;
}
#phModal .micro{ display:inline-flex; align-items:center; gap:4px; }
#phModal .micro .micro-x{ border:none; background:transparent; cursor:pointer; color:#6b7280; font-size:14px; line-height:1; }
#phModal .micro .micro-x:hover{ color:#374151; }