/* =========================================================================
 *  BUYACÁ v8.8.10 — REFINAMIENTO FINAL TEMU / PINTEREST HÍBRIDO
 *  -----------------------------------------------------------------------
 *  Append-only sobre v8.8.9. Sólo override quirúrgico (mayor especificidad +
 *  !important donde es necesario). No modifica reglas previas.
 * ========================================================================= */

.buyaca-app {
    /* Tokens v8.8.10 — paleta Temu/Pinterest */
    --bq810-radius-card: 14px;
    --bq810-radius-pill: 999px;
    --bq810-shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.04);
    --bq810-shadow-hover: 0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
    --bq810-shadow-pop: 0 12px 32px rgba(15, 23, 42, 0.10), 0 4px 8px rgba(15, 23, 42, 0.04);
    --bq810-shadow-feat: 0 6px 18px rgba(255, 184, 0, 0.16), 0 2px 4px rgba(58, 89, 239, 0.06);
    --bq810-dur: 220ms;
    --bq810-dur-slow: 320ms;
    --bq810-ease: cubic-bezier(.2, .8, .2, 1);
    --bq810-gold: #FFB800;
    --bq810-gold-soft: #FFD54A;
    --bq810-gold-deep: #B8860B;
    --bq810-primary: var(--bq-primary, #3A59EF);
}

.buyaca-app:not(.bq-light-mode) {
    --bq810-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.20), 0 1px 3px rgba(0, 0, 0, 0.20);
    --bq810-shadow-hover: 0 8px 24px rgba(0, 0, 0, 0.30), 0 2px 6px rgba(0, 0, 0, 0.18);
    --bq810-shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.36), 0 4px 8px rgba(0, 0, 0, 0.20);
}

/* =========================================================================
 *  1. RESTAURACIÓN DEL TOGGLE DE GRID (X3 / X2 / LIST / GRIDAUTO)
 *  -----------------------------------------------------------------------
 *  v8.8.8 forzaba `bq-view-masonry` en TODOS los grids del catálogo, lo
 *  que pisaba con !important las clases explícitas (bq-view-grid2, grid3,
 *  gridauto, list). Resultado: el toggle del usuario era ignorado.
 *
 *  v8.8.10 crea una EXCLUSIÓN: cuando el grid tiene cualquier clase
 *  explícita, las reglas masonry no aplican. Si el grid no tiene ninguna
 *  (caso home/búsqueda donde no hay toggle), masonry queda como fallback
 *  responsive estilo Pinterest sólo en móvil.
 *
 *  Nota: el JS además REMUEVE la clase `bq-view-masonry` cuando coexiste
 *  con una clase explícita, como defensa adicional.
 * ========================================================================= */

/* Cuando el usuario eligió bq-view-grid2 / grid3 / gridauto / list, eso manda */
.buyaca-app .bq-cv2-product-grid.bq-view-grid2,
.buyaca-app .bq-cv2-product-grid.bq-view-grid3,
.buyaca-app .bq-cv2-product-grid.bq-view-gridauto,
.buyaca-app .bq-cv2-product-grid.bq-view-list {
    /* Reseteamos cualquier rastro de masonry que pudiera filtrarse */
    column-count: initial !important;
    column-gap: initial !important;
}

/* GRID2 — siempre 2 columnas, ignora masonry */
.buyaca-app .bq-cv2-product-grid.bq-view-grid2.bq-view-masonry,
.buyaca-app .bq-cv2-product-grid.bq-view-grid2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-count: initial !important;
    gap: 3px !important;
}

@media (min-width: 640px) {
    .buyaca-app .bq-cv2-product-grid.bq-view-grid2 {
        gap: 14px !important;
        padding: 12px !important;
    }
}

/* GRID3 — 3 columnas EN MÓVIL TAMBIÉN (fix principal del bug del usuario).
 *         Esto reestablece el comportamiento previo: cuando el usuario hace
 *         click en el toggle "X3" en su móvil, ve 3 columnas. */
