/* Contenedor de Imágenes de Producto - Responsive */
.product-image-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(250px, 90%, 290px) !important;
    aspect-ratio: 3 / 4;
    background-color: transparent !important;
    overflow: hidden !important;
    margin-inline: auto;
}

.product-image-container .wc-block-components-product-image {
    width: 100% !important;
    height: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(0.625rem, 2vw, 1rem) !important;
}

.product-image-container .wc-block-components-product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.woocommerce-loop-product__title,
.price {
    font-size: clamp(0.875rem, 2vw, 1rem);
    text-align: center;
}

/* Mobile */
@media (max-width: 480px) {
    .product-image-container {
        width: 95% !important;
    }
}

/* Tablet */
@media (min-width: 768px) {
    .product-image-container {
        width: clamp(280px, 45%, 350px) !important;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    .product-image-container {
        width: clamp(290px, 30%, 400px) !important;
    }
}


/* Selectores de Cantidad y Botones de Compra - Responsive */
.quantity-selector {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    background-color: #fff;
    border: 2px solid #000;
    border-radius: clamp(0.25rem, 1vw, 0.375rem);
    padding: clamp(0.25rem, 1vw, 0.5rem);
    margin-bottom: clamp(0.75rem, 2vw, 1rem);
    max-width: clamp(150px, 50%, 200px);
    margin-inline: auto;
}

.quantity-selector .minus,
.quantity-selector .plus {
    background-color: #fff;
    border: none;
    font-size: clamp(1rem, 2.5vw, 1.125rem);
    padding-inline: clamp(0.5rem, 2vw, 0.75rem);
    cursor: pointer;
    width: clamp(1.75rem, 5vw, 2.25rem);
    height: clamp(2rem, 5vw, 2.5rem);
    text-align: center;
    line-height: 1.2;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    border-radius: clamp(0.125rem, 0.5vw, 0.25rem);
    -webkit-transition: background-color 0.2s ease;
    transition: background-color 0.2s ease;
}

.quantity-selector .minus:hover,
.quantity-selector .plus:hover {
    background-color: #f5f5f5;
}

.quantity-selector .quantity {
    width: clamp(2.5rem, 10vw, 3.5rem);
    text-align: center;
    font-size: clamp(0.875rem, 2vw, 1rem);
    border: none;
    height: clamp(1.75rem, 4vw, 2rem);
    margin: 0;
    font-weight: bold;
    background-color: #fff;
}

.add_to_cart_button_ajax,
.buy_now_button_ajax {
    display: block;
    padding: clamp(0.625rem, 2vw, 0.75rem) 0;
    font-size: clamp(0.875rem, 2.5vw, 1.125rem);
    text-align: center;
    text-decoration: none;
    width: 100%;
    max-width: clamp(280px, 90%, 400px);
    margin-inline: auto;
    border-radius: clamp(0.375rem, 1.5vw, 0.5rem);
    font-weight: bold;
    cursor: pointer;
    -webkit-transition: transform 0.2s ease, box-shadow 0.2s ease;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.add_to_cart_button_ajax {
    background-color: #000;
    color: #fff;
    margin-bottom: clamp(1rem, 3vw, 1.25rem);
    border: 2px solid #fff;
}

.buy_now_button_ajax {
    background-color: #fff;
    color: #000;
    margin-bottom: clamp(0.5rem, 2vw, 0.75rem);
    border: 2px solid #000;
}

.add_to_cart_button_ajax:hover,
.buy_now_button_ajax:hover {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Selectores de Variaciones - Responsive */
.product-variations-dropdowns {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(0.75rem, 2vw, 1rem);
    margin-bottom: clamp(0.75rem, 2vw, 1rem);
    justify-content: center;
}

.variation-dropdown {
    text-align: center;
    flex: 1 1 clamp(120px, 40%, 200px);
    min-width: 120px;
}

.variation-dropdown label {
    display: block;
    font-size: clamp(0.75rem, 2vw, 0.875rem);
    font-weight: bold;
    margin-bottom: clamp(0.25rem, 1vw, 0.375rem);
    color: #fff;
}

.variation-select {
    background-color: #000;
    color: #fff;
    font-size: clamp(0.875rem, 2vw, 1rem);
    padding: clamp(0.5rem, 2vw, 0.75rem);
    border: 2px solid #fff;
    border-radius: clamp(0.5rem, 1.5vw, 0.625rem);
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-align: center;
    cursor: pointer;
    -webkit-transition: background-color 0.2s ease;
    transition: background-color 0.2s ease;
}

.variation-select:hover {
    background-color: #222;
}

.variation-select option {
    background-color: #000;
    color: #fff;
}

/* Galería de Imágenes de Productos - Responsive */
.wc-block-components-product-image {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #f5f5f5;
    padding: clamp(1rem, 3vw, 1.5rem);
    border-radius: clamp(0.375rem, 1.5vw, 0.5rem);
    max-width: clamp(300px, 90%, 500px);
    margin-inline: auto;
}

.wc-block-components-product-image img {
    width: 100%;
    height: auto;
    border-radius: clamp(0.375rem, 1.5vw, 0.5rem);
    border: 2px solid #000;
}

.galeria-productos .woocommerce-product-gallery {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    border-radius: clamp(0.375rem, 1.5vw, 0.5rem) !important;
}

.galeria-productos .woocommerce-product-gallery__image img {
    border-radius: clamp(0.375rem, 1.5vw, 0.5rem) !important;
}

.galeria-productos .flex-control-nav.flex-control-thumbs {
    display: flex !important;
    gap: clamp(0.5rem, 2vw, 0.75rem) !important;
    margin-top: clamp(0.5rem, 2vw, 0.75rem) !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.galeria-productos .flex-control-nav.flex-control-thumbs img {
    border: 2px solid transparent !important;
    border-radius: clamp(0.25rem, 1vw, 0.375rem) !important;
    cursor: pointer !important;
    -webkit-transition: border-color 0.3s ease, transform 0.2s ease !important;
    transition: border-color 0.3s ease, transform 0.2s ease !important;
    max-width: clamp(50px, 15vw, 80px) !important;
}

.galeria-productos .flex-control-nav.flex-control-thumbs img:hover {
    -webkit-transform: scale(1.05) !important;
    transform: scale(1.05) !important;
    border-color: #000 !important;
}

/* Botón del carrito dentro del bloque */
.wc-block-components-button.wc-block-cart__submit-button.contained {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: none !important;
    padding: clamp(0.625rem, 2vw, 0.875rem) clamp(1rem, 3vw, 1.5rem) !important;
    font-size: clamp(0.875rem, 2vw, 1rem) !important;
    border-radius: clamp(0.25rem, 1vw, 0.375rem) !important;
}
