html {
  /* Casi todo el viewport; tope alto solo para pantallas enormes (ultrawide / 4K).
   * Sin `100vw`: incluye el ancho de la barra de scroll y provoca reflow al scrollear (wrap del header). */
  --content-max-width: 3840px;
  /* Carril de scroll + barra siempre: ancho útil estable (evita que grupos/solapas cambien de línea al scrollear). */
  scrollbar-gutter: stable;
  overflow-y: scroll;
  /*
   * Tablas: fuente `--font-table` (sin ajuste dinámico global; evita saltos de scroll).
   */
  --font-table: clamp(12px, 0.26vw + 10px, 14px);
  --font-output: 13px;
  /* Chrome: solapas y píldora “Última actualización” (misma línea que .tabButton). */
  --font-tab: 13px;
  --font-ui-strong: 600;
  --pad-table-cell: 5px 6px;
  /* Padding horizontal compartido: contenedor y barra fija (alineación). */
  --container-pad-x: clamp(6px, 10px, 12px);
  /* Entre 1.ª y 2.ª fila del header (solapas / estado). */
  --stack-gap: 10px;
  /* Bajo el chrome fijo no sumar margen extra: el #appChromeSpacer ya reserva el alto exacto. */
  --chrome-content-gap: 0px;
  /* Dentro de la tarjeta: mínimo aire bajo el borde; el bloque .filters lleva el mismo valor arriba. */
  --panel-inset-y: 5px;
  /*
   * Escala documento (`zoom` en el siguiente bloque `html`). Debe coincidir con ese valor numérico.
   *
   * Zoom en `html` y gráficos ECharts (y canvas ZRender): Apache ECharts no corrige aún la conversión
   * puntero↔tooltip cuando el documento usa CSS `zoom` → tooltips visibles pero desplazados
   * (issue: https://github.com/apache/echarts/issues/20350 ). Aquí NO se “arregla” desde JS:
   * en los bloques que montan el chart (.dashboard-soberano-chart-block, .bcra-rem-chart-panel, …)
   * se aplica zoom inverso `calc(1 / var(--mercados-doc-zoom))` para que dentro del bloque el factor
   * neto sea ~1 y coincidan hover y tooltip. Si agregás otro `echarts.init`, añadí el mismo patrón a
   * su contenedor o a un ancestro que envuelva solo ese chart.
   */
  --mercados-doc-zoom: 0.8;
  /* Altura del #appChromeSpacer (= borde inferior del header); JS pisa --app-chrome-spacer-h. */
  --app-chrome-spacer-h: 118px;
}

body[data-group="dashboards"] {
  --container-pad-x: clamp(4px, 8px, 10px);
}

/* Modo noche: fondo casi negro; modo día: fondo blanco (ver html[data-theme="light"]). */
html[data-theme="dark"],
html:not([data-theme]) {
  color-scheme: dark;
  --bg: #050508;
  --body-bg: radial-gradient(900px 480px at 8% 0%, rgba(255, 255, 255, 0.04), transparent 55%),
    radial-gradient(700px 400px at 92% 5%, rgba(255, 255, 255, 0.03), transparent 50%), var(--bg);
  --card: #12141a;
  --text: #e8edf5;
  --muted: #8b96ab;
  /* Subtítulo bajo “Mercados Argentina” (legible sin competir con el h1) */
  --header-status-label: #a8b4ca;
  --header-status-value: #dce6f4;
  --brand-wordmark-accent: #74acdf;
  --border: rgba(255, 255, 255, 0.1);
  --btn: #1a2332;
  --btnHover: #243044;
  --accent: #7dd3fc;
  --table-row-stripe: rgba(255, 255, 255, 0.045);
  --table-row-hover: rgba(100, 116, 139, 0.28);
  --output-text: #e5e7eb;
  --surface-card: rgba(12, 14, 18, 0.92);
  --surface-status: rgba(12, 14, 18, 0.88);
  --surface-pill: rgba(8, 10, 14, 0.88);
  --surface-pill-border: rgba(148, 163, 184, 0.22);
  --surface-tabs: rgba(10, 12, 16, 0.92);
  --surface-tabs-border: rgba(148, 163, 184, 0.35);
  --surface-select: rgba(10, 12, 16, 0.85);
  --surface-panel: rgba(10, 12, 16, 0.55);
  --group-hover-bg: rgba(255, 255, 255, 0.06);
  --group-active-bg: rgba(59, 130, 246, 0.18);
  --group-active-fg: #60a5fa;
  --group-active-ring: rgba(59, 130, 246, 0.35);
  --tab-hover-bg: rgba(30, 64, 175, 0.45);
  --tab-hover-fg: #e5e7eb;
  --tab-active-fg: #f1f5f9;
  --tab-active-grad-a: #1d4ed8;
  --tab-active-grad-b: #4f46e5;
  --table-head-bg: #0a0c10;
  --table-cell-border: rgba(148, 163, 184, 0.22);
  --card-header-title: #c8dff7;
  --input-bg: rgba(255, 255, 255, 0.07);
  --chart-panel-bg: #131722;
  --chart-title-fg: #f1f5f9;
  --chart-sub-fg: #94a3b8;
  /* Tokens universales (2026-07-06): color semántico +/- y acento de gráficos de serie.
     Consumidos por el line-chart de series BCRA; a migrar al resto (hoy verde/rojo son hex sueltos). */
  --pos: #22c55e;
  --neg: #dc2626;
  --muted: #94a3b8;
  --chart-accent: #4c8dff;
  --chart-accent-fill-top: rgba(76, 141, 255, 0.24);
  --chart-accent-fill-bot: rgba(76, 141, 255, 0.02);
  --rem-chart-title: #ffffff;
  --rem-chart-sub: #94a3b8;
  --loading-fg: #e2e8f0;
  --filter-option-bg: rgba(10, 12, 16, 0.82);
  --dash-calc-input-bg: rgba(10, 12, 16, 0.82);
  --calc-panel-tint: rgba(12, 14, 22, 0.65);
  --acc-surface: rgba(4, 6, 12, 0.5);
  --empty-dashboard-bg: rgba(4, 6, 12, 0.45);
  --border-soft: rgba(148, 163, 184, 0.18);
  --border-medium: rgba(148, 163, 184, 0.4);
  --chart-toggle-fg: #d1d5db;
  --chart-placeholder-fg: #cbd5e1;
  --legend-text-fg: #e2e8f0;
  /* +/- de mercado: derivan del token semántico universal (fuente única). Mismo valor de siempre.
     El JS del treemap lee este nombre y getComputedStyle resuelve el var() a hex → sin romper nada. */
  --dashboard-acciones-treemap-up: var(--pos);
  --dashboard-acciones-treemap-down: var(--neg);
  --dashboard-acciones-treemap-flat: #64748b;
  /* ±3 % extremos: verde/rojo tipo mercado (sin neón #0f0 / #f00) */
  --dashboard-acciones-treemap-pure-up: #15803d;
  --dashboard-acciones-treemap-pure-down: #dc2626;
  --dashboard-acciones-treemap-neutral-band: #334155;
  --dashboard-acciones-treemap-unknown: #475569;
  --dashboard-acciones-treemap-cell-fg-strong: #f8fafc;
  --dashboard-acciones-treemap-cell-fg-muted: #f1f5f9;
  --dashboard-acciones-treemap-stroke: rgba(255, 255, 255, 0.14);
  --dashboard-acciones-treemap-sector-title: #94a3b8;
  --cal-scroll-bg: rgba(6, 8, 12, 0.45);
  --cal-th-bg: rgba(10, 12, 16, 0.95);
  --cal-td-bg: rgba(10, 12, 16, 0.42);
  --cal-td-weekend: rgba(10, 12, 16, 0.28);
  --cal-td-pad-border: rgba(255, 255, 255, 0.06);
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #ffffff;
  --body-bg: #ffffff;
  --card: #f8fafc;
  --text: #0f172a;
  --muted: #64748b;
  --header-status-label: #64748b;
  --header-status-value: #1e293b;
  --brand-wordmark-accent: #0c4a6e;
  --border: rgba(15, 23, 42, 0.12);
  --btn: #e2e8f0;
  --btnHover: #cbd5e1;
  --accent: #0369a1;
  --table-row-stripe: rgba(15, 23, 42, 0.04);
  --table-row-hover: rgba(59, 130, 246, 0.1);
  --output-text: #1e293b;
  --surface-card: rgba(248, 250, 252, 0.98);
  --surface-status: rgba(241, 245, 249, 0.95);
  --surface-pill: rgba(241, 245, 249, 0.98);
  --surface-pill-border: rgba(15, 23, 42, 0.1);
  --surface-tabs: #e2e8f0;
  --surface-tabs-border: rgba(15, 23, 42, 0.14);
  --surface-select: #f1f5f9;
  --surface-panel: rgba(241, 245, 249, 0.9);
  --group-hover-bg: rgba(15, 23, 42, 0.06);
  --group-active-bg: rgba(59, 130, 246, 0.12);
  --group-active-fg: #1d4ed8;
  --group-active-ring: rgba(59, 130, 246, 0.35);
  --tab-hover-bg: rgba(59, 130, 246, 0.12);
  --tab-hover-fg: #0f172a;
  --tab-active-fg: #ffffff;
  --tab-active-grad-a: #2563eb;
  --tab-active-grad-b: #4f46e5;
  --table-head-bg: #f1f5f9;
  --table-cell-border: rgba(15, 23, 42, 0.12);
  --card-header-title: #0f172a;
  --input-bg: #ffffff;
  --chart-panel-bg: #f8fafc;
  --chart-title-fg: #0f172a;
  --chart-sub-fg: #64748b;
  /* Tokens universales — variante día. */
  --pos: #16a34a;
  --neg: #dc2626;
  --muted: #64748b;
  --chart-accent: #2563eb;
  --chart-accent-fill-top: rgba(37, 99, 235, 0.16);
  --chart-accent-fill-bot: rgba(37, 99, 235, 0.01);
  --rem-chart-title: #0f172a;
  --rem-chart-sub: #64748b;
  --loading-fg: #1e293b;
  --filter-option-bg: #e2e8f0;
  --dash-calc-input-bg: #ffffff;
  --calc-panel-tint: rgba(241, 245, 249, 0.98);
  --acc-surface: rgba(241, 245, 249, 0.92);
  --empty-dashboard-bg: rgba(241, 245, 249, 0.88);
  --border-soft: rgba(15, 23, 42, 0.12);
  --border-medium: rgba(15, 23, 42, 0.2);
  --chart-toggle-fg: #475569;
  --chart-placeholder-fg: #64748b;
  --legend-text-fg: #1e293b;
  /* +/- de mercado (día): mismo token semántico universal. */
  --dashboard-acciones-treemap-up: var(--pos);
  --dashboard-acciones-treemap-down: var(--neg);
  --dashboard-acciones-treemap-flat: #94a3b8;
  --dashboard-acciones-treemap-pure-up: #16a34a;
  --dashboard-acciones-treemap-pure-down: #dc2626;
  --dashboard-acciones-treemap-neutral-band: #475569;
  --dashboard-acciones-treemap-unknown: #64748b;
  --dashboard-acciones-treemap-cell-fg-strong: #ffffff;
  --dashboard-acciones-treemap-cell-fg-muted: #0f172a;
  --dashboard-acciones-treemap-stroke: rgba(15, 23, 42, 0.14);
  --dashboard-acciones-treemap-sector-title: #475569;
  --cal-scroll-bg: rgba(241, 245, 249, 0.95);
  --cal-th-bg: #e2e8f0;
  --cal-td-bg: #f8fafc;
  --cal-td-weekend: #f1f5f9;
  --cal-td-pad-border: rgba(15, 23, 42, 0.08);
}

* {
  box-sizing: border-box;
}

html {
  /* Escala global: valor central en `--mercados-doc-zoom` (arriba); ver nota allí re: ECharts/tooltips. */
  zoom: var(--mercados-doc-zoom, 0.8);
  overflow-x: clip;
  max-width: 100%;
  /* Evita que el motor ajuste scrollTop al cambiar altura del contenido (dashboards / table_font_fit). */
  overflow-anchor: none;
}

body {
  margin: 0;
  overflow-x: clip;
  overflow-y: visible;
  max-width: 100%;
  overflow-anchor: none;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji",
    "Segoe UI Emoji";
  background: var(--body-bg);
  color: var(--text);
}

.container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--content-max-width);
  margin: 0 auto;
  /* Sin padding-top: el `#appChromeSpacer` (sync en JS) reserva exactamente el alto del chrome fijo. */
  padding: 0 var(--container-pad-x) 88px;
  /* clip: recorta desborde horizontal sin forzar scrollport en Y (hidden+visible→auto rompe sticky). */
  overflow-x: clip;
  overflow-y: visible;
}

/* Altura la fija JS (= alto del chrome). Fallback hasta syncAppChromeLayout (reduce CLS al pintar). */
.appChromeSpacer {
  width: 100%;
  flex-shrink: 0;
  pointer-events: none;
  height: var(--app-chrome-spacer-h, 118px);
  min-height: 0;
}

/* Dashboards: espacio extra bajo la solapa activa; el scroll nunca depende de JS — solo layout. */
#panels_dashboards {
  padding-bottom: clamp(72px, 20vh, 260px);
  box-sizing: border-box;
  /* Superficies compartidas: burbujas FX (Inicio + Tipos de cambio) y widgets TV landing. */
  --dashboard-tc-panel-bg: color-mix(in srgb, var(--card) 94%, var(--text) 6%);
  --dashboard-tc-quote-bg: transparent;
  --dashboard-tc-inset-bg: color-mix(in srgb, var(--card) 91%, var(--text) 5%);
}

/* Más ancho útil para tablas/gráficos: menos padding lateral que .output genérico. */
#panels_dashboards .output {
  padding: 0 4px 10px;
}

#panels_dashboards .output:not(:has(.filters)):not(.output--landing) {
  padding-top: var(--panel-inset-y);
}

/* Acciones - USA / ETFs / CRIPTO — embeds TradingView (screener + heatmap) */
.output.output--acciones-usa,
.output.output--etfs-tv,
.output.output--cripto-tv {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

/* Experimento 2026-07-06: enmarcar los embeds TradingView (cripto/etfs/acciones USA) con el card
   chrome de MA (superficie matcheada + borde suave + esquinas redondeadas) para que se lean como
   secciones de la app y no como páginas TV sueltas. CSS-only y reversible. */
.output--cripto-tv .tvWidgetSlot,
.output--etfs-tv .tvWidgetSlot,
.output--acciones-usa .tvWidgetSlot {
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  overflow: hidden;
  background: var(--chart-panel-bg);
}

/* Landing Mercados inicio: alturas en px de layout (html zoom 0.8); JS pisa --mercados-landing-tv-h. */
:root {
  --mercados-landing-tv-h: 760px;
  --mercados-landing-chart-h: var(--mercados-landing-tv-h);
  --mercados-landing-timeline-h: var(--mercados-landing-tv-h);
}

/* Landing: fila TV = Top stories (izq.) + gráfico (der.); watchlist híbrida debajo a ancho completo. */
#panels_dashboards .card.tabPanel.card--landing {
  --mercados-landing-tc-gap: 14px;
  --snapshot-band-gap: var(--mercados-landing-tc-gap, 14px);
  /* Relleno compartido: burbujas FX, snapshot y watchlist. */
  --mercados-landing-panel-bg: color-mix(in srgb, var(--card) 94%, var(--text) 6%);
  --mercados-landing-panel-hdr-bg: color-mix(in srgb, var(--card) 88%, var(--text) 4%);
  --mercados-landing-toolbar-bg: color-mix(in srgb, var(--card) 96%, var(--text) 4%);
  --dashboard-tc-panel-bg: var(--mercados-landing-panel-bg);
  --dashboard-tc-quote-bg: transparent;
  --dashboard-tc-inset-bg: color-mix(in srgb, var(--card) 91%, var(--text) 5%);
}

#panels_dashboards .card.tabPanel.card--landing .output--landing {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--mercados-landing-tc-gap, 14px);
  padding: 0;
  min-height: 0;
  overflow: visible;
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Aire bajo header → burbujas FX (mismo token que FX → snapshot); independiente del espaciador. */
#panels_dashboards .card.tabPanel.card--landing #mercadosInicioTcStrip {
  margin-top: var(--mercados-landing-tc-gap, 14px);
}

#panels_dashboards .card.tabPanel.card--landing .landing-tv-wrap.output--landing-tv {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 14px;
  width: 100%;
  max-width: none;
  margin: 0;
  flex-shrink: 0;
  flex-grow: 0;
  align-self: flex-start;
  min-height: var(--mercados-landing-tv-h, 760px);
  height: auto;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

#panels_dashboards .card.tabPanel.card--landing .landing-tv-wrap.output--landing-tv.mercados-landing-tv--layout-ready {
  height: var(--mercados-landing-tv-h, 760px);
  min-height: var(--mercados-landing-tv-h, 760px);
}

.output.output--landing-tv {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 14px;
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  overflow: visible;
}

.landing-tv-col {
  min-width: 0;
  align-self: stretch;
}

.landing-tv-col--timeline {
  flex: 0.88 1 42%;
  overflow: hidden;
}

.landing-tv-col--chart {
  flex: 1.12 1 58%;
  min-width: min(100%, 520px);
  overflow: hidden;
}

.landing-tv-col--chart,
.landing-tv-col--timeline {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: auto;
}

#panels_dashboards .card.tabPanel.card--landing .landing-tv-wrap.mercados-landing-tv--layout-ready .landing-tv-col--chart,
#panels_dashboards .card.tabPanel.card--landing .landing-tv-wrap.mercados-landing-tv--layout-ready .landing-tv-col--timeline {
  min-height: var(--mercados-landing-tv-h, 760px);
  height: var(--mercados-landing-tv-h, 760px);
}

.tvWidgetSlot--advanced-chart,
.tvWidgetSlot--landing-timeline {
  width: 100%;
  max-width: none;
  margin: 0;
  flex: 1 1 auto;
  overflow: hidden;
  box-sizing: border-box;
}

.tvWidgetSlot--advanced-chart {
  height: var(--mercados-landing-chart-h, var(--mercados-landing-tv-h, 760px));
  min-height: var(--mercados-landing-chart-h, var(--mercados-landing-tv-h, 760px));
}

.tvWidgetSlot--landing-timeline {
  height: var(--mercados-landing-timeline-h, var(--mercados-landing-tv-h, 760px));
  min-height: var(--mercados-landing-timeline-h, var(--mercados-landing-tv-h, 760px));
}

.output--landing-tv .tradingview-widget-container {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: inherit;
  overflow: hidden;
}

.output--landing-tv .tradingview-widget-container__widget {
  height: 100%;
  min-height: inherit;
}

.output--landing-tv .tvWidgetSlot--advanced-chart .tradingview-widget-container iframe,
.output--landing-tv .tvWidgetSlot--landing-timeline .tradingview-widget-container iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: inherit !important;
  max-height: none !important;
}

.output--landing-tv .tvWidgetSlot--landing-timeline {
  /* Hex literal: TradingView parseRgb no entiende color-mix() ni vars con alpha. */
  background-color: #0f0f0f;
}

#panels_dashboards .card.tabPanel.card--landing .tvWidgetSlot--advanced-chart,
#panels_dashboards .card.tabPanel.card--landing .tvWidgetSlot--landing-timeline {
  background-color: #0f0f0f;
  border: 1px solid var(--border);
  border-radius: 12px;
  box-sizing: border-box;
}

