/* One continuous page: only the outer top edge of the header is rounded. */
html.lf-theme-switching,
html.lf-theme-switching body,
html.lf-theme-switching body *:not(.lf-theme-toggle):not(.lf-theme-toggle *),
html.lf-theme-switching body *:not(.lf-theme-toggle):not(.lf-theme-toggle *)::before,
html.lf-theme-switching body *:not(.lf-theme-toggle):not(.lf-theme-toggle *)::after { transition:none !important }
body #page > .header-wrapper .menu-bar,
body .mobile-header { border-radius:6px 6px 0 0 !important; border-bottom:1px solid rgba(90,100,90,.20) !important; box-shadow:none !important }
body #page > .header-wrapper .menu-container { border-radius:inherit !important }
body #page, body #page > .main-content, body #page #content { border-radius:0 !important }
/* Without recommendations, contain the final text/list margin inside the page
   background so it cannot collapse into a dark stripe above the footer. */
body #page > .main-content:has(article:is(.type-movie, .type-tv_series)):not(:has(.random-content-section)) { display:flow-root }
/* Do not clip the header: search suggestions must extend over the content. */
body #movie-poster-container .movie-poster-image { border-radius:12px 12px 0 0 !important }
body #movie-poster-container #rating-card-fixed { border-radius:0 0 12px 12px !important }

/* Reuse each site's configured header logo instead of a fixed remote footer image. */
/* Keep both footer backgrounds flush with the page and restore the 10px inset. */
body .footer-widgets, body .footer-bottom { box-sizing:border-box; width:100%; max-width:none; margin:0; padding:10px }
body .lf-footer-brand { display:inline-flex; align-items:center; gap:12px; max-width:100%; margin:0 0 18px; color:inherit; text-decoration:none }
body .lf-footer-brand .footer-logo { display:block; width:auto; height:72px; max-width:min(260px,100%); max-height:72px; object-fit:contain; object-position:left center; margin:0 }
body .lf-footer-mark { display:grid; place-items:center; flex:none; width:56px; height:56px; border-radius:6px; background:var(--lf-primary-color,#3cc52b); color:#fff; font-size:30px; line-height:1; font-weight:700 }
body .lf-footer-wordmark { font-size:26px; line-height:1.2; font-weight:600; letter-spacing:1px }
@media(max-width:600px) {

    body .lf-footer-brand .footer-logo { height:60px; max-height:60px; max-width:min(220px,100%) }
    body .lf-footer-mark { width:48px; height:48px; font-size:26px }
    body .lf-footer-wordmark { font-size:22px }
}

/* Keep external scores in their existing information column. */
body .movie-info .rating-block, body .series-info .rating-block { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:10px; margin:20px 0 }
body .movie-info > .ratings > .rating-block, body .series-info > .ratings > .rating-block { margin:0 }
body .rating-block .rating-item { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-width:100px; padding:8px 15px; border:1px solid #ef9200; border-radius:0 !important; background:transparent !important; box-shadow:none; font-size:16px; line-height:1.6; font-weight:600; color:inherit }
body .rating-block .rating-imdb { border-color:#d5b12f }

/* One label column for every field, including cast names and long series labels. */
body .movie-details .movie-meta-container { display:block !important; margin:0 !important; padding:0 !important }
body .movie-details .movie-meta-column { display:contents !important }
body .movie-details .meta-item { display:grid !important; grid-template-columns:140px minmax(0,1fr); column-gap:16px !important; align-items:baseline !important; margin:0 !important; padding:4px 0 !important; border:0 !important }
body .movie-details .meta-item .meta-label { min-width:0 !important; width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; white-space:normal; color:#656c65; font-weight:600 !important }
body .movie-details .meta-item .meta-value, body .movie-details .meta-item .lf-cast-list { min-width:0 !important; max-width:none !important; grid-column:2; margin:0 !important; padding:0 !important; overflow-wrap:anywhere }
body .movie-details .meta-item > .lf-fold-toggle { grid-column:2; justify-self:start }
body.dark-mode .movie-details .meta-item .meta-label { color:#aeb6ae }
@media(max-width:480px) {
    body .rating-block .rating-item { min-width:80px; padding:6px 10px; font-size:14px }
    body .movie-details .meta-item { grid-template-columns:108px minmax(0,1fr); column-gap:12px !important; font-size:14px }
}

@media(max-width:768px) {
    html, body, body #page, body .hero-banner { background-image:none !important }
    body .site-background, body .site-spacer { display:none !important; background-image:none !important }
    /* A trailer's intrinsic width must not enlarge the single-column grid. */
    body .movie-header, body .series-header { grid-template-columns:minmax(0,1fr) !important; min-width:0; max-width:100%; box-sizing:border-box }
    body .movie-header > *, body .series-header > * { min-width:0 !important; max-width:100% !important; box-sizing:border-box }
    body .movie-header > .movie-poster-container { width:100% !important }
    body .movie-trailer, body .trailer-container { min-width:0; max-width:100%; box-sizing:border-box }
}

/* While the page fills the viewport, negative margins must not protrude.
   This also covers a phone turned sideways, above the mobile breakpoint. */
@media(max-width:1200px) {
    body .content-grid { margin-left:0 !important; margin-right:0 !important; min-width:0; max-width:100%; box-sizing:border-box }
}
@media(hover:none) and (pointer:coarse) {
    html, body { overscroll-behavior-x:none }
}
