/* ──────────────────────────────────────────────────────────────────────────
   Market data bar — Intraday Bias, GMI / GMI-2 / T2108, IWF / MTUM.
   SPY / QQQ / IWM live as eyebrow pills inside the provider-status bar
   (see provider-status.css `.lps-idx`). One uniform row across the page,
   with horizontal-scroll fallback on narrow viewports.
   ────────────────────────────────────────────────────────────────────────── */

.ic-bar {
  display: flex;
  align-items: stretch;
  gap: 8px;
  padding: 6px 16px 7px;
  background: rgba(11, 13, 18, 0.92);
  border-bottom: 1px solid rgba(80, 96, 128, 0.16);
  font: 11px/1.3 "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #cbd5e1;
  /* Cap to viewport width so the bar never drags the body wider than the
     screen. Without max-width, the flex children's combined min-widths
     (now ~1264px since the bias card grew to fit 7 tiles + the new sector
     internals card grew to fit the new layout) can push the body into
     horizontal scroll, which slides the sticky header right and clips the
     refresh button off the right edge. overflow-x: auto handles the
     overflow inside the bar, so the cards stay scrollable. */
  max-width: 100vw;
  overflow-x: auto;
  scrollbar-width: thin;
}
.ic-bar:empty { display: none; }
.ic-bar::-webkit-scrollbar { height: 4px; }
.ic-bar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 2px; }

/* Shared card chrome (SPY/QQQ/IWM live in the provider bar — see
   provider-status.css `.lps-idx`. Everything below renders into #index-cards.) */
.ic-bias,
.ic-score,
.ic-proxy {
  flex: 1 1 0;
  min-width: 108px;
  /* min-height instead of fixed height — the bias card grew a 4th line
     (intraday/weighted/equal-fallback proof line on the INTERNALS tile)
     and was overflowing the old 86px box, clipping the LEAN BULL header
     behind the providers bar. align-items:stretch on .ic-bar matches all
     cards to the tallest, so heights stay consistent across the row. */
  min-height: 60px;
  padding: 5px 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.012));
  cursor: default;
  transition: border-color 0.15s ease, background 0.15s ease;
  overflow: hidden;  /* never bleed below the card box */
}
.ic-bias:hover,
.ic-score:hover,
.ic-proxy:hover {
  border-color: rgba(255, 255, 255, 0.12);
  background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.018));
}

/* ── GMI / GMI-2 / T2108 score cards ─────────────────────────────────────── */