html[data-theme="light"] .output--landing-tv .tvWidgetSlot--landing-timeline,
html[data-theme="light"] #panels_dashboards .card.tabPanel.card--landing .tvWidgetSlot--advanced-chart,
html[data-theme="light"] #panels_dashboards .card.tabPanel.card--landing .tvWidgetSlot--landing-timeline {
  background-color: #f8fafc;
}

.output--landing-tv .tvWidgetSlot--advanced-chart .tradingview-widget-container,
.output--landing-tv .tvWidgetSlot--landing-timeline .tradingview-widget-container {
  background-color: #0f0f0f;
}

html[data-theme="light"] .output--landing-tv .tvWidgetSlot--advanced-chart .tradingview-widget-container,
html[data-theme="light"] .output--landing-tv .tvWidgetSlot--landing-timeline .tradingview-widget-container {
  background-color: #f8fafc;
}

.tvWidgetSlot {
  box-sizing: border-box;
  width: 100%;
  flex: 0 0 auto;
  /* Encaje con alturas px (~54% / ~58% del viewport desde script.js) */
  min-height: clamp(620px, 54vh, 980px);
}

.tvWidgetSlot--heatmap {
  min-height: clamp(680px, 58vh, 1040px);
}

/* Landing Mercados: anular min-height global de `.tvWidgetSlot` en chart y timeline. */
.output--landing-tv .tvWidgetSlot--advanced-chart,
.output--landing-tv .tvWidgetSlot--landing-timeline {
  min-height: 0;
}

.output--landing-tv .tvWidgetSlot--advanced-chart,
.output--landing-tv .tvWidgetSlot--landing-timeline {
  min-height: 0;
}

.output--landing-tv .tvWidgetSlot--advanced-chart .tradingview-widget-copyright {
  margin: 0;
  padding: 4px 0 0;
  font-size: 11px;
  line-height: 1.2;
}

/* Watchlist híbrida Inicio (yfinance + BYMA) — sección nueva debajo del bloque TV */
#panels_dashboards .output--landing .mercados-inicio-hybrid-watchlist {
  --hybrid-font: clamp(0.82rem, 0.76rem + 0.18vw, 0.92rem);
  --hybrid-row-h: 1.85rem;
  --hybrid-sym-col: 28%;
  --hybrid-section-btn-font: clamp(0.82rem, 0.78rem + 0.16vw, 0.92rem);
  --hybrid-section-btn-pad: 6px 11px;
  --hybrid-section-btn-gap: 5px;
  --hybrid-boot-min-h: calc(3.25rem + 6 * var(--hybrid-row-h));
  position: relative;
  width: 100%;
  margin-top: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--mercados-landing-panel-bg, color-mix(in srgb, var(--card) 94%, var(--text) 6%));
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
  overflow: visible;
  flex-shrink: 0;
  min-height: var(--hybrid-boot-min-h);
  font-size: var(--hybrid-font);
  color: var(--output-text);
}

.mercados-inicio-hybrid-watchlist__section-toolbar {
  padding: 9px 11px;
  border-bottom: 1px solid var(--border);
  background: var(--mercados-landing-toolbar-bg, color-mix(in srgb, var(--card) 96%, var(--text) 4%));
}

.mercados-inicio-hybrid-watchlist__toolbar-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px 12px;
  min-width: 0;
}

.mercados-inicio-hybrid-watchlist__toolbar-row [data-hybrid-section-filters] {
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.mercados-inicio-hybrid-watchlist__section-filter {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  width: max-content;
  max-width: none;
}

.mercados-inicio-hybrid-watchlist__section-filter .mercados-filter-btn-group {
  flex-wrap: nowrap;
  gap: var(--hybrid-section-btn-gap, 5px);
}

.mercados-inicio-hybrid-watchlist__section-filter .mercados-filter-btn {
  font-size: var(--hybrid-section-btn-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.2;
  padding: var(--hybrid-section-btn-pad);
}

.mercados-inicio-hybrid-watchlist__updated {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 0.35em;
  margin: 0 0 0 auto;
  padding: 6px 0;
  font-size: clamp(0.72rem, 0.68rem + 0.1vw, 0.82rem);
  line-height: 1.2;
  color: var(--muted);
  border: none;
  background: none;
  white-space: nowrap;
  text-align: right;
  align-self: center;
}

.mercados-inicio-hybrid-watchlist__updated-label {
  font-weight: 600;
  color: var(--text);
  line-height: 1.2;
}

.mercados-inicio-hybrid-watchlist__updated-at {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  color: var(--text);
  line-height: 1.2;
}

.mercados-inicio-hybrid-watchlist__warn {
  margin: 0;
  padding: 8px 14px;
  font-size: clamp(0.76rem, 0.72rem + 0.12vw, 0.84rem);
  line-height: 1.35;
  color: #ffb74d;
  background: rgba(255, 183, 77, 0.08);
  border-bottom: 1px solid rgba(255, 183, 77, 0.25);
}

.mercados-inicio-hybrid-watchlist__warn code {
  font-size: 0.92em;
  word-break: break-all;
}

.mercados-inicio-hybrid-watchlist__body {
  overflow-x: auto;
  overflow-y: visible;
  border-radius: inherit;
  -webkit-overflow-scrolling: touch;
}

.mercados-inicio-hybrid-watchlist__table {
  width: 100%;
  min-width: 72rem;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: inherit;
  line-height: var(--hybrid-row-h);
  font-variant-numeric: tabular-nums;
}

.mercados-inicio-hybrid-watchlist__col-sym {
  width: var(--hybrid-sym-col);
}

.mercados-inicio-hybrid-watchlist__group + .mercados-inicio-hybrid-watchlist__group .mercados-inicio-hybrid-watchlist__group-head {
  border-top: 1px solid var(--table-cell-border, var(--border));
}

.mercados-inicio-hybrid-watchlist__group-head {
  background: var(--mercados-landing-panel-hdr-bg, color-mix(in srgb, var(--card) 88%, var(--text) 4%));
}

.mercados-inicio-hybrid-watchlist__group-head th {
  padding: 6px 8px 4px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  vertical-align: middle;
  color: var(--muted);
  border-bottom: 1px solid var(--table-cell-border, var(--border));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mercados-inicio-hybrid-watchlist__group-head .mercados-inicio-hybrid-watchlist__group-name,
.mercados-inicio-hybrid-watchlist__group-head .mercados-inicio-hybrid-watchlist__col-hdr {
  color: var(--card-header-title);
}

.mercados-inicio-hybrid-watchlist__group-head .mercados-inicio-hybrid-watchlist__group-name {
  text-align: center;
  font-size: clamp(0.82rem, 0.76rem + 0.18vw, 0.9rem);
  font-weight: 700;
  letter-spacing: 0.03em;
}

.mercados-inicio-hybrid-watchlist__group-label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: inherit;
}

.mercados-inicio-hybrid-watchlist__group-label .mercados-inicio-hybrid-watchlist__rf-var-filter {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  margin: 0 0 0 0.45rem;
  text-transform: none;
  font-weight: normal;
  letter-spacing: normal;
}

.mercados-inicio-hybrid-watchlist__rf-var-filter .mercados-filter-btn-group {
  gap: 4px;
}

.mercados-inicio-hybrid-watchlist__rf-var-filter .mercados-filter-btn {
  font-size: 0.72rem;
  padding: 0.14rem 0.55rem;
  line-height: 1.2;
}

.mercados-inicio-hybrid-watchlist__group-note {
  display: inline;
  font-size: clamp(0.68rem, 0.64rem + 0.1vw, 0.74rem);
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
  white-space: nowrap;
}

.mercados-inicio-hybrid-watchlist__group-head .mercados-inicio-hybrid-watchlist__col-hdr {
  font-size: clamp(0.82rem, 0.76rem + 0.18vw, 0.9rem);
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.03em;
}

.mercados-inicio-hybrid-watchlist__col-hdr--sortable {
  padding: 0;
}

.mercados-inicio-hybrid-watchlist__col-hdr-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0.2rem 0.35rem;
  border: none;
  background: transparent;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  color: inherit;
  cursor: pointer;
  user-select: none;
}

.mercados-inicio-hybrid-watchlist__col-hdr-btn:hover {
  text-decoration: underline;
}

.mercados-inicio-hybrid-watchlist__col-hdr-btn.is-sort-desc::after,
.mercados-inicio-hybrid-watchlist__col-hdr-btn.is-sort-asc::after {
  margin-left: 0.2em;
  font-size: 0.78em;
  opacity: 0.92;
}

.mercados-inicio-hybrid-watchlist__col-hdr-btn.is-sort-desc::after {
  content: "▼";
}

.mercados-inicio-hybrid-watchlist__col-hdr-btn.is-sort-asc::after {
  content: "▲";
}

.mercados-inicio-hybrid-watchlist__row td {
  height: var(--hybrid-row-h);
  max-height: var(--hybrid-row-h);
  padding: 0 8px;
  vertical-align: middle;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  overflow: hidden;
  box-sizing: border-box;
}

.mercados-inicio-hybrid-watchlist__group > tr:last-child td {
  border-bottom: none;
}

.mercados-inicio-hybrid-watchlist__sym {
  text-align: center;
  font-weight: 600;
  color: var(--text);
}

.mercados-inicio-hybrid-watchlist__sym-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.mercados-inicio-hybrid-watchlist__sym-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mercados-inicio-hybrid-watchlist__logo-wrap.dashboard-acciones-logo-wrap {
  border: 1px solid var(--border-soft, var(--border));
  box-sizing: border-box;
  background: var(--surface-panel);
}

.mercados-inicio-hybrid-watchlist__logo-wrap {
  position: relative;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  overflow: hidden;
}

.mercados-inicio-hybrid-watchlist__logo-wrap--flag .mercados-inicio-hybrid-watchlist__logo-img,
.mercados-inicio-hybrid-watchlist__logo-wrap--flag .mercados-hybrid-flag-img {
  opacity: 1;
  border-radius: 50%;
  object-fit: cover;
}

.mercados-inicio-hybrid-watchlist__logo-wrap--flag .dashboard-bond-flag-favicon {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--border-soft, var(--border));
  box-sizing: border-box;
}

.mercados-inicio-hybrid-watchlist__logo-wrap--flag .dashboard-bond-flag-favicon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mercados-inicio-hybrid-watchlist__logo-img,
.mercados-inicio-hybrid-watchlist .dashboard-acciones-logo-img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  background: var(--surface-panel);
  border: none;
  display: block;
  box-sizing: border-box;
  opacity: 0;
  transition: none;
}

.mercados-inicio-hybrid-watchlist .dashboard-acciones-logo-img.mercados-hybrid-logo-img--loaded {
  opacity: 1;
}

.mercados-inicio-hybrid-watchlist .dashboard-acciones-logo-wrap--broken .dashboard-acciones-logo-img {
  display: block;
  opacity: 0;
}

.mercados-inicio-hybrid-watchlist__logo-fallback,
.mercados-inicio-hybrid-watchlist .dashboard-acciones-logo-fallback {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  width: 100%;
  height: 100%;
  border-radius: 0;
  align-items: center;
  justify-content: center;
  background: var(--surface-panel);
  border: none;
  box-sizing: border-box;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--chart-title-fg, var(--text));
}

.mercados-inicio-hybrid-watchlist .dashboard-acciones-logo-wrap--broken .dashboard-acciones-logo-fallback {
  display: flex;
}

.mercados-inicio-hybrid-watchlist__sym-name {
  font-weight: 600;
  color: var(--text);
}

.mercados-inicio-hybrid-watchlist__sym-ticker {
  font-weight: 500;
  color: var(--muted);
}

.mercados-inicio-hybrid-watchlist__val-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  max-width: 100%;
}

.mercados-inicio-hybrid-watchlist__val {
  font-variant-numeric: tabular-nums;
}

.mercados-inicio-hybrid-watchlist__delay {
  flex: 0 0 auto;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  color: #ff9800;
  cursor: default;
  user-select: none;
}

.mercados-inicio-hybrid-watchlist__delay:focus {
  outline: none;
}

.mercados-inicio-hybrid-watchlist__delay:focus-visible {
  outline: 1px dotted rgba(255, 152, 0, 0.65);
  outline-offset: 1px;
}

.mercados-inicio-hybrid-watchlist__val-wrap[data-delay-tip] {
  cursor: default;
  position: relative;
}

.mercados-inicio-hybrid-watchlist__delay-tooltip {
  position: absolute;
  z-index: 10050;
  /* Contra-zoom: mismo patrón que ECharts (html { zoom: 0.8 } desplaza fixed + getBoundingClientRect). */
  zoom: calc(1 / var(--mercados-doc-zoom, 0.8));
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: var(--text);
  background: color-mix(in srgb, var(--surface-card, #12141a) 92%, #000 8%);
  border: 1px solid var(--border);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.04) inset;
  pointer-events: none;
  white-space: nowrap;
  opacity: 1;
  transition: opacity 0.12s ease;
}

.mercados-inicio-hybrid-watchlist__delay-tooltip[hidden] {
  display: none !important;
}

.mercados-inicio-hybrid-watchlist__delay-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 8px;
  height: 8px;
  transform: translateX(-50%) rotate(45deg);
  background: inherit;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.08);
}

.mercados-inicio-hybrid-watchlist__delay-tooltip[data-placement="above"]::after {
  bottom: -4px;
}

.mercados-inicio-hybrid-watchlist__delay-tooltip[data-placement="below"]::after {
  top: -4px;
  transform: translateX(-50%) rotate(225deg);
  border-right: none;
  border-bottom: none;
  border-left: 1px solid var(--border);
  border-top: 1px solid var(--border);
}

html[data-theme="light"] .mercados-inicio-hybrid-watchlist__delay-tooltip {
  background: #fff;
  box-shadow:
    0 8px 22px rgba(15, 23, 42, 0.14),
    0 0 0 1px rgba(15, 23, 42, 0.06) inset;
}

html[data-theme="light"] .mercados-inicio-hybrid-watchlist__delay-tooltip::after {
  background: #fff;
}

.mercados-inicio-hybrid-watchlist__num {
  text-align: center;
  font-weight: 500;
  color: var(--output-text);
}

.mercados-inicio-hybrid-watchlist__logo-wrap--flag .mercados-hybrid-flag-us {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--border-soft, var(--border));
  box-sizing: border-box;
}

.mercados-inicio-hybrid-watchlist__logo-wrap--flag .mercados-hybrid-flag-us svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* Paridad con snapshot: impar=raya; fila de grupo ocupa nth-child(1) → datos en pares llevan raya. */
.mercados-inicio-hybrid-watchlist__group > tr.mercados-inicio-hybrid-watchlist__row:nth-child(even) {
  background: var(--table-row-stripe);
}

.mercados-inicio-hybrid-watchlist__group > tr.mercados-inicio-hybrid-watchlist__row:nth-child(odd) {
  background: transparent;
}

.mercados-inicio-hybrid-watchlist__row {
  cursor: pointer;
  height: var(--hybrid-row-h);
}

.mercados-inicio-hybrid-watchlist__row:hover {
  background: var(--table-row-hover) !important;
}

.mercados-inicio-hybrid-watchlist__badge {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  font-size: 0.72em;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  opacity: 0.75;
  vertical-align: middle;
}

.mercados-inicio-hybrid-watchlist__chg-pos {
  color: var(--dashboard-acciones-treemap-up, #22c55e);
}

.mercados-inicio-hybrid-watchlist__chg-neg {
  color: var(--dashboard-acciones-treemap-down, #dc2626);
}

.mercados-inicio-hybrid-watchlist__empty {
  padding: 16px 14px;
  font-size: inherit;
  color: var(--muted);
  text-align: center;
}

[data-theme="light"] .mercados-inicio-hybrid-watchlist {
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.output--acciones-usa .tradingview-widget-container,
.output--etfs-tv .tradingview-widget-container,
.output--cripto-tv .tradingview-widget-container {
  box-sizing: border-box;
  width: 100%;
}

/*
 * Tabla del screener: el DOM va dentro del iframe ajeno → no hay CSS nuestra dentro.
 * Zoom moderado agranda filas y tipografía (~ +8%) para acercarse a nuestra tabla Acciones
 * (--pad-table-cell + --font-table); no es métrica idéntica pero mejora legibilidad / “aire” vertical.
 */
#tv_acciones_usa_screener .tradingview-widget-container,
#tv_etfs_screener .tradingview-widget-container,
#tv_cripto_screener .tradingview-widget-container {
  zoom: 1.08;
}

.tvWidgetSlot--screener {
  overflow-x: auto;
}

/* iframe de TradingView: evita alto colapsado si el mensaje resize llega tarde */
.output--acciones-usa .tvWidgetSlot--screener .tradingview-widget-container iframe,
.output--etfs-tv .tvWidgetSlot--screener .tradingview-widget-container iframe,
.output--cripto-tv .tvWidgetSlot--screener .tradingview-widget-container iframe {
  min-height: 520px !important;
}

.output--acciones-usa .tvWidgetSlot--heatmap .tradingview-widget-container iframe,
.output--etfs-tv .tvWidgetSlot--heatmap .tradingview-widget-container iframe,
.output--cripto-tv .tvWidgetSlot--heatmap .tradingview-widget-container iframe {
  min-height: 600px !important;
}

/* Detalle in-page (?tvwidgetsymbol=): misma barra (grupos + subgrupos); solo oculta paneles de contenido. */
body[data-view="activo"] section.tabPanels {
  display: none !important;
}

.mercados-activo-detalle {
  box-sizing: border-box;
  padding: 12px var(--container-pad-x) 32px;
  max-width: var(--content-max-width);
  margin: 0 auto;
}

.mercados-activo-detalle-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 10px;
}

.mercados-activo-detalle-backWrap {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
  padding: 2px;
  border-radius: 999px;
  background: var(--surface-tabs);
  border: 1px solid var(--surface-tabs-border);
}

.mercados-activo-detalle-close {
  font: inherit;
  font-family: inherit;
  cursor: pointer;
  border-radius: 999px;
  border: none;
  padding: 6px 14px;
  font-size: var(--font-tab);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: transparent;
  color: var(--muted);
}

.mercados-activo-detalle-close:hover {
  background: var(--tab-hover-bg);
  color: var(--tab-hover-fg);
}

.mercados-activo-detalle-close:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.mercados-activo-detalle-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
}

.mercados-tv-solution-grid {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.mercados-tv-solution-cell {
  width: 100%;
  box-sizing: border-box;
}

.mercados-tv-solution-cell--ta .tradingview-widget-container iframe {
  min-height: 450px;
}

.mercados-tv-solution-cell--symbol-info .tradingview-widget-container,
.mercados-tv-solution-cell--chart .tradingview-widget-container,
.mercados-tv-solution-cell--profile .tradingview-widget-container,
.mercados-tv-solution-cell--financials .tradingview-widget-container {
  width: 100%;
}

.mercados-tv-solution-cell--chart .tradingview-widget-container {
  background-color: #131722;
}

html[data-theme="light"] .mercados-tv-solution-cell--chart .tradingview-widget-container {
  background-color: #f8fafc;
}

.mercados-tv-solution-row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: start;
}

@media (max-width: 900px) {
  .mercados-tv-solution-row2 {
    grid-template-columns: 1fr;
  }
}

/* Grupo Dashboards: aprovechar ancho completo y márgenes laterales mínimos. */
body[data-group="dashboards"] .container {
  max-width: 100%;
}

/* Grupos, título, tema, solapas y estado: barra fija al viewport (el scroll no recalcula su “pegado”). */
.appStickyTop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding-top: env(safe-area-inset-top, 0px);
  padding-left: var(--container-pad-x);
  padding-right: var(--container-pad-x);
  padding-bottom: 0;
  background: var(--bg);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
  overflow: visible;
}

.appStickyTop .header {
  max-width: var(--content-max-width);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.mercados-tab-sources {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  pointer-events: none;
}

.mercados-tab-sources .tabs {
  display: none;
}

html[data-theme="light"] .appStickyTop {
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.07);
}

