/* Selector de forma (Básico/Rinconero/Chestlong, etc.) del PDP.
   El widget HTML embebido en Elementor está duplicado en cada producto
   con su propio <style>, así que sobreescribimos aquí en un único sitio
   con !important en vez de editar cada uno por separado. */

.numma-config-selector {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(8px, 1.5vw, 16px) !important;
    width: 100% !important;
}

.numma-config-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    aspect-ratio: 1 / 1 !important;
    padding: clamp(6px, 1.2vw, 14px) !important;
    border-width: 1px !important;
}

/* Tamaño relativo a la propia tarjeta (no al viewport), para que la
   imagen siempre ocupe la mayor parte del cuadro a cualquier tamaño. */
.numma-config-card img {
    width: 76% !important;
    max-width: none !important;
    height: auto !important;
    margin-bottom: 6% !important;
}

.numma-config-label {
    font-size: clamp(12px, 1.3vw, 15px) !important;
    line-height: 1.15 !important;
}

.numma-config-card:hover {
    transform: none !important;
}

/* El contenedor de Elementor que envuelve el selector deja demasiado
   espacio antes de la siguiente sección (Módulos extra, etc.). */
.elementor-widget-html:has(> .numma-config-selector) {
    margin-bottom: 0 !important;
}

.elementor-widget-html:has(> .numma-config-selector),
.elementor-widget-html:has(> .numma-config-selector) .elementor-widget-container {
    padding-bottom: 0 !important;
}

/* El hueco grande no es margen, es el "gap" real del contenedor flex de
   Elementor que agrupa título+precio / selector de forma / formulario de
   variaciones (confirmado con el inspector de gaps de Chrome DevTools).
   Un margen no lo puede compensar: hay que bajar el gap del contenedor. */
.elementor-element-580dd4e.e-con {
    gap: 0px !important;
    row-gap: 0px !important;
}

.woocommerce-variation-price {
    margin-top: 0 !important;
}