/* ── Dashboard Command Centre ──────────────────────────────────────────────── */

/* Zone wrappers */
.dash-zone { margin-bottom: 28px; }
.dash-zone-title {
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-muted);
  margin-bottom: 12px; display: flex; align-items: center; gap: 8px;
}
.dash-zone-title::after {
  content: ''; flex: 1; height: 1px; background: var(--border);
}

/* ── Status bar ──────────────────────────────────────────────────────────────*/
.dash-status-bar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 10px 16px; margin-bottom: 16px;
  font-size: 12px;
}
.dash-market-badge {
  padding: 3px 10px; border-radius: 12px; font-size: 11px; font-weight: 700;
  letter-spacing: .04em;
}
.dash-market-badge.strong-uptrend { background:rgba(34,197,94,.2); color:var(--green); }
.dash-market-badge.uptrend        { background:rgba(34,197,94,.1); color:#86efac; }
.dash-market-badge.sideways       { background:rgba(245,158,11,.15); color:var(--yellow); }
.dash-market-badge.downtrend      { background:rgba(239,68,68,.12); color:#fca5a5; }
.dash-market-badge.strong-downtrend { background:rgba(239,68,68,.25); color:var(--red); }
.dash-macro-badge {
  padding: 3px 10px; border-radius: 12px; font-size: 11px; font-weight: 600;
  background: rgba(99,102,241,.15); color: var(--accent);
}
.dash-spy-today { font-weight: 600; }
.dash-time-et   { color: var(--text-muted); margin-left: auto; }
.dash-market-status {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 8px; border-radius: 10px; font-size: 11px; font-weight: 600;
}
.dash-market-status.open   { background:rgba(34,197,94,.1); color:var(--green); }
.dash-market-status.closed { background:rgba(148,163,184,.1); color:var(--text-muted); }
.dash-market-dot {
  width: 7px; height: 7px; border-radius: 50%;
}
.dash-market-status.open   .dash-market-dot { background: var(--green); animation: pulse 2s infinite; }
.dash-market-status.closed .dash-market-dot { background: var(--text-muted); }
@keyframes pulse {
  0%,100% { opacity: 1; } 50% { opacity: .3; }
}

/* ── Portfolio numbers row ───────────────────────────────────────────────────*/
.dash-port-row {
  display: grid; grid-template-columns: 2fr repeat(4, 1fr);
  gap: 12px; margin-bottom: 16px;
}
.dash-port-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
}
.dash-port-card.primary { border-color: var(--accent); }
.dash-port-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing:.07em; margin-bottom:4px; }
.dash-port-value { font-size: 22px; font-weight: 700; line-height: 1.1; }
.dash-port-value.big { font-size: 30px; }
.dash-port-sub   { font-size: 11px; color: var(--text-muted); margin-top: 3px; }
.dash-port-card.primary .dash-port-label { color: var(--accent); }

/* ── Chart area ──────────────────────────────────────────────────────────────*/
.dash-chart-wrap {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 18px 20px; margin-bottom: 20px;
}
.dash-chart-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px; flex-wrap: wrap; gap: 8px;
}
.dash-chart-title { font-size: 13px; font-weight: 600; }
.dash-chart-alpha {
  font-size: 20px; font-weight: 700;
}
.dash-chart-period-btns { display: flex; gap: 4px; }
.dash-chart-period-btn {
  padding: 4px 10px; border-radius: 14px; border: 1px solid var(--border);
  background: transparent; color: var(--text-muted); cursor: pointer; font-size: 11px;
  transition: all .15s;
}
.dash-chart-period-btn.active,
.dash-chart-period-btn:hover { border-color: var(--accent); color: var(--text); background: var(--accent-dim); }
.dash-chart-legend { display: flex; gap: 16px; margin-top: 10px; font-size: 11px; }
.dash-chart-legend-item { display: flex; align-items: center; gap: 5px; color: var(--text-muted); }
.dash-chart-legend-dot  { width: 10px; height: 3px; border-radius: 2px; }
#dashPortfolioChart { width: 100%; height: 200px; display: block; }
.dash-chart-placeholder {
  height: 200px; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  color: var(--text-muted); font-size: 14px; gap: 10px;
}

/* ── Positions table ─────────────────────────────────────────────────────────*/
.dash-positions-wrap {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 0; margin-bottom: 20px; overflow: hidden;
}
.dash-positions-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--border);
}
.dash-positions-header h2 { font-size: 13px; font-weight: 700; margin: 0; }
.dash-pos-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.dash-pos-table th {
  padding: 8px 14px; text-align: right; font-size: 10px; font-weight: 700;
  text-transform: uppercase; color: var(--text-muted); background: var(--bg);
}
.dash-pos-table th:first-child { text-align: left; }
.dash-pos-table td {
  padding: 10px 14px; text-align: right;
  border-top: 1px solid rgba(255,255,255,.03);
}
.dash-pos-table td:first-child { text-align: left; }
.dash-pos-row-hold       { background: transparent; }
.dash-pos-row-watch      { background: rgba(245,158,11,.04); }
.dash-pos-row-exit       { background: rgba(239,68,68,.06); }
.dash-pos-row-stop_hit   { background: rgba(239,68,68,.12); }

/* Status badges in table */
.status-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 700;
  white-space: nowrap;
}
.status-hold     { background:rgba(34,197,94,.12); color:var(--green); }
.status-watch    { background:rgba(245,158,11,.18); color:var(--yellow); }
.status-exit     { background:rgba(239,68,68,.18); color:var(--red); }
.status-stop_hit { background:rgba(239,68,68,.30); color:var(--red); border:1px solid var(--red); }