.header {
  container-type: inline-size;
  container-name: app-header;
  display: grid;
  /* marca | grupos (ancho real) | cinta TV (solo el hueco) | día/noche */
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  grid-template-rows: auto;
  align-items: center;
  justify-content: stretch;
  gap: 12px 14px;
  margin-bottom: 0;
  max-width: 100%;
  min-width: 0;
  min-height: 3.25rem;
  border-bottom: 1px solid var(--border);
  padding-top: 6px;
  padding-bottom: 10px;
  overflow: visible;
}

/* Sin hueco entre grupos y día/noche (p. ej. zoom): clase desde syncHeaderTickerVisibility. */
@media (min-width: 981px) {
  .header.header--no-ticker {
    grid-template-columns: auto auto auto;
  }

  .header.header--no-ticker .headerTicker {
    display: none;
  }
}

.headerBrand {
  grid-column: 1;
  position: relative;
  flex: 0 0 auto;
  align-self: stretch;
  min-width: 0;
  max-width: min(360px, 44vw);
  padding: 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 0;
  --brand-mark-size: clamp(38px, 7vw, 44px);
  --brand-mark-gap: 12px;
}

.headerBrand h1 {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: 0;
  text-align: center;
  color: var(--text);
  font-size: inherit;
  font-weight: inherit;
  line-height: 1.1;
  letter-spacing: inherit;
}

.headerBrandHome {
  display: inline-flex;
  align-items: center;
  gap: var(--brand-mark-gap, 12px);
  max-width: 100%;
  color: inherit;
  text-decoration: none;
  outline: none;
}

.headerBrandHome:hover {
  text-decoration: none;
  opacity: 0.88;
}

.headerBrandHome:focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
  border-radius: 8px;
  opacity: 1;
}

.brandMark {
  flex: 0 0 auto;
  display: block;
  width: var(--brand-mark-size, clamp(38px, 7vw, 44px));
  height: var(--brand-mark-size, clamp(38px, 7vw, 44px));
}

.brandMark-bg {
  fill: #154e72;
  stroke: rgba(116, 172, 223, 0.42);
}

.brandMark-type {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
}

/* Isologotipo MA: mismos colores en modo día y noche (no usar --text / --brand-wordmark-accent). */
.brandMark-m {
  fill: #f8fafc;
}

.brandMark-a {
  fill: #74acdf;
}

.brandWordmark {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
  gap: 0.34em;
  min-width: 0;
  line-height: 1.05;
  letter-spacing: -0.025em;
  white-space: nowrap;
}

.brandWordmarkPrimary {
  font-size: clamp(1.12rem, calc(0.68rem + 2.1vw), 1.48rem);
  font-weight: 700;
  color: var(--text);
}

.brandWordmarkSecondary {
  font-size: clamp(1.12rem, calc(0.68rem + 2.1vw), 1.48rem);
  font-weight: 700;
  color: var(--brand-wordmark-accent);
}

.headerBrandStatus {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0.35em 0.45em;
  margin: 0;
  margin-top: auto;
  padding: 3px 0 1px 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: none;
  background: none;
  box-shadow: none;
  text-align: center;
  /* Centrar bajo el wordmark “Mercados Argentina”, no bajo logo+texto. */
  transform: translateX(calc((var(--brand-mark-size, 41px) + var(--brand-mark-gap, 12px)) / 2));
}

.headerBrandStatus .statusLabel {
  font-family: system-ui, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--header-status-label);
  letter-spacing: 0.03em;
  flex-shrink: 0;
}

.headerBrandStatus .statusBody {
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-family: system-ui, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  color: var(--header-status-value);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  min-height: 0;
  border: none;
  background: none;
}

.headerGroupsColumn {
  grid-column: 2;
  position: relative;
  z-index: 600;
  flex: 0 0 auto;
  width: max-content;
  max-width: 100%;
  min-width: max-content;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  align-self: center;
}

.headerActions {
  grid-column: -1;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  margin-left: 0;
  align-self: center;
}

.headerTitleRow {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-shrink: 0;
}

.groupNav {
  position: relative;
  flex: 0 0 auto;
}

.groupNav .groupButton {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.groupNav .groupButton::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 1px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  opacity: 0.4;
  flex-shrink: 0;
  transform: translateY(1px);
}

.groupNav__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  left: auto;
  min-width: 220px;
  max-width: min(100vw - 24px, 340px);
  max-height: min(85vh, 560px);
  overflow-y: auto;
  padding: 6px 0;
  margin: 0;
  list-style: none;
  background: var(--surface-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.28);
  z-index: 400;
}

html[data-theme="light"] .groupNav__menu {
  box-shadow: 0 14px 40px rgba(15, 23, 42, 0.12);
}

.groupNav__menu[hidden] {
  display: none !important;
}

.groupNav--open .groupNav__menu:not([hidden]) {
  display: block !important;
}

.groupNav__item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  padding: 10px 16px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.25;
}

.groupNav__item:hover,
.groupNav__item:focus-visible {
  background: var(--group-hover-bg);
}


.groupNav__item--active {
  background: var(--group-active-bg);
  color: var(--group-active-fg);
}

/* Clic siempre en el botón (evita targets hijos); el ticker no debe “robar” el menú. */
.groupNav__item .groupNav__icon,
.groupNav__item .groupNav__item-label {
  pointer-events: none;
}

.groupNav__icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  font-size: 16px;
  line-height: 22px;
  text-align: center;
}

.groupNav__item-label {
  flex: 1 1 auto;
  min-width: 0;
}

.themeToggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-tabs);
  color: var(--muted);
  cursor: pointer;
  flex-shrink: 0;
  line-height: 0;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.themeToggle:hover {
  background: var(--surface-pill);
  color: var(--text);
}

.themeToggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.themeToggle-icon {
  display: block;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  transition: opacity 0.15s ease, color 0.15s ease;
}

html[data-theme="dark"] .themeToggle-icon--sun,
html:not([data-theme]) .themeToggle-icon--sun {
  opacity: 0.38;
}

html[data-theme="dark"] .themeToggle-icon--moon,
html:not([data-theme]) .themeToggle-icon--moon {
  opacity: 1;
  color: var(--accent);
}

html[data-theme="light"] .themeToggle-icon--sun {
  opacity: 1;
  color: var(--accent);
}

html[data-theme="light"] .themeToggle-icon--moon {
  opacity: 0.38;
}

h1 {
  margin: 0 0 6px 0;
  font-size: 22px;
  letter-spacing: 0.2px;
}

.sub {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.status {
  min-width: min(100%, 320px);
  max-width: 100%;
  border: 1px solid var(--border);
  background: var(--surface-status);
  backdrop-filter: blur(10px);
  border-radius: 12px;
  overflow: hidden;
}

.statusTitle {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  color: var(--muted);
}

.statusBody {
  padding: 10px 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  white-space: pre-wrap;
  font-size: 12px;
  line-height: 1.45;
  min-height: 2.9em; /* reduce CLS cuando llega el primer texto de estado */
}

.card {
  border: 1px solid var(--border);
  background: var(--surface-card);
  backdrop-filter: blur(10px);
  border-radius: 14px;
  overflow: hidden;
}

.cardWide {
  margin-top: 14px;
}

.cardHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  border-bottom: 1px solid var(--border);
}

.cardHeader h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
  color: var(--card-header-title);
}

.cardHeaderTitle {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.serieDesde {
  font-size: 12px;
  color: var(--muted);
  font-weight: 400;
}

/* Line-chart de series BCRA (Fecha|Valor). Alto fijo para que ECharts tenga tamaño desde el vamos. */
.bcraSeriesChart {
  width: 100%;
  height: 280px;
  margin: 2px 0 14px;
}
.bcraSeriesChartPh {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--muted);
  font-size: 13px;
}
.bcraSeriesTable td.num,
.bcraSeriesTable th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Accesibilidad (2026-07-06, salida a público): baseline de foco de TECLADO para todo control
   interactivo. Varios sitios hacen `outline:none` en :focus (bien para mouse) pero no daban ningún
   indicador al navegar con Tab → invisible para teclado. `:focus-visible` solo dispara en teclado
   (no en click), así que no hay regresión para mouse. `:where()` mantiene especificidad 0; el
   `!important` es el patrón aceptado para no permitir que un reset silencie el foco (WCAG 2.4.7). */
:where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 2px solid var(--chart-accent, #4c8dff) !important;
  outline-offset: 2px;
  border-radius: 4px;
}

/* Skeletons de carga (2026-07-06): shimmer universal reutilizable para estados de "cargando".
   Respeta prefers-reduced-motion. Uso: <div class="skeleton skeleton-block"></div>. */
.skeleton {
  position: relative;
  overflow: hidden;
  background: var(--surface-card, rgba(148, 163, 184, 0.09));
  border-radius: 8px;
}
.skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.14), transparent);
  animation: mercados-skeleton-shimmer 1.4s ease-in-out infinite;
}
.skeleton-line {
  height: 12px;
  margin: 8px 0;
}
.skeleton-block {
  width: 100%;
  height: 100%;
}
@keyframes mercados-skeleton-shimmer {
  100% {
    transform: translateX(100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .skeleton::after {
    animation: none;
  }
}

/* Números tabulares en todas las tablas (2026-07-06): dígitos de ancho fijo → las columnas numéricas
   alinean sin importar los valores. Solo afecta el glifo de los dígitos (cosmético) — NO cambia el
   conteo de decimales. Cubre .table + REM/INDEC/watchlist/snapshot/calc y cualquier <table> futura. */
table {
  font-variant-numeric: tabular-nums;
}

/* Título del panel redundante con grupo/solapa superior; conservar "Serie desde …" en BCRA */
.tabPanel > .cardHeader:not(:has(.serieDesde)) {
  display: none;
}

.tabPanel > .cardHeader:has(.serieDesde) h2 {
  display: none;
}

.tabPanel > .cardHeader:has(.serieDesde) {
  padding: 8px 12px;
}

button {
  border: 1px solid var(--border);
  background: var(--btn);
  color: var(--text);
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  font-size: var(--font-output);
}

button:hover {
  background: var(--btnHover);
}

.output {
  margin: 0;
  /* Sin padding-top por defecto: evita “banda” bajo el header antes del primer control (.filters trae el inset). */
  padding: 0 8px 10px;
  max-height: none;
  overflow-x: clip;
  overflow-y: visible;
  width: 100%;
  max-width: 100%;
  font-size: var(--font-output);
  line-height: 1.5;
  color: var(--output-text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}

.output:not(:has(.filters)):not(.output--landing) {
  padding-top: var(--panel-inset-y);
}

.row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: var(--font-output);
  color: var(--muted);
}

input[type="date"] {
  background: var(--input-bg);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 7px 9px;
  border-radius: 10px;
}

.checkbox {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--font-output);
  color: var(--muted);
  user-select: none;
}

.hint {
  padding: 10px 12px 14px;
  color: var(--muted);
  font-size: var(--font-output);
}

.tabs {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
  padding: 2px;
  border-radius: 999px;
  background: var(--surface-tabs);
  border: 1px solid var(--surface-tabs-border);
}

.groups {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}

.header .groups {
  margin: 0;
  padding: 2px 0;
  border: none;
  justify-content: flex-start;
  flex: 0 0 auto;
  width: max-content;
  max-width: 100%;
  gap: 8px;
  flex-wrap: nowrap;
  overflow: visible;
}

.headerTicker {
  grid-column: 3;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 64px;
  max-height: 64px;
  min-height: 64px;
  overflow: hidden;
  display: block;
  line-height: 0;
  justify-self: stretch;
  align-self: center;
}

.headerTicker tv-ticker-tape {
  display: block;
  width: 100%;
  min-width: 0;
  height: 100%;
}

/* Tokens públicos TV (shadow cerrado): alinear cinta con modo día / noche de la app (misma altura que oscuro). */
html[data-theme="light"] .headerTicker {
  color-scheme: light;
  --tv-widget-background-color: var(--bg);
  --tv-widget-text-color: var(--text);
  --tv-widget-scales-font-color: var(--muted);
  --tv-widget-price-text-color: var(--text);
  --tv-widget-positive-color: #059669;
  --tv-widget-negative-color: #dc2626;
}

html[data-theme="dark"] .headerTicker,
html:not([data-theme]) .headerTicker {
  color-scheme: dark;
  --tv-widget-background-color: var(--surface-tabs);
  --tv-widget-text-color: var(--text);
  --tv-widget-scales-font-color: var(--muted);
  --tv-widget-price-text-color: var(--text);
  --tv-widget-positive-color: #4ade80;
  --tv-widget-negative-color: #f87171;
}

.groupButton {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 15px;
  font-weight: 600;
  padding: 9px 14px;
  cursor: pointer;
  border-radius: 10px;
  transition: all 0.2s;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.groupButton:hover:not(:disabled) {
  background: var(--group-hover-bg);
  color: var(--text);
}

.groupButton.active {
  background: var(--group-active-bg);
  color: var(--group-active-fg);
  box-shadow: inset 0 0 0 1px var(--group-active-ring);
}

.groupButton:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.groupButton:focus-visible,
.tabButton:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.tabButton {
  border-radius: 999px;
  border: none;
  background: transparent;
  padding: 6px 14px;
  font-size: var(--font-tab);
  font-weight: var(--font-ui-strong);
  color: var(--muted);
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tabButton:hover {
  background: var(--tab-hover-bg);
  color: var(--tab-hover-fg);
}

.tabButton.active {
  background: linear-gradient(135deg, var(--tab-active-grad-a), var(--tab-active-grad-b));
  color: var(--tab-active-fg);
}

.tabPanels {
  margin-top: var(--chrome-content-gap);
  width: 100%;
  max-width: 100%;
}

.tabPanel {
  display: none;
}

.tabPanel.active {
  display: block;
}

.table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  font-size: var(--font-table);
  table-layout: auto;
  min-width: 0;
}

.table thead {
  position: sticky;
  top: 0;
  background: var(--table-head-bg);
  z-index: 1;
}

.table th,
.table td {
  padding: var(--pad-table-cell);
  border-bottom: 1px solid var(--table-cell-border);
  text-align: right;
  white-space: nowrap;
  overflow: visible;
  vertical-align: middle;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}

.table th:first-child,
.table td:first-child {
  text-align: left;
}

/* Dashboard Acciones: centrar columnas excepto Empresa (primera columna). */
#out_acciones .table th,
#out_acciones .table td {
  text-align: center;
}

#out_acciones .table th:first-child,
#out_acciones .table td:first-child {
  text-align: left;
}

/* Rayas alternas: filas impares ligeramente más claras (tablas de datos en toda la app) */
.table tbody tr:nth-child(odd),
table.calc-table tbody tr:nth-child(odd),
#panels_calculadoras .calc-desc-table tbody tr:nth-child(odd) {
  background: var(--table-row-stripe);
}

#panels_calculadoras .calc-desc-table tbody tr:has(td.calc-desc-empty) {
  background: transparent;
}

.table tbody tr:hover,
table.calc-table tbody tr:hover,
#panels_calculadoras .calc-desc-table tbody tr:hover {
  background: var(--table-row-hover);
}

.table th.sortable {
  cursor: pointer;
  user-select: none;
}

.table th.sortable::after {
  content: " ⇅";
  opacity: 0.4;
  font-size: 0.85em;
}

.table th.sort-asc::after {
  content: " ▲";
  opacity: 0.9;
}

.table th.sort-desc::after {
  content: " ▼";
  opacity: 0.9;
}

/* Sticky first column en mobile (2026-07-06): al scrollear una tabla ancha horizontalmente, la
   primera columna (Ticker/Empresa/Fecha) queda fija para no perder el contexto de cada fila.
   La celda fija tiene fondo sólido (--card) + overlay de zebra/hover, y una sombra sutil a la
   derecha que marca el borde congelado. Solo mobile; el thead (z:1) > tbody (auto) mantiene el
   header por encima de la columna fija al scrollear vertical. */
@media (max-width: 900px) {
  /* Tablas anchas en mobile: hacerlas scrolleables (antes el .table-container era overflow:visible y
     el .output/.card clipeaban -> las columnas extra quedaban CORTADAS e inalcanzables). */
  .table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: var(--card);
    box-shadow: 6px 0 8px -6px rgba(0, 0, 0, 0.45);
  }
  .table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: var(--table-head-bg);
    box-shadow: 6px 0 8px -6px rgba(0, 0, 0, 0.45);
  }
  .table tbody tr:nth-child(odd) td:first-child {
    background-image: linear-gradient(var(--table-row-stripe), var(--table-row-stripe));
  }
  .table tbody tr:hover td:first-child {
    background-image: linear-gradient(var(--table-row-hover), var(--table-row-hover));
  }
}

.cell-pos {
  color: #4ade80;
}

.cell-neg {
  color: #f87171;
}

.filters {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: var(--panel-inset-y) 12px 8px;
  max-width: 100%;
  overflow-x: hidden;
}

.filterLabel {
  font-size: var(--font-output);
  color: var(--muted);
}

.filterGroup {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.searchGroup {
  min-width: 180px;
}

.filterGroup input[type="date"] {
  padding: 5px 10px;
  font-size: var(--font-output);
  min-height: 30px;
}

/* BCRA — REM: mismas listas que Calculadoras (fondo oscuro, texto legible) */
#panels_bcra .bcra-rem-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px 16px;
  padding: var(--panel-inset-y) 12px 4px;
  max-width: 100%;
}

#panels_bcra .bcra-rem-filters-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 14px;
  flex: 1 1 auto;
  min-width: 0;
}

#panels_bcra .bcra-rem-select {
  min-width: 9rem;
  max-width: min(22rem, 100%);
  padding: 0.35rem 0.5rem;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent);
  background: var(--surface-select);
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
}

#panels_bcra .bcra-rem-select:hover {
  border-color: rgba(148, 163, 184, 0.45);
}

#panels_bcra .bcra-rem-select:focus {
  outline: 2px solid rgba(56, 189, 248, 0.45);
  outline-offset: 1px;
}

#panels_bcra .bcra-rem-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 16px;
  flex: 0 1 auto;
  margin: 0;
  padding: 0 4px 4px;
}

#panels_bcra .bcra-rem-links a {
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 1px solid transparent;
}

#panels_bcra .bcra-rem-links a:hover {
  border-bottom-color: rgba(56, 189, 248, 0.55);
}

#panels_bcra .bcra-rem-chart-panel {
  margin: 12px 0 16px;
  padding: 12px 12px 8px;
  border-radius: 10px;
  background: var(--surface-panel);
  border: 1px solid var(--border);
  /* Contra-zoom ECharts en REM: misma razón que `--mercados-doc-zoom` en `html`. */
  zoom: calc(1 / var(--mercados-doc-zoom, 0.8));
}

#panels_bcra .bcra-rem-chart-title {
  margin: 0 0 4px 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--rem-chart-title);
  letter-spacing: 0.02em;
}

#panels_bcra .bcra-rem-chart-sub {
  margin: 0 0 10px 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--rem-chart-sub);
}

#panels_bcra .bcra-rem-chart-canvas-wrap {
  width: 100%;
  min-height: 220px;
}

#panels_bcra .bcra-rem-chart-mount {
  width: 100%;
  min-height: 220px;
}

#panels_bcra .bcra-rem-chart-lw-inner {
  width: 100%;
  min-height: 220px;
}

#panels_bcra .bcra-rem-chart-lw-inner canvas {
  display: block;
}

#panels_bcra .bcra-rem-lw-legend-row {
  margin-top: 6px;
  font: bold 12px system-ui, Segoe UI, sans-serif;
}

