/* ============================================
   FORECAST VIEW · estilos armonizados con el design system de SMI.
   TODOS los selectores prefijados con #view-forecast (no contamina globales).
   ============================================ */
#view-forecast .fc-wrap { max-width: 1280px; margin: 0 auto; padding: 8px 4px 40px; }
#view-forecast .fc-head { margin-bottom: 18px; }
#view-forecast .fc-title { font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: var(--neutral-900); margin: 0 0 4px; }
#view-forecast .fc-sub { font-size: 13px; color: var(--neutral-500); margin: 0; line-height: 1.5; }

#view-forecast .fc-empty { padding: 28px; text-align: center; color: var(--neutral-500); background: var(--neutral-50);
  border: 1px dashed var(--neutral-300); border-radius: var(--tds-radius-md); margin: 20px 0; }

/* ---- Cabecera (KPIs 2-cols a la izquierda · Lectura IA a la derecha) ---- */
#view-forecast .fc-header-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 20px; margin-bottom: 22px; align-items: start; }
#view-forecast .fc-header-left { display: flex; flex-direction: column; gap: 10px; }
#view-forecast .fc-header-right { margin-bottom: 0; min-height: 100%; }
#view-forecast .fc-header-right .fc-narr { max-height: 320px; overflow: auto; }

/* ---- KPIs (2 columnas dentro del bloque izquierdo de la cabecera) ---- */
#view-forecast .fc-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
#view-forecast .fc-kpi { background: var(--tds-white); border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-md); padding: 14px 16px; box-shadow: var(--shadow-xs); }
#view-forecast .fc-kpi-v { font-size: 21px; font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
#view-forecast .fc-kpi-l { font-size: 11px; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .04em; margin-top: 4px; }
#view-forecast .fc-kpi-delta { display: inline-block; margin-left: 6px; padding: 1px 6px; font-size: 10.5px; font-weight: 700; border-radius: 3px; }
#view-forecast .fc-kpi-delta.up { color: var(--tds-green-500); background: var(--tds-green-100); }
#view-forecast .fc-kpi-delta.down { color: var(--scania-brand-red); background: var(--tds-red-100); }

/* ---- Filtros ---- */
#view-forecast .fc-filters { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; margin-bottom: 22px;
  padding: 14px 16px; background: var(--tds-white); border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-md); }
#view-forecast .fc-filters label { font-size: 11px; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .04em; display: flex; flex-direction: column; gap: 4px; }
#view-forecast .fc-filters select { font: 400 13px/1.4 var(--font-sans); color: var(--neutral-800);
  padding: 7px 10px; border: 1px solid var(--tds-border-strong); border-radius: var(--tds-radius-sm); background: var(--tds-white); min-width: 150px; }
#view-forecast .fc-filters select:focus { outline: none; border-color: var(--tds-blue-300); box-shadow: 0 0 0 3px var(--tds-blue-100); }
#view-forecast #fc-reset { background: transparent; color: var(--tds-blue-400); font: 600 12px/1 var(--font-sans);
  padding: 9px 14px; border: 1px solid var(--tds-border-strong); border-radius: var(--tds-radius-sm); cursor: pointer; }
#view-forecast #fc-reset:hover { background: var(--neutral-50); }

/* ---- Card / chart ---- */
#view-forecast .fc-card { background: var(--tds-white); border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-lg); padding: 18px 20px 16px; box-shadow: var(--shadow-sm); margin-bottom: 20px; }
#view-forecast .fc-card-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px solid var(--neutral-100); }
#view-forecast .fc-card-head h3 { font-size: 14.5px; font-weight: 800; color: var(--neutral-900); margin: 0; }
#view-forecast .fc-chart-wrap { position: relative; width: 100%; height: 320px; }
#view-forecast .fc-chart-wrap.fc-mid { height: 260px; }
#view-forecast .fc-foot { font-size: 11.5px; color: var(--neutral-500); margin: 8px 0 0; line-height: 1.5; }
#view-forecast .fc-foot-inline { font-size: 11.5px; color: var(--neutral-500); font-family: var(--font-mono); }
#view-forecast .fc-tag { font-size: 10.5px; font-weight: 700; padding: 2px 7px; border-radius: 3px; letter-spacing: .04em; }
#view-forecast .fc-tag-meta { background: var(--neutral-100); color: var(--neutral-500); font-family: var(--font-mono); }
#view-forecast .fc-tag-d { background: var(--tds-grey-100); color: var(--tds-grey-700); }
#view-forecast .fc-tag-ml { background: var(--tds-blue-100); color: var(--tds-blue-500); }
#view-forecast .fc-tag-ai { background: #EDE4FE; color: var(--accent-purple); }

