/* EVO+ production parity.
   Preserve Ojo Negro's geometry and focus contract; only the EVO+ palette
   remains different. This file intentionally loads after the EVO theme and
   cross-device fixes. */

:root {
  --evo-tv-focus: #a61f32;
}

/* Inicio lives only in the shared top navigation. Keep the hidden controller
   button in the DOM so existing view routing remains unchanged. */
#app.be-home-redesign .sidebar #mainNav > [data-view="home"] {
  display: none !important;
}

/* Section titles belong to the content area. Keep the shared top bar reserved
   for navigation, account validity and actions on every authenticated view. */
#app:not([hidden]) .topbar-copy {
  display: none !important;
}

/* One toolbar surface in every EVO+ catalogue view. Earlier production CSS
   removed the button chrome only while Home was active, so Live, Movies and
   Series showed the same icons inside unrelated rounded boxes. */
#app.be-home-redesign .topbar {
  z-index: 120 !important;
  isolation: isolate;
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: 0 !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#app.be-home-redesign:not(.be-home-active) .topbar {
  position: sticky !important;
  top: 0 !important;
}

/* Destacados uses the full content width on the television shell and on
   compact touch layouts. The page keeps its padding for every carousel while
   only the hero bleeds through that inset, eliminating the blue side bars. */
html.blackeye-apk-shell #app.be-home-active #homeFeature {
  width: calc(100% + var(--home-inline-inset, 18px) + var(--home-inline-inset, 18px)) !important;
  max-width: none !important;
  margin-inline: calc(-1 * var(--home-inline-inset, 18px)) !important;
}

@media (max-width: 760px),
       (orientation: landscape) and (max-width: 1180px) and (max-height: 820px) {
  html:not(.blackeye-apk-shell) #app.be-home-active #homeFeature {
    width: calc(100% + var(--home-inline-inset, 16px) + var(--home-inline-inset, 16px)) !important;
    max-width: none !important;
    margin-inline: calc(-1 * var(--home-inline-inset, 16px)) !important;
  }
}

#app.be-home-redesign .top-actions > :is(
  #weatherButton,
  #apkFavoritesButton,
  #webFavoritesButton,
  #homeFavoritesShortcut,
  #apkRemoteControlButton,
  #homeSearchShortcut
) {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #79a5ff !important;
  box-shadow: none !important;
}

#app.be-home-redesign #userMenuButton {
  border: 0 !important;
  border-radius: 50% !important;
  background: #4c82ff !important;
  color: #06162f !important;
  box-shadow: none !important;
}

/* Fire TV keeps the exact same right-side geometry in Home and catalogues.
   The featured header used a wider inset, smaller controls and a 19px gap;
   that pushed the tools toward the centre and crowded the primary menu. */
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign.be-home-active .topbar {
  left: var(--home-inline-inset, 18px) !important;
  right: var(--home-inline-inset, 18px) !important;
  padding: 8px 0 !important;
  gap: 12px !important;
}

html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign .topbar .top-actions {
  flex: 0 0 auto !important;
  width: auto !important;
  margin-left: auto !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign .topbar .top-actions > :is(
    #weatherButton,
    #apkFavoritesButton,
    #homeFavoritesShortcut,
    #apkRemoteControlButton,
    #homeSearchShortcut
  ),
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign .topbar .top-actions > .user-menu-shell,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign .topbar #userMenuButton {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  flex: 0 0 48px !important;
}

/* At the top, Home keeps the toolbar over the featured image. Once the page
   moves to the lower rails, anchor that same transparent toolbar to the
   viewport while the content clipper removes anything entering its space. */
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye
  #app.be-home-redesign.be-home-active.evo-home-scrolled .topbar,
html:not(.blackeye-apk-shell) body.theme-blackeye
  #app.be-home-redesign.be-home-active.evo-home-scrolled .topbar {
  position: fixed !important;
  top: 0 !important;
  left: var(--evo-home-fixed-left, 0px) !important;
  right: var(--evo-home-fixed-right, 0px) !important;
  width: auto !important;
}

/* Account validity and clock are navigation copy, not action icons. Match the
   neutral label colour used by Películas, Series, En vivo and Favoritos. */
#app.be-home-redesign .top-actions > :is(#homeAccountExpiry, #deviceLocalTime) {
  color: #a8a9b0 !important;
}

/* The primary header uses the same blue underline for remote focus and for
   the section that is already open. While the remote is moving across the
   menu, hide the old active marker so there is only one unambiguous focus. */
#app.be-home-redesign .home-layout-nav button:is(:focus, :focus-visible) {
  outline: none !important;
  outline-offset: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  font-weight: 750 !important;
}

