/* ============================================================
   deals-view.css — redesigned "All Deals" page (additive)
   Loaded AFTER style.css. Only touches the All Deals layout.
   ============================================================ */

.deals-page {
  max-width: 1320px;
  margin: 0 auto;
  padding: 1.6rem 1.75rem 3rem;
}

/* ---- HEADER ---- */
.deals-topbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.deals-eyebrow {
  font-size: 0.69rem;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #a39b8b;
  margin-bottom: 0.35rem;
}
.deals-page h1 {
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: -0.6px;
  color: var(--strong);
  line-height: 1;
  margin: 0;
}
.deals-toolbar { display: flex; align-items: center; gap: 0.65rem; }

.deals-search { position: relative; display: flex; align-items: center; }
.deals-search svg { position: absolute; left: 11px; color: #a39b8b; pointer-events: none; }
.deals-search input {
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 0.55rem 0.8rem 0.55rem 2.05rem;
  border-radius: 8px;
  font-size: 0.85rem;
  font-family: inherit;
  width: 290px;
  outline: none;
  transition: border-color 0.15s;
}
.deals-search input:focus { border-color: var(--accent); }

.view-toggle {
  display: flex;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--card);
}
.view-toggle button {
  padding: 0.52rem 1.05rem;
  font-size: 0.8rem;
  font-weight: 600;
  border: none;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-family: inherit;
  transition: all 0.12s;
}
.view-toggle button.active { background: var(--accent); color: #fff; }

/* ---- KPI STRIP ---- */
.deals-kpis {
  display: flex;
  align-items: stretch;
  margin-top: 1.25rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.kpi { flex: 1; padding: 0.8rem 1.1rem; border-right: 1px solid #ece7dd; }
.kpi:last-child { border-right: none; }
.kpi-label {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.66rem; font-weight: 600; letter-spacing: 1px;
  text-transform: uppercase; color: #a39b8b; margin-bottom: 0.4rem;
}
.kpi-dot { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
.kpi-val {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 1.32rem; font-weight: 600; color: var(--strong);
}

/* ---- BODY LAYOUT ---- */
.deals-body { display: flex; gap: 1.4rem; align-items: flex-start; margin-top: 1.25rem; }
.deals-content { flex: 1; min-width: 0; }

/* ---- FILTER RAIL ---- */
.deal-rail {
  flex: none;
  width: 236px;
  position: sticky;
  top: 80px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.deal-rail-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.85rem 1rem 0.75rem;
}
.deal-rail-head span { font-size: 0.78rem; font-weight: 700; color: var(--strong); }
.rail-clear {
  font-size: 0.72rem; font-weight: 500; background: none; border: none;
  cursor: pointer; font-family: inherit; text-decoration: underline;
  text-underline-offset: 2px; color: #bbb3a4;
}
.rail-clear.active { color: var(--accent); }
.rail-divider { height: 1px; background: #ece7dd; margin: 0 1rem; }
.rail-section { padding: 0.85rem 1rem; }
.rail-label {
  font-size: 0.66rem; font-weight: 600; letter-spacing: 1px;
  text-transform: uppercase; color: #a39b8b; margin-bottom: 0.6rem;
}

/* type pills */
.type-pills { display: flex; flex-direction: column; gap: 5px; }
.type-pill {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 0.5rem 0.7rem; border-radius: 8px;
  font-size: 0.8rem; font-weight: 600; cursor: pointer; font-family: inherit;
  background: var(--light); border: 1px solid #e3ddd1; color: #3a3a44;
  transition: all 0.12s;
}
.type-pill .tp-left { display: flex; align-items: center; gap: 8px; }
.type-pill .tp-dot { width: 9px; height: 9px; border-radius: 2px; }
.type-pill .tp-count { font-family: 'IBM Plex Mono', monospace; font-size: 0.72rem; opacity: 0.65; }
.type-pill:hover { border-color: #cfc7b8; }
.type-pill.active.ma  { color: var(--accent); background: rgba(58,86,192,0.12);  border-color: rgba(58,86,192,0.4); }
.type-pill.active.vc  { color: var(--green);  background: rgba(46,145,88,0.14);  border-color: rgba(46,145,88,0.4); }
.type-pill.active.jv  { color: var(--orange); background: rgba(232,146,12,0.16); border-color: rgba(232,146,12,0.45); }
.type-pill.active.spv { color: #6d28d9;       background: rgba(124,58,237,0.13); border-color: rgba(124,58,237,0.4); }

/* status segmented */
.status-seg { display: flex; gap: 5px; }
.status-seg button {
  flex: 1; padding: 0.42rem 0.3rem; border-radius: 7px;
  font-size: 0.76rem; font-weight: 600; cursor: pointer; font-family: inherit;
  background: var(--light); border: 1px solid #e3ddd1; color: var(--muted);
  transition: all 0.12s;
}
.status-seg button.active { color: #fff; }
.status-seg button.active[data-s="all"]    { background: var(--accent); border-color: var(--accent); }
.status-seg button.active[data-s="closed"] { background: var(--green);  border-color: var(--green); }
.status-seg button.active[data-s="died"]   { background: var(--red);    border-color: var(--red); }

/* people list */
.people-list { display: flex; flex-direction: column; gap: 1px; max-height: 320px; overflow-y: auto; margin: 0 -6px; }
.person-row {
  display: flex; align-items: center; gap: 9px; width: 100%;
  padding: 0.32rem 0.5rem; border-radius: 8px; cursor: pointer;
  font-family: inherit; border: 1px solid transparent; background: transparent;
  transition: background 0.12s;
}
.person-row:hover { background: var(--light); }
.person-row.active { background: rgba(58,86,192,0.1); border-color: rgba(58,86,192,0.35); }
.person-av {
  width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 9px; font-weight: 700;
}
.person-name {
  flex: 1; text-align: left; font-size: 0.78rem; font-weight: 500; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.person-count { font-family: 'IBM Plex Mono', monospace; font-size: 0.7rem; color: #a39b8b; }
.rail-empty { font-size: 0.74rem; color: #a39b8b; padding: 0.2rem 0.5rem; }

/* ---- RESULT SUMMARY ---- */
.deals-summary {
  display: flex; align-items: center; gap: 0.6rem;
  margin-bottom: 0.7rem; min-height: 20px;
  font-size: 0.8rem; color: var(--muted);
}
.filter-active-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.72rem; font-weight: 600; color: var(--accent);
  background: rgba(58,86,192,0.1); padding: 3px 9px; border-radius: 20px;
}

/* ---- DENSE TABLE ---- */
.deals-table-wrap {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.deals-table-wrap table { width: 100%; border-collapse: collapse; }
.deals-table-wrap thead th {
  background: var(--light);
  text-align: left;
  padding: 0.7rem 0.9rem;
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #a39b8b;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.deals-table-wrap thead th:first-child { cursor: default; }
.deals-table-wrap thead th.th-num { text-align: right; }
.deals-table-wrap thead th.th-type { width: 86px; }
.deals-table-wrap thead th.th-num  { width: 110px; }
.deals-table-wrap thead th.th-date { width: 124px; }
.deals-table-wrap thead th.th-team { width: 150px; }
.deals-table-wrap thead th.th-act  { width: 40px; }
.deals-table-wrap thead th:hover { color: var(--text); }
.sort-ind { font-size: 0.7rem; color: var(--accent); }

.deals-table-wrap tbody td {
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid #f1ede4;
  vertical-align: middle;
  font-size: 0.85rem;
}
.deals-table-wrap tbody tr:last-child td { border-bottom: none; }
.deals-table-wrap tbody tr.clickable-row { cursor: pointer; }
.deals-table-wrap tbody tr:hover { background: #f7f9ff; }
.deals-table-wrap tbody tr.deal-died { opacity: 0.6; }

.dn-cell { display: flex; align-items: center; gap: 10px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.dn-text { min-width: 0; }
.deal-name { font-size: 0.86rem; font-weight: 600; color: var(--strong); line-height: 1.25; }
tr.deal-died .deal-name { text-decoration: line-through; text-decoration-color: rgba(217,69,53,0.5); color: #9a917f; }
.deal-sub {
  font-size: 0.72rem; color: #9a917f; line-height: 1.35;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 320px;
}
.td-num  { text-align: right; font-family: 'IBM Plex Mono', monospace; font-size: 0.84rem; font-weight: 600; color: var(--strong); }
.td-date { font-family: 'IBM Plex Mono', monospace; font-size: 0.76rem; color: var(--muted); white-space: nowrap; }
.died-tag {
  margin-left: 0.4rem; font-size: 0.6rem; font-weight: 700; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--red); background: rgba(217,69,53,0.12);
  padding: 1px 6px; border-radius: 4px; vertical-align: 1px;
}

/* overlapping avatars */
.deal-team-stack { display: flex; align-items: center; padding-left: 7px; }
.deal-av {
  width: 25px; height: 25px; border-radius: 50%; margin-left: -7px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 8.5px; font-weight: 700; border: 2px solid var(--card);
}
.deal-av-more { background: #e8e2d6; color: #7a7a8c; }
.team-stack-cell { display: flex; align-items: center; gap: 4px; }

/* ---- BOARD VIEW ---- */
.deals-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.9rem; align-items: start; }
.board-col { background: var(--card); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.board-col-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.7rem 0.85rem; border-bottom: 1px solid #ece7dd; border-top: 3px solid var(--accent);
}
.bc-title { display: flex; align-items: center; gap: 7px; font-size: 0.82rem; font-weight: 700; color: var(--strong); }
.bc-count { font-family: 'IBM Plex Mono', monospace; font-size: 0.68rem; font-weight: 600; color: #a39b8b; }
.bc-total { font-family: 'IBM Plex Mono', monospace; font-size: 0.72rem; font-weight: 600; }
.board-col-body { padding: 0.6rem; display: flex; flex-direction: column; gap: 8px; min-height: 56px; }
.board-empty { font-size: 0.72rem; color: #bbb3a4; text-align: center; padding: 0.8rem 0; }
.board-card { background: var(--light); border: 1px solid #e7e1d5; border-radius: 9px; padding: 0.65rem 0.7rem; cursor: pointer; transition: border-color 0.12s, transform 0.08s; }
.board-card:hover { border-color: var(--accent); }
.board-card.deal-died { opacity: 0.6; }
.bc-name { font-size: 0.8rem; font-weight: 600; color: var(--strong); line-height: 1.3; margin-bottom: 2px; }
.board-card.deal-died .bc-name { text-decoration: line-through; text-decoration-color: rgba(217,69,53,0.5); color: #9a917f; }
.bc-sub { font-size: 0.68rem; color: #9a917f; line-height: 1.35; margin-bottom: 0.55rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bc-foot { display: flex; align-items: center; justify-content: space-between; }
.bc-val { font-family: 'IBM Plex Mono', monospace; font-size: 0.8rem; font-weight: 600; color: var(--strong); }
.board-card .deal-av { border-color: var(--light); width: 22px; height: 22px; font-size: 8px; margin-left: -6px; }
.board-card .deal-team-stack { padding-left: 6px; }

/* row add button (reuse base look) keep visible on row hover */
tr:hover .row-add-btn { opacity: 1; }

@media (max-width: 860px) {
  .deals-body { flex-direction: column; }
  .deal-rail { width: 100%; position: static; }
  .deals-board { grid-template-columns: repeat(2, 1fr); }
  .deals-kpis { flex-wrap: wrap; }
  .kpi { min-width: 33%; }
}