.buyaca-app .bq-cv2-product-grid.bq-view-grid3.bq-view-masonry,
.buyaca-app .bq-cv2-product-grid.bq-view-grid3 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-count: initial !important;
    gap: 2px !important;
    padding: 0 !important;
}

@media (min-width: 640px) {
    .buyaca-app .bq-cv2-product-grid.bq-view-grid3 {
        gap: 12px !important;
        padding: 12px !important;
    }
}

/* En grid3 las imágenes deben mantener aspect-ratio fijo (no masonry) */
.buyaca-app .bq-cv2-product-grid.bq-view-grid3 .bq-cv2-product-img,
.buyaca-app .bq-cv2-product-grid.bq-view-grid2 .bq-cv2-product-img {
    aspect-ratio: 1 !important;
    height: auto !important;
}

.buyaca-app .bq-cv2-product-grid.bq-view-grid3 .bq-cv2-product-img img,
.buyaca-app .bq-cv2-product-grid.bq-view-grid2 .bq-cv2-product-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Cards en grid3/grid2: NO display:inline-block (eso es de masonry) */
.buyaca-app .bq-cv2-product-grid.bq-view-grid3>*,
.buyaca-app .bq-cv2-product-grid.bq-view-grid2>* {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    break-inside: initial !important;
    page-break-inside: initial !important;
    -webkit-column-break-inside: initial !important;
    vertical-align: initial !important;
}

/* GRIDAUTO — responsive 3/4/5 columnas, ignora masonry */
.buyaca-app .bq-cv2-product-grid.bq-view-gridauto.bq-view-masonry,
.buyaca-app .bq-cv2-product-grid.bq-view-gridauto {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-count: initial !important;
    gap: 12px !important;
    padding: 12px !important;
}

@media (min-width: 1024px) {
    .buyaca-app .bq-cv2-product-grid.bq-view-gridauto {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }
}

