/* iOS/Safari resilience layer. It is intentionally loaded after theme component CSS. */
:root {
    --gk-ios-vh: 100vh;
}

html.gk-ios,
html.gk-ios body {
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
}

html.gk-ios #gkMobileSearch,
html.gk-ios .gk-mobile-search {
    height: var(--gk-ios-vh, 100vh) !important;
    max-height: var(--gk-ios-vh, 100vh) !important;
}

html.gk-ios .gk-story-global-overlay,
html.gk-ios .gk-story-overlay {
    max-height: var(--gk-ios-vh, 100vh);
}

/* Never keep real content invisible only because a third-party slider failed. */
.gk-story-rail-ready,
.gk-stories-swiper.gk-swiper-fallback,
.gk-swiper-instance.gk-swiper-fallback,
.gk-thumbs-swiper.gk-swiper-fallback {
    opacity: 1 !important;
    visibility: visible !important;
}

.gk-story-rail-ready + .gk-stories-skeleton,
.gk-stories-swiper.gk-swiper-fallback + .gk-stories-skeleton {
    display: none !important;
    opacity: 0 !important;
}

.gk-swiper-fallback {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 1px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    touch-action: pan-x pan-y;
}

.gk-swiper-fallback > .swiper-wrapper {
    display: flex !important;
    width: max-content !important;
    max-width: none !important;
    transform: none !important;
    transition: none !important;
}

.gk-swiper-fallback > .swiper-wrapper > .swiper-slide {
    flex: 0 0 86vw !important;
    width: 86vw !important;
    flex-basis: min(86vw, 360px) !important;
    width: min(86vw, 360px) !important;
    scroll-snap-align: start;
}

.gk-thumbs-swiper.gk-swiper-fallback > .swiper-wrapper > .swiper-slide,
.gk-stories-swiper.gk-swiper-fallback > .swiper-wrapper > .swiper-slide {
    flex-basis: auto !important;
    width: auto !important;
}

.gk-gallery-shell[data-loaded="true"] .gk-gallery-wrapper {
    opacity: 1 !important;
    visibility: visible !important;
}

.gk-gallery-shell[data-loaded="true"] .skel-overlay,
.gk-gallery-shell[data-loaded="true"] .skel-thumbs {
    display: none !important;
}

@supports not (height: 100dvh) {
    #gkMobileSearch,
    .gk-mobile-search,
    .gk-story-global-overlay,
    .gk-story-overlay {
        height: var(--gk-ios-vh, 100vh);
        max-height: var(--gk-ios-vh, 100vh);
    }
}


/* Keep native touch input available while Swiper is initializing on Safari. */
html.gk-ios-swiper-rescue .swiper,
html.gk-touch-swiper-rescue .swiper {
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

html.gk-ios-swiper-rescue .swiper.swiper-initialized,
html.gk-touch-swiper-rescue .swiper.swiper-initialized {
    touch-action: pan-y;
}

/* Runtime rescue uses inline styles too, because some Elementor widgets hide the
   rail with a dynamic #id selector that no reusable class selector can outrank. */
html.gk-swiper-runtime-pending .gk-swiper-instance.gk-swiper-fallback,
html.gk-swiper-runtime-pending .gk-stories-swiper.gk-swiper-fallback,
html.gk-swiper-runtime-pending .gk-thumbs-swiper.gk-swiper-fallback,
html.gk-swiper-runtime-pending .spd-swiper-container.gk-swiper-fallback {
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 1px !important;
}
