/* ============================================
   Static Template Fixes
   Only overrides JS-dependent behaviors
   ============================================ */

/* --- SLICK CAROUSEL --- */
/* Remove JS transform positioning */
.slick-track {
    transform: none !important;
    width: auto !important;
    height: auto !important;
}

.slick-list {
    height: auto !important;
}

/* Hide all banner groups except the active one */
.banner-carousel > .slick-list > .slick-track > .banner-group-vertical {
    display: none !important;
}

.banner-carousel > .slick-list > .slick-track > .banner-group-vertical[aria-hidden='false'] {
    display: block !important;
}

/* Inside active group: show only first real slide, hide rest */
.banner-group-vertical .slick-track {
    transform: none !important;
    height: auto !important;
}

.banner-group-vertical .slick-list {
    height: auto !important;
}

.banner-group-vertical .slick-slide {
    display: none !important;
}

.banner-group-vertical .slick-slide.slick-active {
    display: block !important;
}

/* If no slick-active, show first non-cloned */
.banner-group-vertical .slick-slide[data-slick-index='0']:not(.slick-cloned) {
    display: block !important;
}

/* Banner images full width */
.banner img {
    width: 100%;
    height: auto;
}

/* --- MENU SLIDE & DROPDOWN --- */
.menu-slide {
    overflow: visible !important;
}

.top-menu {
    overflow: visible !important;
}

/* --- DOWNLOAD APK: Scroll-triggered animation --- */
.download-apk > div {
    opacity: 0 !important;
    transition: opacity 0.8s ease-out, transform 0.8s ease-out !important;
}

/* Left div: slide in from left */
.download-apk > div:first-child {
    transform: translateX(-60px) !important;
}

/* Right div: slide in from right */
.download-apk > div:nth-child(2) {
    transform: translateX(60px) !important;
    transition-delay: 0.2s !important;
}

.download-apk.in-view > div {
    opacity: 1 !important;
    transform: translateX(0) !important;
}

/* --- MENU ICON HOVER SWAP --- */
.menu-icon-wrap {
    display: block;
    margin: 0 auto 5px;
    height: 30px;
    width: 30px;
    position: relative;
}

.menu-icon-wrap img {
    display: block;
    width: 30px;
    height: 30px;
}

.menu-icon-wrap .menu-icon-hover {
    display: none;
}

.top-menu > li:hover .menu-icon-wrap .menu-icon-normal {
    display: none;
}

.top-menu > li:hover .menu-icon-wrap .menu-icon-hover {
    display: block;
}

/* Override original content swap (broken due to CSS var path resolution) */
.top-menu > li:hover > a > .menu-icon-wrap img,
.top-menu > li[data-active='true'] > a > .menu-icon-wrap img {
    content: none !important;
}

/* --- PLAY ICON FIX --- */
/* CSS var(--play-icon-src) resolves url() relative to the CSS file, not HTML.
   Override with correct relative path from assets/css/ */
.play-now::before,
.free-play::before {
    background-image: url(../images/play.png) !important;
}