#app.be-home-redesign .home-layout-nav button:is(:focus, :focus-visible)::after {
  content: "" !important;
  position: absolute !important;
  bottom: 3px !important;
  left: 0 !important;
  width: 23px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #4c82ff !important;
  box-shadow: none !important;
}

#app.be-home-redesign .home-layout-nav:focus-within button.active:not(:focus)::after {
  opacity: 0 !important;
}

/* Compact landscape web menus must scale the wide EVO+ wordmark inside the
   available rail. The theme's fixed 116px width previously won over the
   mobile 52px sidebar and visibly cropped both ends. */
@media (orientation: landscape) and (max-width: 1180px) and (max-height: 820px) {
  html:not(.blackeye-apk-shell) body.theme-blackeye #app .sidebar > .brand {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  html:not(.blackeye-apk-shell) body.theme-blackeye #app .sidebar > .brand img {
    display: block !important;
    width: min(116px, 100%) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 43px !important;
    object-fit: contain !important;
  }

  html:not(.blackeye-apk-shell) body.theme-blackeye #app.sidebar-collapsed .sidebar > .brand img {
    width: 40px !important;
    max-width: 40px !important;
    height: auto !important;
    max-height: 34px !important;
  }
}

/* Artwork receives one uniform frame, entirely inside the image. The card
   itself never paints another ring, so the first item and the title beneath
   it cannot be clipped or covered. */
html.blackeye-apk-shell #app :is(
  .content-card,
  .home-curation-card,
  .home-live-carousel-card,
  .live-folder,
  .carousel-view-all
):is(:focus,:focus-visible) {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Explicit forms retain compatibility with the Fire OS Chromium build and
   outrank the earlier EVO theme without changing any element dimensions. */
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .content-card:focus > .poster,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .content-card:focus-visible > .poster,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-curation-card:focus > .home-curation-poster,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-curation-card:focus-visible > .home-curation-poster,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-live-carousel-card:focus .home-live-card-art,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-live-carousel-card:focus-visible .home-live-card-art,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .live-folder:focus .live-folder-art,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .live-folder:focus-visible .live-folder-art,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .carousel-view-all:focus .carousel-view-all-art,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .carousel-view-all:focus-visible .carousel-view-all-art {
  position: relative !important;
  box-sizing: border-box !important;
  border: 1px solid transparent !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-curation-card.is-selected:is(:focus,:focus-visible) .home-card-expanded {
  box-sizing: border-box !important;
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
  transform: none !important;
}

html.blackeye-apk-shell #app :is(
  .content-card:focus > .poster,
  .content-card:focus-visible > .poster,
  .home-curation-card:focus > .home-curation-poster,
  .home-curation-card:focus-visible > .home-curation-poster,
  .home-live-carousel-card:focus .home-live-card-art,
  .home-live-carousel-card:focus-visible .home-live-card-art,
  .live-folder:focus .live-folder-art,
  .live-folder:focus-visible .live-folder-art,
  .carousel-view-all:focus .carousel-view-all-art,
  .carousel-view-all:focus-visible .carousel-view-all-art
) {
  position: relative !important;
  box-sizing: border-box !important;
  border: 1px solid transparent !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html.blackeye-apk-shell #app :is(
  .content-card:focus > .poster,
  .content-card:focus-visible > .poster,
  .home-curation-card:focus > .home-curation-poster,
  .home-curation-card:focus-visible > .home-curation-poster,
  .home-live-carousel-card:focus .home-live-card-art,
  .home-live-carousel-card:focus-visible .home-live-card-art,
  .live-folder:focus .live-folder-art,
  .live-folder:focus-visible .live-folder-art,
  .carousel-view-all:focus .carousel-view-all-art,
  .carousel-view-all:focus-visible .carousel-view-all-art,
  .apk-preview-focused:not(.apk-preview-on-dismiss) > .poster,
  .apk-preview-focused:not(.apk-preview-on-dismiss) > .home-curation-poster
)::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  box-sizing: border-box !important;
  border: 3px solid var(--evo-tv-focus) !important;
  border-radius: inherit !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  z-index: 30 !important;
  pointer-events: none !important;
}