#view-forecast .fc-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 11.5px; color: var(--neutral-600); }
#view-forecast .fc-leg-item { display: inline-flex; align-items: center; gap: 6px; }
#view-forecast .fc-leg-line { width: 22px; height: 2px; background: var(--neutral-900); display: inline-block; }
#view-forecast .fc-leg-line.fc-leg-real { background: var(--neutral-900); }
#view-forecast .fc-leg-line.fc-leg-cent { background: var(--tds-blue-300); }
#view-forecast .fc-leg-band { width: 22px; height: 8px; background: rgba(61,133,221,.15); display: inline-block; border-radius: 2px; }

#view-forecast .fc-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 0; align-items: start; }
#view-forecast .fc-grid-7-5 { display: grid; grid-template-columns: 7fr 5fr; gap: 20px; margin-bottom: 0; align-items: start; }

/* Mix por segmento · full-width con doughnut + barras stacked */
#view-forecast .fc-mix-split { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
#view-forecast .fc-mix-cell { display: flex; flex-direction: column; min-width: 0; }
#view-forecast .fc-subh { font-size: 12px; font-weight: 700; color: var(--neutral-600); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 10px; }
/* Leyenda unificada del Mix · 3 columnas de segmentos + 1 columna de estados */
#view-forecast .fc-mix-legend {
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 24px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--neutral-100);
}
#view-forecast .fc-legend-segs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 14px;
  align-content: start;
}
#view-forecast .fc-legend-buckets { display: flex; flex-direction: column; gap: 6px; }
#view-forecast .fc-legend-h {
  font-size: 10.5px; font-weight: 700; color: var(--neutral-500);
  text-transform: uppercase; letter-spacing: .04em; margin: 0 0 4px;
}
#view-forecast .fc-legend-item {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: var(--neutral-700);
}
#view-forecast .fc-legend-item .dot { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
#view-forecast .fc-legend-item-btn {
  background: transparent; border: 1px solid transparent; padding: 4px 6px;
  border-radius: var(--tds-radius-sm); cursor: pointer; text-align: left; font: inherit;
  transition: background var(--tx-fast), border-color var(--tx-fast);
}
#view-forecast .fc-legend-item-btn:hover { background: var(--tds-blue-50); border-color: var(--tds-blue-300); }
#view-forecast .fc-legend-item-btn:focus-visible { outline: 2px solid var(--tds-blue-300); outline-offset: 2px; }

/* Definition list usada en el modal de criterio de segmento */
#view-forecast .fc-scm-dl { display: grid; grid-template-columns: 160px 1fr; gap: 6px 14px; margin: 0; }
#view-forecast .fc-scm-dl dt { font-size: 11px; font-weight: 700; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
#view-forecast .fc-scm-dl dd { margin: 0; font-size: 13px; color: var(--neutral-800); line-height: 1.5; }
#view-forecast .fc-scm-dl code { background: var(--neutral-100); padding: 1px 6px; border-radius: 3px; font-size: 12px; color: var(--neutral-900); }
@media (max-width: 600px) {
  #view-forecast .fc-scm-dl { grid-template-columns: 1fr; }
}

/* Cards apiladas verticales (palancas/patrones a mitad de ancho) */
#view-forecast .fc-cards-stack { grid-template-columns: 1fr; }