#panels_dashboards .dashboard-soberano-spread-lw-mount {
  width: 100%;
  min-height: 240px;
  font-weight: 600;
}

#panels_dashboards .dashboard-soberano-spread-echarts-inner {
  overflow: visible;
}

#panels_bcra .bcra-rem-footnote {
  margin: 8px 0 0;
  color: var(--muted);
}

#panels_bcra .bcra-rem-src {
  color: var(--rem-chart-sub);
  font-weight: 700;
}

/* Dashboard Soberano USD — mismos colores/fondo que lista instrumento calculadora; fuente más chica */
#panels_dashboards .dashboard-soberano-filters--calc {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  padding: var(--panel-inset-y) 2px 14px;
  margin: 0 0 12px;
  border-bottom: 1px solid var(--border-soft);
}

#panels_dashboards .dashboard-soberano-filters--calc.dashboard-soberano-filters--one-row {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

@media (max-width: 720px) {
  #panels_dashboards .dashboard-soberano-filters--calc.dashboard-soberano-filters--one-row {
    flex-wrap: wrap;
  }
}

#panels_dashboards .dashboard-soberano-byma-eod-banner {
  flex: 1 1 100%;
  width: 100%;
  font-size: 0.8125rem;
  color: var(--chart-sub-fg);
  line-height: 1.35;
  padding: 0 2px 4px;
}

#panels_dashboards .dashboard-soberano-filter-field {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  cursor: default;
}

/* Tres columnas iguales: el <select> nativo no debe crecer por el texto más largo de las opciones. */
#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field {
  flex: 0 0 10.5rem;
  width: 10.5rem;
  max-width: 10.5rem;
}

#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field--legis {
  flex: 1 1 14rem;
  min-width: 12rem;
  max-width: 22rem;
  width: auto;
}

/* El campo Restaurar no lleva label ni entra en la grilla fija de 10.5rem: que se ajuste al botón
   (sin espacio sobrante) y quede alineado abajo, a la altura de los demás controles de la fila. */
#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field--restore-only {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  align-items: center;
  justify-content: flex-end;
}

#panels_dashboards .dashboard-soberano-legis-restore-row {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-width: 0;
}

#panels_dashboards .dashboard-soberano-legis-restore-row .dashboard-soberano-filter-select {
  flex: 1 1 auto;
  min-width: 0;
}

/* Campo Legislación: etiqueta a la IZQUIERDA, en línea con el selector (no apilada encima).
   El resto de .dashboard-soberano-filter-field queda en columna; este campo se fuerza a fila. */
#panels_dashboards .dashboard-soberano-filter-field--legis {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

#panels_dashboards .dashboard-soberano-filter-field--legis > span {
  flex: 0 0 auto;
  white-space: nowrap;
}

#panels_dashboards .dashboard-soberano-filter-field--legis > .dashboard-soberano-legis-restore-row {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

/* Texto tipo opción Mercado (azul, negrita), sin aspecto de botón */
#panels_dashboards .dashboard-soberano-filter-restore-btn {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.2rem 0.1rem;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  white-space: nowrap;
  color: var(--accent);
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  -webkit-appearance: none;
  appearance: none;
}

#panels_dashboards .dashboard-soberano-filter-restore-btn:hover:not(:disabled) {
  filter: brightness(1.12);
  text-decoration: underline;
  text-underline-offset: 2px;
}

#panels_dashboards .dashboard-soberano-filter-restore-btn:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(96, 165, 250, 0.35);
}

#panels_dashboards .dashboard-soberano-filter-restore-btn:focus:not(:focus-visible) {
  box-shadow: none;
}

#panels_dashboards .dashboard-soberano-filter-restore-btn:focus-visible {
  box-shadow: 0 0 0 2px rgba(96, 165, 250, 0.35);
}

#panels_dashboards .dashboard-soberano-filter-restore-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  text-decoration: none;
  filter: none;
}

/* Restaurar (Calculadoras): mismo formato pill que «Volver al Dashboard»; texto en mayúsculas vía CSS. */
#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap {
  flex: 0 0 auto;
}

#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap .dashboard-soberano-filter-restore-btn {
  padding: 6px 14px;
  font-size: var(--font-tab);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.25;
  color: var(--muted);
  background: transparent;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  -webkit-appearance: none;
  appearance: none;
}

#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap .dashboard-soberano-filter-restore-btn:hover:not(:disabled) {
  background: var(--tab-hover-bg);
  color: var(--tab-hover-fg);
  text-decoration: none;
  filter: none;
}

#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap .dashboard-soberano-filter-restore-btn:focus {
  outline: none;
  box-shadow: none;
}

#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap .dashboard-soberano-filter-restore-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

#panels_dashboards .mercados-activo-detalle-backWrap.calc-restore-backWrap .dashboard-soberano-filter-restore-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}

/* Títulos de categoría de los grupos de filtros/botones (Liquidación, Precio, Mercado, Plazo, Moneda…):
   color de texto normal (no azul acento) + negrita, homogéneo en filtros y toolbars de gráficos. */
#panels_dashboards .dashboard-soberano-filter-field > span,
#panels_dashboards .dashboard-chart-filter-field > span,
#panels_dashboards .dashboard-soberano-filter-field-label {
  font-size: var(--font-output);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text);
  line-height: 1.2;
}

/* Select / input de fecha: mismo formato "burbuja" que los botones de filtro (.mercados-filter-btn):
   misma altura (padding vertical 6px), tipografía (--font-table) y color de borde (--border-soft). */
#panels_dashboards .dashboard-soberano-filter-select,
#panels_dashboards .dashboard-soberano-filter-date {
  box-sizing: border-box;
  min-width: 6.25rem;
  max-width: 15rem;
  padding: 6px 10px;
  font-size: var(--font-table);
  font-weight: 600;
  line-height: 1.2;
  color: var(--accent);
  background: var(--surface-select);
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
}

/* Input de fecha: que las partes nativas (texto, ícono de calendario) sigan el tema. */
#panels_dashboards .dashboard-soberano-filter-date {
  color-scheme: dark;
}
html[data-theme="light"] #panels_dashboards .dashboard-soberano-filter-date {
  color-scheme: light;
}

/* Botones de filtro segmentados (reutilizable: dashboards, calendario, etc.) */
.mercados-filter-btn-group {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
}

.mercados-filter-btn {
  font: inherit;
  font-size: var(--font-table);
  padding: 6px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--surface-card);
  color: var(--text);
  cursor: pointer;
  line-height: 1.2;
  white-space: nowrap;
}

.mercados-filter-btn:hover {
  border-color: var(--tab-active-grad-a, #2563eb);
}

/* Opción no disponible: opaca y no seleccionable (en vez de desaparecer). */
.mercados-filter-btn:disabled,
.mercados-filter-btn[aria-disabled="true"] {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

.mercados-filter-btn.is-active,
.filterOption.mercados-filter-btn.is-active,
.mercados-filter-btn--radio.is-active {
  background: linear-gradient(135deg, var(--tab-active-grad-a), var(--tab-active-grad-b));
  border-color: var(--tab-active-grad-a);
  color: var(--tab-active-fg);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

/* Toolbar de Tipos de Cambio (selector de fecha de operación + nota de histórico). */
.dashboard-tc-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 16px;
  margin: 0 0 12px;
}
.dashboard-tc-toolbar__note {
  font-size: var(--font-output);
  color: var(--muted);
  align-self: center;
}

/* Nombres de botones de navegación SIEMPRE en mayúsculas (Dashboards y Calculadoras). */
.groupButton,
.groupNav__item-label,
.dashboard-supergroup-btn,
.arsCalcTopNav .tabButton,
.arsCalcCurveNav .tabButton {
  text-transform: uppercase;
}

/* Botonera de navegación de super-grupo (Renta Fija - ARG / Acciones - ARG): rota entre secciones. */
.dashboard-supergroup-nav {
  margin: 2px 0 12px;
}
.dashboard-supergroup-nav[hidden] {
  display: none;
}
.dashboard-supergroup-nav .mercados-filter-btn-group {
  flex-wrap: wrap;
}
.dashboard-supergroup-nav .dashboard-supergroup-btn {
  font-weight: 600;
}

.mercados-filter-btn--radio input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}

html[data-theme="light"] .mercados-filter-btn.is-active,
html[data-theme="light"] .filterOption.mercados-filter-btn.is-active,
html[data-theme="light"] .mercados-filter-btn--radio.is-active,
html[data-theme="light"] .calendario-filter-chip.mercados-filter-btn.is-active {
  color: var(--tab-active-fg);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

#panels_dashboards .dashboard-soberano-filter-field--btn-inline {
  flex: 0 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

#panels_dashboards .dashboard-soberano-filter-field--btn-inline > .dashboard-soberano-filter-field-label,
#panels_dashboards .dashboard-soberano-filter-field--btn-inline > span:first-child {
  flex: 0 0 auto;
  white-space: nowrap;
}

#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field--btn-inline {
  flex: 0 1 auto;
  width: auto;
  max-width: none;
}

/* Campos de filtro con <select> o <input type="date"> (Variación, Fecha Cierre, selección de fecha):
   label a la IZQUIERDA en línea con el control (no apilado), consistente con los button-groups y
   reduciendo la altura de la fila. El :has(>...) apunta solo a controles hijos directos, por lo que
   NO alcanza al campo Legislación (su <select> está anidado en .dashboard-soberano-legis-restore-row). */
#panels_dashboards .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-select),
#panels_dashboards .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-date) {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

#panels_dashboards .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-select) > span,
#panels_dashboards .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-date) > span {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* En la grilla --calc estos campos no deben conservar el ancho fijo de 10.5rem (label + control en línea). */
#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-select),
#panels_dashboards .dashboard-soberano-filters--calc > .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-date) {
  flex: 0 1 auto;
  width: auto;
  max-width: none;
}

/* En --calc el select venía forzado a width:100% (para la grilla apilada); en modo inline usa ancho de contenido. */
#panels_dashboards .dashboard-soberano-filters--calc .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-select) .dashboard-soberano-filter-select,
#panels_dashboards .dashboard-soberano-filters--calc .dashboard-soberano-filter-field:has(> .dashboard-soberano-filter-date) .dashboard-soberano-filter-date {
  width: auto;
}

.calendario-filter-chip.mercados-filter-btn {
  padding: 6px 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--surface-card);
  color: var(--text);
}

.calendario-filter-chip.mercados-filter-btn.is-active {
  background: linear-gradient(135deg, var(--tab-active-grad-a), var(--tab-active-grad-b));
  border-color: var(--tab-active-grad-a);
  color: var(--tab-active-fg);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.calendario-filter-chip.mercados-filter-btn.is-active .calendario-filter-chip-text {
  color: inherit;
  font-weight: 600;
}

.calendario-filter-chip.mercados-filter-btn input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}

#panels_dashboards .dashboard-soberano-filters--calc .dashboard-soberano-filter-select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

#panels_dashboards .dashboard-soberano-filter-select:hover,
#panels_dashboards .dashboard-soberano-filter-date:hover {
  border-color: rgba(148, 163, 184, 0.45);
}

#panels_dashboards .dashboard-soberano-filter-select:focus,
#panels_dashboards .dashboard-soberano-filter-date:focus {
  outline: none;
  border-color: rgba(96, 165, 250, 0.55);
  box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.25);
}

/* Stack tabla + gráfico TIR/duración (estilo oscuro tipo TradingView) */
#panels_dashboards .dashboard-soberano-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
  /* Refuerzo: menos anclaje automático del motor al redibujar tabla/gráficos. */
  overflow-anchor: none;
}

/* Dashboard Acciones / Cedears: treemap (debajo de la tabla) */
#panels_dashboards .dashboard-acciones-treemap-section,
#panels_dashboards .dashboard-cedears-treemap-section {
  margin-top: 12px;
  padding: 12px 10px 14px;
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  background: var(--chart-panel-bg);
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  flex-shrink: 0;
  overflow-anchor: none;
}

/* Heatmap RF: debajo de curvas (y spread legislación en USD); un poco más de aire tras los gráficos. */
#panels_dashboards .dashboard-acciones-treemap-section.dashboard-bond-treemap-section {
  margin-top: 16px;
}

#panels_dashboards .dashboard-acciones-treemap-toolbar,
#panels_dashboards .dashboard-cedears-treemap-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin-bottom: 10px;
}

#panels_dashboards .dashboard-acciones-treemap-toolbar .dashboard-bond-treemap-split-leg {
  margin-left: auto;
  flex-shrink: 0;
}

#panels_dashboards .dashboard-acciones-treemap-mount,
#panels_dashboards .dashboard-cedears-treemap-mount {
  position: relative;
  width: 100%;
  min-height: 320px;
  min-width: 0;
  font-family: inherit;
  font-size: var(--font-table);
  overflow-anchor: none;
  contain: layout style;
}

#panels_dashboards .dashboard-acciones-treemap-svg {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
  font-family: inherit;
  overflow: hidden;
}

#panels_dashboards .dashboard-acciones-treemap-sector-title {
  pointer-events: none;
  text-rendering: geometricPrecision;
}

#panels_dashboards .dashboard-acciones-treemap-cell {
  cursor: pointer;
}

#panels_dashboards .dashboard-acciones-treemap-svg a.dashboard-acciones-treemap-cell-link {
  cursor: pointer;
  outline: none;
}

#panels_dashboards .dashboard-acciones-treemap-svg a.dashboard-acciones-treemap-cell-link:focus-visible {
  outline: 2px solid var(--accent, #2563eb);
  outline-offset: 2px;
  border-radius: 2px;
}

#panels_dashboards .dashboard-acciones-treemap-cell text {
  pointer-events: none;
}

#panels_dashboards .dashboard-acciones-treemap-cell:hover > .dashboard-acciones-treemap-cell-fill {
  filter: brightness(1.14) saturate(1.08);
}

#panels_dashboards .dashboard-acciones-treemap-tooltip {
  position: absolute;
  z-index: 20;
  max-width: min(380px, calc(100vw - 40px));
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border-soft);
  background: var(--surface-card);
  color: var(--text);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  font-size: max(var(--font-table), 12px);
  line-height: 1.35;
  text-align: left;
}

html[data-theme="light"] #panels_dashboards .dashboard-acciones-treemap-tooltip {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
}

#panels_dashboards .dashboard-acciones-treemap-tooltip--visible {
  visibility: visible;
}

#panels_dashboards .dashboard-acciones-treemap-tooltip[hidden] {
  display: none !important;
}

#panels_dashboards .dashboard-acciones-treemap-tooltip:not([hidden]) {
  display: block;
}

#panels_dashboards .dashboard-acciones-treemap-tooltip-empresa {
  font-weight: 600;
  color: var(--chart-title-fg);
  margin-bottom: 4px;
}

#panels_dashboards .dashboard-acciones-treemap-tooltip-monto {
  font-size: max(var(--font-table), 12px);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--chart-sub-fg);
  margin-bottom: 6px;
}

#panels_dashboards .dashboard-acciones-treemap-tooltip-meta {
  font-size: max(var(--font-table), 11px);
  font-weight: 500;
  color: var(--chart-sub-fg);
}

/* Tooltip flotante curvas Soberano USD / Tasa fija ARS (LWC), estilo burbuja heatmap acciones */
#panels_dashboards .dashboard-bond-lw-hover-tip,
#out_soberano_usd .dashboard-bond-lw-hover-tip,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip,
#mercadosEchartsGlobalTip {
  position: absolute;
  z-index: 22;
  max-width: min(300px, calc(100% - 16px));
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border-soft);
  background: var(--surface-card);
  color: var(--text);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  font-size: max(var(--font-table), 12px);
  line-height: 1.38;
  text-align: left;
}

html[data-theme="light"] #panels_dashboards .dashboard-bond-lw-hover-tip,
html[data-theme="light"] #out_soberano_usd .dashboard-bond-lw-hover-tip,
html[data-theme="light"] #out_tasa_fija_ars .dashboard-bond-lw-hover-tip,
html[data-theme="light"] #mercadosEchartsGlobalTip {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
}

#panels_dashboards .dashboard-bond-lw-hover-tip[hidden],
#out_soberano_usd .dashboard-bond-lw-hover-tip[hidden],
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip[hidden],
#mercadosEchartsGlobalTip[hidden] {
  display: none !important;
}

#panels_dashboards .dashboard-bond-lw-hover-tip:not([hidden]),
#out_soberano_usd .dashboard-bond-lw-hover-tip:not([hidden]),
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip:not([hidden]),
#mercadosEchartsGlobalTip:not([hidden]) {
  display: block;
}

#panels_dashboards .dashboard-bond-lw-hover-tip__title,
#out_soberano_usd .dashboard-bond-lw-hover-tip__title,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip__title,
#mercadosEchartsGlobalTip .dashboard-bond-lw-hover-tip__title {
  font-weight: 700;
  font-size: 13px;
  color: var(--chart-title-fg);
  margin-bottom: 6px;
  letter-spacing: 0.01em;
}

#panels_dashboards .dashboard-bond-lw-hover-tip__row,
#out_soberano_usd .dashboard-bond-lw-hover-tip__row,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip__row,
#mercadosEchartsGlobalTip .dashboard-bond-lw-hover-tip__row {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

#panels_dashboards .dashboard-bond-lw-hover-tip__sep,
#out_soberano_usd .dashboard-bond-lw-hover-tip__sep,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip__sep,
#mercadosEchartsGlobalTip .dashboard-bond-lw-hover-tip__sep {
  opacity: 0.55;
  font-weight: 500;
  padding: 0 2px;
}

#panels_dashboards .dashboard-bond-lw-hover-tip__monto,
#out_soberano_usd .dashboard-bond-lw-hover-tip__monto,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip__monto,
#mercadosEchartsGlobalTip .dashboard-bond-lw-hover-tip__monto {
  margin-top: 6px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--chart-sub-fg);
}

#panels_dashboards .dashboard-bond-lw-hover-tip__meta,
#out_soberano_usd .dashboard-bond-lw-hover-tip__meta,
#out_tasa_fija_ars .dashboard-bond-lw-hover-tip__meta,
#mercadosEchartsGlobalTip .dashboard-bond-lw-hover-tip__meta {
  margin-top: 6px;
  font-size: max(var(--font-table), 11px);
  font-weight: 500;
  color: var(--chart-sub-fg);
}