html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .content-card:focus > .poster::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .content-card:focus-visible > .poster::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-curation-card:focus > .home-curation-poster::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-curation-card:focus-visible > .home-curation-poster::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-live-carousel-card:focus .home-live-card-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .home-live-carousel-card:focus-visible .home-live-card-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .live-folder:focus .live-folder-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .live-folder:focus-visible .live-folder-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .carousel-view-all:focus .carousel-view-all-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .carousel-view-all:focus-visible .carousel-view-all-art::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .apk-preview-focused:not(.apk-preview-on-dismiss) > .poster::after,
html.blackeye-apk-shell.blackeye-fire-tv body.theme-blackeye #app .apk-preview-focused:not(.apk-preview-on-dismiss) > .home-curation-poster::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  box-sizing: border-box !important;
  border: 3px solid var(--evo-tv-focus) !important;
  border-radius: inherit !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  z-index: 30 !important;
  pointer-events: none !important;
}

/* Web and touch browsers use the same single inside frame without borrowing
   the poster pseudo-element that draws the mouse play affordance. */
html:not(.blackeye-apk-shell) body.theme-blackeye #app :is(
  .content-card:focus > .poster,
  .content-card:focus-visible > .poster,
  .home-curation-card:focus > .home-curation-poster,
  .home-curation-card:focus-visible > .home-curation-poster,
  .home-live-carousel-card:focus .home-live-card-art,
  .home-live-carousel-card:focus-visible .home-live-card-art,
  .live-folder:focus .live-folder-art,
  .live-folder:focus-visible .live-folder-art,
  .carousel-view-all:focus .carousel-view-all-art,
  .carousel-view-all:focus-visible .carousel-view-all-art
) {
  box-sizing: border-box !important;
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
  transform: none !important;
}

html:not(.blackeye-apk-shell) body.theme-blackeye #app .home-curation-card.is-selected:is(:focus,:focus-visible) .home-card-expanded {
  box-sizing: border-box !important;
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
  transform: none !important;
}

html:not(.blackeye-apk-shell) body.theme-blackeye #app :is(
  .content-card,
  .home-curation-card,
  .home-live-carousel-card,
  .live-folder,
  .carousel-view-all
):is(:focus,:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

/* Restore the original rail spacing. With an internal frame no extra padding
   is needed, and the artwork title stays in its production position. */
html.blackeye-apk-shell #app .home-curation-scroller,
html.blackeye-apk-shell #app .movie-genre-scroller {
  padding-top: 3px !important;
  padding-right: 4px !important;
  padding-bottom: 4px !important;
  padding-left: 4px !important;
  scroll-padding-inline: 4px !important;
}

html.blackeye-apk-shell #app .home-live-carousel {
  padding: 2px 2px 4px !important;
  scroll-padding-inline: 2px !important;
}

/* Non-art controls keep the production thickness with the EVO dark red. */
html.blackeye-fire-tv body.theme-blackeye :is(
  button,
  a,
  input,
  select,
  [tabindex]
):not(.content-card):not(.home-curation-card):not(.home-live-carousel-card):not(.live-folder):not(.carousel-view-all):is(:focus,:focus-visible) {
  outline: 3px solid var(--evo-tv-focus) !important;
  outline-offset: 1px !important;
  box-shadow: 0 0 0 2px #080808 !important;
}

/* Language/audio/subtitle focus stays inside its field and never covers its
   label. These controls retain their original production padding. */
html.blackeye-fire-tv body.theme-blackeye #detailDialog :is(
  .series-control select,
  .subtitle-control select
):is(:focus,:focus-visible) {
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
}

html.blackeye-fire-tv body.theme-blackeye #detailDialog.apk-detail-layout.apk-detail-landscape #seriesControl:not([hidden]) {
  padding: 6px !important;
}

html.blackeye-fire-tv body.theme-blackeye #detailDialog.apk-detail-layout.apk-detail-landscape.apk-detail-series #seriesControl:not([hidden]) {
  padding: 0 !important;
}

/* The continue button uses the small production ring around the play circle. */
html.blackeye-fire-tv body.theme-blackeye #detailDialog.apk-detail-layout.apk-detail-landscape #seriesContinue {
  width: auto !important;
  margin: 0 !important;
  padding: 3px 3px 3px 9px !important;
  outline: none !important;
  box-shadow: none !important;
}

html.blackeye-fire-tv body.theme-blackeye #detailDialog.apk-detail-layout.apk-detail-landscape #seriesContinue .series-continue-icon {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
  outline: none !important;
  box-shadow: none !important;
}

html.blackeye-fire-tv body.theme-blackeye #detailDialog.apk-detail-layout.apk-detail-landscape #seriesContinue:is(:focus,:focus-visible) .series-continue-icon {
  outline: 2px solid var(--evo-tv-focus) !important;
  outline-offset: 2px !important;
  background: var(--evo-tv-focus) !important;
  box-shadow: none !important;
}

