.tv-dashboard-page {
  --tv-panel: linear-gradient(135deg, #1e2a4a 0%, #1b1d3c 40%, #162040 100%);
  --tv-border: rgba(126, 148, 198, 0.24);
  --tv-text: #f8fafc;
  --tv-muted: rgba(226, 232, 240, 0.7);
  color: var(--tv-text);
  max-width: none;
  padding: 1.25rem 1.5rem 2rem;
}

.tv-dashboard-header {
  align-items: end;
  margin: 0 0 1.25rem;
  row-gap: 0.75rem;
}

.tv-breadcrumb {
  color: rgba(148, 163, 184, 0.9);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.tv-page-title {
  margin: 0.2rem 0;
  color: var(--tv-text);
  font-size: 1.7rem;
  font-weight: 650;
}

.tv-page-subtitle {
  margin: 0;
  color: var(--tv-muted);
  font-size: 0.94rem;
}

.tv-advert-dropdown {
  width: 22rem !important;
  max-width: 100%;
  margin-left: auto;
}

.tv-dashboard-page .tile-card {
  border: 1px solid var(--tv-border) !important;
  border-radius: 0.7rem !important;
  background: var(--tv-panel) !important;
  box-shadow: 0 1.15rem 2.8rem rgba(0, 0, 0, 0.18) !important;
  overflow: hidden !important;
}

.tv-dashboard-page .card-header {
  border-bottom: 1px solid rgba(126, 148, 198, 0.16) !important;
  background: rgba(7, 15, 36, 0.16) !important;
  color: var(--tv-text);
  font-size: 0.9rem;
  font-weight: 650;
}

.tv-dashboard-page .card-body { min-width: 0; }
.tv-hero-row, .tv-aida-row, .tv-bottom-row { row-gap: 0.9rem; margin-bottom: 0.9rem; }
.tv-hero-row .tile-card { height: 100% !important; min-height: 17.5rem; }
.tv-hero-row .js-plotly-plot, .tv-hero-row .plot-container, .tv-hero-row .svg-container { height: 100% !important; }
.tv-hero-row > div:first-child .card-body > .h-100 > div {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  position: relative;
}
.tv-hero-row > div:first-child #tv-video-help {
  bottom: 0;
  left: 0;
  position: absolute;
}

.tv-aida-row .tile-card { min-height: 20rem; }
.tv-aida-row .card-header { padding: 0.7rem 0.85rem; }
.tv-aida-row .card-body { display: flex; flex-direction: column; min-height: 0; padding: 0.45rem 0.55rem; }
.tv-aida-row .card-body > div { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.tv-aida-row .card-body > .h-100 > div:first-child { flex: 0 0 3.5rem; height: 3.5rem; margin-bottom: 0 !important; position: relative; z-index: 1; }
.tv-aida-row .card-body > .h-100 > div:nth-child(2) { flex: 1 1 auto; margin-top: 0.5rem; min-height: 0; overflow: hidden; position: relative; z-index: 0; }
.tv-aida-row [id$="-table"] { display: flex; flex: 1 1 auto; height: 100% !important; min-height: 0; }
.tv-aida-card-header { display: flex; align-items: center; gap: 0.7rem; min-height: 2.6rem; position: relative; }
.tv-aida-stage-icon { align-items: center; border-radius: 50%; display: inline-flex; flex: 0 0 2.4rem; height: 2.4rem; justify-content: center; }
.tv-aida-heading-copy { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; padding-right: 2.1rem; }
.tv-aida-row .aida-title { font-size: 1rem; line-height: 1.1; }
.tv-aida-description { color: var(--tv-muted); font-size: 0.68rem; line-height: 1.2; margin-top: 0.16rem; }
.tv-aida-row [id$="-avg"] {
  display: inline;
}

.tv-dashboard-page .metric-pill {
  border-width: 0 0 0 3px !important;
  border-radius: 0.35rem !important;
  background: rgba(60, 79, 128, 0.28) !important;
  padding: 0.45rem 0.55rem 1.25rem !important;
  min-height: 0 !important;
}

.tv-metric-pill-with-tooltip {
  display: flex;
  height: 100%;
  min-height: 0;
}

.tv-aida-metric-table { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.tv-aida-column-headings,
.tv-aida-metric-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.tv-aida-column-headings { flex: 0 0 auto; margin-bottom: 0.45rem; }
.tv-aida-column-heading { color: rgba(226, 232, 240, 0.82); font-size: 0.78rem; font-weight: 300; text-align: center; }
.tv-aida-metric-grid { display: grid; flex: 1 1 auto; gap: 0.5rem; grid-template-rows: repeat(4, minmax(0, 1fr)); min-height: 0; }
.tv-aida-metric-row { min-height: 0; }
.tv-aida-metric-row .metric-pill { height: 100% !important; margin: 0 !important; min-height: 0 !important; }

.tv-bottom-row .tile-card { height: 31.25rem !important; }
.tv-bottom-row .js-plotly-plot, .tv-bottom-row .plot-container, .tv-bottom-row .svg-container { height: 100% !important; }

@media (max-width: 991.98px) {
  .tv-dashboard-header { margin-bottom: 1rem; }
  .tv-advert-dropdown { margin-top: 0.8rem; width: 100% !important; }
  .tv-hero-row .tile-card { min-height: 16rem; }
}

@media (max-width: 1199.98px) {
  .tv-hero-row > div { flex: 0 0 100%; max-width: 100%; }
  .tv-aida-row .tile-card { min-height: 43rem; }
  .tv-aida-row .card-body > .h-100 > div:first-child { padding-top: 0.5rem; }
  .tv-aida-stage-icon,
  .tv-aida-description { display: none; }
  .tv-aida-card-header { min-height: 0; }
  .tv-aida-heading-copy { flex: 0 1 auto; justify-content: center; padding-right: 0; }
  .tv-aida-row [id$="-avg"] { align-self: center; flex: 0 0 auto; margin-left: auto; }
  .tv-aida-column-headings { display: none; }
  .tv-aida-metric-grid { grid-template-rows: repeat(8, minmax(0, 1fr)); }
  .tv-aida-metric-row { display: contents; }
  .tv-aida-metric-row .metric-pill { min-height: 0 !important; }
}