/* Logos tipo TradingView en tabla Acciones (redondel + fallback letra; alto de fila cercano al resto de la tabla) */
#panels_dashboards .dashboard-acciones-table td {
  vertical-align: middle;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-empresa-cell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 0;
  max-width: 100%;
  line-height: 1.35;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-tv-link {
  color: var(--chart-title-fg);
  text-decoration: none;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-tv-link:hover {
  text-decoration: underline;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-tv-link:focus-visible {
  outline: 2px solid var(--accent, #2563eb);
  outline-offset: 2px;
  border-radius: 4px;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-tv-link--empresa-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-logo-wrap {
  position: relative;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  box-sizing: border-box;
  background: var(--surface-panel);
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-logo-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  background: var(--surface-panel);
  border: none;
  display: block;
  box-sizing: border-box;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-logo-wrap--broken .dashboard-acciones-logo-img {
  display: none;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-logo-fallback {
  display: none;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  background: var(--surface-panel);
  border: none;
  font-size: max(var(--font-table), 11px);
  font-weight: 600;
  color: var(--chart-title-fg);
  box-sizing: border-box;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-logo-wrap--broken .dashboard-acciones-logo-fallback {
  display: flex;
}

#panels_dashboards .dashboard-acciones-table .dashboard-acciones-empresa-name {
  min-width: 0;
  flex: 1 1 auto;
}

/* Heatmap: logo circular encima del rect de variación (no interceptar hover del tile) */
#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack {
  pointer-events: none;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack--loaded:not(.dashboard-acciones-treemap-logo-stack--broken) .dashboard-acciones-treemap-logo-fallback {
  visibility: hidden;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack:not(.dashboard-acciones-treemap-logo-stack--loaded):not(.dashboard-acciones-treemap-logo-stack--broken) .dashboard-acciones-treemap-logo-img {
  visibility: hidden;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack--bond-flag .dashboard-acciones-treemap-logo-fallback {
  visibility: hidden;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-bond-treemap-flag-ring {
  pointer-events: none;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack--broken .dashboard-acciones-treemap-logo-img {
  visibility: hidden;
}

#panels_dashboards .dashboard-acciones-treemap-svg .dashboard-acciones-treemap-logo-stack--broken .dashboard-acciones-treemap-logo-fallback {
  visibility: visible;
}

#panels_dashboards .dashboard-acciones-treemap-empty {
  margin: 0;
  padding: 24px 8px;
  text-align: center;
  font-size: 13px;
  color: var(--chart-placeholder-fg);
}

/* Placeholder mientras se difiere el montaje de gráficos (tabla prioritaria) */
#panels_dashboards .dashboard-soberano-charts-deferred[aria-busy="true"] {
  margin-top: 8px;
  min-height: 2.25rem;
}

#panels_dashboards .dashboard-soberano-charts-placeholder {
  margin: 0;
  padding: 8px 2px 4px;
  font-size: 12px;
  color: var(--muted);
}

#panels_dashboards .dashboard-soberano-table--loading .dashboard-soberano-loading-inner {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 8px;
  text-align: center;
}

#panels_dashboards .dashboard-soberano-loading-title {
  font-weight: 600;
  font-size: 14px;
  color: var(--loading-fg);
}

#panels_dashboards .dashboard-soberano-loading-sub {
  display: block;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
  max-width: 42rem;
  margin: 0 auto;
}

#panels_dashboards .dashboard-soberano-chart-block {
  margin-top: 12px;
  padding: 12px 10px 14px;
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  background: var(--chart-panel-bg);
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  flex-shrink: 0;
  /* Contra-zoom: ver comentario de `--mercados-doc-zoom` en el primer bloque `html`. */
  zoom: calc(1 / var(--mercados-doc-zoom, 0.8));
}

#panels_dashboards .dashboard-soberano-chart-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 10px 16px;
  margin-bottom: 10px;
}

#panels_dashboards .dashboard-soberano-chart-toolbar-spacer {
  min-width: 0;
}

#panels_dashboards .dashboard-soberano-chart-title {
  grid-column: 2;
  justify-self: center;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--chart-title-fg);
}

#panels_dashboards .dashboard-soberano-chart-toggle {
  grid-column: 3;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 500;
  color: var(--chart-toggle-fg);
  cursor: pointer;
  user-select: none;
}

#panels_dashboards .dashboard-soberano-chart-toggle input {
  width: 14px;
  height: 14px;
  accent-color: #2962ff;
  cursor: pointer;
}

/* Toggles con aspecto de botón (.mercados-filter-btn--toggle): mismo estándar que el resto de filtros
   (tipografía var(--font-table), peso heredado, gap chico) en cualquier toolbar, no 11px/500 del base. */
#panels_dashboards .dashboard-soberano-chart-toggle.mercados-filter-btn--toggle {
  gap: 6px;
  font-size: var(--font-table);
  font-weight: inherit;
}

#panels_dashboards .dashboard-soberano-lw-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 500;
  color: var(--legend-text-fg);
  width: 100%;
  box-sizing: border-box;
}

#panels_dashboards .dashboard-soberano-lw-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  color: inherit;
}

#panels_dashboards .dashboard-soberano-lw-legend-item--note {
  flex-basis: 100%;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.35;
  margin-top: 2px;
}

#panels_dashboards .dashboard-soberano-lw-swatch {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  flex-shrink: 0;
}

#panels_dashboards .dashboard-soberano-chart-canvas-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
  height: min(380px, 55vh);
  min-height: 280px;
  overflow: visible;
}

/* Etiquetas de ejes sobre LWC (eje Y = métrica del desplegable; eje X = Dur. Mod.) */
#panels_dashboards .dashboard-soberano-chart-canvas-wrap .dashboard-bond-chart-axis-labels {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
}

#panels_dashboards .dashboard-bond-chart-axis-y {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: center center;
  font-size: 11px;
  font-weight: 700;
  color: var(--chart-sub-fg);
  letter-spacing: 0.04em;
  white-space: nowrap;
  max-width: 42%;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}

#panels_dashboards .dashboard-bond-chart-axis-x {
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  font-size: 11px;
  font-weight: 700;
  color: var(--chart-sub-fg);
  white-space: nowrap;
  padding: 0 8px;
  pointer-events: none;
}

#panels_dashboards .dashboard-soberano-lw-mount {
  position: relative;
  z-index: 2;
  width: 100%;
  min-height: 260px;
  height: auto;
  box-sizing: border-box;
  font-weight: 600;
  overflow: visible;
}

/* Forzar cursor default en canvas de ECharts (evita "manito" sobre puntos/barras). */
#panels_dashboards .dashboard-soberano-lw-mount canvas,
#panels_dashboards .dashboard-soberano-spread-echarts-inner canvas,
#out_soberano_usd .dashboard-soberano-lw-mount canvas,
#out_tasa_fija_ars .dashboard-soberano-lw-mount canvas,
#dashboardSoberanoSpreadMount canvas,
#dashboardTasaFijaArsChart canvas,
#dashboardSoberanoUsdChart canvas {
  cursor: default !important;
}

/* Tooltips ECharts: con appendToBody el nodo cuelga de body — forzar capa alta (p. ej. sobre iframes/stacking) */
div.echarts-tooltip {
  z-index: 9999999 !important;
}

/* Si algún chart usa tooltip en el mismo DOM del chart */
#panels_dashboards .echarts-tooltip,
#out_soberano_usd .echarts-tooltip,
#out_tasa_fija_ars .echarts-tooltip,
#out_bcra_rem .echarts-tooltip {
  z-index: 9999999 !important;
}

/* Ticks eje X (Dur. Mod.): posición lineal vía LWC timeScale.timeToCoordinate (etiquetas nativas ocultas). */
#panels_dashboards .dashboard-bond-lw-dur-tick-strip,
#out_soberano_usd .dashboard-bond-lw-dur-tick-strip,
#out_tasa_fija_ars .dashboard-bond-lw-dur-tick-strip {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 4px;
  height: 18px;
  overflow: visible;
  pointer-events: none;
  z-index: 5;
}

#panels_dashboards .dashboard-bond-lw-dur-tick-strip__lbl,
#out_soberano_usd .dashboard-bond-lw-dur-tick-strip__lbl,
#out_tasa_fija_ars .dashboard-bond-lw-dur-tick-strip__lbl {
  position: absolute;
  bottom: 0;
  transform: translateX(-50%);
  font-size: 11px;
  font-weight: 700;
  color: var(--chart-sub-fg);
  white-space: nowrap;
  line-height: 1.2;
}

#panels_dashboards .dashboard-soberano-lw-mount canvas {
  display: block;
}

#panels_dashboards .dashboard-soberano-fallback-canvas {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
  border-radius: 4px;
}

#panels_dashboards .dashboard-soberano-chart-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 12px;
  font-size: 12px;
  font-weight: 500;
  color: var(--chart-placeholder-fg);
  text-align: center;
  z-index: 1;
  pointer-events: none;
}

#panels_dashboards .dashboard-soberano-chart-placeholder[hidden] {
  display: none !important;
}

/* Soberano USD y Sob. ARS Tasa Fija: mismo bloque gráfico/tablas bajo #out_* (anidan bajo .output). */
#out_soberano_usd .dashboard-soberano-chart-block,
#out_tasa_fija_ars .dashboard-soberano-chart-block {
  margin-top: 12px;
  padding: 12px 10px 14px;
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  background: var(--chart-panel-bg);
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  flex-shrink: 0;
  scroll-margin-top: 72px;
  /* Contra-zoom: ver `--mercados-doc-zoom` en el primer bloque `html`. */
  zoom: calc(1 / var(--mercados-doc-zoom, 0.8));
}

#out_soberano_usd .dashboard-soberano-chart-canvas-wrap,
#out_tasa_fija_ars .dashboard-soberano-chart-canvas-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
  /* Altura explícita: `height: 100%` en el hijo falla si el padre solo tiene min-height. */
  height: min(380px, 55vh);
  min-height: 280px;
  overflow: visible;
}

#out_soberano_usd .dashboard-soberano-lw-mount,
#out_tasa_fija_ars .dashboard-soberano-lw-mount {
  position: relative;
  z-index: 2;
  width: 100%;
  min-height: 260px;
  height: 100%;
  box-sizing: border-box;
  font-weight: 600;
  overflow: visible;
}

#out_soberano_usd .dashboard-soberano-chart-placeholder[hidden],
#out_tasa_fija_ars .dashboard-soberano-chart-placeholder[hidden] {
  display: none !important;
}

#panels_dashboards .card.tabPanel[data-tab-panel="soberano_usd"],
#panels_dashboards .card.tabPanel[data-tab-panel="tasa_fija_ars"] {
  overflow: visible;
}

#out_soberano_usd .dashboard-soberano-chart-toggle span,
#out_tasa_fija_ars .dashboard-soberano-chart-toggle span {
  max-width: min(100%, 22rem);
  line-height: 1.35;
  color: var(--chart-toggle-fg);
}

.bymaCierreFechaGroup {
  flex: 0 1 300px;
  min-width: 0;
}

.bymaCierreFechaFija {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 11px;
  color: var(--text);
  padding: 5px 10px;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--input-bg);
}

.searchInput {
  background: var(--input-bg);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 11px;
  outline: none;
}

.searchInput:focus {
  border-color: var(--accent);
}

.filterOptions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.filterOption {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  color: var(--output-text);
  background: var(--filter-option-bg);
  border-radius: 999px;
  padding: 2px 8px;
  border: 1px solid var(--border-medium);
}

.filterOption.mercados-filter-btn {
  font-size: var(--font-table);
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--surface-card);
  color: var(--text);
  border: 1px solid var(--border-soft);
  cursor: pointer;
  line-height: 1.2;
  white-space: nowrap;
}

.filterOption.mercados-filter-btn input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}

.filterOption:not(.mercados-filter-btn) input[type="checkbox"] {
  width: 11px;
  height: 11px;
}

.filterGroup.mercados-filter-field--btn-inline {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px;
}

.filterGroup.mercados-filter-field--btn-inline > .filterLabel {
  flex: 0 0 auto;
  margin: 0;
}

.filterGroup.mercados-filter-field--btn-inline .mercados-filter-btn-group {
  flex-wrap: wrap;
}

/* REM fila 1: Variable (full-width, crece) + links/PDF alineados a la derecha. */
#panels_bcra .bcra-rem-row-var {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px 16px;
}

#panels_bcra .bcra-rem-var-filter {
  flex: 1 1 auto;
  min-width: 0;
}

#panels_bcra .bcra-rem-links {
  justify-content: flex-end;
  flex: 0 0 auto;
}

/* REM fila 2: Conjunto + Estadístico + Comparar en una sola fila. */
#panels_bcra .bcra-rem-row-sub .bcra-rem-filters-inner {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 18px;
  width: 100%;
}

#panels_bcra .bcra-rem-filters-inner .mercados-filter-btn-group {
  flex-wrap: wrap;
  max-width: 100%;
  justify-content: flex-start;
}

#panels_bcra .bcra-rem-pdf-picker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
}

#panels_bcra .bcra-rem-pdf-picker .bcra-rem-select {
  min-width: auto;
  padding: 0.2rem 0.4rem;
}

/* REM: tabla de detalle centrada y tan angosta como su contenido (cada columna lo justo). */
#panels_bcra .bcra-rem-table {
  display: flex;
  justify-content: center;
  max-width: 100%;
  overflow-x: auto;
}

#panels_bcra .bcra-rem-table table.table {
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
}

#panels_bcra .bcra-rem-table th,
#panels_bcra .bcra-rem-table td {
  text-align: center;
  white-space: nowrap;
}

/* INDEC — IPC: reusa el lenguaje visual de REM (la CSS de REM está scopeada a #panels_bcra). */
#panels_indec .bcra-rem-toolbar-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: var(--panel-inset-y) 12px 4px;
}

#panels_indec .bcra-rem-filters-inner {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 18px;
  width: 100%;
}

#panels_indec .bcra-rem-filters-inner .mercados-filter-btn-group {
  flex-wrap: wrap;
  max-width: 100%;
}

#panels_indec .bcra-rem-chart-panel {
  margin: 12px 0 16px;
  padding: 12px 12px 8px;
  border-radius: 10px;
  background: var(--surface-panel);
  border: 1px solid var(--border);
  zoom: calc(1 / var(--mercados-doc-zoom, 0.8));
}

#panels_indec .bcra-rem-chart-title {
  margin: 0 0 6px 0;
  font-size: 15px;
}

#panels_indec .indec-ipc-chart-mount {
  width: 100%;
}

#panels_indec .indec-ipc-table {
  display: flex;
  justify-content: center;
  max-width: 100%;
  overflow-x: auto;
}

#panels_indec .indec-ipc-table table.table {
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
}

#panels_indec .indec-ipc-table th,
#panels_indec .indec-ipc-table td {
  text-align: center;
  white-space: nowrap;
}

.dashboard-cedears-table th[data-col="clase"],
.dashboard-cedears-table th[data-col="ticker"],
.dashboard-cedears-table td.col-cedears-center {
  text-align: center;
}

.accordion {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.accItem {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--acc-surface);
  overflow: hidden;
}

.accSummary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  gap: 10px;
}

.accTitle {
  font-weight: 700;
  color: var(--card-header-title);
}

.accMeta {
  color: var(--muted);
  font-size: 12px;
}

.accBody {
  padding: 0 12px 12px;
}

.accSummaryGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 12px;
  padding: 10px 0 12px;
  border-top: 1px solid var(--border);
}

.kv .k {
  color: var(--muted);
  font-size: 11px;
}

.kv .v {
  color: var(--text);
  font-size: 12px;
  word-break: break-word;
}

.accTable {
  border-top: 1px solid var(--border);
  padding-top: 10px;
}

.empty {
  color: var(--muted);
  font-size: 12px;
}

/* Dashboards: solapas aún sin panel */
.empty.empty--dashboard {
  max-width: 28rem;
  margin: 1.25rem auto;
  padding: 1.5rem 1.25rem;
  text-align: center;
  border: 1px dashed var(--border-medium);
  border-radius: 12px;
  background: var(--empty-dashboard-bg);
}

.empty.empty--dashboard .empty-title {
  margin: 0 0 0.35rem 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--card-header-title);
}

.empty.empty--dashboard .empty-sub {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
}

/*
 * Tablas bajo #panels_*: misma fuente de tema en todos los grupos.
 */
[id^="panels_"] table.table,
[id^="panels_"] table.calc-table,
[id^="panels_"] table.calc-desc-table,
[id^="panels_"] table.calc-flow-unified-table,
[id^="panels_"] table.calc-proyectado-flow-table {
  font-size: var(--font-table);
}

/* Dashboards Soberano / Sob. ARS: lectura comparable al resto de la página (evita fuente demasiado chica con muchas columnas). */
#panels_dashboards #out_soberano_usd table.table,
#panels_dashboards #out_tasa_fija_ars table.table {
  font-size: max(var(--font-table), 12px);
}

/* Gráfico Sob. ARS: título + selector centrados en columna. */
#panels_dashboards .dashboard-soberano-chart-toolbar--tfa-metric .dashboard-tasa-fija-ars-chart-metric-wrap {
  grid-column: 2;
  justify-self: center;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  max-width: min(100%, 48rem);
  text-align: center;
}

/* Soberano USD: selector de métrica + título en el primer bloque de gráfico */
#panels_dashboards .dashboard-soberano-chart-toolbar--usd-main {
  align-items: center;
}

#panels_dashboards .dashboard-soberano-usd-chart-metric-wrap {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  max-width: min(100%, 42rem);
  text-align: center;
}

#panels_dashboards .dashboard-soberano-usd-chart-metric-wrap .dashboard-chart-filter-field,
#panels_dashboards .dashboard-tasa-fija-ars-chart-metric-wrap .dashboard-chart-filter-field,
#panels_dashboards .dashboard-tc-chart-metric-wrap .dashboard-chart-filter-field {
  width: 100%;
  justify-content: center;
}

#panels_dashboards .dashboard-soberano-chart-toolbar--usd-main .dashboard-soberano-chart-toggle.mercados-filter-btn--toggle {
  grid-column: 3;
  justify-self: end;
  font-size: var(--font-table);
  font-weight: inherit;
  /* El .dashboard-soberano-chart-block aplica zoom 1.25 (contra el zoom 0.8 del documento) → sus botones
     quedaban ~25% más grandes que el toggle idéntico del heatmap. Se restaura el zoom del documento aquí
     para que "Diferenciar por Legislación" tenga el MISMO tamaño neto que su gemelo del heatmap y que el
     resto de filtros de la app. */
  zoom: var(--mercados-doc-zoom, 0.8);
}

#panels_dashboards .dashboard-soberano-chart-toggle.mercados-filter-btn--toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}

#panels_dashboards .dashboard-acciones-treemap-toolbar .dashboard-chart-filter-field {
  flex: 0 1 auto;
}

#panels_dashboards .dashboard-acciones-treemap-toolbar .dashboard-soberano-chart-toggle.mercados-filter-btn--toggle {
  margin-left: auto;
  /* Igualar tamaño/tipografía al resto de botones del heatmap (.mercados-filter-btn),
     que aquí quedaban más chicos por el font-size: 11px / weight 500 de .dashboard-soberano-chart-toggle. */
  font-size: var(--font-table);
  font-weight: inherit;
}

/* Paneles de datos: ancho completo */
#panels_dashboards .table-container,
#panels_licitaciones .filters .filterOptions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

#panels_licitaciones .filters .filterOption.mercados-filter-btn {
  font-size: var(--font-table);
}

#panels_calculadoras .calc-calc-price-src,
#panels_calculadoras .calc-calc-quote-opts,
#panels_calculadoras .calc-calc-ccy-opts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

#panels_calculadoras .calc-calc-filter-row {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}

#panels_calculadoras .calc-calc-filter-row .calc-calc-sub {
  flex: 0 0 auto;
  margin: 0;
}

#panels_licitaciones .table-container,
#panels_tc .table-container,
#panels_byma .table-container,
#panels_a3 .table-container {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

#panels_dashboards .table th,
#panels_tc .table th,
#panels_byma .table th,
#panels_a3 .table th,
#panels_licitaciones .table th {
  font-weight: 600;
}

/* Watchlists / tablas de datos de dashboards: columnas centradas (numéricas);
   la primera (ticker / nombre) se mantiene alineada a la izquierda. */
#panels_dashboards .table th,
#panels_dashboards .table td {
  text-align: center;
}

#panels_dashboards .table th:first-child,
#panels_dashboards .table td:first-child {
  text-align: left;
}

/* BCRA y tabla Feriados (subpestaña Calendario): mismo ancho y tipografía que el resto del sitio */
#panels_bcra .table-container,
#panels_calendario [data-tab-panel="calendario_feriados"] .table-container {
  width: 100%;
  max-width: 100%;
  margin-right: 0;
}

/* Pocas columnas (≤3): no estirar a todo el ancho; alinear el bloque tabla a la izquierda */
#panels_bcra .table-container:has(thead tr th:first-child:nth-last-child(-n + 3)),
#panels_calendario [data-tab-panel="calendario_feriados"] .table-container:has(thead tr th:first-child:nth-last-child(-n + 3)) {
  width: auto;
  max-width: min(100%, 36rem);
  margin-left: 0;
  margin-right: auto;
}

