/* Route-local Player 1 fixes.
   Keep scoped: /player and /player69 use this after the main player CSS. */

/* Repair 15: movie tile and movie detail formatting. */
body[data-content-mode="movies"] .web-player-shell.player-two .web-player-main,
.web-player-shell.player-two.mode-movies .web-player-main {
  grid-template-columns: minmax(520px, 0.98fr) minmax(520px, 1fr) !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid,
.web-player-shell.mode-movies .catalog-grid.media-grid {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)) !important;
  gap: 14px !important;
  align-content: start !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card {
  --zz-card-art-h: 224px;
  min-height: 382px !important;
  max-height: 382px !important;
  display: grid !important;
  grid-template-rows: 224px minmax(42px, auto) 26px minmax(56px, auto) !important;
  gap: 8px !important;
  padding: 12px !important;
  overflow: hidden !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .poster,
body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .media-poster,
body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card img,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .poster,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .media-poster,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card img {
  height: 224px !important;
  min-height: 224px !important;
  max-height: 224px !important;
  object-fit: cover !important;
  pointer-events: none !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .media-title,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .media-title {
  display: -webkit-box !important;
  min-height: 40px !important;
  max-height: 42px !important;
  overflow: hidden !important;
  font-size: 14px !important;
  line-height: 1.22 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .media-card-meta,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .media-card-meta {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 24px !important;
  overflow: hidden !important;
  color: #ffd94a !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .media-card-meta em,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .media-card-meta em {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #d7e8ff !important;
  font-style: normal !important;
  text-overflow: ellipsis !important;
}

body[data-content-mode="movies"] .catalog-grid.media-grid .channel-card.media-card .media-card-overview,
.web-player-shell.mode-movies .catalog-grid.media-grid .channel-card.media-card .media-card-overview {
  display: -webkit-box !important;
  min-height: 50px !important;
  max-height: 52px !important;
  overflow: hidden !important;
  color: #b9d8ff !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

body[data-content-mode="movies"] .watch-pane,
.web-player-shell.mode-movies .watch-pane,
body:not(.zz-not-authenticated):is([data-content-mode="movies"]) .watch-pane {
  grid-template-rows: minmax(230px, 30vh) auto minmax(430px, auto) !important;
  overflow: auto !important;
}

body[data-content-mode="movies"] .stage,
.web-player-shell.mode-movies .stage,
body:not(.zz-not-authenticated):is([data-content-mode="movies"]) .stage {
  min-height: 230px !important;
  height: 30vh !important;
  max-height: 300px !important;
}

body[data-content-mode="movies"] .overview-card,
.web-player-shell.mode-movies .overview-card,
body:not(.zz-not-authenticated):is([data-content-mode="movies"]) .overview-card {
  min-height: 430px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 18px !important;
  align-content: start !important;
  gap: 8px !important;
}

body[data-content-mode="movies"] .overview-card .overview-title,
.web-player-shell.mode-movies .overview-card .overview-title {
  max-width: 100% !important;
  margin: 4px 0 8px !important;
  overflow-wrap: anywhere !important;
  font-size: clamp(26px, 2vw, 36px) !important;
  line-height: 1.06 !important;
}

body[data-content-mode="movies"] .overview-card .overview-meta,
.web-player-shell.mode-movies .overview-card .overview-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-bottom: 8px !important;
}

body[data-content-mode="movies"] .overview-card .media-continuity-panel,
body[data-content-mode="movies"] .overview-card .overview-continuity,
.web-player-shell.mode-movies .overview-card .media-continuity-panel,
.web-player-shell.mode-movies .overview-card .overview-continuity {
  display: grid !important;
  grid-template-columns: 82px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  margin: 6px 0 8px !important;
}

body[data-content-mode="movies"] .overview-card .media-art-card,
body[data-content-mode="movies"] .overview-card .media-art-card img,
body[data-content-mode="movies"] .overview-card .overview-continuity img,
.web-player-shell.mode-movies .overview-card .media-art-card,
.web-player-shell.mode-movies .overview-card .media-art-card img,
.web-player-shell.mode-movies .overview-card .overview-continuity img {
  width: 82px !important;
  height: 120px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

body[data-content-mode="movies"] .overview-card .media-continuity-copy,
.web-player-shell.mode-movies .overview-card .media-continuity-copy {
  min-width: 0 !important;
  display: grid !important;
  align-content: start !important;
  gap: 9px !important;
}

body[data-content-mode="movies"] .overview-card .media-progress-head,
.web-player-shell.mode-movies .overview-card .media-progress-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

body[data-content-mode="movies"] .overview-card .media-fact-row,
.web-player-shell.mode-movies .overview-card .media-fact-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

body[data-content-mode="movies"] .overview-card .overview-description,
body[data-content-mode="movies"] .overview-card #overviewText,
.web-player-shell.mode-movies .overview-card .overview-description {
  display: -webkit-box !important;
  max-width: 820px !important;
  min-height: 38px !important;
  max-height: 42px !important;
  margin: 6px 0 10px !important;
  overflow: hidden !important;
  color: #f5f9ff !important;
  font-size: 14px !important;
  line-height: 1.42 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body[data-content-mode="movies"] .overview-card .overview-actions,
body[data-content-mode="movies"] .overview-card .media-detail-actions,
.web-player-shell.mode-movies .overview-card .overview-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

body[data-content-mode="movies"] .overview-card .overview-actions button,
body[data-content-mode="movies"] .overview-card .media-detail-actions button,
.web-player-shell.mode-movies .overview-card .overview-actions button {
  min-width: 150px !important;
  min-height: 44px !important;
  padding: 0 18px !important;
  font-size: 15px !important;
}