/* Native select sheet: original dimensions and one consistent focus surface. */
html.blackeye-fire-tv .blackeye-tv-select-menu {
  padding: 15px !important;
}

html.blackeye-fire-tv .blackeye-tv-select-option:is(:focus,:focus-visible) {
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  background: #700c1f !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
}

/* Sidebar and Sports Zone are clipped surfaces. Their frame is internal so
   circular and edge controls show a complete, even contour. */
html.blackeye-fire-tv body.theme-blackeye #app .sidebar nav {
  padding: 4px 0 !important;
  scroll-padding: 4px !important;
}

html.blackeye-fire-tv body.theme-blackeye #app .sidebar .nav-item:is(:focus,:focus-visible) {
  border-color: transparent !important;
  outline: none !important;
  background: linear-gradient(90deg, rgba(112,12,31,.58), rgba(26,6,15,.38)) !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
}

html.blackeye-fire-tv body.theme-blackeye :is(.sports-zone,.sports-zone-detail) :is(button,input,select):is(:focus,:focus-visible) {
  border-color: var(--evo-tv-focus) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 3px var(--evo-tv-focus) !important;
}

/* The live agenda belongs directly on the home background. Individual event
   cards keep their own border and focus state; only the outer panel frame is
   removed. */
body.theme-blackeye #app .home-live-panel {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* TV Home uses the screen above the score ribbon, not a fixed 460/560px hero.
   Preserve document scrolling: native D-pad reveal uses window.scrollBy. */
html.blackeye-apk-shell.blackeye-fire-tv {
  scroll-padding-bottom: calc(var(--be-live-ticker-height, 0px) + 12px);
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #hero.home-dashboard {
  padding: 0 !important; margin-top: 0 !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeature {
  height: calc(100vh - var(--be-live-ticker-height, 0px)) !important;
  min-height: 0 !important; max-height: none !important;
  padding: 0 !important; box-sizing: border-box !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active :is(#homeFeatureArt, #homeFeatureMedia, .home-feature-shade) {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureArt,
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureMedia video {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; object-position: center !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureMedia { overflow: hidden; }
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureMedia iframe {
  inset: auto !important; left: 50% !important; top: 50% !important;
  width: var(--evo-feature-media-width, 100%) !important;
  height: var(--evo-feature-media-height, 100%) !important;
  max-width: none !important; transform: translate(-50%, -50%) !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active .home-feature-copy {
  position: absolute !important; top: calc(var(--home-header-height, 72px) + 12px) !important;
  bottom: 62px !important; left: 4% !important; width: 58% !important;
  display: flex; flex-direction: column; align-items: flex-start;
  min-height: 0; padding: 0 !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active .home-feature-title-slot {
  min-height: 0 !important; margin: 10px 0 !important; flex: 0 1 auto;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureLogo {
  max-height: clamp(44px, 15vh, 112px) !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureSynopsis {
  flex: 0 1 auto; min-height: 0; margin: 0 0 12px !important;
}
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active :is(#homeFeatureKind, #homeFeatureMeta, .home-feature-actions) { flex-shrink: 0; }
html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active .home-feature-controls {
  position: absolute !important; left: 4% !important; right: 4% !important;
  bottom: 14px !important; margin: 0 !important;
}
html.blackeye-apk-shell.blackeye-fire-tv.be-live-ticker-visible body #app > .main {
  padding-bottom: calc(var(--be-live-ticker-height, 0px) + 24px) !important;
}
@media (max-height: 480px) {
  html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureTitle {
    font-size: 28px !important; line-height: 1.05 !important;
  }
  html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureMeta { margin-bottom: 8px !important; }
  html.blackeye-apk-shell.blackeye-fire-tv body #app.be-home-active #homeFeatureSynopsis { -webkit-line-clamp: 2 !important; line-height: 1.4 !important; }
}

/* Favorites preview occupies its grid column instead of covering its neighbours.
   Only its own row moves; column count and row height stay stable for D-pad navigation. */
html.blackeye-apk-shell #app .favorite-group-grid {
  overflow-x:auto; overflow-y:hidden; padding:8px; margin:-8px;
  scroll-padding-inline:8px; overflow-anchor:none;
}
html.blackeye-apk-shell #app .favorite-group-grid > .content-card {
  min-width:0!important; max-width:none!important; width:100%!important;
  transform:translateX(var(--evo-favorite-shift,0px))!important;
}
html.blackeye-apk-shell #app .favorite-group-grid > .apk-preview-focused {
  width:var(--be-preview-width)!important;
}
html.blackeye-apk-shell #app .favorite-group-grid > .apk-preview-grid > .poster {
  width:100%!important; left:0!important;
}