#panels_bcra .table,
#panels_calendario [data-tab-panel="calendario_feriados"] .table {
  width: 100%;
  min-width: 0;
}

#panels_bcra .table th,
#panels_bcra .table td,
#panels_calendario [data-tab-panel="calendario_feriados"] .table th,
#panels_calendario [data-tab-panel="calendario_feriados"] .table td {
  text-align: left;
  padding: var(--pad-table-cell);
  min-width: 0;
}

#panels_bcra .table th:last-child,
#panels_bcra .table td:last-child {
  text-align: right;
}

#panels_bcra .output,
#panels_calendario [data-tab-panel="calendario_feriados"] .output {
  max-width: 100%;
}

/* Subpestaña Feriados: Argentina y USA en dos columnas */
#panels_calendario [data-tab-panel="calendario_feriados"] .feriados-dual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 28px;
  align-items: start;
  width: 100%;
  max-width: 100%;
}

@media (max-width: 960px) {
  #panels_calendario [data-tab-panel="calendario_feriados"] .feriados-dual-grid {
    grid-template-columns: 1fr;
  }
}

#panels_calendario [data-tab-panel="calendario_feriados"] .feriados-col-heading {
  margin: 0 0 10px 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text);
}

#panels_calendario [data-tab-panel="calendario_feriados"] .feriados-col-count {
  margin-top: 8px;
  margin-bottom: 0;
}

/* Calculadoras — Soberano: ancho completo del contenedor */
#panels_calculadoras .output {
  max-width: 100%;
}

.calculadoras-soberano {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0 0 8px;
}

.calc-soberano-main-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.calc-soberano-main-row > .calc-soberano-panel {
  min-width: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

@media (max-width: 960px) {
  .calc-soberano-main-row {
    grid-template-columns: 1fr;
  }
}

.calc-soberano-panel,
.calc-intro {
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--calc-panel-tint);
  max-width: 100%;
  box-sizing: border-box;
}

.calc-instrument-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  max-width: 100%;
}

.calc-instrument-bar .calc-dashboard-backWrap {
  flex: 0 0 auto;
}

#out_soberano_usd a.dashboard-soberano-ticker-link,
#out_tasa_fija_ars a.dashboard-tasa-fija-ars-ticker-link,
#out_cer_ars a.dashboard-ars-curve-ticker-link,
#out_dl_ars a.dashboard-ars-curve-ticker-link,
#out_tamar_ars a.dashboard-ars-curve-ticker-link,
#out_badlar_ars a.dashboard-ars-curve-ticker-link {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 600;
}

#out_soberano_usd a.dashboard-soberano-ticker-link:hover,
#out_tasa_fija_ars a.dashboard-tasa-fija-ars-ticker-link:hover,
#out_cer_ars a.dashboard-ars-curve-ticker-link:hover,
#out_dl_ars a.dashboard-ars-curve-ticker-link:hover,
#out_tamar_ars a.dashboard-ars-curve-ticker-link:hover,
#out_badlar_ars a.dashboard-ars-curve-ticker-link:hover {
  filter: brightness(1.08);
}

/* Favicon bandera AR circular (misma lectura que el heatmap) en columna Ticker — Sob. USD, Sob. ARS tasa fija y curva ARS (CER/DL/Tamar/Badlar). */
#out_soberano_usd .dashboard-bond-flag-favicon,
#out_tasa_fija_ars .dashboard-bond-flag-favicon,
#out_cer_ars .dashboard-bond-flag-favicon,
#out_dl_ars .dashboard-bond-flag-favicon,
#out_tamar_ars .dashboard-bond-flag-favicon,
#out_badlar_ars .dashboard-bond-flag-favicon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}

#out_soberano_usd .dashboard-bond-flag-favicon--us,
#out_tasa_fija_ars .dashboard-bond-flag-favicon--us,
#out_cer_ars .dashboard-bond-flag-favicon--us,
#out_dl_ars .dashboard-bond-flag-favicon--us,
#out_tamar_ars .dashboard-bond-flag-favicon--us,
#out_badlar_ars .dashboard-bond-flag-favicon--us,
.mercados-inicio-hybrid-watchlist__logo-wrap--flag .dashboard-bond-flag-favicon--us {
  box-shadow: 0 0 0 1px var(--border-soft, var(--border));
}

html[data-theme="light"] #out_soberano_usd .dashboard-bond-flag-favicon,
html[data-theme="light"] #out_tasa_fija_ars .dashboard-bond-flag-favicon,
html[data-theme="light"] #out_cer_ars .dashboard-bond-flag-favicon,
html[data-theme="light"] #out_dl_ars .dashboard-bond-flag-favicon,
html[data-theme="light"] #out_tamar_ars .dashboard-bond-flag-favicon,
html[data-theme="light"] #out_badlar_ars .dashboard-bond-flag-favicon {
  box-shadow: 0 0 0 1px var(--border-soft, rgba(0, 0, 0, 0.12));
}

#out_soberano_usd .dashboard-bond-flag-favicon svg,
#out_tasa_fija_ars .dashboard-bond-flag-favicon svg,
#out_cer_ars .dashboard-bond-flag-favicon svg,
#out_dl_ars .dashboard-bond-flag-favicon svg,
#out_tamar_ars .dashboard-bond-flag-favicon svg,
#out_badlar_ars .dashboard-bond-flag-favicon svg {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

#out_soberano_usd .dashboard-bond-ticker-cell,
#out_tasa_fija_ars .dashboard-bond-ticker-cell,
#out_cer_ars .dashboard-bond-ticker-cell,
#out_dl_ars .dashboard-bond-ticker-cell,
#out_tamar_ars .dashboard-bond-ticker-cell,
#out_badlar_ars .dashboard-bond-ticker-cell {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

#out_soberano_usd .table td .dashboard-bond-ticker-cell,
#out_tasa_fija_ars .table td .dashboard-bond-ticker-cell,
#out_cer_ars .table td .dashboard-bond-ticker-cell,
#out_dl_ars .table td .dashboard-bond-ticker-cell,
#out_tamar_ars .table td .dashboard-bond-ticker-cell,
#out_badlar_ars .table td .dashboard-bond-ticker-cell {
  max-width: 100%;
}

#out_soberano_usd .dash-soberano-calc-inp,
#out_tasa_fija_ars .dash-soberano-calc-inp,
#out_cer_ars .dash-soberano-calc-inp,
#out_dl_ars .dash-soberano-calc-inp,
#out_tamar_ars .dash-soberano-calc-inp,
#out_badlar_ars .dash-soberano-calc-inp {
  box-sizing: border-box;
  width: 100%;
  min-width: 4.5rem;
  max-width: 9rem;
  margin: 0;
  padding: 0.2rem 0.35rem;
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--text);
  background: var(--dash-calc-input-bg);
  border: 1px solid var(--border-medium);
  border-radius: 4px;
}

#out_soberano_usd .dash-soberano-calc-inp:focus,
#out_tasa_fija_ars .dash-soberano-calc-inp:focus,
#out_cer_ars .dash-soberano-calc-inp:focus,
#out_dl_ars .dash-soberano-calc-inp:focus,
#out_tamar_ars .dash-soberano-calc-inp:focus,
#out_badlar_ars .dash-soberano-calc-inp:focus {
  outline: none;
  border-color: var(--accent, #38bdf8);
  box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.35);
}

#out_soberano_usd .dash-soberano-calc-inp--override,
#out_tasa_fija_ars .dash-soberano-calc-inp--override,
#out_cer_ars .dash-soberano-calc-inp--override,
#out_dl_ars .dash-soberano-calc-inp--override,
#out_tamar_ars .dash-soberano-calc-inp--override,
#out_badlar_ars .dash-soberano-calc-inp--override {
  color: #f87171;
  font-weight: 700;
  border-color: rgba(248, 113, 113, 0.45);
}

.calc-instrument-bar .calc-title {
  margin: 0;
}

.calc-intro-toolbar {
  margin-bottom: 12px;
}

.calc-instrument-label {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  color: var(--muted);
}

.calc-instrument-select {
  min-width: 8rem;
  max-width: 14rem;
  padding: 0.35rem 0.5rem;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent);
  background: var(--surface-select);
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
}

/* Sob. ARS tasa fija: Activos + Vencidos + link dashboard en una fila; selects compactos como .calc-instrument-select */
.calc-instrument-bar--tfa-split {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Guion placeholder centrado en cerrado y en lista (Activos / Vencidos). */
.calc-instrument-bar--tfa-split .calc-instrument-select--activos,
.calc-instrument-bar--tfa-split .calc-instrument-select--vencidos {
  text-align: center;
  text-align-last: center;
}

.calc-instrument-bar--tfa-split .calc-instrument-select--activos option,
.calc-instrument-bar--tfa-split .calc-instrument-select--vencidos option {
  text-align: center;
}

.calc-instrument-split-field {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.4rem;
  flex: 0 0 auto;
  min-width: 0;
}

.calc-instrument-split-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}

/* Lista desplegable arriba; filas Mercado y PX Moneda debajo, ancho completo. */
.calc-instrument-mercado-toolbar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.calc-instrument-mercado-toolbar .calc-instrument-bar {
  flex: 0 0 auto;
  min-width: 0;
}

.calc-instrument-mercado-toolbar .calc-calc-mercado-block {
  flex: 1 1 auto;
  min-width: 0;
}

/* Toolbar del instrumento (sin <h1> duplicado); mismo tamaño de texto que .calc-instrument-select */
.calc-title-toolbar {
  margin-bottom: 12px;
}

.calc-title {
  margin: 0 0 6px 0;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--accent);
}

.calc-tagline {
  margin: 0 0 18px 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--muted);
}

/* Tabla descriptivo: una línea por celda; fuente de tema */
.calc-desc-wrap {
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
}

.calc-desc-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border-collapse: collapse;
  table-layout: auto;
  font-size: var(--font-table);
}

.calc-desc-table col.calc-desc-col-lab {
  width: 11%;
}

.calc-desc-table col.calc-desc-col-val {
  width: 22%;
}

#panels_calculadoras .calc-desc-table th,
#panels_calculadoras .calc-desc-table td {
  text-align: left;
  vertical-align: middle;
  padding: 0.45rem 0.6rem 0.45rem 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
  line-height: 1.25;
}

#panels_calculadoras .calc-desc-table th.calc-desc-lab,
#panels_calculadoras .calc-desc-table td.calc-desc-val {
  white-space: nowrap;
  overflow: visible;
  max-width: none;
}

#panels_calculadoras .calc-desc-table th[scope="row"] {
  font-weight: 500;
  color: var(--muted);
}

#panels_calculadoras .calc-desc-table .calc-desc-empty {
  border-bottom: none;
  padding: 0 0 0 0;
  background: transparent;
  white-space: normal;
  max-width: none;
  overflow: visible;
}

#panels_calculadoras .calc-desc-table th.calc-desc-lab--wrap,
#panels_calculadoras .calc-desc-table td.calc-desc-val--wrap {
  vertical-align: middle;
  line-height: 1.25;
}

.calc-section-title {
  margin: 0 0 10px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0.03em;
}

.calc-intro .calc-section-title,
.calc-soberano-panel .calc-section-title {
  margin-top: 4px;
}

.calc-proyectado-subtitle {
  margin: 14px 0 8px 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0.02em;
}

.calc-proyectado-controls {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 8px;
}

.calc-proyectado-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: flex-end;
  font-size: 13px;
}

.calc-proyectado-exit-mode-row {
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-bottom: 0;
}

.calc-proyectado-exit-mode-row .calc-calc-sub {
  margin-right: 4px;
}

.calc-proyectado-clamp-hint {
  margin: 0 0 8px 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}

.calc-proyectado-row label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.calc-proyectado-label {
  font-size: 12px;
  color: var(--muted);
  margin-right: 6px;
  align-self: center;
}

/* Subtítulos de bloque Entrada / Salida / Rendimiento */
.calc-proyectado-rendimiento th.calc-proy-sec-hdg {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  padding-top: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

.calc-calc-conv-paren {
  font-weight: 500;
  color: var(--muted);
  white-space: nowrap;
}

.calc-proyectado-inline {
  flex-direction: row;
  align-items: center;
  gap: 6px;
}

/* Mismo relleno que Exit Yield / Valor (retorno proyectado) y campos de calculadora */
.calc-field-soberano {
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface-select);
  color: var(--text);
}

.calc-proyectado-anchor {
  min-width: 11rem;
  padding: 0.35rem 0.5rem;
  font-size: 13px;
}

.calc-proyectado-val {
  min-width: 10rem;
  padding: 0.35rem 0.5rem;
  font-size: 13px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.calc-proyectado-flow-wrap {
  overflow-x: hidden;
  max-width: 100%;
  margin-bottom: 6px;
}

.calc-proyectado-flow-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  table-layout: auto;
}

.calc-unified-flow-scroll {
  overflow-x: hidden;
  max-width: 100%;
  margin-bottom: 4px;
}

.calc-flow-unified-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  table-layout: auto;
  border-collapse: collapse;
  font-size: var(--font-table);
}

#panels_calculadoras .calc-flow-unified-table th,
#panels_calculadoras .calc-flow-unified-table td {
  white-space: nowrap;
  overflow: visible;
  padding: var(--pad-table-cell);
  vertical-align: middle;
  line-height: 1.25;
}

.calc-flow-unified-table thead tr:first-child th {
  text-align: center;
  font-size: 1em;
  color: var(--muted);
  font-weight: 600;
}

.calc-flow-unified-table .calc-flow-hdg-cal,
.calc-flow-unified-table .calc-flow-hdg-proy {
  text-align: center;
}

.calc-flow-unified-table th:nth-child(6),
.calc-flow-unified-table td:nth-child(6) {
  border-left: 1px solid var(--border);
}

.calc-flow-row--entry td,
.calc-flow-row--exit td {
  background: var(--acc-surface);
}

.calc-flow-subsection-label {
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--muted);
  padding: 10px 8px 6px 0;
  border-bottom: none;
}

.calc-soberano-flow-unified .calc-section-title {
  margin-bottom: 10px;
}

.calc-proyectado-subtitle--primero {
  margin-top: 14px;
}

/* Misma jerarquía visual que .calc-calc-results: etiquetas en color texto, valores alineados a derecha */
.calc-proyectado-rendimiento th[scope="row"] {
  text-align: left;
  font-weight: 500;
  color: var(--text);
}

.calc-proyectado-rendimiento td {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.calc-proyectado-rendimiento td.calc-proyectado-metric-val {
  color: var(--text);
}

.calc-calc-readonly-val {
  color: var(--text);
}

.calc-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 18px;
  margin: 0 0 16px 0;
  font-size: 13px;
  max-width: 100%;
}

.calc-meta dt {
  margin: 0;
  color: var(--muted);
}

.calc-meta dd {
  margin: 0;
}

.calc-calculator {
  padding: 0 18px 8px;
  max-width: 100%;
  box-sizing: border-box;
}

.calc-soberano-panel.calc-calculator {
  padding: 16px 18px;
}

.calc-calc-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: flex-end;
  margin-bottom: 14px;
}

.calc-calc-controls label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
}

.calc-calc-date {
  min-width: 10.5rem;
  box-sizing: border-box;
}

/* Plazo (número): misma burbuja que Concertación / Fecha liquidación (fechas usan input global). */
#panels_calculadoras .calculadoras-soberano .calc-calc-controls input.calc-calc-plazo[type="number"] {
  background: var(--input-bg);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 7px 9px;
  border-radius: 10px;
  min-width: 10.5rem;
  width: 10.5rem;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 13px;
  line-height: 1.25;
  color-scheme: inherit;
  text-align: center;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
#panels_calculadoras .calculadoras-soberano .calc-calc-controls input.calc-calc-plazo[type="number"]::-webkit-outer-spin-button,
#panels_calculadoras .calculadoras-soberano .calc-calc-controls input.calc-calc-plazo[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Mismo aspecto y control nativo (ícono calendario) que concertación; no readonly/disabled en fecha liquidación. */
#panels_calculadoras .calculadoras-soberano input[type="date"],
#panels_calculadoras .calc-proyectado-exit-date:not(:disabled) {
  color-scheme: dark;
}

.calc-calc-price-src {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  font-size: 13px;
}

.calc-calc-price-src .calc-calc-sub {
  margin: 0 6px 0 0;
}

.calc-calc-price-src .calc-calc-mercado-plazo {
  margin-left: 10px;
}

.calc-calc-mercado-block {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}

/* Etiquetas de sección (Mercado, Plazo, PX BYMA/A3, PX Moneda, Flujo Moneda): mismo acento que Entrada/Salida/Desglose en retorno proyectado */
.calc-calc-mercado-block .calc-calc-sub {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--accent);
}

.calc-calc-quote-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  font-size: 13px;
}

.calc-calc-quote-opts .calc-calc-sub {
  margin: 0 6px 0 0;
}

/* Franja «No disponible» alineada a la derecha (misma columna que Precio dirty). */
.calc-calc-mkt-hint-bar {
  margin: 0 0 6px 0;
  padding-left: 50%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  font-size: 12px;
  line-height: 1.35;
  min-height: 1.35em;
  text-align: right;
}

.calc-calc-ccy-row {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border, rgba(128, 128, 128, 0.25));
  min-width: 0;
  box-sizing: border-box;
}
.calc-calc-ccy-row .calc-calc-ccy-opts {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
  flex: 0 1 auto;
}
.calc-soberano-implicit-line {
  flex: 1 1 10rem;
  min-width: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calc-calc-ccy-opts {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}
.calc-soberano-disp-offscreen {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.calc-calc-mkt-hint-bar .calc-calc-quote-unavail {
  width: 100%;
  max-width: 14rem;
  text-align: right;
}
.calc-calc-quote-unavail {
  margin: 0;
  min-height: 1.35em;
  font-size: 12px;
  line-height: 1.35;
  color: #c62828;
}
.calc-calc-quote-unavail:not(.calc-calc-quote-unavail--show) {
  visibility: hidden;
}
.calc-calc-quote-unavail.calc-calc-quote-unavail--show {
  visibility: visible;
}

.calc-flow-table tbody tr.calc-flow-row--past td {
  opacity: 0.72;
}

.calc-calc-error {
  color: #c62828;
  font-size: 13px;
  margin-bottom: 8px;
}

.calc-calc-results th {
  text-align: left;
  font-weight: 500;
  width: 50%;
}

.calc-calc-results td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

.calc-calc-results th .calc-calc-conv-paren {
  font-weight: 500;
}

.calc-calc-out-input {
  width: 100%;
  max-width: 14rem;
  margin: 0 0 0 auto;
  display: block;
  padding: 0.35rem 0.5rem;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  text-align: right;
  box-sizing: border-box;
}

.calc-flow-table th:nth-child(2),
.calc-flow-table td:nth-child(2) {
  text-align: left;
}

.calc-calc-skip {
  font-size: 13px;
  color: var(--muted);
  margin: 0;
}

.calc-divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 22px 0 18px 0;
  max-width: 100%;
}

.calc-flow-wrap {
  max-width: 100%;
  padding: 0 18px;
  box-sizing: border-box;
}

.calc-soberano-panel.calc-flow-wrap {
  padding: 16px 18px;
}

.calc-flow-wrap .calc-section-title {
  margin-bottom: 12px;
}

.calc-table.table-container {
  max-width: 100%;
}

/* Mismas reglas que .table aunque no lleven la clase (flujo, calculadora, etc.) */
table.calc-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  table-layout: auto;
  border-collapse: collapse;
  font-size: var(--font-table);
}