/* Leyenda compartida del bloque HCC (attach + R&M esperado) — 4 columnas, clicable */
#view-forecast .fc-hcc-legend {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px 14px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--neutral-100);
}
@media (max-width: 900px) {
  #view-forecast .fc-hcc-legend { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Ciclo de venta · velocidad (charts + KPIs combinados) ---- */
#view-forecast .fc-velocity { display: flex; flex-direction: column; gap: 14px; }
#view-forecast .fc-vel-row { display: grid; gap: 14px; }
#view-forecast .fc-vel-row-charts { grid-template-columns: 1fr 1fr; }
#view-forecast .fc-vel-row-kpis { grid-template-columns: 1fr 1fr 1fr; }
#view-forecast .fc-vel-card {
  background: var(--neutral-50); border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-md); padding: 12px 14px;
  display: flex; flex-direction: column;
}
#view-forecast .fc-vel-title {
  font-size: 11px; font-weight: 700; color: var(--neutral-600);
  text-transform: uppercase; letter-spacing: .04em; margin: 0 0 10px;
}
#view-forecast .fc-vel-chart-wrap { position: relative; width: 100%; height: 220px; }
#view-forecast .fc-vel-pie-wrap   { position: relative; width: 100%; flex: 1 1 auto; min-height: 160px; }
#view-forecast .fc-vel-gauge      { width: 100%; flex: 1 1 auto; min-height: 130px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
#view-forecast .fc-gauge-legend   { display: flex; flex-direction: column; gap: 3px; width: 100%; max-width: 240px; }
#view-forecast .fc-gauge-leg-row  { display: grid; grid-template-columns: 11px auto auto 1fr; align-items: center; gap: 6px; font-size: 11px; color: var(--neutral-700); }
#view-forecast .fc-gauge-leg-dot  { width: 9px; height: 9px; border-radius: 50%; }
#view-forecast .fc-gauge-leg-lbl  { font-weight: 600; color: var(--neutral-800); }
#view-forecast .fc-gauge-leg-val  { font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
#view-forecast .fc-gauge-leg-n    { color: var(--neutral-500); font-family: var(--font-mono); font-size: 10px; text-align: right; }
#view-forecast .fc-vel-mini { min-height: 180px; }
#view-forecast .fc-vel-kpi-stack { display: flex; flex-direction: column; justify-content: space-around; gap: 6px; }
#view-forecast .fc-vel-kpi-stack > div { padding: 4px 0; }
#view-forecast .fc-vel-kpi { background: var(--neutral-50); border: 1px solid var(--neutral-200); border-radius: var(--tds-radius-md); padding: 12px 14px; }
#view-forecast .fc-vel-kpi-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
@media (max-width: 900px) {
  #view-forecast .fc-vel-kpi-grid { grid-template-columns: repeat(2, 1fr); }
}
#view-forecast .fc-vel-v { font-size: 18px; font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
#view-forecast .fc-vel-l { font-size: 10.5px; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .03em; margin-top: 3px; }

/* ---- Embudo de etapas (trapezoidal, sin gap, datos dentro + fuga derecha) ---- */
#view-forecast .fc-funnel { display: flex; flex-direction: column; gap: 0; padding-top: 6px; }
#view-forecast .fc-fnl-row { display: grid; grid-template-columns: 1fr 150px; gap: 14px; align-items: stretch; }
#view-forecast .fc-fnl-bar {
  position: relative;
  color: #fff;
  min-height: 72px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 8px 14px; line-height: 1.15;
  background: linear-gradient(180deg, var(--tds-blue-400), var(--tds-blue-300));   /* fallback */
}
/* Paleta funnel: azul (ofertadas) -> ámbar cálido (negociación) -> verde (ganadas).
   Misma saturación/luminosidad media → armónica. */
#view-forecast .fc-fnl-bar[data-stage="ofertadas"]   { background: linear-gradient(180deg, #2762A5, #3D85DD); }
#view-forecast .fc-fnl-bar[data-stage="negociacion"] { background: linear-gradient(180deg, #C68A20, #E5A435); }
#view-forecast .fc-fnl-bar[data-stage="ganadas"]     { background: linear-gradient(180deg, #1D8C4D, #2BAA62); }
#view-forecast .fc-fnl-stage { font-size: 12px; font-weight: 700; opacity: .95; }
#view-forecast .fc-fnl-count { font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
#view-forecast .fc-fnl-time  { font-size: 10.5px; opacity: .88; margin-top: 2px; }
#view-forecast .fc-fnl-leak  { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding-left: 10px; border-left: 3px solid var(--neutral-200); }
#view-forecast .fc-fnl-leak .fl-tot   { font-size: 11px; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
#view-forecast .fc-fnl-leak .fl-vivas { font-size: 13px; font-weight: 700; color: var(--tds-blue-500); font-variant-numeric: tabular-nums; }
#view-forecast .fc-fnl-leak .fl-perd  { font-size: 13px; font-weight: 700; color: var(--scania-brand-red); font-variant-numeric: tabular-nums; }
#view-forecast .fc-fnl-leak .lbl      { font-size: 10.5px; color: var(--neutral-500); font-weight: 500; margin-left: 4px; }
#view-forecast .fc-fnl-leak.fc-fnl-empty { display: none; }   /* primera fila sin fuga */