@media (min-width: 1440px) {
    .buyaca-app .bq-cv2-product-grid.bq-view-gridauto {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

.buyaca-app .bq-cv2-product-grid.bq-view-gridauto>* {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    break-inside: initial !important;
}

/* LIST — vista lista vertical, ignora masonry COMPLETAMENTE */
.buyaca-app .bq-cv2-product-grid.bq-view-list.bq-view-masonry,
.buyaca-app .bq-cv2-product-grid.bq-view-list {
    display: flex !important;
    flex-direction: column !important;
    column-count: initial !important;
    column-gap: initial !important;
    gap: 8px !important;
    padding: 8px !important;
    grid-template-columns: none !important;
}

.buyaca-app .bq-cv2-product-grid.bq-view-list .bq-cv2-product-card {
    display: grid !important;
    grid-template-columns: 110px 1fr !important;
    width: auto !important;
    margin: 0 !important;
    break-inside: initial !important;
    page-break-inside: initial !important;
    -webkit-column-break-inside: initial !important;
}

@media (min-width: 640px) {
    .buyaca-app .bq-cv2-product-grid.bq-view-list .bq-cv2-product-card {
        grid-template-columns: 160px 1fr !important;
    }
}

.buyaca-app .bq-cv2-product-grid.bq-view-list .bq-cv2-product-img {
    aspect-ratio: 1 !important;
    height: auto !important;
}

.buyaca-app .bq-cv2-product-grid.bq-view-list .bq-cv2-product-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* =========================================================================
 *  2. ESTRELLAS — limpieza FINAL: sólido amarillo, sin stroke, sin contorno
 *  -----------------------------------------------------------------------
 *  v8.8.9 ya intentaba esto pero estilos inline persistían en algunos
 *  templates. v8.8.10 refuerza con selectores extremadamente específicos
 *  + el JS limpia los atributos `stroke` inline retroactivamente.
 * ========================================================================= */



.buyaca-app .bq-feat-tag svg,
.buyaca-app .bq-feat-mini-badge svg,
.buyaca-app .bq-featured-v2-star-badge svg,
.buyaca-app .bq-featured-v2-stars svg,
.buyaca-app .bq-feat-tag svg polygon,
.buyaca-app .bq-feat-mini-badge svg polygon,
.buyaca-app .bq-featured-v2-star-badge svg polygon,
.buyaca-app .bq-featured-v2-stars svg polygon,
.buyaca-app .bq-feat-tag svg path,
.buyaca-app .bq-featured-v2-star-badge svg path {
    fill: var(--bq810-gold) !important;
    stroke: none !important;
    stroke-width: 0 !important;
    filter: none !important;
}

/* Estado estático (.bq-feat-tag SIN href): chip transparente con estrella sólida */
.buyaca-app span.bq-feat-tag {
    background: transparent !important;
    border: none !important;

    padding: 2px 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-weight: 700 !important;
    color: var(--bq810-gold-deep) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    font-size: 10.5px !important;
}

/* Asegurar alineación vertical perfecta de la estrella con el texto */
.buyaca-app .bq-feat-tag svg,
.buyaca-app .bq-featured-v2-star-badge svg,
.buyaca-app .bq-feat-mini-badge svg {
    display: inline-block !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
}

/* Star badge en cards destacadas (top-right): círculo dorado sutil */
.buyaca-app .bq-featured-v2-star-badge {
    background: rgba(255, 184, 0, 0.95) !important;
    border: none !important;
    border-radius: 999px !important;
    width: 26px !important;
    height: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    backdrop-filter: blur(6px);
}

.buyaca-app .bq-featured-v2-star-badge svg {
    width: 13px !important;
    height: 13px !important;
}

.buyaca-app .bq-featured-v2-star-badge svg polygon,
.buyaca-app .bq-featured-v2-star-badge svg path {
    fill: #FFFFFF !important;
}

/* =========================================================================
 *  3. BADGE "DESTACAR NEGOCIO" — pill moderno tipo Temu integrado
 *  -----------------------------------------------------------------------
 *  Estado de acción: <a class="bq-feat-tag" href="...?tab=plans">Destacar</a>
 *  Lo transformamos en un pill elegante con gradiente dorado sutil,
 *  microinteracción al hover (lift + glow) y consistencia visual.
 * ========================================================================= */

.buyaca-app a.bq-feat-tag,
.buyaca-app .bq-feat-tag[href] {
    /* Reset de todo lo inline anterior */
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.16), rgba(255, 165, 0, 0.06)) !important;
    border: 1px solid rgba(255, 195, 0, 0.32) !important;
    border-radius: var(--bq810-radius-pill) !important;
    padding: 6px 12px !important;
    color: var(--bq810-gold-deep) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;

    backdrop-filter: blur(4px);
    transition: transform var(--bq810-dur) var(--bq810-ease),
        border-color var(--bq810-dur) var(--bq810-ease),
        box-shadow var(--bq810-dur) var(--bq810-ease),
        color var(--bq810-dur) var(--bq810-ease) !important;
    will-change: transform;
}

.buyaca-app a.bq-feat-tag::before,
.buyaca-app .bq-feat-tag[href]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 0%,
            rgba(255, 215, 0, 0.45) 0%,
            rgba(255, 215, 0, 0) 70%);
    opacity: 0;
    transition: opacity var(--bq810-dur-slow) var(--bq810-ease);
    pointer-events: none;
}

.buyaca-app a.bq-feat-tag:hover,
.buyaca-app .bq-feat-tag[href]:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 195, 0, 0.65) !important;

    color: #8B6508 !important;
}

.buyaca-app a.bq-feat-tag:hover::before,
.buyaca-app .bq-feat-tag[href]:hover::before {
    opacity: 1;
}

