/* Smart-TV browsers can expose a layout viewport larger than the area that is
   actually visible. Fit every modal to the measured visual viewport instead
   of relying on vh/dvh or native dialog centering. */
html.blackeye-tv-browser dialog[open] {
  box-sizing: border-box !important;
}

html.blackeye-tv-browser #detailDialog[open],
html.blackeye-tv-browser #usOpenHubDialog[open],
html.blackeye-tv-browser #sportsZoneDetailDialog[open] {
  position: fixed !important;
  top: calc(var(--tv-viewport-top, 0px) + 8px) !important;
  right: auto !important;
  bottom: auto !important;
  left: calc(var(--tv-viewport-left, 0px) + 8px) !important;
  width: calc(var(--tv-viewport-width, 100vw) - 16px) !important;
  max-width: calc(var(--tv-viewport-width, 100vw) - 16px) !important;
  height: calc(var(--tv-viewport-height, 100vh) - 16px) !important;
  max-height: calc(var(--tv-viewport-height, 100vh) - 16px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  transform: none !important;
}

html.blackeye-tv-browser #detailDialog[open] > .detail-content,
html.blackeye-tv-browser #detailDialog.has-trailer[open] > .detail-content,
html.blackeye-tv-browser #detailDialog.web-desktop-series-wide[open] > .detail-content,
html.blackeye-tv-browser #usOpenHubDialog[open] > .us-open-hub-scroll,
html.blackeye-tv-browser #sportsZoneDetailDialog[open] > .sports-zone-detail-body {
  box-sizing: border-box !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html.blackeye-tv-browser #playerDialog[open],
html.blackeye-tv-browser #multiviewDialog[open] {
  position: fixed !important;
  top: calc(var(--tv-viewport-top, 0px) + 4px) !important;
  right: auto !important;
  bottom: auto !important;
  left: calc(var(--tv-viewport-left, 0px) + 4px) !important;
  display: flex !important;
  box-sizing: border-box !important;
  width: calc(var(--tv-viewport-width, 100vw) - 8px) !important;
  max-width: calc(var(--tv-viewport-width, 100vw) - 8px) !important;
  height: calc(var(--tv-viewport-height, 100vh) - 8px) !important;
  max-height: calc(var(--tv-viewport-height, 100vh) - 8px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  transform: none !important;
}

html.blackeye-tv-browser #playerDialog[open] {
  flex-direction: column !important;
}

html.blackeye-tv-browser #playerDialog[open] > video {
  width: 100% !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  flex: 1 1 auto !important;
  object-fit: contain !important;
}

html.blackeye-tv-browser #playerDialog[open] > .player-bar {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
}

html.blackeye-tv-browser #usOpenHubDialog[open] > #closeUsOpenHub,
html.blackeye-tv-browser #sportsZoneDetailDialog[open] > .sports-zone-detail-close,
html.blackeye-tv-browser #detailDialog[open] > #closeDetail,
html.blackeye-tv-browser #playerDialog[open] > #closePlayer {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
}

html.blackeye-tv-browser .access-dialog[open],
html.blackeye-tv-browser .request-dialog[open],
html.blackeye-tv-browser .beta-notice-dialog[open],
html.blackeye-tv-browser .fire-tv-search-dialog[open] {
  position: fixed !important;
  top: calc(var(--tv-viewport-top, 0px) + 12px) !important;
  right: auto !important;
  bottom: auto !important;
  left: calc(var(--tv-viewport-left, 0px) + 12px) !important;
  box-sizing: border-box !important;
  width: calc(var(--tv-viewport-width, 100vw) - 24px) !important;
  max-width: calc(var(--tv-viewport-width, 100vw) - 24px) !important;
  height: auto !important;
  max-height: calc(var(--tv-viewport-height, 100vh) - 24px) !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  transform: none !important;
}

html.blackeye-tv-browser dialog[open]::backdrop {
  backdrop-filter: none !important;
}