/* ---- Matriz oportunidad × dificultad (2x2) ---- */
#view-forecast .fc-matrix {
  display: grid; grid-template-columns: 22px 1fr 1fr; grid-template-rows: 1fr 1fr 22px;
  gap: 6px; min-height: 360px;
}
#view-forecast .fc-mx-cell { border: 1px solid var(--neutral-200); border-radius: var(--tds-radius-md); padding: 10px; display: flex; flex-direction: column; gap: 6px; overflow: auto; }
#view-forecast .fc-mx-cell .mx-title { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--neutral-500); }
#view-forecast .fc-mx-prio   { background: var(--tds-green-100); border-color: #BFE6CF; }   /* opp alta + diff baja */
#view-forecast .fc-mx-strat  { background: var(--tds-blue-50); }                            /* opp alta + diff alta */
#view-forecast .fc-mx-fill   { background: var(--neutral-50); }                             /* opp baja + diff baja */
#view-forecast .fc-mx-avoid  { background: var(--tds-red-100); border-color: #F3C9C4; }     /* opp baja + diff alta */
#view-forecast .fc-mx-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--neutral-800); background: #fff; border: 1px solid var(--neutral-200); border-radius: 20px; padding: 3px 9px; }
#view-forecast .fc-mx-chip .tag { font-size: 9px; font-weight: 800; padding: 1px 5px; border-radius: 3px; }
#view-forecast .fc-mx-ytag { writing-mode: vertical-rl; transform: rotate(180deg); text-align: center; font-size: 10px; font-weight: 700; color: var(--neutral-400); text-transform: uppercase; letter-spacing: .08em; grid-row: 1 / 3; }
#view-forecast .fc-mx-xtag { grid-column: 2 / 4; text-align: center; font-size: 10px; font-weight: 700; color: var(--neutral-400); text-transform: uppercase; letter-spacing: .08em; }

/* Separador visual sobre la barra de filtros */
#view-forecast .fc-filters-divider { position: relative; margin-top: 28px; }
#view-forecast .fc-filters-divider::before {
  content: ''; position: absolute; top: -14px; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--neutral-300), transparent);
}
#view-forecast .fc-filters-eyebrow {
  width: 100%; font-size: 10.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--tds-blue-400);
}

/* ---- Cards genéricas (patrones, palancas, clusters) ---- */
#view-forecast .fc-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
#view-forecast .fc-pcard { background: var(--neutral-50); border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-md); padding: 14px 16px; }
#view-forecast .fc-pcard h4 { font-size: 13.5px; font-weight: 700; color: var(--neutral-900); margin: 6px 0 4px; }
#view-forecast .fc-pcard .metric { font-size: 13px; font-weight: 700; color: var(--tds-blue-500); margin: 4px 0; font-variant-numeric: tabular-nums; }
#view-forecast .fc-pcard p { font-size: 12.5px; color: var(--neutral-700); line-height: 1.45; margin: 6px 0 0; }
#view-forecast .fc-pcard .head { display: flex; align-items: center; gap: 6px; }
#view-forecast .fc-spacer { flex: 1 1 auto; }

/* Badge de scope (Venta / R&M) — a la derecha del head de cada card y en la leyenda de la matriz */
#view-forecast .fc-scope { font-size: 9.5px; font-weight: 800; letter-spacing: .04em;
  padding: 2px 7px; border-radius: 999px; text-transform: uppercase;
  font-family: var(--font-sans); white-space: nowrap; }
#view-forecast .fc-scope-venta { background: var(--tds-blue-100, #DBE9F8); color: var(--tds-blue-500, #2058A8); }
#view-forecast .fc-scope-rm    { background: #FCE7C7; color: #8A4F0F; }

/* Marca R&M dentro de la matriz: punto naranja + borde sutil */
#view-forecast .fc-mx-chip.fc-mx-rm { border-color: #E5A435; background: #FFF8EE; }
#view-forecast .fc-mx-dot { width: 7px; height: 7px; border-radius: 50%; background: #D6892B; display: inline-block; }