table.calc-table th,
table.calc-table td {
  white-space: nowrap;
  overflow: visible;
  vertical-align: middle;
  line-height: 1.25;
  padding: var(--pad-table-cell);
}

.calc-table th:first-child,
.calc-table td:first-child {
  text-align: left;
}

.calc-table th:nth-child(n + 2),
.calc-table td:nth-child(n + 2) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.calc-table td.calc-num {
  font-variant-numeric: tabular-nums;
}

.calc-table--desc th {
  text-align: left;
  font-weight: 500;
  color: var(--muted);
  width: 42%;
}

.calc-units {
  margin: 12px 0 0 0;
  font-size: 11px;
  line-height: 1.45;
}

.muted {
  color: var(--muted);
}

/* Sensibilidad TIR: ancho acotado (pocas columnas), alineado al bloque de la calculadora */
.calc-sensibilidad-tir .calc-sensibilidad-table-wrap {
  max-width: min(100%, 28rem);
}
.calc-sensibilidad-tir .calc-sensibilidad-inner {
  overflow-x: auto;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}
.calc-sensibilidad-tir table.calc-sensibilidad-table {
  width: 100%;
  max-width: 100%;
}
.calc-sensibilidad-tir .calc-sensibilidad-empty {
  margin: 0 0 10px 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
}
.calc-sensibilidad-table thead th {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}
.calc-sensibilidad-table tbody th {
  font-weight: 500;
}
.calc-sensibilidad-table th,
.calc-sensibilidad-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.calc-sensibilidad-table th:first-child,
.calc-sensibilidad-table td:first-child {
  text-align: left;
}

@media (max-width: 980px) {
  .header {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: start;
    gap: 10px 12px;
  }

  .headerBrand {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
    position: relative;
    max-width: 100%;
    min-height: 0;
    display: block;
  }

  .headerBrand h1 {
    display: block;
    flex: none;
    align-items: unset;
    justify-content: unset;
    min-height: unset;
    text-align: left;
    margin: 0 0 6px 0;
  }

  .headerBrandHome {
    justify-content: flex-start;
  }

  .headerBrandStatus {
    flex: none;
    justify-content: flex-start;
    align-items: baseline;
    margin-top: 0;
    padding: 0 0 0 calc(var(--brand-mark-size, 41px) + var(--brand-mark-gap, 12px));
    max-width: 100%;
    transform: none;
  }

  .headerGroupsColumn {
    grid-column: 1 / -1;
    grid-row: 2;
    max-width: 100%;
    /* Base tiene min-width:max-content → se estiraba a ~1200px (todo el nav) desbordando la celda del
       grid y dejando los grupos de la derecha inalcanzables. min-width:0 lo constriñe al viewport para
       que el overflow-x:auto de .groups (abajo) scrollee por swipe. */
    min-width: 0;
    justify-content: center;
    margin-top: 0;
    margin-bottom: 0;
  }

  .headerTicker {
    display: none;
  }

  .headerActions {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;
  }

  /* Mobile: el nav de grupos no entra en una fila; antes quedaba con overflow:visible (cortado, los
     grupos de la derecha —BCRA/Licitaciones/…/INDEC— inalcanzables). Ahora scrollea horizontal por
     swipe, con scrollbar oculta. flex-start para que el primer grupo no quede clippeado. */
  .header .groups {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .header .groups::-webkit-scrollbar {
    display: none;
  }

  .header .groups > .groupNav {
    flex: 0 0 auto;
  }

  .groupNav__menu {
    right: auto;
    left: 0;
  }
}

/* --- Calendario de publicaciones (BCRA + INDEC) --- */
.calendario-root {
  padding: 12px 14px 18px;
  font-size: 16px;
  line-height: 1.5;
}

/* Una fila: buscar (izq.) + mes/año/flechas centrados en el ancho total (columna 3 vacía equilibra) */
.calendario-top-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px 16px;
  width: 100%;
  margin-bottom: 14px;
  box-sizing: border-box;
}

.calendario-top-row .calendario-search-wrap {
  grid-column: 1;
  justify-self: start;
  min-width: 0;
  max-width: min(100%, 280px);
}

/* Tres columnas: flechas | mes+año | flechas. Columna central de ancho fijo (~mes más largo + año)
   para que las flechas no se muevan; column-gap separa flechas del texto sin agrandar los botones. */
.calendario-nav {
  grid-column: 2;
  justify-self: center;
  display: grid;
  grid-template-columns: auto 320px auto;
  align-items: center;
  width: auto;
  max-width: min(560px, 100%);
  min-width: min(100%, 260px);
  column-gap: 22px;
  row-gap: 8px;
  box-sizing: border-box;
}

/* Pantallas estrechas: columna central flexible (evita overflow); flechas algo más cerca del texto */
@media (max-width: 720px) {
  .calendario-nav {
    grid-template-columns: auto minmax(0, 1fr) auto;
    column-gap: 14px;
  }
}

@media (max-width: 560px) {
  .calendario-top-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .calendario-top-row .calendario-search-wrap {
    grid-column: 1;
    max-width: none;
    width: 100%;
  }

  .calendario-nav {
    grid-column: 1;
    justify-self: center;
    width: 100%;
    max-width: 420px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    column-gap: 12px;
  }
}

.calendario-prev {
  justify-self: start;
}

.calendario-next {
  justify-self: end;
}

.calendario-month-heading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  width: 100%;
  min-width: 0;
  justify-self: stretch;
  text-align: center;
  box-sizing: border-box;
}

.calendario-month-name {
  margin: 0;
  font-size: 21px;
  font-weight: 600;
  text-transform: capitalize;
  text-align: center;
  color: var(--text);
}

.calendario-year-label--nav {
  display: inline-flex;
  align-items: center;
  margin: 0;
  color: var(--muted);
  flex-shrink: 0;
}

.calendario-filters-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px 20px;
  margin-bottom: 10px;
  width: 100%;
}

.calendario-prev,
.calendario-next {
  flex-shrink: 0;
  border: 1px solid var(--border);
  background: var(--btn);
  color: var(--text);
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 15px;
  line-height: 1;
  box-sizing: border-box;
}

.calendario-prev:hover,
.calendario-next:hover {
  background: var(--btnHover);
}

.calendario-year {
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 7px 11px;
  font-size: 15px;
}

.calendario-filters-wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px 16px;
  flex: 1;
  min-width: 0;
}

.calendario-filter-section {
  border-radius: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  background: var(--surface-card);
}

.calendario-filter-section--ar {
  border-left: 4px solid #29b6f6;
  background: linear-gradient(
    90deg,
    rgba(41, 182, 246, 0.08) 0%,
    rgba(255, 255, 255, 0.02) 48%
  );
}

.calendario-filter-section--global {
  border-left: 4px solid #5c6bc0;
  background: linear-gradient(
    90deg,
    rgba(92, 107, 192, 0.1) 0%,
    rgba(255, 255, 255, 0.02) 48%
  );
}

.calendario-filter-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 8px;
}

.calendario-filter-section-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.calendario-filter-section--ar .calendario-filter-section-title {
  color: #81d4fa;
}

.calendario-filter-section--global .calendario-filter-section-title {
  color: #9fa8da;
}

.calendario-filters {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  font-size: 14px;
  flex: 1;
  min-width: 0;
}

.calendario-filter-actions {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
}

.calendario-select-all,
.calendario-clear-all {
  border: 1px solid var(--border);
  background: var(--btn);
  color: var(--text);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  line-height: 1.2;
}

.calendario-select-all:hover,
.calendario-clear-all:hover {
  background: var(--btnHover);
}

.calendario-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
}

.calendario-filter-chip input {
  margin: 0;
  cursor: pointer;
}

.calendario-filter-chip-text {
  color: var(--text);
  font-size: 13px;
  font-weight: 500;
}

.calendario-search-wrap label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--muted);
  margin: 0;
}

.calendario-search {
  min-width: min(100%, 200px);
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 7px 11px;
  font-size: 15px;
}

.calendario-err-hint {
  margin: 8px 0 0 0;
  font-size: 14px;
  color: var(--muted);
}

.calendario-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--cal-scroll-bg);
}

.calendario-month-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  min-width: 520px;
}

.calendario-th-dow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  background: var(--cal-th-bg);
  border-bottom: 2px solid var(--border);
  padding: 11px 7px;
  text-align: center;
}

.calendario-td {
  vertical-align: top;
  border: 1px solid var(--border);
  background: var(--cal-td-bg);
  padding: 0;
  cursor: pointer;
  transition: background 0.12s ease, box-shadow 0.12s ease;
  width: 20%;
}

.calendario-td:hover {
  background: var(--table-row-hover);
}

.calendario-td--pad {
  cursor: default;
  background: var(--table-row-stripe);
  border-color: var(--cal-td-pad-border);
}

.calendario-td--weekend {
  background: var(--cal-td-weekend);
}

.calendario-td--feriado {
  box-shadow: inset 0 0 0 1px rgba(250, 204, 21, 0.22);
}

.calendario-td--today {
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.82);
}

.calendario-td--selected {
  background: rgba(51, 65, 85, 0.5);
  box-shadow: inset 0 0 0 1px rgba(125, 211, 252, 0.45);
}

.calendario-td--today.calendario-td--selected {
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.9), inset 0 0 0 3px rgba(125, 211, 252, 0.42);
}

.calendario-td-inner {
  padding: 7px 8px 9px;
  min-height: 124px;
}

.calendario-daynum {
  font-size: 17px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-bottom: 6px;
  color: var(--text);
}

.calendario-ev-list {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 220px;
  overflow-y: auto;
  font-size: 13px;
  line-height: 1.4;
}

.calendario-ev {
  margin: 0 0 5px 0;
  padding: 0;
  display: flex;
  gap: 4px;
  align-items: flex-start;
}

.calendario-ev:last-child {
  margin-bottom: 0;
}

.calendario-ev-more {
  font-style: italic;
  color: var(--muted);
}

.calendario-ev-more .calendario-ev-text {
  font-size: 11px;
}

.calendario-ev-tag {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  padding: 2px 5px;
  border-radius: 4px;
  line-height: 1.2;
  margin-top: 1px;
}

/*
 * Colores por fuente, agrupados por región:
 * Argentina — celestes / verdes / índigo (sector público y stats locales).
 * Global — EE.UU. (azul marino / rojo), UE (azul institucional / oro BCE), Latam (verdes), PMI (gris / violeta).
 */
.calendario-ev--bcra .calendario-ev-tag {
  background: rgba(0, 172, 193, 0.35);
  color: #e0f7fa;
}

.calendario-ev--indec .calendario-ev-tag {
  background: rgba(92, 107, 192, 0.35);
  color: #e8eaf6;
}

.calendario-ev--feriados_arg .calendario-ev-tag {
  background: rgba(251, 140, 0, 0.35);
  color: #fff3e0;
}

.calendario-ev--feriados_usa .calendario-ev-tag {
  background: rgba(2, 136, 209, 0.34);
  color: #e1f5fe;
}

.calendario-ev--hacienda .calendario-ev-tag {
  background: rgba(46, 125, 50, 0.34);
  color: #e8f5e9;
}

.calendario-ev--licitaciones_me .calendario-ev-tag {
  background: rgba(0, 137, 123, 0.34);
  color: #e0f2f1;
}

.calendario-ev--caba .calendario-ev-tag {
  background: rgba(57, 73, 171, 0.34);
  color: #e8eaf6;
}

.calendario-ev--usa_nyfed .calendario-ev-tag {
  background: rgba(21, 101, 192, 0.36);
  color: #e3f2fd;
}

.calendario-ev--fed .calendario-ev-tag {
  background: rgba(198, 40, 40, 0.34);
  color: #ffebee;
}

.calendario-ev--ecb .calendario-ev-tag {
  background: rgba(250, 160, 0, 0.36);
  color: #fff8e1;
}

.calendario-ev--europa .calendario-ev-tag {
  background: rgba(13, 71, 161, 0.38);
  color: #e8eaf6;
}

.calendario-ev--brasil .calendario-ev-tag {
  background: rgba(104, 159, 56, 0.36);
  color: #f1f8e9;
}

.calendario-ev--bcb .calendario-ev-tag {
  background: rgba(245, 124, 0, 0.36);
  color: #fff3e0;
}

.calendario-ev--pmi_spglobal .calendario-ev-tag {
  background: rgba(84, 110, 122, 0.36);
  color: #eceff1;
}

.calendario-ev--pmi_ism .calendario-ev-tag {
  background: rgba(123, 31, 162, 0.34);
  color: #f3e5f5;
}

.calendario-sep-pill {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(244, 63, 94, 0.22);
  color: #fecdd3;
  border: 1px solid rgba(244, 63, 94, 0.35);
}

.calendario-sep-pill--cell {
  font-size: 9px;
  padding: 1px 4px;
  margin-right: 2px;
}

.calendario-ev-link,
.calendario-ev-text {
  flex: 1;
  min-width: 0;
  display: block;
  word-break: break-word;
}

.calendario-ev-link {
  color: var(--accent);
  text-decoration: none;
}

.calendario-ev-link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.calendario-ev-empty {
  min-height: 4px;
}

.calendario-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 12px;
  min-height: 12px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.calendario-dot--bcra {
  background: #00acc1;
}

.calendario-dot--indec {
  background: #5c6bc0;
}

.calendario-dot--feriados_arg {
  background: #fb8c00;
}

.calendario-dot--feriados_usa {
  background: #0288d1;
}

.calendario-dot--hacienda {
  background: #2e7d32;
}

.calendario-dot--licitaciones_me {
  background: #00897b;
}

.calendario-dot--caba {
  background: #3949ab;
}

.calendario-dot--usa_nyfed {
  background: #1565c0;
}

.calendario-dot--fed {
  background: #c62828;
}

.calendario-dot--ecb {
  background: #f9a825;
}

.calendario-dot--europa {
  background: #0d47a1;
}

.calendario-dot--brasil {
  background: #689f38;
}

.calendario-dot--bcb {
  background: #f57c00;
}

.calendario-dot--pmi_spglobal {
  background: #546e7a;
}

.calendario-dot--pmi_ism {
  background: #7b1fa2;
}

.calendario-detail-panel {
  border-top: 1px solid var(--border);
  padding-top: 14px;
}

.calendario-detail-title {
  margin: 0 0 10px 0;
  font-size: 18px;
  font-weight: 600;
  text-transform: capitalize;
}

.calendario-detail-title:empty {
  display: none;
}

.calendario-detail-empty {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.calendario-detail-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.calendario-detail-item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
}

.calendario-badge {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 6px;
}

.calendario-badge--bcra {
  background: rgba(0, 172, 193, 0.32);
  color: #e0f7fa;
}

.calendario-badge--indec {
  background: rgba(92, 107, 192, 0.32);
  color: #e8eaf6;
}

.calendario-badge--feriados_arg {
  background: rgba(251, 140, 0, 0.32);
  color: #fff3e0;
}

.calendario-badge--feriados_usa {
  background: rgba(2, 136, 209, 0.32);
  color: #e1f5fe;
}

.calendario-badge--hacienda {
  background: rgba(46, 125, 50, 0.32);
  color: #e8f5e9;
}

.calendario-badge--licitaciones_me {
  background: rgba(0, 137, 123, 0.32);
  color: #e0f2f1;
}

.calendario-badge--caba {
  background: rgba(57, 73, 171, 0.32);
  color: #e8eaf6;
}

.calendario-badge--usa_nyfed {
  background: rgba(21, 101, 192, 0.34);
  color: #e3f2fd;
}

.calendario-badge--fed {
  background: rgba(198, 40, 40, 0.32);
  color: #ffebee;
}

.calendario-badge--ecb {
  background: rgba(250, 160, 0, 0.34);
  color: #fff8e1;
}

.calendario-badge--europa {
  background: rgba(13, 71, 161, 0.34);
  color: #e8eaf6;
}

.calendario-badge--brasil {
  background: rgba(104, 159, 56, 0.34);
  color: #f1f8e9;
}

.calendario-badge--bcb {
  background: rgba(245, 124, 0, 0.34);
  color: #fff3e0;
}

.calendario-badge--pmi_spglobal {
  background: rgba(84, 110, 122, 0.34);
  color: #eceff1;
}

.calendario-badge--pmi_ism {
  background: rgba(123, 31, 162, 0.32);
  color: #f3e5f5;
}

.calendario-detail-text {
  flex: 1;
  min-width: 0;
  font-size: 15px;
  line-height: 1.45;
}

.calendario-detail-text a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 720px) {
  /* Mobile: NO achicar la tabla a 100% (squisheaba las 5 columnas → texto ilegible letra por letra).
     Se mantiene un ancho legible (~130px/col) y `.calendario-table-scroll` (overflow-x:auto) permite
     scrollear horizontal por swipe. */
  .calendario-month-table {
    min-width: 650px;
  }

  .calendario-td-inner {
    min-height: 98px;
  }

  .calendario-ev-list {
    max-height: 152px;
  }
}

/* Dashboard Inicio — franja TC (ancho completo; no solapar con TradingView debajo) */
#panels_dashboards .dashboard-inicio-tc-strip,
#mercadosInicioTcStrip {
  --tc-card-h: 272px;
  width: 100%;
  max-width: 100%;
  flex-shrink: 0;
  margin-left: 0;
  margin-right: 0;
  padding: 0 0 2px;
  overflow: visible;
  position: relative;
  z-index: 2;
  min-height: var(--tc-card-h, 272px);
}

#mercadosInicioTcStrip:empty {
  min-height: var(--tc-card-h, 272px);
}

#panels_dashboards .output--landing .dashboard-inicio-tc.dashboard-tc .dashboard-tc-card {
  overflow: visible;
  --tc-card-tail-min-h: 3.15rem;
}

#panels_dashboards .output--landing .dashboard-inicio-tc.dashboard-tc .dashboard-tc-card__fuente {
  -webkit-line-clamp: 3;
  line-clamp: 3;
  flex-shrink: 0;
}

/* Dashboard Inicio — snapshot local (4 tablas Top movers en fila) */
#panels_dashboards .dashboard-inicio-snapshot--loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(2rem + 1.85rem + 5 * 1.65rem);
  opacity: 0.72;
}

#panels_dashboards .dashboard-inicio-snapshot__loading {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--muted, #787b86);
}

#panels_dashboards .dashboard-inicio-snapshot-strip,
#mercadosInicioLocalSnapshot {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}

#panels_dashboards .card.tabPanel.card--landing .landing-tv-wrap.output--landing-tv {
  content-visibility: auto;
  contain-intrinsic-size: auto 480px;
}

#mercados_inicio_hybrid_watchlist {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}

#mercadosInicioLocalSnapshot {
  --snapshot-row-h: 1.65rem;
  --snapshot-panel-h: calc(2rem + 1.85rem + 5 * var(--snapshot-row-h));
  --snapshot-strip-h: calc(2 * var(--snapshot-panel-h) + var(--snapshot-band-gap, var(--mercados-landing-tc-gap, 14px)));
  width: 100%;
  max-width: 100%;
  flex: 0 0 auto;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  position: relative;
  z-index: 2;
  min-height: var(--snapshot-strip-h);
  height: auto;
}

#panels_dashboards .dashboard-inicio-snapshot-strip:empty,
#mercadosInicioLocalSnapshot:empty {
  min-height: var(--snapshot-strip-h);
}

#panels_dashboards .dashboard-inicio-snapshot {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  row-gap: var(--snapshot-band-gap, var(--mercados-landing-tc-gap, 14px));
  flex: 0 0 auto;
  height: auto;
  --snapshot-cols: 6;
  --snapshot-grid-gap: clamp(8px, 0.65vw, 12px);
}

