/**
 * Woo Gallery Manager Frontend Styles
 */

.wgm-gallery-active {
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* Forzar que el contenedor principal y el slider ocupen todo el ancho del padre (que el tema centra) */
.woocommerce-product-gallery, .wgm-splide {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    float: none !important;
}

.wgm-splide {
    margin-bottom: 20px;
    background-color: transparent;
}

.wgm-slide-image-wrapper {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.wgm-slide-image-wrapper img.wgm-main-image {
    width: 100%;
    height: auto;
    display: block;
    /* Ajuste para que ocupe todo el ancho disponible */
}

/* Flechas mejoradas para mayor visibilidad y toque premium */
.wgm-splide .splide__arrow {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #ddd;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    opacity: 0.8;
    transition: all 0.3s ease;
    width: 3em;
    height: 3em;
}

.wgm-splide .splide__arrow:hover {
    background: #fff;
    opacity: 1;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.wgm-splide .splide__arrow svg {
    fill: #333;
    width: 1.5em;
    height: 1.5em;
}

.wgm-splide .splide__arrow--prev {
    left: 10px;
}

.wgm-splide .splide__arrow--next {
    right: 10px;
}

/* Ajuste para dispositivos móviles */
@media screen and (max-width: 768px) {
    .wgm-splide .splide__arrow {
        width: 2.5em;
        height: 2.5em;
        top: 50%; /* Centramos en móvil si el diseño lo requiere */
    }
}

/* Forzar que no aparezcan dots bajo ninguna circunstancia */
.wgm-splide .splide__pagination {
    display: none !important;
}

/* Protecciones adicionales para dificultar la descarga de imágenes */
.woocommerce-product-gallery img {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none; /* iOS: evita el menú de guardar imagen al mantener pulsado */
    pointer-events: none !important; /* Bloqueo total de eventos en la imagen para evitar lightboxes en móvil */
}

.woocommerce-product-gallery a {
    cursor: default !important;
    pointer-events: none !important;
}