/* Palancas (estilo card pero con destaque del upside) */
#view-forecast .fc-levers .fc-pcard { border-left: 3px solid var(--tds-blue-300); }
#view-forecast .fc-pcard .upside { font-size: 17px; font-weight: 800; color: var(--neutral-900); margin: 6px 0; }
#view-forecast .fc-pcard .upside .eur { color: var(--tds-blue-500); }
#view-forecast .fc-pcard .lever-meta { display: flex; gap: 10px; font-size: 11px; color: var(--neutral-500); margin-top: 6px; }

/* ---- Heatmap ---- */
#view-forecast .fc-heatmap { display: grid; grid-template-columns: 280px repeat(12, 1fr); gap: 2px; font-size: 11px; }
#view-forecast .fc-hm-h { color: var(--neutral-500); font-weight: 600; padding: 6px 4px; text-align: center; font-variant-numeric: tabular-nums; }
#view-forecast .fc-hm-lbl { color: var(--neutral-800); font-weight: 600; padding: 8px 6px; line-height: 1.3; }
#view-forecast .fc-hm-lbl-btn { background: transparent; border: 0; text-align: left; cursor: pointer; font: inherit; color: inherit; border-radius: 4px; transition: background var(--tx-fast); }
#view-forecast .fc-hm-lbl-btn:hover { background: var(--tds-blue-50); color: var(--tds-blue-500); }
#view-forecast .fc-hm-cell { padding: 8px 4px; text-align: center; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; border-radius: 2px; transition: transform var(--tx-fast); }
#view-forecast .fc-hm-cell:hover { transform: scale(1.05); outline: 2px solid var(--tds-blue-300); }

/* ---- Modal del Forecast (estacionalidad, etc.) ---- */
#view-forecast .fc-modal-overlay {
  position: fixed; inset: 0; background: rgba(15, 23, 42, 0.55);
  display: none; align-items: center; justify-content: center; z-index: 1000; padding: 20px;
}
#view-forecast .fc-modal-overlay.open { display: flex; }
#view-forecast .fc-modal-dialog {
  background: var(--tds-white); border-radius: var(--tds-radius-lg);
  box-shadow: var(--shadow-lg); max-width: 640px; width: 100%;
  max-height: 86vh; overflow: auto;
}
#view-forecast .fc-modal-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 18px 22px 12px; border-bottom: 1px solid var(--neutral-100);
}
#view-forecast .fc-modal-title { font-size: 15px; font-weight: 800; color: var(--neutral-900); }
#view-forecast .fc-modal-sub   { font-size: 12px; color: var(--neutral-500); margin-top: 4px; line-height: 1.5; }
#view-forecast .fc-modal-close {
  background: transparent; border: 0; font-size: 22px; color: var(--neutral-500);
  cursor: pointer; padding: 0 4px; line-height: 1;
}
#view-forecast .fc-modal-close:hover { color: var(--neutral-900); }
#view-forecast .fc-modal-body { padding: 14px 22px 22px; font-size: 13px; color: var(--neutral-800); line-height: 1.55; }
#view-forecast .fc-sm-meta {
  display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 14px; padding: 12px 14px;
  background: var(--neutral-50); border: 1px solid var(--neutral-200); border-radius: var(--tds-radius-md);
  font-size: 12.5px;
}
#view-forecast .fc-sm-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
#view-forecast .fc-sm-table th { text-align: left; color: var(--neutral-500); font-weight: 600; padding: 6px 8px; border-bottom: 2px solid var(--neutral-200); }
#view-forecast .fc-sm-table td { padding: 6px 8px; border-bottom: 1px solid var(--neutral-100); font-variant-numeric: tabular-nums; }

