/* =========================================================================
   NVL COMPONENTS — cierre de la cadena de hojas de componentes

   Este archivo ya NO contiene los componentes: se repartieron por familia en
   nvl-elements, nvl-product-card, nvl-cart-summary, nvl-content y nvl-order
   (ver inc/assets.php, que declara la cadena de dependencias y con ella el
   orden de cascada).

   Conserva el handle 'nvl-components' porque es del que dependen todas las
   hojas de vista: así el reparto no obligó a tocar ninguna de ellas. Y
   conserva lo que DEBE ir al final de la cascada: las anulaciones de
   movimiento reducido, que solo funcionan si llegan después de las
   transiciones y animaciones que anulan.
   ========================================================================= */

/* --- Movimiento reducido -------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .nvl-button,
    .nvl-button--secondary,
    .nvl-product-card,
    .nvl-product-card__image,
    .nvl-product-card__link,
    .nvl-faq__item,
    .nvl-faq__question .nvl-icon,
    .nvl-cart-line__step,
    .nvl-cart-line__remove,
    .nvl-cart-launcher,
    .nvl-pay-option,
    .nvl-pay-option__title .nvl-icon,
    .nvl-add-control__step,
    .nvl-reward__node,
    .nvl-reward__disc,
    .nvl-cart-bar {
        transition: none;
    }

    /* El despliegue de la respuesta. Entrada propia porque el selector de arriba
       alcanza al <details> pero no a su pseudo-elemento. Sin transición,
       block-size salta de 0 a auto: el comportamiento que el acordeón tenía
       antes de animarse. */
    .nvl-faq__item::details-content {
        transition: none;
    }

    /* Aparece y desaparece de golpe, sin desplazamiento. La transición se anula
       AQUÍ y no solo en .nvl-cart-bar de arriba: desde el rediseño de la cápsula
       los tres estados ocultos declaran transición propia en nvl-base.css, y con
       más especificidad, así que un `transition: none` sobre la clase suelta no
       los alcanzaría. */
    .nvl-cart-bar.nvl-is-empty,
    .nvl-cart-toast.nvl-is-visible ~ .nvl-cart-bar,
    body.nvl-is-drawer-open .nvl-cart-bar {
        transform: none;
        transition: none;
    }

    /* El hover conserva el cambio de fondo y de sombra —son señales de estado,
       no movimiento— y pierde solo el levantamiento de 2px. Se anula por la
       variable y no con `transform: none` para no pisar el desplazamiento de
       salida, que viaja por la misma propiedad.
       La cifra del contador NO necesita gemela de cambio cero aquí: su animación
       en nvl-base.css ya es de cambio cero con steps(1), así que emite
       animationend igual y este bloque no la toca. */
    .nvl-cart-bar:hover {
        --nvl-bar-shift: 0px;
    }

    /* Mismo criterio en el pulsado: se anula SOLO el hundimiento de 1px. El
       cambio de sombra y el filo que se apaga se conservan, porque son señal de
       estado y no movimiento —y en táctil son el único acuse que hay—. */
    .nvl-cart-bar:active {
        --nvl-bar-shift: 0px;
    }

    .nvl-cart-bar__chip {
        transition: none;
    }

    .nvl-add-control__step:active .nvl-icon,
    .nvl-cart-line__step:active .nvl-icon,
    .nvl-cart-line__remove:active,
    /* Al botón del carrito se le quita el encogimiento y le queda el cambio de
       fondo, que es señal de estado y no movimiento. */
    .nvl-cart-launcher:active {
        transform: none;
    }

    .nvl-reward__phrase.nvl-is-flashing {
        animation: none;
    }

    .nvl-product-card:hover,
    .nvl-product-card:active,
    .nvl-button--primary:hover,
    .nvl-button--primary:active,
    .nvl-button--cta:hover,
    .nvl-button--cta:active,
    .nvl-button--secondary:hover,
    .nvl-button--secondary:active {
        transform: none;
    }

    .nvl-product-card:hover .nvl-product-card__image {
        transform: none;
    }

    /* El aviso del pedido entra con nvl-reveal desde C3 (antes lo hacía dentro
       de su caja); aquí aparece de golpe, como el resto de los bloques que el
       JS revela. */
    .nvl-cart-adjusted[data-kind] {
        animation: none;
    }

    /* CONTRATO CON nvl-cart.js: el JS retira .nvl-is-just-won del hito recién
       conseguido escuchando `animationend`. `animation: none` no dispara ese
       evento nunca y la clase se quedaría pegada al disco, que seguiría
       anunciándose como recién ganado en cada render. La corrección es de CSS,
       igual que la del contador: una gemela de cambio cero que SÍ termina y SÍ
       emite el evento. NO TOCAR nvl-cart.js para este caso. */
    @keyframes nvl-reward-won-hold {
        from { transform: none; }
        to   { transform: none; }
    }

    .nvl-reward__node.nvl-is-just-won .nvl-reward__disc {
        animation: nvl-reward-won-hold var(--nvl-duration-slow) steps(1) both;
    }

    /* Contrato con nvl-cart.js: el JS retira la clase de confirmación
       escuchando `animationend`. `animation: none` nunca dispara ese evento y
       la clase se quedaría pegada al contador. La corrección es de CSS: una
       animación de cambio cero que sí termina y sí emite el evento.
       NO TOCAR nvl-cart.js para este caso. */
    @keyframes nvl-bumped-hold {
        from { background: var(--nvl-color-primary-dark); }
        to   { background: var(--nvl-color-primary-dark); }
    }

    .nvl-cart-launcher__count.nvl-is-bumped {
        animation: nvl-bumped-hold var(--nvl-duration-slower) steps(1) both;
    }

    /* Mismo contrato para el aviso de agregado: `animation: none` lo dejaría
       clavado en pantalla para siempre, porque la animación ES su temporizador
       y su final es lo que lo retira. Gemela de cambio cero, misma duración
       total: aparece y desaparece de golpe, sin desplazamiento. */
    @keyframes nvl-toast-life-hold {
        from { opacity: 1; transform: none; }
        to   { opacity: 1; transform: none; }
    }

    .nvl-cart-toast.nvl-is-visible {
        animation: nvl-toast-life-hold
            calc(var(--nvl-duration-slow) + var(--nvl-duration-notice) + var(--nvl-duration-base))
            steps(1) both;
    }


}