/* ============================================
   Product Gallery Lightbox
   Custom lightbox for WooCommerce product gallery
   ============================================ */

/* Overlay */
.sika-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0, 0, 0, 0.92);
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.sika-lightbox.is-open {
    display: flex;
    opacity: 0;
}

.sika-lightbox.is-visible {
    opacity: 1;
}

/* Inner wrapper */
.sika-lightbox__inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 40px 48px;
    box-sizing: border-box;
}

/* Image */
.sika-lightbox__img {
    display: block;
    max-width: calc(100vw - 96px);
    max-height: calc(100vh - 80px);
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 2px;
    opacity: 0;
    transform: scale(0.96);
    transition: opacity 0.2s ease, transform 0.2s ease;
    user-select: none;
    -webkit-user-drag: none;
}

.sika-lightbox__img.is-loaded {
    opacity: 1;
    transform: scale(1);
}

/* Close button */
.sika-lightbox__close {
    position: fixed;
    top: 20px;
    right: 24px;
    width: 44px;
    height: 44px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, transform 0.15s ease;
    z-index: 1;
    padding: 0;
}

.sika-lightbox__close:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: scale(1.08);
}

.sika-lightbox__close svg {
    width: 18px;
    height: 18px;
    stroke: #fff;
    stroke-width: 2;
    fill: none;
    display: block;
}

/* Navigation arrows */
.sika-lightbox__prev,
.sika-lightbox__next {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 52px;
    height: 52px;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, transform 0.15s ease;
    z-index: 1;
    padding: 0;
}

.sika-lightbox__prev {
    left: 20px;
}

.sika-lightbox__next {
    right: 20px;
}

.sika-lightbox__prev:hover,
.sika-lightbox__next:hover {
    background: rgba(255, 255, 255, 0.22);
}

.sika-lightbox__prev:hover {
    transform: translateY(-50%) translateX(-2px);
}

.sika-lightbox__next:hover {
    transform: translateY(-50%) translateX(2px);
}

.sika-lightbox__prev svg,
.sika-lightbox__next svg {
    width: 20px;
    height: 20px;
    stroke: #fff;
    stroke-width: 2;
    fill: none;
    display: block;
}

/* Hide arrows when only one image */
.sika-lightbox.single-image .sika-lightbox__prev,
.sika-lightbox.single-image .sika-lightbox__next {
    display: none;
}

/* Counter */
.sika-lightbox__counter {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.6);
    font-size: 13px;
    font-family: inherit;
    letter-spacing: 0.05em;
    user-select: none;
}

/* Clickable gallery images cursor */
.woocommerce-product-gallery .woocommerce-product-gallery__image a {
    cursor: zoom-in;
}

/* Zoom trigger cursor */
.woocommerce-product-gallery__trigger {
    cursor: zoom-in;
}

/* Mobile adjustments */
@media (max-width: 600px) {
    .sika-lightbox__inner {
        padding: 56px 16px 40px;
    }

    .sika-lightbox__prev {
        left: 8px;
    }

    .sika-lightbox__next {
        right: 8px;
    }

    .sika-lightbox__prev,
    .sika-lightbox__next {
        width: 40px;
        height: 40px;
    }

    .sika-lightbox__close {
        top: 14px;
        right: 14px;
        width: 38px;
        height: 38px;
    }
}

/* ============================================
   Product gallery – injected overlay controls
   ============================================ */

/* Shared base */
.sika-gallery__zoom,
.sika-gallery__prev,
.sika-gallery__next {
    position: absolute;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    transition: opacity 0.2s ease, background 0.15s ease;
}

.sika-gallery__zoom svg,
.sika-gallery__prev svg,
.sika-gallery__next svg {
    display: block;
    stroke: #fff;
    fill: none;
}

/* Zoom button – top-right corner */
.sika-gallery__zoom {
    top: 12px;
    right: 12px;
    width: 44px;
    height: 44px;
    opacity: 0;
}

.sika-gallery__zoom svg { width: 18px; height: 18px; stroke-width: 2; }
.sika-gallery__zoom:hover { background: rgba(0, 0, 0, 0.6); }

/* Prev/Next arrows */
.sika-gallery__prev,
.sika-gallery__next {
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    opacity: 0;
}

.sika-gallery__prev svg,
.sika-gallery__next svg { width: 20px; height: 20px; stroke-width: 2; }

.sika-gallery__prev { left: 12px; }
.sika-gallery__next { right: 12px; }

.sika-gallery__prev:hover,
.sika-gallery__next:hover { background: rgba(0, 0, 0, 0.6); }

/* Reveal all three on gallery hover */
.woocommerce-product-gallery:hover .sika-gallery__zoom,
.woocommerce-product-gallery:hover .sika-gallery__prev,
.woocommerce-product-gallery:hover .sika-gallery__next {
    opacity: 1;
}