/* ---- Lista de segmentos ---- */
#view-forecast .fc-list { margin-top: 10px; display: grid; grid-template-columns: 1fr; gap: 4px; font-size: 12px; }
#view-forecast .fc-list-row { display: grid; grid-template-columns: auto 1fr auto auto; gap: 10px; align-items: center; padding: 4px 0; border-bottom: 1px dashed var(--neutral-100); }
#view-forecast .fc-list-row .dot { width: 10px; height: 10px; border-radius: 50%; }
#view-forecast .fc-list-row .name { color: var(--neutral-800); }
#view-forecast .fc-list-row .uds { color: var(--neutral-500); font-variant-numeric: tabular-nums; }
#view-forecast .fc-list-row .win { color: var(--tds-blue-500); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---- Cabecera resumen del bloque Oportunidades (4 cols: KPIs + 3 charts) ---- */
#view-forecast .fc-opps-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 16px;
}
#view-forecast .fc-opps-summary > .fc-opps-cell {
  background: var(--neutral-50);
  border: 1px solid var(--neutral-200);
  border-radius: var(--tds-radius-md);
  padding: 12px 14px;
  display: flex; flex-direction: column; min-width: 0;
}
#view-forecast .fc-opps-summary h4 {
  font-size: 11px; font-weight: 800; color: var(--neutral-600);
  text-transform: uppercase; letter-spacing: .04em; margin: 0 0 8px;
}
#view-forecast .fc-opps-kpis { display: flex; flex-direction: column; gap: 10px; justify-content: center; }
#view-forecast .fc-opps-kpi-v { font-size: 19px; font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
#view-forecast .fc-opps-kpi-l { font-size: 10.5px; color: var(--neutral-500); text-transform: uppercase; letter-spacing: .03em; }
#view-forecast .fc-opps-chart-wrap { position: relative; width: 100%; height: 140px; }
#view-forecast .fc-opps-cell.fc-opps-hidden { display: none; }   /* al filtrar oculta el chart ya redundante */

@media (max-width: 1100px) {
  #view-forecast .fc-opps-summary { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Tabla oportunidades ---- */
#view-forecast .fc-table-wrap { overflow-x: auto; max-height: 480px; }
#view-forecast .fc-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
#view-forecast .fc-table th { text-align: left; color: var(--neutral-500); font-weight: 600; padding: 8px 10px; border-bottom: 2px solid var(--neutral-200); position: sticky; top: 0; background: var(--tds-white); }
#view-forecast .fc-table td { padding: 7px 10px; border-bottom: 1px solid var(--neutral-100); color: var(--neutral-800); font-variant-numeric: tabular-nums; }
#view-forecast .fc-table .pwin { display: inline-flex; align-items: center; gap: 6px; }
#view-forecast .fc-table .pwin-bar { width: 60px; height: 6px; background: var(--neutral-100); border-radius: 3px; overflow: hidden; }
#view-forecast .fc-table .pwin-fill { height: 100%; background: var(--tds-blue-300); }

/* ---- Narrativa IA ---- */
#view-forecast .fc-btn { background: var(--tds-blue-300); color: var(--tds-white); border: 0; border-radius: var(--tds-radius-sm);
  padding: 8px 14px; font: 600 12px/1 var(--font-sans); cursor: pointer; transition: background var(--tx-fast); }
#view-forecast .fc-btn:hover { background: var(--tds-blue-400); }
#view-forecast .fc-btn:disabled { opacity: .55; cursor: default; }
#view-forecast .fc-narr h3, #view-forecast .fc-narr h4, #view-forecast .fc-narr h5 { color: var(--neutral-900); margin: 10px 0 4px; }
#view-forecast .fc-narr ul { margin: 4px 0 8px; padding-left: 20px; }
#view-forecast .fc-narr li { margin: 3px 0; font-size: 13px; color: var(--neutral-800); line-height: 1.5; }
#view-forecast .fc-narr p { font-size: 13px; color: var(--neutral-800); line-height: 1.5; margin: 6px 0; }
#view-forecast .fc-narr .err { color: var(--scania-brand-red); }
#view-forecast .fc-narr .spin::before { content: "⏳ "; }

@media (max-width: 900px) {
  #view-forecast .fc-header-grid { grid-template-columns: 1fr; }
  #view-forecast .fc-kpis { grid-template-columns: repeat(2, 1fr); }
  #view-forecast .fc-grid-2 { grid-template-columns: 1fr; }
  #view-forecast .fc-grid-7-5 { grid-template-columns: 1fr; }
  #view-forecast .fc-mix-split { grid-template-columns: 1fr; }
  #view-forecast .fc-mix-legend { grid-template-columns: 1fr; }
  #view-forecast .fc-legend-segs { grid-template-columns: repeat(2, 1fr); }
  #view-forecast .fc-vel-row-charts { grid-template-columns: 1fr; }
  #view-forecast .fc-vel-row-kpis { grid-template-columns: 1fr; }
  #view-forecast .fc-heatmap { grid-template-columns: 80px repeat(12, 1fr); font-size: 10px; }
}