.ic-score {
  cursor: help;
  gap: 4px;
}
.ic-score-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
}
.ic-score-label {
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: #94a3b8;
  text-transform: uppercase;
}
.ic-score-value {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #f1f5f9;
}
.ic-score-bar {
  display: flex;
  gap: 2px;
  height: 4px;
}
.ic-score-pip {
  flex: 0 0 5px;
  border-radius: 1px;
  background: rgba(255, 255, 255, 0.06);
}
.ic-score-pip.on { background: currentColor; }
.ic-score[data-tone="bull"]    { color: #34d399; }
.ic-score[data-tone="bull"]    .ic-score-value { color: #34d399; }
.ic-score[data-tone="bear"]    { color: #f87171; }
.ic-score[data-tone="bear"]    .ic-score-value { color: #f87171; }
.ic-score[data-tone="neutral"] { color: #fbbf24; }
.ic-score[data-tone="neutral"] .ic-score-value { color: #fbbf24; }
.ic-score-sub {
  font-size: 9px;
  color: #64748b;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}

/* ── IWF / MTUM proxy cards ──────────────────────────────────────────────── */

.ic-proxy { gap: 3px; }
.ic-proxy-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.ic-proxy-sym {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.06em;
  color: #f1f5f9;
}
.ic-proxy-pill {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 999px;
  white-space: nowrap;
}
.ic-proxy-pill[data-ok="true"]    { background: rgba(52,211,153,0.14); color: #34d399; }
.ic-proxy-pill[data-ok="false"]   { background: rgba(248,113,113,0.14); color: #f87171; }
.ic-proxy-pill[data-ok="unknown"] { background: rgba(148,163,184,0.10); color: #94a3b8; }
.ic-proxy-label { font-size: 9px; color: #64748b; letter-spacing: 0.04em; }
.ic-proxy-meta {
  font-size: 10px;
  color: #94a3b8;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Intraday bias card (7× width — header + 7-tile grid) ────────────────── */

.ic-bias {
  flex: 7 1 0;
  min-width: 640px;
  gap: 4px;
  padding: 5px 9px;
}
.ic-bias-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  white-space: nowrap;
  overflow: hidden;
}
.ic-bias-verdict {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.1;
}
.ic-bias[data-tone="bull"]    .ic-bias-verdict { color: #34d399; }
.ic-bias[data-tone="bear"]    .ic-bias-verdict { color: #f87171; }
.ic-bias[data-tone="neutral"] .ic-bias-verdict { color: #fbbf24; }
.ic-bias[data-risk-off="true"] .ic-bias-verdict { color: #fb923c; }
.ic-bias-score {
  font-size: 10px;
  font-weight: 500;
  color: #64748b;
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}
.ic-bias-summary {
  font-size: 10px;
  color: #94a3b8;
  letter-spacing: 0.01em;
  text-overflow: ellipsis;
  overflow: hidden;
}
.ic-bias-note {
  color: #64748b;
  font-size: 9px;
  cursor: help;
}
/* Sparkline of today's composite bias score. Sits between the verdict
   (left) and the signals summary (right) in the card header. Tone-driven
   stroke + soft filled area so the day's trajectory reads at a glance. */
.ic-bias-spark {
  flex: 0 0 auto;
  align-self: center;
  width: 180px;
  height: 26px;
  overflow: visible;
}
.ic-bias-spark-zero {
  stroke: #475569;
  stroke-width: 1;
  stroke-dasharray: 3 3;
  opacity: 0.7;
}
.ic-bias-spark-area {
  fill: currentColor;
  opacity: 0.18;
  color: #94a3b8;
}
.ic-bias-spark-line {
  fill: none;
  stroke: #cbd5e1;
  stroke-width: 1.75;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.ic-bias-spark-dot {
  fill: #e2e8f0;
  stroke: rgba(15, 23, 42, 0.6);
  stroke-width: 0.5;
}
.ic-bias-spark[data-tone="bull"]    { color: #34d399; }
.ic-bias-spark[data-tone="bull"]    .ic-bias-spark-line { stroke: #34d399; }
.ic-bias-spark[data-tone="bull"]    .ic-bias-spark-dot  { fill:   #34d399; }
.ic-bias-spark[data-tone="bear"]    { color: #f87171; }
.ic-bias-spark[data-tone="bear"]    .ic-bias-spark-line { stroke: #f87171; }
.ic-bias-spark[data-tone="bear"]    .ic-bias-spark-dot  { fill:   #f87171; }
.ic-bias-spark[data-tone="neutral"] { color: #fbbf24; }
.ic-bias-spark[data-tone="neutral"] .ic-bias-spark-line { stroke: #fbbf24; }
.ic-bias-spark[data-tone="neutral"] .ic-bias-spark-dot  { fill:   #fbbf24; }
.ic-bias[data-risk-off="true"] .ic-bias-spark { color: #fb923c; }
.ic-bias[data-risk-off="true"] .ic-bias-spark .ic-bias-spark-line { stroke: #fb923c; }
.ic-bias[data-risk-off="true"] .ic-bias-spark .ic-bias-spark-dot  { fill:   #fb923c; }
.ic-bias-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 3px;
}
.ic-bias-tile {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 2px 5px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.025);
  border-left: 2px solid rgba(148, 163, 184, 0.25);
  min-width: 0;
}
.ic-bias-tile[data-vote="bull"]    { border-left-color: #34d399; }
.ic-bias-tile[data-vote="bear"]    { border-left-color: #f87171; }
.ic-bias-tile[data-vote="neutral"] { border-left-color: #fbbf24; }
.ic-bias-tile[data-vote="na"]      { border-left-color: rgba(100,116,139,0.4); opacity: 0.6; }
.ic-bias-label {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #64748b;
  text-transform: uppercase;
}
.ic-bias-primary {
  font-size: 11px;
  font-weight: 600;
  color: #f1f5f9;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ic-bias-tile[data-vote="bull"] .ic-bias-arrow { color: #34d399; }
.ic-bias-tile[data-vote="bear"] .ic-bias-arrow { color: #f87171; }
.ic-bias-tile[data-vote="neutral"] .ic-bias-arrow { color: #fbbf24; }
.ic-bias-arrow { margin-right: 3px; font-size: 10px; }
.ic-bias-context {
  font-size: 9px;
  color: #64748b;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Narrow viewports: keep single row, just shrink whitespace ───────────── */
@media (max-width: 1100px) {
  .ic-bar { padding: 8px 12px; gap: 6px; }
  .ic-score, .ic-proxy { padding: 6px 8px; min-width: 92px; min-height: 64px; }
  .ic-bias { padding: 5px 8px; min-width: 540px; min-height: 64px; }
  .ic-bias-context { display: none; }
  .ic-proxy-meta, .ic-score-sub { display: none; }
}
