/* The parent expands genres and years on mobile and skips its desktop scroll plugin.
   Native overflow also works on touch devices and when scripts are unavailable. */
.child-catalog-more { clear: both; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; padding: 18px 10px; }
.child-load-catalog { min-height: 44px; padding: 10px 20px; border: 0; border-radius: 6px; background: var(--child-site-primary, #dd3333); color: #fff; font: inherit; cursor: pointer; }
.child-load-catalog[hidden] { display: none; }
.child-load-catalog:disabled { opacity: .6; cursor: wait; }
.child-load-status { font-size: 12px; line-height: 1.5; }
@media only screen and (min-width: 769px) {
    header.main .hbox .child-desktop-header { display: flex; align-items: center; overflow: visible; }
    header.main .hbox .child-desktop-header > .logo { float: none; flex: 0 0 auto; }
    header.main .hbox .child-desktop-header > .head-main-nav { float: none; flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
    header.main .hbox .child-desktop-header .head-main-nav ul.main-header { float: none; display: flex; justify-content: center; }
    header.main .hbox .child-desktop-header .head-main-nav ul.main-header > li { float: none; }
    header.main .hbox .child-desktop-header > .headitems { float: none; flex: 0 0 auto; margin-left: 12px; }
}
@media only screen and (min-width: 769px) and (max-width: 1100px) {
    header.main .hbox .child-desktop-header .head-main-nav ul.main-header > li > a { padding-left: 8px; padding-right: 8px; font-size: 13px; }
}
.dt_mainmeta nav.genres ul.genres.scrolling,
.dt_mainmeta nav.releases ul.releases.scrolling,
.sidemenu ul.genres.scrolling {
    max-height: 282px;
}
.dt_mainmeta nav.genres ul.genres.scrolling:not(.mCustomScrollbar),
.dt_mainmeta nav.releases ul.releases.scrolling:not(.mCustomScrollbar),
.sidemenu ul.genres.scrolling:not(.mCustomScrollbar) {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

@media only screen and (max-width: 767px) {
    .module .content .items.normal .item,
    .module .content .items.full .item,
    .module .content.full_width_layout .items .item,
    .module .content .items .item,
    .items_glossary .items .item {
        width: 50%;
    }
}

/* Server columns respond to the available player width, not the device name. */
#single .dooplay_player .options ul#playeroptionsul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(120px, calc((100% - 10px) / 2)), 1fr));
    gap: 10px;
    margin: 14px 0;
}
#single .dooplay_player .options ul#playeroptionsul > li {
    float: none; width: auto; min-width: 0; margin: 0; padding: 12px 10px;
    position: relative; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 4px 7px;
    align-content: center; min-height: 64px; border: 1px solid #ffffff18; border-radius: 6px;
    box-sizing: border-box;
}
#single .dooplay_player .options ul#playeroptionsul > li > i { grid-column: 1; grid-row: 1; float: none; margin: 0; font-size: 18px; line-height: 20px; align-self: center; text-align: center; }
#single .dooplay_player .options ul#playeroptionsul > li span.title { grid-column: 2; grid-row: 1; float: none; min-width: 0; font-size: 12px; line-height: 20px; align-self: center; margin: 0; overflow-wrap: anywhere; }
#single .dooplay_player .options ul#playeroptionsul > li span.server { grid-column: 2; grid-row: 2; margin: 0; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
#single .dooplay_player .options ul#playeroptionsul > li span.flag { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); float: none; line-height: 0; }
#single .dooplay_player .options ul#playeroptionsul > li span.flag:empty { display: none; }
#single .dooplay_player .options ul#playeroptionsul > li:has(span.flag:not(:empty)) { padding-right: 35px; }
#single .dooplay_player .options ul#playeroptionsul > li span.loader { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); margin: 0; }
#single .dooplay_player .options ul#playeroptionsul > li span.title,
#single .dooplay_player .options ul#playeroptionsul > li span.server { min-width: 0; max-width: 100%; white-space: nowrap; overflow-wrap: normal; overflow-x: auto; scrollbar-width: none; }
#single .dooplay_player .options ul#playeroptionsul > li span.title::-webkit-scrollbar,
#single .dooplay_player .options ul#playeroptionsul > li span.server::-webkit-scrollbar { display: none; }

/* Every related poster keeps the same portrait frame, including Owl slides. */
#single_relacionados article { width: 100%; padding: 5px; box-sizing: border-box; }
#single_relacionados article > a { display: block; width: 100%; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 6px; background: #171717; }
#single_relacionados article > a > img { display: block; position: static; width: 100%; height: 100%; object-fit: contain; margin: 0; }

@media only screen and (max-width: 767px) {
    #single .sheader { display: flex; flex-direction: column; align-items: center; gap: 15px; padding: 20px 16px; }
    #single .sheader .poster { float: none; width: clamp(110px, 34vw, 150px); flex-shrink: 0; padding: 0; }
    #single .sheader .poster img { display: block; float: none; width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: contain; border-radius: 7px; }
    #single .sheader .data { float: none; width: 100%; min-width: 0; margin: 0; padding: 0; text-align: center; }
    #single .sheader .data h1 { font-size: clamp(18px, 4.5vw, 22px); line-height: 1.35; white-space: normal; overflow-wrap: anywhere; margin-bottom: 10px; }
    #single .sheader .data .extra { font-size: 12px; line-height: 1.6; }
    #single .sheader .sgeneros { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; }
    #single .sheader .sgeneros a { float: none; margin: 0; font-size: 12px; line-height: 1.5; }
    #single .dooplay_player .options { padding-left: 12px; padding-right: 12px; }
}

.dt_social_single.child-social { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dt_social_single.child-social > span { margin: 0; }
.dt_social_single.child-social > a { float: none; display: inline-flex; align-items: center; justify-content: center; gap: 7px; margin: 0; min-height: 40px; padding: 9px 12px; box-sizing: border-box; }
.dt_social_single.child-social > a > i, .dt_social_single.child-social > a > b { float: none; margin: 0; }
.dt_social_single.child-social .child-x-logo { width: 16px; height: 16px; fill: currentColor; }
.dt_social_single.child-social > a.x { background: #151515; color: #fff; border: 1px solid #ffffff40; }
.dt_social_single.child-social > a.telegram { background: #229ed9; color: #fff; }
.dt_social_single.child-social { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
#single .content .sbox.child-social-box { position: relative; inset: auto; float: none; clear: both; display: flow-root; width: 100%; box-sizing: border-box; }
.child-social-box .dt_social_single.child-social { position: relative; inset: auto; float: none; clear: both; width: 100%; box-sizing: border-box; }
.child-social-box .dt_social_single.child-social > a { position: relative; inset: auto; }
@media only screen and (max-width: 767px) {
    #single .content .sbox.child-social-box { margin-top: 16px; padding: 16px; }
}
.dt_social_single.child-social > span { grid-column: 1 / -1; float: none; width: auto; }
.dt_social_single.child-social > .child-share-heading { display: block; padding: 0 0 4px; font-size: 14px; font-weight: 500; line-height: 1.5; }
.dt_social_single.child-social .child-share-heading #social_count { font-size: 12px; opacity: .65; }
.dt_social_single.child-social > a { width: 100%; min-width: 0; height: 40px; padding: 8px 5px; }
.dt_social_single.child-social > a > b { white-space: nowrap; }
@media only screen and (max-width: 600px) {
    .dt_social_single.child-social { gap: 6px; }
    .dt_social_single.child-social > a > b { display: none; }
    .dt_social_single.child-social > a > i { font-size: 18px; }
}
@media only screen and (max-width: 480px) {
    #single .dooplay_player .options ul#playeroptionsul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
