/* =========================================================
   WOO ARCHIVE — Product Card Hover Effect
   Aplica en: shop, categorías, resultados de búsqueda (WC + Blocksy)
   Mobile-first | WCAG 2.1 | prefers-reduced-motion safe
   ========================================================= */

:root {
    --ct-hover-transition: transform 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                           box-shadow 0.28s ease;
    --ct-hover-transform: translateY(-10px) scale(1.05);
    --ct-hover-shadow:
        0 4px 8px  rgba(0, 0, 0, 0.06),
        0 16px 32px rgba(0, 0, 0, 0.12),
        0 32px 64px rgba(0, 0, 0, 0.10);
}

/* ── Liberar overflow en contenedores padre ──────────────────── */
.woocommerce,
.woocommerce-page,
ul.products,
.products,
.ct-container,
.ct-container-narrow,
.entries,
.ct-blog {
    overflow: visible !important;
}

/* ═══════════════════════════════════════════════════════════
   A) PRODUCT ARCHIVE — li.product (shop, categorías WC)
   ═══════════════════════════════════════════════════════════ */

li.product {
    position: relative;
    z-index: 1;
    transition: var(--ct-hover-transition), z-index 0s;
    will-change: transform;
}

li.product .ct-woo-card-wrapper {
    transition: var(--ct-hover-transition);
    will-change: transform;
}

li.product:hover {
    z-index: 20;
    transform: var(--ct-hover-transform);
    box-shadow: var(--ct-hover-shadow);
}

li.product:has(.ct-woo-card-wrapper):hover {
    transform: none;
    box-shadow: none;
}
li.product:has(.ct-woo-card-wrapper):hover .ct-woo-card-wrapper {
    transform: var(--ct-hover-transform);
    box-shadow: var(--ct-hover-shadow);
}

/* ═══════════════════════════════════════════════════════════
   B) SEARCH PAGE — Blocksy Companion (ct_post_type=product)
   Estructura confirmada via Playwright:
   article.entry-card.card-content.type-product  ← el article ES la tarjeta
     └── ul.entry-meta, h2.entry-title, div.entry-excerpt
   Parent: div.entries (overflow: visible)
   ═══════════════════════════════════════════════════════════ */

article.entry-card.type-product {
    position: relative;
    z-index: 1;
    transition: var(--ct-hover-transition), z-index 0s;
    will-change: transform;
}

article.entry-card.type-product:hover {
    z-index: 20;
    transform: var(--ct-hover-transform);
    box-shadow: var(--ct-hover-shadow);
}

/* ── Accesibilidad ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    li.product,
    li.product .ct-woo-card-wrapper,
    article.entry-card.type-product {
        transition: none !important;
        transform: none !important;
        will-change: auto !important;
    }
}

/* ── Product title — truncar a 2 líneas para uniformidad del grid ── */

.woocommerce-loop-product__title,
li.product .woocommerce-loop-product__title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 2.7em; /* reserva espacio para 2 líneas siempre */
}

/* ── Touch — sin hover en móvil ─────────────────────────────── */
@media (hover: none) {
    li.product,
    li.product .ct-woo-card-wrapper,
    article.entry-card.type-product {
        transition: none !important;
    }
    li.product:hover,
    li.product:has(.ct-woo-card-wrapper):hover .ct-woo-card-wrapper,
    article.entry-card.type-product:hover {
        transform: none !important;
        box-shadow: none !important;
    }
}