#panels_dashboards .dashboard-inicio-snapshot-row {
  flex: 0 0 auto;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  isolation: isolate;
}

#panels_dashboards .dashboard-inicio-snapshot-row--local {
  margin-bottom: 0;
}

#panels_dashboards .dashboard-inicio-snapshot-row--global {
  margin-top: 0;
}

#panels_dashboards .dashboard-inicio-snapshot-grid {
  display: grid;
  grid-template-columns: repeat(var(--snapshot-cols, 4), minmax(0, 1fr));
  gap: var(--snapshot-grid-gap);
  width: 100%;
  align-items: stretch;
}

#panels_dashboards .dashboard-inicio-snapshot-grid--etfs {
  margin-top: var(--snapshot-grid-gap, 10px);
  max-width: calc(50% - var(--snapshot-grid-gap, 10px) / 2);
}

#panels_dashboards .dashboard-inicio-snapshot-panel {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--mercados-landing-panel-bg, color-mix(in srgb, var(--card) 94%, var(--text) 6%));
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
  overflow: visible;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__hdr {
  flex-shrink: 0;
  padding: 8px 10px 6px;
  border-bottom: 1px solid var(--border);
  background: var(--mercados-landing-panel-hdr-bg, color-mix(in srgb, var(--card) 88%, var(--text) 4%));
}

#panels_dashboards .dashboard-inicio-snapshot-panel__hdr-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  min-height: 1.25em;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__status {
  position: absolute;
  left: 0;
  z-index: 1;
  display: flex;
  align-items: center;
}

.mercados-market-status {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--text) 12%, transparent);
}

.mercados-market-status--open {
  background: #22c55e;
}

.mercados-market-status--premarket {
  background: #eab308;
}

.mercados-market-status--closed {
  background: #ef4444;
}

.dashboard-tc-card__title-row {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 1.25em;
}

.dashboard-tc-card__title-row .mercados-market-status {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.dashboard-tc-card__title-row .dashboard-tc-card__title {
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
  margin: 0;
  padding: 0 12px;
  box-sizing: border-box;
}

.mercados-inicio-hybrid-watchlist__market-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__title {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--card-header-title);
  font: inherit;
  font-size: clamp(0.82rem, 0.75rem + 0.2vw, 0.92rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
  cursor: pointer;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  max-width: calc(100% - 3.5rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__title:hover {
  color: var(--accent);
}

#panels_dashboards .dashboard-inicio-snapshot-panel__title--static {
  cursor: default;
  display: block;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__title--static:hover {
  color: var(--card-header-title);
  text-decoration: none;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__ult {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  margin: 0;
  font-size: 0.68rem;
  font-weight: 650;
  color: color-mix(in srgb, var(--muted) 78%, #b45309 22%);
  line-height: 1.2;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

#panels_dashboards .dashboard-inicio-snapshot-panel__cols {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  min-height: 0;
}

#panels_dashboards .dashboard-inicio-snapshot-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: visible;
}

#panels_dashboards .dashboard-inicio-snapshot-col + .dashboard-inicio-snapshot-col {
  border-left: 1px solid var(--table-cell-border);
}

#panels_dashboards .dashboard-inicio-snapshot-col__hdr {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px 4px;
  font-size: clamp(0.72rem, 0.66rem + 0.15vw, 0.8rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  background: var(--table-head-bg);
  border-bottom: 1px solid var(--table-cell-border);
  text-align: center;
}

#panels_dashboards .dashboard-inicio-snapshot-col__label {
  font-size: inherit;
}

#panels_dashboards .dashboard-inicio-snapshot-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: clamp(0.8rem, 0.74rem + 0.18vw, 0.88rem);
  line-height: var(--snapshot-row-h);
  color: var(--output-text);
}

#panels_dashboards .dashboard-inicio-snapshot-table tbody tr:nth-child(odd) {
  background: var(--table-row-stripe);
}

#panels_dashboards .dashboard-inicio-snapshot-table tbody tr:nth-child(even) {
  background: transparent;
}

#panels_dashboards .dashboard-inicio-snapshot-table tbody tr:hover {
  background: var(--table-row-hover);
}

#panels_dashboards .dashboard-inicio-snapshot__ticker {
  width: 52%;
  padding: 0 6px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

#panels_dashboards .dashboard-inicio-snapshot__var {
  width: 48%;
  padding: 0 6px;
  text-align: center;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

#panels_dashboards .dashboard-inicio-snapshot__var.cell-pos {
  color: var(--dashboard-acciones-treemap-up, #22c55e);
}

#panels_dashboards .dashboard-inicio-snapshot__var.cell-neg {
  color: var(--dashboard-acciones-treemap-down, #dc2626);
}

#panels_dashboards .dashboard-inicio-snapshot__row--empty .dashboard-inicio-snapshot__ticker,
#panels_dashboards .dashboard-inicio-snapshot__row--empty .dashboard-inicio-snapshot__var {
  color: var(--muted);
}

html[data-theme="light"] #panels_dashboards .dashboard-inicio-snapshot-panel,
html[data-theme="light"] #panels_dashboards .card.tabPanel.card--landing .dashboard-tc .dashboard-tc-card {
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

@media (max-width: 1100px) {
  #panels_dashboards .dashboard-inicio-snapshot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  #panels_dashboards .dashboard-inicio-snapshot-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Dashboard TC — base compartida (Inicio + Tipos de cambio) */
#panels_dashboards .dashboard-tc {
  --tc-card-h: 272px;
  --tc-grid-gap: clamp(8px, 0.65vw, 12px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: var(--panel-inset-y) 0 24px;
  box-sizing: border-box;
}

/* Inicio: sin padding-top extra del bloque .dashboard-tc (aire en #mercadosInicioTcStrip). */
#panels_dashboards .card.tabPanel.card--landing .output--landing .dashboard-inicio-tc.dashboard-tc {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  gap: 0;
  box-sizing: border-box;
  --tc-card-h: 272px;
}

/* Solo solapa Dashboards → Tipos de Cambio (no Inicio) */
#out_tipos_cambio {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding-left: 4px;
  padding-right: 4px;
}

#out_tipos_cambio .dashboard-tc {
  /* Misma altura base que Inicio; un poco más solo si hace falta el pie de fuente */
  --tc-card-h: 288px;
}

#panels_dashboards .dashboard-tc-section {
  width: 100%;
  max-width: none;
}

#panels_dashboards .dashboard-tc-section__title {
  margin: 0 0 12px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--border);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
  text-transform: uppercase;
  text-align: center;
}

#panels_dashboards .dashboard-tc-grid {
  display: grid;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  grid-template-columns: repeat(var(--tc-cols, 6), minmax(0, 1fr));
  gap: var(--tc-grid-gap, clamp(8px, 0.65vw, 12px));
  align-items: stretch;
}

/*
 * Tipos de cambio: flex (no grid de 7 columnas). Cada tarjeta = 1/7 del ancho;
 * el bloque completo se centra. Con 6 tarjetas quedan 3+3 (no 3+1+2 en columna central).
 */
#out_tipos_cambio .dashboard-tc-grid {
  --tc-slot-min: calc((100% - 6 * var(--tc-grid-gap, 10px)) / 7);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: flex-start;
  gap: var(--tc-grid-gap, 10px);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#out_tipos_cambio .dashboard-tc-grid[data-tc-count="1"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="2"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="3"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="4"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="5"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="6"],
#out_tipos_cambio .dashboard-tc-grid[data-tc-count="7"] {
  flex-wrap: nowrap;
}

#out_tipos_cambio .dashboard-tc-grid > .dashboard-tc-card {
  flex: 0 0 var(--tc-slot-min);
  width: var(--tc-slot-min);
  max-width: var(--tc-slot-min);
  min-width: 0;
}

#panels_dashboards .dashboard-tc-futuros-rows {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}

#panels_dashboards .dashboard-tc-grid--futuros {
  --tc-slot-min: calc((100% - 6 * var(--tc-grid-gap, 10px)) / 7);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: flex-start;
  grid-template-columns: unset;
}

#panels_dashboards .dashboard-tc-grid--futuros > .dashboard-tc-card {
  flex: 0 0 var(--tc-slot-min);
  width: var(--tc-slot-min);
  max-width: var(--tc-slot-min);
  min-width: 0;
}

#panels_dashboards .dashboard-tc-financiero-rows {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}

#panels_dashboards .dashboard-tc .dashboard-tc-card {
  --tc-card-pad-y: 14px;
  --tc-card-pad-x: 12px;
  --tc-card-tail-min-h: 2.45rem;
  --tc-card-mid-gap: 7px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: var(--tc-card-h, 272px);
  min-height: var(--tc-card-h, 272px);
  max-height: var(--tc-card-h, 272px);
  padding: var(--tc-card-pad-y) var(--tc-card-pad-x);
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--dashboard-tc-panel-bg, color-mix(in srgb, var(--card) 94%, var(--text) 6%));
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
  overflow: hidden;
}

#panels_dashboards .card.tabPanel.card--landing .dashboard-tc .dashboard-tc-card {
  background: var(--mercados-landing-panel-bg, var(--dashboard-tc-panel-bg));
}

#out_tipos_cambio .dashboard-tc .dashboard-tc-card {
  height: var(--tc-card-h, 288px);
  min-height: var(--tc-card-h, 288px);
  max-height: var(--tc-card-h, 288px);
}

#panels_dashboards .dashboard-tc-card--empty:not(.dashboard-tc-card--stale):not(.dashboard-tc-card--futuro) {
  opacity: 0.52;
}

#panels_dashboards .dashboard-tc-card__stale {
  margin: 0 0 6px;
  width: 100%;
  font-size: 0.62rem;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: var(--muted);
  text-align: center;
}

#panels_dashboards .dashboard-tc-card--stale .dashboard-tc-card__stale {
  color: color-mix(in srgb, var(--muted) 82%, #b45309 18%);
}

#panels_dashboards .dashboard-tc-card__title {
  flex: 0 0 auto;
  margin: 0;
  width: 100%;
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.25;
  color: var(--text);
  letter-spacing: 0.07em;
  text-align: center;
  text-transform: uppercase;
}

#panels_dashboards .dashboard-tc-card__mid {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  gap: var(--tc-card-mid-gap);
  min-height: 0;
  width: 100%;
  margin: 0;
}

#panels_dashboards .dashboard-tc-card__tail {
  flex: 0 0 var(--tc-card-tail-min-h);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 3px;
  width: 100%;
  min-height: var(--tc-card-tail-min-h);
}

#panels_dashboards .dashboard-tc-card__subtitle {
  margin: -4px 0 6px;
  width: 100%;
  font-size: 0.68rem;
  line-height: 1.25;
  color: var(--muted);
  text-align: center;
}

#panels_dashboards .dashboard-tc-card__calc-spec,
.dashboard-inicio-tc .dashboard-tc-card__calc-spec {
  margin: -2px 0 8px;
  width: 100%;
  font-size: 0.62rem;
  line-height: 1.3;
  color: color-mix(in srgb, var(--muted) 88%, var(--text) 12%);
  text-align: center;
}

.dashboard-inicio-tc .dashboard-tc-card__subtitle {
  margin: -4px 0 6px;
  width: 100%;
  font-size: 0.68rem;
  line-height: 1.25;
  color: var(--muted);
  text-align: center;
}

#panels_dashboards .dashboard-tc-card__quote {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  flex: 0 0 auto;
  margin: 0;
  padding: 0 4px;
  border: none;
  border-radius: 0;
  background: transparent;
  text-align: center;
  box-sizing: border-box;
}

#panels_dashboards .dashboard-tc-card__main {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.5rem;
  flex: 0 0 auto;
}

#panels_dashboards .dashboard-tc-card__var-row {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 1.75rem;
  flex: 0 0 auto;
  margin-top: 0;
}

#panels_dashboards .dashboard-tc-card__var--placeholder {
  visibility: hidden;
  min-width: 4.75rem;
}

#panels_dashboards .dashboard-tc-card__hero {
  font-size: clamp(1.55rem, 2.4vw, 1.95rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

#panels_dashboards .dashboard-tc-card__hero.cell-pos {
  color: var(--dashboard-acciones-treemap-up, #22c55e);
}

#panels_dashboards .dashboard-tc-card__hero.cell-neg {
  color: var(--dashboard-acciones-treemap-down, #dc2626);
}

#panels_dashboards .dashboard-tc-card__var {
  padding: 4px 11px;
  border-radius: 8px;
  font-size: clamp(1.08rem, 1.8vw, 1.28rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  background: transparent;
  border: 1px solid color-mix(in srgb, var(--border) 52%, transparent);
}

#panels_dashboards .dashboard-tc-card__var.cell-pos {
  color: var(--dashboard-acciones-treemap-up, #22c55e);
  background: color-mix(in srgb, var(--dashboard-tc-inset-bg, var(--card)) 88%, var(--dashboard-acciones-treemap-up, #22c55e) 12%);
  border-color: color-mix(in srgb, var(--dashboard-acciones-treemap-up, #22c55e) 28%, var(--border));
}

#panels_dashboards .dashboard-tc-card__var.cell-neg {
  color: var(--dashboard-acciones-treemap-down, #dc2626);
  background: color-mix(in srgb, var(--dashboard-tc-inset-bg, var(--card)) 88%, var(--dashboard-acciones-treemap-down, #dc2626) 12%);
  border-color: color-mix(in srgb, var(--dashboard-acciones-treemap-down, #dc2626) 28%, var(--border));
}

#panels_dashboards .dashboard-tc-card__fuente {
  margin: 0;
  padding-top: 0;
  max-width: 100%;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  min-height: 1.2rem;
  flex: 0 0 auto;
}

#panels_dashboards .dashboard-tc-card__fuente--slot {
  visibility: hidden;
  pointer-events: none;
}

#out_tipos_cambio .dashboard-tc-card__fuente {
  flex-shrink: 0;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

#panels_dashboards .dashboard-tc-card__ult {
  margin: 0;
  width: 100%;
  font-size: 0.72rem;
  font-weight: 650;
  color: var(--muted);
  text-align: center;
  line-height: 1.25;
  min-height: 0.9rem;
  flex: 0 0 auto;
}

#panels_dashboards .dashboard-tc-card__ult--slot {
  visibility: hidden;
  pointer-events: none;
}

#panels_dashboards .dashboard-tc-card__ult--stale {
  color: color-mix(in srgb, var(--muted) 78%, #b45309 22%);
}

.dashboard-inicio-tc .dashboard-tc-card__ult,
#out_tipos_cambio .dashboard-tc-card__ult {
  flex-shrink: 0;
}

#panels_dashboards .dashboard-tc-card__fuente--stale {
  color: color-mix(in srgb, var(--muted) 78%, #b45309 22%);
  font-weight: 650;
}

#panels_dashboards .dashboard-tc-card__fuente--spec,
.dashboard-inicio-tc .dashboard-tc-card__fuente--spec,
#out_tipos_cambio .dashboard-tc-card__fuente--spec {
  white-space: nowrap;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  text-overflow: ellipsis;
}

#panels_dashboards .dashboard-tc-card__puntas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  margin-top: 0;
  flex: 0 0 auto;
  align-content: center;
}

#panels_dashboards .dashboard-tc-card__punta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  min-height: 0;
  padding: 0 4px;
  border: none;
  border-radius: 0;
  background: transparent;
  text-align: center;
  box-sizing: border-box;
}

#panels_dashboards .dashboard-tc-card__punta-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1.15;
}

#panels_dashboards .dashboard-tc-card__punta-value {
  font-size: 1.02rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  color: var(--text);
}

#panels_dashboards .dashboard-tc-card__extras {
  width: 100%;
  margin-top: 0;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#panels_dashboards .dashboard-tc-card__metric {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 100%;
}

#panels_dashboards .dashboard-tc-card__metric-label {
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

#panels_dashboards .dashboard-tc-card__metric-value {
  font-size: 0.96rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

#panels_dashboards .dashboard-tc-card__metric-value .cell-pos {
  color: var(--dashboard-acciones-treemap-up, #22c55e);
}

#panels_dashboards .dashboard-tc-card__metric-value .cell-neg {
  color: var(--dashboard-acciones-treemap-down, #dc2626);
}

#panels_dashboards .dashboard-tc-card__muted {
  font-weight: 600;
  color: var(--muted);
  font-size: 0.84rem;
}

#panels_dashboards .dashboard-tc-card__foot {
  width: 100%;
  margin: 0;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  text-align: center;
  line-height: 1.2;
  min-height: 0.95rem;
}

#panels_dashboards .dashboard-tc-card__foot:empty,
#panels_dashboards .dashboard-tc-card__slot-spacer {
  visibility: hidden;
  pointer-events: none;
}

#panels_dashboards .dashboard-tc-chart-toolbar--dual .dashboard-tc-chart-metric-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px 32px;
}

#panels_dashboards .dashboard-tc-chart-toolbar--dual .dashboard-tc-chart-metric-wrap .dashboard-chart-filter-field {
  width: auto;
  flex: 0 1 auto;
  gap: 14px;
}

#panels_dashboards .dashboard-tc-section--chart {
  margin-top: 4px;
}

#panels_dashboards .dashboard-tc-chart-block {
  width: 100%;
  max-width: none;
}

#panels_dashboards .dashboard-tc-section--chart {
  width: 100%;
  max-width: none;
}

#panels_dashboards .dashboard-tc-chart-canvas-wrap {
  width: 100%;
  min-height: 300px;
  height: min(36vh, 380px);
}

#panels_dashboards .dashboard-tc-futures-chart-mount {
  width: 100%;
  height: 100%;
  min-height: 280px;
}

#panels_dashboards .dashboard-tc-futures-legend {
  justify-content: center;
}

#panels_dashboards .dashboard-tc-chart-block .dashboard-soberano-lw-legend {
  margin-bottom: 10px;
}

#panels_dashboards .dashboard-tc-chart-metric-wrap {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

@media (max-width: 1100px) {
  #out_tipos_cambio .dashboard-tc-grid {
    --tc-slot-min: calc((100% - 3 * var(--tc-grid-gap, 10px)) / 4);
  }
}

@media (max-width: 640px) {
  #out_tipos_cambio .dashboard-tc-grid {
    --tc-slot-min: calc((100% - var(--tc-grid-gap, 10px)) / 2);
  }

  #out_tipos_cambio .dashboard-tc-grid[data-tc-count] {
    flex-wrap: wrap;
  }
}

/* Tira de dólar de la landing (2026-07-06): usa el grid de --tc-cols (9 columnas fijas), que en
   pantallas angostas encimaba los tiles. Se reflowea por ancho disponible (auto-fill): ~5 col en
   tablet, 2 en teléfono. Solo la tira de inicio; la grilla de #out_tipos_cambio ya usa flex-wrap. */
@media (max-width: 900px) {
  #panels_dashboards .dashboard-inicio-tc-grid {
    grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  }
}

/*
 * Tablas muy largas: alternativa ligera a virtual scroll (medir en Performance antes de activar).
 * Puede interactuar con table_font_fit: probar scroll y ajuste de fuente al habilitar.
 *
 * .output .table tbody tr {
 *   content-visibility: auto;
 *   contain-intrinsic-size: 28px 1px;
 * }
 */

.siteFooter {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--content-max-width);
  margin: 2rem auto 0;
  padding: 1.25rem var(--container-pad-x) 2rem;
  border-top: 1px solid var(--border);
}

.siteFooter__brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem 0.75rem;
  margin-bottom: 0.75rem;
}

.siteFooter__mark {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
}

.siteFooter__copy {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--text);
}

.siteFooter__wordmark {
  font-weight: 600;
  color: var(--text);
}

.siteFooter__disclaimer {
  margin: 0;
  max-width: 52rem;
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--muted);
}