.buyaca-app a.bq-feat-tag:active,
.buyaca-app .bq-feat-tag[href]:active {
    transform: translateY(0);

}

/* Tema oscuro para badge de acción */
.buyaca-app:not(.bq-light-mode) a.bq-feat-tag,
.buyaca-app:not(.bq-light-mode) .bq-feat-tag[href] {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.12), rgba(255, 165, 0, 0.04)) !important;
    border-color: rgba(255, 195, 0, 0.28) !important;
    color: var(--bq810-gold-soft) !important;
}

.buyaca-app:not(.bq-light-mode) a.bq-feat-tag:hover,
.buyaca-app:not(.bq-light-mode) .bq-feat-tag[href]:hover {
    color: #FFD700 !important;
    border-color: rgba(255, 215, 0, 0.55) !important;
}

/* =========================================================================
 *  4. CARRUSEL "Locales Pautados" — placeholder mejorado + estabilidad
 *  -----------------------------------------------------------------------
 *  v8.8.9 sólo mostraba placeholder si la URL tenía params de filtro. En
 *  la home los filtros son in-memory de Alpine (no van a la URL). v8.8.10
 *  detecta filtro activo vía Alpine state y muestra el placeholder
 *  cuando corresponde.
 * ========================================================================= */

.buyaca-app .bq-destacados-section {
    contain: layout style;
    transition: opacity var(--bq810-dur) var(--bq810-ease),
        min-height var(--bq810-dur) var(--bq810-ease);
}

