/*
 * ROKN Product Hero — source-native art-directed display.
 *
 * 1.3.24 rule:
 * - Desktop / Tablet / Mobile already have separately prepared source images.
 * - The source image defines the visible Hero ratio; Product Engine must not add
 *   a fixed-height frame, black bars, ambient fill, blur, shadow or extra canvas.
 * - Product pixels are never cropped or transformed. The source is rendered with
 *   `contain` inside its own aspect ratio, so the full image remains visible.
 * - Presentation-only: source files and product meta are untouched.
 */
body.single-rokn_product .rokn-pe-hero-fit-widget {
    --container-widget-width: 100% !important;
    --container-widget-flex-grow: 1 !important;
    width: 100% !important;
    max-width: none !important;
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    align-self: stretch !important;
    position: relative !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: var(--rokn-pe-hero-aspect, auto) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

/* Old ambient/frame nodes from a cached DOM must never create visible padding. */
body.single-rokn_product .rokn-pe-hero-fit-widget .rokn-pe-hero-ambient-layer,
body.single-rokn_product .rokn-pe-hero-fit-widget .rokn-pe-hero-ambient-veil {
    display: none !important;
}

body.single-rokn_product .rokn-pe-hero-fit-widget > .elementor-widget-container,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery__content,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-swiper,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-gallery-swiper-slider,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery-slider,
body.single-rokn_product .rokn-pe-hero-fit-widget .swiper-wrapper,
body.single-rokn_product .rokn-pe-hero-fit-widget .swiper-slide,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery__image,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery__image-link,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-woo-product-gallery__image-item,
body.single-rokn_product .rokn-pe-hero-fit-widget figure,
body.single-rokn_product .rokn-pe-hero-fit-widget .elementor-image,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-listing-dynamic-image,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-listing-dynamic-image__link {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: hidden !important;
}

body.single-rokn_product img.rokn-pe-hero-fit-image,
body.single-rokn_product .rokn-pe-hero-fit-widget .jet-listing-dynamic-image__img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    object-fit: contain !important;
    object-position: var(--rokn-pe-hero-position, 50% 50%) !important;
    aspect-ratio: auto !important;
    position: relative;
    z-index: 1;
}

/* If the image is rendered without a stable gallery/widget wrapper, preserve the
 * source itself rather than manufacturing a surrounding frame. */
body.single-rokn_product img.rokn-pe-hero-fit-image[data-rokn-hero-standalone="1"] {
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
}

/* 1.4.0 — ordered multi-Hero collection. No source pixels are cropped or resized. */
body.single-rokn_product .rokn-pe-hero-has-carousel > .rokn-pe-hero-original-content {
    display: none !important;
}
body.single-rokn_product .rokn-pe-hero-carousel {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: var(--rokn-pe-hero-aspect, auto) !important;
    overflow: hidden !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    outline: none;
}
body.single-rokn_product .rokn-pe-hero-carousel__track,
body.single-rokn_product .rokn-pe-hero-carousel__slide {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.single-rokn_product .rokn-pe-hero-carousel__slide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0,0,0) scale(1.012);
    transition: opacity .38s cubic-bezier(.22,.61,.36,1), transform .5s cubic-bezier(.22,.61,.36,1), visibility 0s linear .5s;
    will-change: opacity,transform;
}
body.single-rokn_product .rokn-pe-hero-carousel[data-rokn-slide-direction="next"] .rokn-pe-hero-carousel__slide:not(.is-active) {
    transform: translate3d(14px,0,0) scale(1.012);
}
body.single-rokn_product .rokn-pe-hero-carousel[data-rokn-slide-direction="prev"] .rokn-pe-hero-carousel__slide:not(.is-active) {
    transform: translate3d(-14px,0,0) scale(1.012);
}
body.single-rokn_product .rokn-pe-hero-carousel__slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0,0,0) scale(1);
    transition-delay: 0s;
}
body.single-rokn_product .rokn-pe-hero-carousel__image {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: var(--rokn-pe-hero-position, 50% 50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
body.single-rokn_product .rokn-pe-hero-carousel__nav {
    position: absolute;
    top: 50%;
    z-index: 4;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    font-size: 30px;
    line-height: 1;
    background: rgba(0,0,0,.48);
    color: #fff;
    transition: background .18s ease, transform .18s ease, border-color .18s ease;
}
body.single-rokn_product .rokn-pe-hero-carousel__nav:hover,
body.single-rokn_product .rokn-pe-hero-carousel__nav:focus-visible {
    background: rgba(244,122,32,.92);
    outline: 2px solid rgba(255,255,255,.92);
    outline-offset: 2px;
    transform: translateY(-50%) scale(1.055);
}
body.single-rokn_product .rokn-pe-hero-carousel__prev { right: 14px; }
body.single-rokn_product .rokn-pe-hero-carousel__next { left: 14px; }
body.single-rokn_product .rokn-pe-hero-carousel__dots {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    display: flex;
    gap: 7px;
}
body.single-rokn_product .rokn-pe-hero-carousel__dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 999px;
    background: rgba(0,0,0,.35);
    cursor: pointer;
}
body.single-rokn_product .rokn-pe-hero-carousel__dot.is-active { background: #fff; }
@media (max-width: 767px) {
    body.single-rokn_product .rokn-pe-hero-carousel__nav { width: 36px; height: 36px; font-size: 25px; }
    body.single-rokn_product .rokn-pe-hero-carousel__prev { right: 8px; }
    body.single-rokn_product .rokn-pe-hero-carousel__next { left: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    body.single-rokn_product .rokn-pe-hero-carousel__slide { transition: none; transform:none!important; }
    body.single-rokn_product .rokn-pe-hero-carousel__nav { transition:none; }
}
/* 1.7.2: physical SVG chevrons are immune to RTL Unicode mirroring. */
body.single-rokn_product .rokn-pe-hero-carousel__nav{direction:ltr;display:flex;align-items:center;justify-content:center}
body.single-rokn_product .rokn-pe-hero-carousel__nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
