/* Dashboard TV — contraste de sala v57.
   Capa visual aislada: no modifica métricas, datos ni comportamiento. */

body.dashboard-tv-active .tv-55-panel {
  --tv-bg: #050b14;
  --tv-surface: #0b1724;
  --tv-card: #112131;
  --tv-card-strong: #162a3d;
  --tv-text: #f8fafc;
  --tv-text-secondary: #d5e2ea;
  --tv-text-muted: #b7c9d5;
  --tv-accent: #67e8f9;
  --tv-accent-strong: #22d3ee;
  --tv-focus: #fde047;
  --tv-success: #bbf7d0;
  --tv-warning: #fef3c7;
  --tv-danger: #ffe4e6;
  color: var(--tv-text);
  font-family: "DM Sans", Arial, sans-serif;
}

body.dashboard-tv-active .tv-55-panel .tv-stage {
  border: 2px solid #34536a !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(8, 145, 178, .16), transparent 34%),
    linear-gradient(145deg, var(--tv-bg) 0%, #081522 58%, #07111d 100%) !important;
  color: var(--tv-text) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-grid-bg {
  opacity: .18 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-energy-field {
  opacity: .12 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-bar,
body.dashboard-tv-active .tv-55-panel .tv-slide,
body.dashboard-tv-active .tv-55-panel .tv-broadcast-strip article,
body.dashboard-tv-active .tv-55-panel .tv-signal-strip article,
body.dashboard-tv-active .tv-55-panel .tv-metrics article,
body.dashboard-tv-active .tv-55-panel .tv-count-card,
body.dashboard-tv-active .tv-55-panel .tv-chart,
body.dashboard-tv-active .tv-55-panel .tv-list,
body.dashboard-tv-active .tv-55-panel .tv-alerts article,
body.dashboard-tv-active .tv-55-panel .tv-route-map-wrap,
body.dashboard-tv-active .tv-55-panel .tv-route-side {
  border-color: #3f6178 !important;
  background: var(--tv-card) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-slide {
  border-left: 5px solid var(--tv-accent-strong) !important;
  background: linear-gradient(145deg, #0a1623, #0d1d2c) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-bar {
  border-left: 5px solid var(--tv-accent-strong) !important;
  background: #091522 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-bar strong,
body.dashboard-tv-active .tv-55-panel #tvClock,
body.dashboard-tv-active .tv-55-panel #tvStatus {
  color: var(--tv-text) !important;
  font-weight: 800 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-live-dot {
  border: 2px solid #86efac !important;
  color: #f0fdf4 !important;
  background: #14532d !important;
}

body.dashboard-tv-active .tv-55-panel .tv-live-dot::before {
  background: #86efac !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-actions {
  opacity: 1 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-actions button {
  min-height: 38px !important;
  border: 2px solid #55758a !important;
  color: var(--tv-text) !important;
  background: #172b3d !important;
  font-size: clamp(12px, .78vw, 15px) !important;
  font-weight: 800 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-control-actions button:hover,
body.dashboard-tv-active .tv-55-panel .tv-control-actions button:focus-visible {
  border-color: var(--tv-accent) !important;
  background: #20425a !important;
}

body.dashboard-tv-active .tv-55-panel .tv-fullscreen-primary,
body.dashboard-tv-active .tv-55-panel .tv-control-actions #tvAudioButton.active {
  border-color: #a5f3fc !important;
  color: #03131d !important;
  background: #67e8f9 !important;
}

body.dashboard-tv-active .tv-55-panel :is(button, a, [tabindex]):focus-visible {
  outline: 4px solid var(--tv-focus) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 7px rgba(5, 11, 20, .9) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-slide-head .eyebrow {
  color: #bae6fd !important;
  font-size: clamp(12px, .75vw, 15px) !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
}

body.dashboard-tv-active .tv-55-panel .tv-slide-head h2 {
  color: var(--tv-text) !important;
  font-size: clamp(30px, 3vw, 56px) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .5) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-slide-head p {
  max-width: 82ch !important;
  color: var(--tv-text-secondary) !important;
  font-size: clamp(15px, 1vw, 19px) !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-slide-head > strong {
  border: 2px solid #a5f3fc !important;
  color: #03131d !important;
  background: #a5f3fc !important;
  font-size: clamp(13px, .8vw, 16px) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-metrics article,
body.dashboard-tv-active .tv-55-panel .tv-count-card {
  border-left: 5px solid #38bdf8 !important;
  background: var(--tv-card-strong) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-metrics strong,
body.dashboard-tv-active .tv-55-panel .tv-count-card strong {
  color: #ffffff !important;
  font-size: clamp(32px, 3.1vw, 58px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .45) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-metrics span,
body.dashboard-tv-active .tv-55-panel .tv-count-card > span {
  color: var(--tv-text-secondary) !important;
  font-size: clamp(12px, .78vw, 15px) !important;
  font-weight: 850 !important;
  letter-spacing: .045em !important;
}

body.dashboard-tv-active .tv-55-panel .tv-count-card strong[title="N/D"],
body.dashboard-tv-active .tv-55-panel .tv-chart-empty {
  color: var(--tv-warning) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-chart h4,
body.dashboard-tv-active .tv-55-panel .tv-list h4,
body.dashboard-tv-active .tv-55-panel .tv-route-side h3 {
  color: var(--tv-text) !important;
  font-size: clamp(18px, 1.15vw, 24px) !important;
  font-weight: 900 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-chart-subtitle,
body.dashboard-tv-active .tv-55-panel .tv-route-side p,
body.dashboard-tv-active .tv-55-panel .tv-line-footer {
  color: var(--tv-text-muted) !important;
  font-size: clamp(12px, .78vw, 15px) !important;
  font-weight: 700 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar {
  position: relative !important;
  min-height: 40px !important;
  border-left: 4px solid #55758a !important;
  padding: 4px 6px !important;
  background: #0b1825 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar.leader {
  border-left-color: var(--tv-focus) !important;
  background: #1e2936 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar.leader > span::before {
  content: "★ ";
  color: var(--tv-focus);
}

body.dashboard-tv-active .tv-55-panel .tv-bar span,
body.dashboard-tv-active .tv-55-panel .tv-bar strong {
  color: var(--tv-text) !important;
  font-size: clamp(13px, .82vw, 16px) !important;
  font-weight: 800 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar strong small {
  color: var(--tv-text-secondary) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar div {
  border: 1px solid #48657a !important;
  background: #24394a !important;
}

body.dashboard-tv-active .tv-55-panel .tv-bar i {
  background: linear-gradient(90deg, #38bdf8 0%, #67e8f9 100%) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset !important;
}

body.dashboard-tv-active .tv-55-panel .tv-list article {
  border-left: 4px solid #4b6f86 !important;
  background: #0b1825 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-list article:first-child {
  border-left-color: var(--tv-focus) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-list article:first-child > strong::before {
  content: "★ ";
  color: var(--tv-focus);
}

body.dashboard-tv-active .tv-55-panel .tv-list article strong {
  color: var(--tv-text) !important;
  font-size: clamp(14px, .9vw, 18px) !important;
  font-weight: 850 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-list article span {
  color: var(--tv-text-secondary) !important;
  font-size: clamp(12px, .78vw, 15px) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-list article em {
  color: var(--tv-accent) !important;
  font-size: clamp(16px, 1vw, 21px) !important;
  font-weight: 900 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article {
  border-left: 6px solid #94a3b8 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article.warning::before,
body.dashboard-tv-active .tv-55-panel .tv-alerts article.danger::before,
body.dashboard-tv-active .tv-55-panel .tv-alerts article.ok::before {
  display: block;
  margin-bottom: 5px;
  font-size: clamp(11px, .7vw, 14px);
  font-weight: 900;
  letter-spacing: .08em;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article.warning {
  border-left-color: #fbbf24 !important;
  color: var(--tv-warning) !important;
  background: #3b2a0d !important;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article.warning::before { content: "⚠ ATENCIÓN"; }

body.dashboard-tv-active .tv-55-panel .tv-alerts article.danger {
  border-left-color: #fb7185 !important;
  color: var(--tv-danger) !important;
  background: #421722 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article.danger::before { content: "⛔ CRÍTICO"; }

body.dashboard-tv-active .tv-55-panel .tv-alerts article.ok {
  border-left-color: #4ade80 !important;
  color: var(--tv-success) !important;
  background: #123523 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-alerts article.ok::before { content: "✓ CORRECTO"; }

body.dashboard-tv-active .tv-55-panel .tv-alerts article strong,
body.dashboard-tv-active .tv-55-panel .tv-alerts article span {
  color: inherit !important;
  font-weight: 800 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-source-health article {
  border: 2px solid #4b6f86 !important;
  background: #102131 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-source-health span,
body.dashboard-tv-active .tv-55-panel .tv-source-health strong {
  color: var(--tv-text) !important;
  font-size: clamp(12px, .75vw, 15px) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-source-health em {
  border: 1px solid currentColor !important;
  color: var(--tv-success) !important;
  background: #123523 !important;
  font-size: clamp(10px, .62vw, 12px) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-source-health article.empty em {
  color: var(--tv-warning) !important;
  background: #3b2a0d !important;
}

body.dashboard-tv-active .tv-55-panel .tv-source-health article.error em {
  color: var(--tv-danger) !important;
  background: #421722 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-data-badge {
  border: 2px solid #4ade80 !important;
  color: var(--tv-success) !important;
  background: #123523 !important;
  font-size: clamp(11px, .68vw, 13px) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-data-badge::before { content: "✓ "; }

body.dashboard-tv-active .tv-55-panel .tv-data-badge.review {
  border-color: #fbbf24 !important;
  color: var(--tv-warning) !important;
  background: #3b2a0d !important;
}

body.dashboard-tv-active .tv-55-panel .tv-data-badge.review::before { content: "⚠ "; }

body.dashboard-tv-active .tv-55-panel .tv-data-badge.empty {
  border-color: #cbd5e1 !important;
  color: #e2e8f0 !important;
  background: #263545 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-data-badge.empty::before { content: "— "; }

body.dashboard-tv-active .tv-55-panel .tv-tabs {
  gap: 7px !important;
  opacity: 1 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-tabs button {
  width: 34px !important;
  height: 9px !important;
  min-height: 9px !important;
  border: 2px solid #7692a5 !important;
  background: #26394a !important;
}

body.dashboard-tv-active .tv-55-panel .tv-tabs button.active {
  width: 54px !important;
  border-color: #a5f3fc !important;
  background: var(--tv-accent) !important;
}

body.dashboard-tv-active .tv-55-panel .tv-line-card polyline {
  stroke-width: 4.5 !important;
  filter: drop-shadow(0 0 3px rgba(103, 232, 249, .55));
}

body.dashboard-tv-active .tv-55-panel .tv-line-card circle {
  fill: #ffffff !important;
  stroke: #22d3ee !important;
  stroke-width: 2 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-ticker {
  border: 2px solid #526f83 !important;
  color: var(--tv-warning) !important;
  background: #0b1622 !important;
}

body.dashboard-tv-active .tv-55-panel .tv-ticker span {
  color: inherit !important;
  font-size: clamp(14px, .9vw, 18px) !important;
  font-weight: 850 !important;
}

@media (min-width: 1600px) {
  body.dashboard-tv-active .tv-55-panel .tv-content-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 901px) and (max-width: 1599px) {
  body.dashboard-tv-active .tv-55-panel .tv-control-actions button {
    min-height: 36px !important;
    padding: 3px 7px !important;
    font-size: 12px !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-slide-head h2 {
    font-size: clamp(28px, 2.8vw, 42px) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-metrics strong,
  body.dashboard-tv-active .tv-55-panel .tv-count-card strong {
    font-size: clamp(28px, 2.7vw, 42px) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-content-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  body.dashboard-tv-active .tv-55-panel,
  body.dashboard-tv-active .tv-55-panel * {
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  html:has(body.dashboard-tv-active),
  body.dashboard-tv-active,
  body.dashboard-tv-active .content,
  body.dashboard-tv-active .tv-panel,
  body.dashboard-tv-active .tv-55-panel,
  body.dashboard-tv-active .tv-55-panel .tv-stage,
  body.dashboard-tv-active .tv-55-panel .tv-slide {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html:has(body.dashboard-tv-active),
  body.dashboard-tv-active {
    overflow-x: hidden !important;
  }

  body.dashboard-tv-active .content,
  body.dashboard-tv-active .tv-panel {
    grid-template-columns: minmax(0, 1fr) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-stage {
    height: auto !important;
    min-height: 100dvh !important;
    padding: 10px !important;
    overflow: visible !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-control-bar,
  body.dashboard-tv-active .tv-55-panel .tv-slide-head {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-control-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-control-actions button {
    width: 100% !important;
    min-height: 44px !important;
    font-size: 14px !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-tabs {
    position: static !important;
    max-width: 100% !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-slide {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-slide-head {
    margin-left: 0 !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-slide-head h2 {
    font-size: clamp(30px, 9vw, 42px) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-slide-head p {
    max-width: none !important;
    font-size: 16px !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-metrics {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-metrics strong,
  body.dashboard-tv-active .tv-55-panel .tv-count-card strong {
    font-size: clamp(30px, 10vw, 46px) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-content-grid,
  body.dashboard-tv-active .tv-55-panel .tv-route-board {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-chart,
  body.dashboard-tv-active .tv-55-panel .tv-list,
  body.dashboard-tv-active .tv-55-panel .tv-alerts,
  body.dashboard-tv-active .tv-55-panel .tv-alerts article {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-bar {
    grid-template-columns: minmax(112px, 1.25fr) minmax(72px, 1fr) auto !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-list article {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  body.dashboard-tv-active .tv-55-panel .tv-list article span {
    grid-column: 1 / -1 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.dashboard-tv-active .tv-55-panel *,
  body.dashboard-tv-active .tv-55-panel *::before,
  body.dashboard-tv-active .tv-55-panel *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (forced-colors: active) {
  body.dashboard-tv-active .tv-55-panel .tv-slide,
  body.dashboard-tv-active .tv-55-panel .tv-chart,
  body.dashboard-tv-active .tv-55-panel .tv-list,
  body.dashboard-tv-active .tv-55-panel .tv-alerts article {
    border: 2px solid CanvasText !important;
  }
}