.buyaca-app .bq-featured-empty-v889,
.buyaca-app .bq-featured-empty-v8810 {
    /* Estilo unificado para los dos placeholders (compatibilidad con v8.8.9) */
    display: none;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin: 8px 16px 16px;
    padding: 22px 24px;
    border-radius: var(--bq810-radius-card);
    background: linear-gradient(135deg, rgba(58, 89, 239, 0.04), rgba(255, 184, 0, 0.02));
    border: 1px dashed rgba(58, 89, 239, 0.20);
    color: var(--bq-text-secondary, #6B7280);
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
    flex-wrap: wrap;
    animation: bq810FadeInUp .35s var(--bq810-ease) both;
}

.buyaca-app .bq-featured-empty-v889.is-visible,
.buyaca-app .bq-featured-empty-v8810.is-visible {
    display: flex;
}

.buyaca-app .bq-featured-empty-v889 svg,
.buyaca-app .bq-featured-empty-v8810 svg {
    flex-shrink: 0;
    color: var(--bq810-primary);
    opacity: 0.7;
}

.buyaca-app .bq-featured-empty-v889 strong,
.buyaca-app .bq-featured-empty-v8810 strong {
    color: var(--bq-text-primary, #0f172a);
    font-weight: 800;
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
    letter-spacing: -0.01em;
}

.buyaca-app .bq-featured-empty-v889 .bq89-empty-text,
.buyaca-app .bq-featured-empty-v8810 .bq810-empty-text {
    text-align: left;
    flex: 1 1 220px;
    min-width: 0;
}

.buyaca-app:not(.bq-light-mode) .bq-featured-empty-v889,
.buyaca-app:not(.bq-light-mode) .bq-featured-empty-v8810 {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
    border-color: rgba(255, 255, 255, 0.10);
}

@keyframes bq810FadeInUp {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Estabilidad de altura del scroll */
.buyaca-app .bq-featured-scroll[data-bq89-stable="1"],
.buyaca-app .bq-featured-scroll[data-bq810-stable="1"] {
    min-height: 280px;
}

/* =========================================================================
 *  5. CARDS — sombras suaves, hover lift, microinteracción Temu
 * ========================================================================= */

.buyaca-app .bq-cv2-product-card,
.buyaca-app .bq-pc-card,
.buyaca-app .bq-product-card,
.buyaca-app .bq-profile-card {
    border-radius: 3px !important;

    transition: transform var(--bq810-dur) var(--bq810-ease),
        box-shadow var(--bq810-dur) var(--bq810-ease),
        border-color var(--bq810-dur) var(--bq810-ease) !important;
    will-change: transform;
}

.buyaca-app .bq-cv2-product-card:hover,
.buyaca-app .bq-pc-card:hover,
.buyaca-app .bq-product-card:hover,
.buyaca-app .bq-profile-card:hover {
    transform: translateY(-3px) !important;

    border-color: var(--bq810-primary) !important;
}

.buyaca-app .bq-featured-card-v2 {
    border-radius: var(--bq810-radius-card) !important;

    transition: transform var(--bq810-dur-slow) var(--bq810-ease),
        box-shadow var(--bq810-dur-slow) var(--bq810-ease) !important;
}

.buyaca-app .bq-featured-card-v2:hover {
    transform: translateY(-2px) scale(1.005) !important;

}

/* Imagen de card: aspect-ratio reservado para evitar CLS */
.buyaca-app .bq-cv2-product-img {
    aspect-ratio: 1;
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
    overflow: hidden;
}

.buyaca-app:not(.bq-light-mode) .bq-cv2-product-img {
    background: linear-gradient(135deg, #1e1e26, #14141a);
}

.buyaca-app .bq-cv2-product-img img {
    transition: transform var(--bq810-dur-slow) var(--bq810-ease);
    will-change: transform;
}

.buyaca-app .bq-cv2-product-card:hover .bq-cv2-product-img img {
    transform: scale(1.04);
}

/* =========================================================================
 *  6. SHIMMER MEJORADO — anti-CLS al cargar imágenes dinámicas
 * ========================================================================= */

.buyaca-app .bq-img-shimmer {
    position: relative;
    overflow: hidden;
}

.buyaca-app .bq-img-shimmer::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg,
            transparent 0%,
            rgba(255, 255, 255, 0.45) 50%,
            transparent 100%);
    transform: translateX(-100%);
    animation: bq810Shimmer 1.4s cubic-bezier(.2, .8, .2, 1) infinite;
    pointer-events: none;
}

.buyaca-app:not(.bq-light-mode) .bq-img-shimmer::after {
    background: linear-gradient(110deg,
            transparent 0%,
            rgba(255, 255, 255, 0.06) 50%,
            transparent 100%);
}

@keyframes bq810Shimmer {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

/* =========================================================================
 *  7. BOTÓN ELIMINAR SLOT — pill rojo discreto Temu
 * ========================================================================= */

.bq-fp-delete-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    background: transparent !important;
    border: 1px solid rgba(239, 68, 68, 0.35) !important;
    color: #EF4444 !important;
    border-radius: var(--bq810-radius-pill, 999px) !important;
    padding: 6px 12px !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    cursor: pointer !important;
    transition: transform 180ms cubic-bezier(.2, .8, .2, 1),
        background-color 180ms cubic-bezier(.2, .8, .2, 1),
        border-color 180ms cubic-bezier(.2, .8, .2, 1),
        box-shadow 180ms cubic-bezier(.2, .8, .2, 1) !important;
    will-change: transform;
}

.bq-fp-delete-btn:hover {
    background: rgba(239, 68, 68, 0.08) !important;
    border-color: rgba(239, 68, 68, 0.65) !important;
    transform: translateY(-1px);

}

.bq-fp-delete-btn:active {
    transform: translateY(0);

}

.bq-fp-delete-btn:disabled,
.bq-fp-delete-btn[aria-busy="true"] {
    opacity: 0.55;
    pointer-events: none;
}

.bq-fp-delete-btn .bq810-spinner,
.bq-fp-delete-btn .bq89-spinner {
    width: 11px;
    height: 11px;
    border: 1.5px solid rgba(239, 68, 68, 0.30);
    border-top-color: #EF4444;
    border-radius: 50%;
    display: inline-block;
    animation: bq810Spin 0.7s linear infinite;
}

@keyframes bq810Spin {
    to {
        transform: rotate(360deg);
    }
}

.buyaca-app:not(.bq-light-mode) .bq-fp-delete-btn {
    color: #F87171 !important;
    border-color: rgba(248, 113, 113, 0.32) !important;
}

.buyaca-app:not(.bq-light-mode) .bq-fp-delete-btn:hover {
    background: rgba(248, 113, 113, 0.10) !important;
    border-color: rgba(248, 113, 113, 0.55) !important;
}

/* Animación de salida (idem v8.8.9 — la mantenemos para compatibilidad) */
.bq-fp-slot-card.is-removing-v889,
.bq-fp-slot-card.is-removing-v8810 {
    transition: opacity 350ms cubic-bezier(.2, .8, .2, 1),
        transform 350ms cubic-bezier(.2, .8, .2, 1),
        max-height 400ms cubic-bezier(.2, .8, .2, 1),
        margin 400ms cubic-bezier(.2, .8, .2, 1),
        padding 400ms cubic-bezier(.2, .8, .2, 1) !important;
    opacity: 0 !important;
    transform: translateX(-24px) scale(0.96) !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    pointer-events: none !important;
}

/* =========================================================================
 *  8. TIPOGRAFÍA Y ESPACIADO — jerarquía clara
 * ========================================================================= */

.buyaca-app .bq-home-section-title,
.buyaca-app .bq-featured-section-title,
.buyaca-app .bq-products-header-title {
    font-weight: 900 !important;
    letter-spacing: -0.015em !important;
    line-height: 1.25 !important;
}

.buyaca-app .bq-cv2-product-name,
.buyaca-app .bq-cv2-product-name--minimal,
.buyaca-app .bq-pc-name {
    line-height: 1.35 !important;
    letter-spacing: -0.005em !important;
    font-weight: 600 !important;
}

.buyaca-app .bq-cv2-product-price,
.buyaca-app .bq-pc-price {
    letter-spacing: -0.015em !important;
    font-weight: 800 !important;
}

/* =========================================================================
 *  9. CARRUSEL HORIZONTAL — snap, scrollbar oculto
 * ========================================================================= */

.buyaca-app .bq-featured-scroll {
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scroll-padding: 16px;
}

.buyaca-app .bq-featured-scroll::-webkit-scrollbar {
    display: none;
}

.buyaca-app .bq-featured-scroll>* {
    scroll-snap-align: start;
}

/* =========================================================================
 *  10. ANTI-CLS — reservación estable de altura
 * ========================================================================= */

.buyaca-app .bq-cv2-product-img,
.buyaca-app .bq-product-card img.bq-card-image {
    aspect-ratio: 1;
}

/* =========================================================================
 *  11. PREFERS-REDUCED-MOTION — respeto absoluto
 * ========================================================================= */

@media (prefers-reduced-motion: reduce) {

    .buyaca-app *,
    .buyaca-app *::before,
    .buyaca-app *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .buyaca-app .bq-cv2-product-card:hover,
    .buyaca-app .bq-pc-card:hover,
    .buyaca-app .bq-product-card:hover,
    .buyaca-app .bq-featured-card-v2:hover,
    .buyaca-app a.bq-feat-tag:hover,
    .buyaca-app .bq-fp-delete-btn:hover {
        transform: none !important;
    }
}

/* =========================================================================
 *  12. FADE-IN para tarjetas que aparecen tras filtrar
 * ========================================================================= */

.buyaca-app .bq810-fade-in-up {
    animation: bq810FadeInUp 0.45s var(--bq810-ease) both;
}

/* =========================================================================
 *  13. TOAST / FEEDBACK MEJORADO (compat con BUYACA.toast existente)
 * ========================================================================= */

.bq810-toast-error {
    background: rgba(239, 68, 68, 0.95) !important;
    color: #FFFFFF !important;
}