/* ── Exit alert cards ────────────────────────────────────────────────────────*/
.dash-exit-card {
  border: 1px solid rgba(239,68,68,.4); border-left: 4px solid var(--red);
  border-radius: var(--radius); background: rgba(239,68,68,.05);
  padding: 16px 18px; margin-bottom: 14px;
}
.dash-exit-card.stop-hit {
  border-color: rgba(239,68,68,.7); border-left-color: var(--red);
  background: rgba(239,68,68,.1);
}
.dash-exit-card-title { font-size: 14px; font-weight: 700; margin-bottom: 10px; }
.dash-exit-signals    { list-style: none; padding: 0; margin: 0 0 12px; }
.dash-exit-signals li { font-size: 12px; color: var(--text-muted); padding: 2px 0; }
.dash-exit-signals li::before { content: '• '; color: var(--red); }
.dash-exit-ai-note {
  font-size: 12px; color: var(--text-muted); font-style: italic;
  border-top: 1px solid rgba(239,68,68,.2); padding-top: 10px; margin-top: 10px;
}
.dash-exit-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* ── Zone 2: Intelligence ────────────────────────────────────────────────────*/
.dash-intel-grid {
  display: grid; grid-template-columns: 2fr 1fr;
  gap: 16px; margin-bottom: 20px;
}

/* Upgrade cards */
.dash-upgrade-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius); padding: 16px 18px; margin-bottom: 14px;
}
.dash-upgrade-header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.dash-upgrade-ticker { font-size: 20px; font-weight: 800; font-family: monospace; }
.dash-upgrade-company { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.dash-upgrade-score  { margin-left: auto; }
.dash-upgrade-reasons { list-style: none; padding: 0; margin: 0 0 12px; }
.dash-upgrade-reasons li { font-size: 12px; color: var(--text-muted); padding: 2px 0; }
.dash-upgrade-reasons li::before { content: '→ '; color: var(--accent); }
.dash-upgrade-levels {
  display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px;
  color: var(--text-muted); margin-bottom: 12px;
}
.dash-upgrade-levels strong { color: var(--text); }
.dash-upgrade-replace {
  font-size: 11px; color: var(--text-muted); margin-bottom: 10px;
}
.dash-upgrade-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* Compact candidates list */
.dash-candidates-compact {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
}
.dash-candidates-compact h3 {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 10px;
}
.dash-cand-chip-list { display: flex; flex-wrap: wrap; gap: 6px; }
.dash-cand-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px; border-radius: 14px;
  background: var(--bg); border: 1px solid var(--border);
  font-size: 12px; text-decoration: none; color: var(--text);
  transition: all .15s;
}
.dash-cand-chip:hover { border-color: var(--accent); color: var(--accent); }
.dash-cand-chip-score { font-size: 10px; color: var(--text-muted); }

/* Right column — alerts + phantom */
.dash-right-col { display: flex; flex-direction: column; gap: 14px; }

.dash-alerts-card,
.dash-phantom-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
}
.dash-alerts-card h3,
.dash-phantom-card h3 {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 10px;
}
.dash-alert-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.03); font-size: 12px;
}
.dash-alert-item:last-child { border-bottom: none; }
.dash-alert-ticker { font-weight: 700; font-family: monospace; }
.dash-alert-msg    { color: var(--text-muted); font-size: 11px; flex: 1; margin: 0 8px; }
.dash-phantom-value { font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.dash-phantom-sub   { font-size: 12px; color: var(--text-muted); }

/* ── Zone 3: Market backdrop ─────────────────────────────────────────────────*/
.dash-backdrop-wrap {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden; margin-bottom: 20px;
}
.dash-backdrop-summary {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 18px; cursor: pointer; user-select: none;
  font-size: 12px; font-weight: 600;
}
.dash-backdrop-summary:hover { background: rgba(255,255,255,.02); }
.dash-backdrop-caret { font-size: 10px; color: var(--text-muted); transition: transform .2s; }
.dash-backdrop-body {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0;
  border-top: 1px solid var(--border); padding: 18px 20px; gap: 20px;
}
.dash-backdrop-col h3 {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--text-muted); margin-bottom: 12px;
}
.dash-sector-chip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 8px; border-radius: 10px; font-size: 11px; margin: 2px;
}
.dash-sector-hot  { background:rgba(34,197,94,.12); color:var(--green); }
.dash-sector-cold { background:rgba(99,102,241,.12); color:var(--accent); }
.dash-macro-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 0; font-size: 12px; border-bottom: 1px solid rgba(255,255,255,.03);
}
.dash-macro-row:last-child { border-bottom: none; }
.dash-macro-key   { color: var(--text-muted); }
.dash-macro-val   { font-weight: 600; }
.dash-alloc-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 12px; }
.dash-alloc-label { width: 90px; color: var(--text-muted); font-size: 11px; }
.dash-alloc-track { flex: 1; height: 8px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
.dash-alloc-fill  { height: 100%; border-radius: 4px; }
.dash-alloc-pct   { width: 36px; text-align: right; font-size: 11px; font-weight: 600; }
.dash-alloc-flag  { font-size: 10px; }

/* last refresh */
#dashLastRefresh { font-size: 10px; color: var(--text-muted); }

/* gap alert banner (carry-forward) */
.gap-alert-banner {
  background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--radius); padding: 10px 16px;
  font-size: 13px; margin-bottom: 14px; display: flex; align-items: center; gap: 10px;
}

@media (max-width: 1100px) {
  .dash-port-row { grid-template-columns: repeat(3, 1fr); }
  .dash-intel-grid { grid-template-columns: 1fr; }
  .dash-backdrop-body { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .dash-port-row  { grid-template-columns: 1fr 1fr; }
  .dash-backdrop-body { grid-template-columns: 1fr; }
}