.producto-ficha__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: var(--pproducto-bc-align, flex-start);
    gap: 0.25rem;
    font-size: var(--pproducto-bc-tam, 0.875rem);
    font-family: var(--pproducto-bc-fuente, inherit);
    margin-bottom: 1rem;
}

.producto-ficha__breadcrumb-link {
    color: var(--pproducto-bc-link-color, inherit) !important;
    text-decoration: none !important;
    opacity: 0.8;
}
.producto-ficha__breadcrumb-link:hover {
    color: var(--pproducto-bc-link-hover-color, var(--pproducto-bc-link-color, inherit)) !important;
    text-decoration: underline !important;
    opacity: 1;
}

.producto-ficha__breadcrumb-sep {
    color: var(--pproducto-bc-link-color, inherit);
    opacity: 0.4;
}

.producto-ficha__breadcrumb-current {
    font-weight: 600;
    color: var(--pproducto-bc-link-color, inherit) !important;
}

.producto-ficha {
    padding-block-start: var(--pproducto-padding-top, 2rem);
    padding-block-end: var(--pproducto-padding-bottom, 2rem);
    background-color: var(--pproducto-pagina-fondo, transparent);
    color: var(--pproducto-color-texto, inherit);
}

.producto-ficha .container {
    max-width: var(--pproducto-container-max-width, var(--site-container-max-width, 1200px));
}

/* Layout dos columnas */
.producto-ficha__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--pproducto-grid-gap, 2rem);
    margin-bottom: 3rem;
}

@media (min-width: 768px) {
    .producto-ficha__grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--pproducto-grid-gap-desktop, 3rem);
    }
    /* imagen derecha: info primero en DOM, imagen segunda → invertir orden visual */
    .producto-ficha__grid--img-right .producto-ficha__galeria { order: 2; }
    .producto-ficha__grid--img-right .producto-ficha__info    { order: 1; }
}

/* Galería */
.producto-ficha__galeria {
    position: relative;
}

.producto-ficha__badges {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.badge { display: inline-block; padding: 0.25em 0.6em; border-radius: 4px; font-size: 0.75rem; font-weight: 600; }
.badge--new     { background-color: var(--pproducto-badge-new-fondo,     var(--info-color,    #3b82f6)); color: var(--pproducto-badge-color-texto, #fff); }
.badge--agotado { background-color: var(--pproducto-badge-agotado-fondo, var(--danger-color,  #ef4444)); color: var(--pproducto-badge-color-texto, #fff); }
.badge--stock   { background-color: var(--pproducto-badge-stock-fondo,   var(--success-color, #22c55e)); color: var(--pproducto-badge-color-texto, #fff); }
.badge--dto     { background-color: var(--card-badge-bg, var(--warning-color, #f97316)); color: var(--card-badge-color, #fff); }

.producto-ficha__img-principal {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--pproducto-galeria-radio, 0.5rem);
    background-color: var(--pproducto-galeria-fondo, var(--light-color, #f1f5f9));
}

.producto-ficha__img-principal img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition: transform 0.3s;
}

.producto-ficha__thumbs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.producto-ficha__thumb {
    width: var(--pproducto-thumb-tam, 72px);
    height: var(--pproducto-thumb-tam, 72px);
    border: 2px solid transparent;
    border-radius: var(--pproducto-thumb-radio, 4px);
    overflow: hidden;
    cursor: pointer;
    padding: 0;
    background: var(--pproducto-galeria-fondo, var(--light-color, #f1f5f9));
    transition: border-color 0.15s;
}

.producto-ficha__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.producto-ficha__thumb.active,
.producto-ficha__thumb:hover {
    border-color: var(--pproducto-thumb-borde-color, var(--primary-color, #2563eb));
}

/* Info */
.producto-ficha__titulo-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin: 0 0 0.75rem;
}

.producto-ficha__titulo-row .producto-ficha__titulo {
    margin: 0;
    flex: 1 1 0;
    min-width: 0;
}

.producto-ficha__btn-favorito {
    flex: 0 0 auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    font-size: var(--pproducto-fav-tam, 1.75rem);
    color: var(--pproducto-fav-color, var(--border-color, #d1d5db));
    transition: color 0.15s, transform 0.15s;
}

.producto-ficha__btn-favorito svg,
.producto-ficha__btn-favorito i {
    width: 1em;
    height: 1em;
    fill: currentColor;
    display: block;
    font-size: inherit;
}

.producto-ficha__btn-favorito:hover {
    color: var(--pproducto-fav-color-active, var(--color-danger, #dc3545));
    transform: scale(1.1);
}

.producto-ficha__btn-favorito.is-favorito {
    color: var(--pproducto-fav-color-active, var(--color-danger, #dc3545));
}

.producto-ficha__titulo {
    font-size: var(--pproducto-titulo-tam, clamp(1.25rem, 3vw, 1.875rem)) !important;
    font-weight: var(--pproducto-titulo-peso, 700) !important;
    color: var(--pproducto-titulo-color, inherit) !important;
    line-height: 1.3;
    margin: 0 0 0.75rem;
}

.producto-ficha__descripcion-corta {
    font-size: var(--pproducto-dcorta-tam, 1rem);
    font-family: var(--pproducto-dcorta-fuente, inherit);
    color: var(--pproducto-dcorta-color, inherit);
    opacity: var(--pproducto-dcorta-opacidad, 0.8);
    line-height: 1.6;
    margin: 0 0 1.25rem;
}

/* Precio */
.producto-ficha__precio {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.producto-ficha__precio-actual {
    font-size: var(--pproducto-precio-tam, 1.75rem);
    font-weight: var(--pproducto-precio-peso, 700);
    color: var(--pproducto-precio-color, var(--card-price-color, var(--primary-color)));
}

.producto-ficha__precio-antes {
    font-size: var(--pproducto-precio-antes-tam, 1rem);
    text-decoration: line-through;
    color: var(--pproducto-precio-antes-color, var(--card-precio-antes-color, var(--dark-color, #1e293b)));
    opacity: var(--pproducto-precio-antes-opacidad, 0.6);
}

.producto-ficha__canon {
    font-size: var(--pproducto-canon-tam, 0.8125rem);
    color: var(--pproducto-canon-color, inherit);
    opacity: var(--pproducto-canon-opacidad, 0.65);
    margin: 0 0 1rem;
}

/* Comprar */
.producto-ficha__comprar {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-block: 1.5rem;
}

.producto-ficha__cantidad {
    display: flex;
    align-items: center;
    border: 1px solid var(--pproducto-qty-color-borde, var(--form-input-border, #e2e8f0));
    border-radius: var(--pproducto-qty-radio, 0.375rem);
    overflow: hidden;
    background-color: var(--pproducto-qty-color-fondo, transparent);
    color: var(--pproducto-qty-color-texto, inherit);
}

.qty-btn {
    width: 2.25rem;
    height: 2.25rem;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.qty-btn:hover { background: var(--light-color, #f1f5f9); }

.qty-input {
    width: 3rem;
    height: 2.25rem;
    border: none;
    text-align: center;
    font-size: var(--pproducto-qty-tam, 0.9375rem);
    color: var(--pproducto-qty-color-texto, inherit);
    -moz-appearance: textfield;
    background: transparent;
}
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }

.producto-ficha__btn-comprar {
    background-color: var(--pproducto-btn-color, var(--primary-color)) !important;
    color: var(--pproducto-btn-color-texto, #fff) !important;
    border-radius: var(--pproducto-btn-radio, 0.375rem) !important;
    font-size: var(--pproducto-btn-tam, 1rem) !important;
    font-weight: var(--pproducto-btn-peso, 600) !important;
    border: none;
    padding: 0.65em 1.75em;
    cursor: pointer;
    transition: opacity 0.15s;
}
.producto-ficha__btn-comprar:hover { opacity: 0.85; }

/* Meta */
.producto-ficha__meta {
    margin-top: 1.5rem;
    border-top: 1px solid var(--pproducto-meta-borde, var(--card-border-color, #e2e8f0));
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.producto-ficha__meta-row {
    display: flex;
    gap: 0.5rem;
    font-size: var(--pproducto-meta-tam, 0.875rem);
}

.producto-ficha__meta-row dt {
    font-weight: var(--pproducto-meta-dt-peso, 600);
    color: var(--pproducto-meta-dt-color, inherit);
    min-width: 60px;
    opacity: var(--pproducto-meta-dt-opacidad, 0.7);
}

.producto-ficha__meta-row dd {
    color: var(--pproducto-meta-dd-color, inherit);
}

.producto-ficha__meta-row a {
    color: var(--pproducto-meta-link-color, var(--main-link, var(--primary-color)));
    text-decoration: none;
}
.producto-ficha__meta-row a:hover { text-decoration: underline; }

/* Descripción larga */
.producto-ficha__descripcion-larga {
    border-top: 1px solid var(--pproducto-desc-larga-borde, var(--card-border-color, #e2e8f0));
    padding-top: var(--pproducto-desc-larga-padding-top, 2rem);
}

.producto-ficha__desc-titulo {
    font-size: var(--pproducto-desc-titulo-tam, 1.25rem) !important;
    font-weight: var(--pproducto-desc-titulo-peso, 700) !important;
    color: var(--pproducto-desc-titulo-color, inherit) !important;
    margin: 0 0 1rem;
}

.producto-ficha__desc-contenido {
    font-size: var(--pproducto-desc-tam, 1rem);
    color: var(--pproducto-desc-color, inherit);
    line-height: 1.75;
    max-width: var(--pproducto-desc-max-ancho, 65ch);
}

/* Características / atributos del producto (campos genéricos).
   Va en la COLUMNA INFO (derecha), junto a la ficha técnica: lista vertical de
   una sola columna, misma estética que .producto-ficha__meta. */
.producto-ficha__atributos {
    margin-top: var(--pproducto-atributos-padding-top, 1.5rem);
    border-top: 1px solid var(--pproducto-atributos-borde, var(--card-border-color, #e2e8f0));
    padding-top: 1rem;
}

.producto-ficha__atributos-titulo {
    font-size: var(--pproducto-atributos-titulo-tam, 1rem) !important;
    font-weight: var(--pproducto-atributos-titulo-peso, 700) !important;
    color: var(--pproducto-atributos-titulo-color, inherit) !important;
    margin: 0 0 0.75rem;
}

.producto-ficha__atributos-lista {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
}

.producto-ficha__atributo {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--pproducto-atributos-borde, var(--card-border-color, #e2e8f0));
    font-size: 0.875rem;
}

.producto-ficha__atributo:last-child {
    border-bottom: 0;
}

.producto-ficha__atributo-nombre {
    font-weight: 600;
    color: var(--pproducto-atributos-nombre-color, inherit);
    opacity: 0.7;
    margin: 0;
}

.producto-ficha__atributo-valor {
    color: var(--pproducto-atributos-valor-color, inherit);
    text-align: right;
    margin: 0;
}

/* ── Destacados (sin producto) ─────────────────────────── */
.producto-destacados {
    padding-block-start: var(--pproducto-dest-padding-top, 2rem);
    padding-block-end: var(--pproducto-dest-padding-bottom, 2rem);
    background-color: var(--pproducto-dest-color-fondo, transparent);
}

.producto-destacados .container {
    max-width: var(--pproducto-dest-container-max-width, var(--site-container-max-width, 1200px));
}

.producto-destacados__breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: var(--pproducto-dest-bc-align, flex-start);
    gap: 0.25rem;
    font-size: var(--pproducto-dest-bc-tam, 0.875rem);
    font-family: var(--pproducto-dest-bc-fuente, inherit);
    margin-bottom: 0.75rem;
}

.producto-destacados__breadcrumb-link {
    color: var(--pproducto-dest-bc-link-color, inherit) !important;
    text-decoration: none !important;
    opacity: 0.8;
}
.producto-destacados__breadcrumb-link:hover {
    color: var(--pproducto-dest-bc-link-hover-color, var(--pproducto-dest-bc-link-color, inherit)) !important;
    text-decoration: underline !important;
    opacity: 1;
}

.producto-destacados__breadcrumb-sep {
    color: var(--pproducto-dest-bc-link-color, inherit);
    opacity: 0.4;
}

.producto-destacados__breadcrumb-current {
    font-weight: 600;
    color: var(--pproducto-dest-bc-link-color, inherit) !important;
}

/* Cabecera de destacados */
.producto-destacados__header {
    background-color: var(--pproducto-dest-header-fondo, transparent);
    padding-block-start: var(--pproducto-dest-header-padding-top, 1.5rem);
    padding-block-end: var(--pproducto-dest-header-padding-bottom, 1.5rem);
    margin-bottom: 2rem;
}

.producto-destacados__header-inner {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.producto-destacados__header-texto {
    width: 100%;
}

.producto-destacados__header-inner--img-izquierda,
.producto-destacados__header-inner--img-derecha {
    flex-direction: row;
    flex-wrap: nowrap;
}

.producto-destacados__header-inner--img-centro {
    flex-direction: column;
    align-items: center;
}

.producto-destacados__header-img {
    flex: 0 0 auto;
    width: 180px;
}

.producto-destacados__header-img--centro {
    width: 220px;
}

.producto-destacados__header-img img {
    width: 100%;
    height: auto;
    border-radius: var(--card-radius, 0.5rem);
    object-fit: cover;
    display: block;
}

.producto-destacados__header-inner--img-izquierda .producto-destacados__header-texto,
.producto-destacados__header-inner--img-derecha .producto-destacados__header-texto {
    flex: 1 1 0;
    min-width: 0;
}

.producto-destacados__titulo {
    font-size: var(--pproducto-dest-titulo-tam, 1.75rem) !important;
    color: var(--pproducto-dest-titulo-color, inherit) !important;
    text-align: var(--pproducto-dest-titulo-align, left);
    font-family: var(--pproducto-dest-titulo-fuente, inherit);
    font-weight: var(--pproducto-dest-titulo-peso, 700);
    margin: 0 0 0.5rem;
}

.producto-destacados__desc {
    font-size: var(--pproducto-dest-desc-tam, 1rem);
    color: var(--pproducto-dest-desc-color, inherit);
    text-align: var(--pproducto-dest-desc-align, left);
    font-family: var(--pproducto-dest-desc-fuente, inherit);
    font-weight: var(--pproducto-dest-desc-peso, 400);
    line-height: 1.6;
    margin: 0;
    opacity: var(--pproducto-dest-desc-opacidad, 0.75);
}

.producto-destacados__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

@media (min-width: 640px) {
    .producto-destacados__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
    .producto-destacados__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
    .producto-destacados__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1024px) {
    .producto-destacados__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
    .producto-destacados__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
    .producto-destacados__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
}

.producto-destacados__card {
    text-decoration: none;
    color: inherit;
}

.producto-destacados__card:hover .product-card__img-wrap img { transform: scale(1.04); }

.producto-destacados__empty {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--pproducto-dest-empty-color, inherit);
    font-size: var(--pproducto-dest-empty-tam, 1rem);
    opacity: var(--pproducto-dest-empty-opacidad, 0.6);
    padding: 3rem 0;
}

/* ═══════════════════════════════════════════════════════════════
   Zoom, lightbox, documentos y relacionados de la ficha de producto
   ═══════════════════════════════════════════════════════════════ */

/* --- Zoom con lupa al pasar el ratón --- */
.producto-ficha__img-principal.js-zoom { position: relative; cursor: zoom-in; overflow: hidden; }
.producto-ficha__zoom-lens {
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-size: 200%;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}
.producto-ficha__img-principal.is-zooming .producto-ficha__zoom-lens { opacity: 1; }
.producto-ficha__img-principal.is-zooming img { opacity: 0; }

.producto-ficha__zoom-full {
    position: absolute;
    right: .6rem; bottom: .6rem;
    width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border: none; border-radius: 50%;
    background: rgba(0,0,0,.55); color: #fff;
    cursor: pointer; z-index: 3;
    transition: background .15s ease;
}
.producto-ficha__zoom-full:hover { background: rgba(0,0,0,.8); }

/* --- Lightbox a pantalla completa --- */
.producto-lightbox {
    position: fixed; inset: 0;
    display: none;
    align-items: center; justify-content: center;
    background: rgba(15,15,15,.92);
    z-index: 9999;
    padding: 3rem 1rem;
}
.producto-lightbox[aria-hidden="false"] { display: flex; }
body.lightbox-abierto { overflow: hidden; }
.producto-lightbox__figura { margin: 0; max-width: 90vw; max-height: 88vh; text-align: center; }
.producto-lightbox__img {
    max-width: 90vw; max-height: 82vh;
    object-fit: contain;
    border-radius: 4px;
    background: #fff;
}
.producto-lightbox__contador { color: #fff; margin-top: .75rem; font-size: .9rem; letter-spacing: .04em; }
.producto-lightbox__cerrar {
    position: absolute; top: 1rem; right: 1.25rem;
    background: none; border: none; color: #fff;
    font-size: 2.5rem; line-height: 1; cursor: pointer;
    width: 44px; height: 44px;
}
.producto-lightbox__nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    background: rgba(255,255,255,.12); border: none; color: #fff;
    font-size: 2.5rem; line-height: 1;
    width: 56px; height: 56px; border-radius: 50%;
    cursor: pointer; transition: background .15s ease;
    display: flex; align-items: center; justify-content: center;
}
.producto-lightbox__nav:hover { background: rgba(255,255,255,.28); }
.producto-lightbox__nav--prev { left: 1.25rem; }
.producto-lightbox__nav--next { right: 1.25rem; }

/* --- Documentos descargables (ficha técnica) --- */
.producto-ficha__docs { margin-top: 1.75rem; }
.producto-ficha__docs-titulo {
    font-size: var(--pproducto-docs-titulo-tam, 1.05rem);
    font-weight: 700;
    margin: 0 0 .75rem;
    color: var(--secondary-color, #1f2937);
}
.producto-ficha__docs-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.producto-ficha__doc {
    display: flex; align-items: center; gap: .85rem;
    padding: .7rem .9rem;
    border: 1px solid var(--border-color, #e2e5ea);
    border-radius: var(--card-radius, 8px);
    text-decoration: none;
    color: var(--secondary-color, #1f2937);
    transition: border-color .15s ease, background .15s ease;
}
.producto-ficha__doc:hover {
    border-color: var(--main-color, #8CD50B);
    background: color-mix(in srgb, var(--main-color, #8CD50B) 6%, transparent);
}
.producto-ficha__doc-icono { color: var(--danger-color, #d33); display: inline-flex; flex: none; }
.producto-ficha__doc-texto { display: flex; flex-direction: column; gap: .1rem; flex: 1 1 auto; min-width: 0; }
.producto-ficha__doc-nombre { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.producto-ficha__doc-ext { font-size: .72rem; letter-spacing: .06em; color: var(--muted-color, #8a91a0); text-transform: uppercase; }
.producto-ficha__doc-descarga { color: var(--main-color, #8CD50B); display: inline-flex; flex: none; }

/* --- También te puede interesar (relacionados) --- */
.producto-ficha__relacionados { margin-top: 3rem; }
.producto-ficha__rel-titulo {
    font-size: var(--pproducto-rel-titulo-tam, 1.5rem);
    font-weight: 700;
    margin: 0 0 1.25rem;
    color: var(--secondary-color, #1f2937);
    text-wrap: balance;
}
.producto-ficha__rel-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
@media (min-width: 640px)  { .producto-ficha__rel-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .producto-ficha__rel-grid { grid-template-columns: repeat(4, 1fr); } }

/* --- Tarjeta de relacionados: botón comprar + selector de cantidad ---
   Los relacionados usan partials/product-card.twig (.product-card__*). El estilo
   base de la tarjeta viene de theme.css; aquí se añaden el botón y el selector de
   cantidad, que no están en el global. Reglas genéricas (sin prefijo de grid) para
   que apliquen a los relacionados de la ficha igual que en categoria/marca/buscador. */

/* La tarjeta necesita position:relative para anclar el bloque de compra, que en
   modo "al pasar el ratón" se posiciona en absoluto al fondo de la tarjeta. Sin
   esto, el bloque se ancla a un ancestro lejano y no aparece ni con hover. */
.producto-ficha__rel-grid .product-card--v2 { position: relative; }

.producto-ficha__rel-grid .product-card__btn {
    width: 100%;
    border: none;
    cursor: pointer;
    padding: 0.6rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 0.5rem;
    background-color: var(--primary-color, #16a34a);
    color: var(--dark-color, #222);
    transition: filter 0.2s, opacity 0.25s, transform 0.25s;
}
.producto-ficha__rel-grid .product-card__btn:hover { filter: brightness(0.95); }

.product-card__comprar {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    width: 100%;
}
.product-card__cantidad {
    display: flex;
    align-items: stretch;
    flex-shrink: 0;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 0.5rem;
    overflow: hidden;
}
.product-card__cantidad .qty-btn {
    width: 2rem;
    border: 0;
    background: var(--bg-light, #f9fafb);
    color: var(--dark-color, #222);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-card__cantidad .qty-btn:hover { background: var(--border-color, #e5e7eb); }
.product-card__cantidad .qty-input {
    width: 3rem;
    border: 0;
    text-align: center;
    font-size: 0.875rem;
    background: var(--bg-white, #fff);
    color: var(--dark-color, #222);
    -moz-appearance: textfield;
    appearance: textfield;
}
.product-card__cantidad .qty-input::-webkit-outer-spin-button,
.product-card__cantidad .qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* El botón comprar ocupa el resto del ancho junto al selector */
.product-card__comprar .product-card__btn { flex: 1; width: auto; }

/* Modo "mostrar al hover": el bloque (selector + botón) va ABSOLUTO anclado al
   fondo de la tarjeta, así no ocupa espacio en el flujo ni descuadra el grid. */
.product-card--v2.btn-hover .product-card__comprar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0.5rem;
    background: var(--bg-white, #fff);
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.25s ease, opacity 0.25s ease;
    z-index: 2;
}
.product-card--v2.btn-hover:hover .product-card__comprar {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
/* En pantallas táctiles el hover no aplica: bloque en flujo, siempre visible */
@media (hover: none) {
    .product-card--v2.btn-hover .product-card__comprar {
        position: static;
        transform: none;
        opacity: 1;
        pointer-events: auto;
        padding: 0;
        background: transparent;
    }
}

:root {
    --pproducto-padding-top: 2rem;
    --pproducto-padding-bottom: 2rem;
    --pproducto-pagina-fondo: var(--bg-white);
    --pproducto-container-max-width: 1400px;
    --pproducto-color-texto: var(--secondary-color);
    --pproducto-grid-gap: 2rem;
    --pproducto-grid-gap-desktop: 5rem;
    --pproducto-galeria-radio: 0.5rem;
    --pproducto-galeria-fondo: var(--bg-white);
    --pproducto-thumb-tam: 72px;
    --pproducto-thumb-radio: 0.5rem;
    --pproducto-thumb-borde-color: var(--secondary-color);
    --pproducto-badge-new-fondo: var(--info-color);
    --pproducto-badge-agotado-fondo: var(--danger-color);
    --pproducto-badge-stock-fondo: var(--success-color);
    --pproducto-badge-color-texto: var(--bg-white);
    --pproducto-titulo-tam: clamp(1.75rem, 4vw, 2.75rem);
    --pproducto-titulo-peso: 800;
    --pproducto-titulo-color: var(--secondary-color);
    --pproducto-dcorta-tam: 0.875rem;
    --pproducto-dcorta-color: var(--bg-black);
    --pproducto-dcorta-opacidad: 1;
    --pproducto-precio-tam: 3rem;
    --pproducto-precio-peso: 600;
    --pproducto-precio-color: var(--secondary-color);
    --pproducto-precio-antes-tam: 1rem;
    --pproducto-precio-antes-color: var(--bg-black);
    --pproducto-precio-antes-opacidad: 0.8;
    --pproducto-canon-tam: 0.75rem;
    --pproducto-canon-color: var(--secondary-color);
    --pproducto-canon-opacidad: 0.65;
    --pproducto-btn-color: var(--secondary-color);
    --pproducto-btn-color-texto: var(--bg-white);
    --pproducto-btn-radio: 0.375rem;
    --pproducto-btn-tam: 1rem;
    --pproducto-btn-peso: 600;
    --pproducto-fav-color-active: var(--terciario-color);
    --pproducto-fav-tam: 2rem;
    --pproducto-qty-color-fondo: var(--bg-grey);
    --pproducto-qty-color-texto: var(--bg-black);
    --pproducto-qty-color-borde: var(--secondary-color);
    --pproducto-qty-radio: 4px;
    --pproducto-qty-tam: 0.75rem;
    --pproducto-meta-borde: var(--secondary-color);
    --pproducto-meta-tam: 1rem;
    --pproducto-meta-dt-color: var(--secondary-color);
    --pproducto-meta-dt-peso: 800;
    --pproducto-meta-dt-opacidad: 1;
    --pproducto-meta-dd-color: var(--bg-black);
    --pproducto-meta-link-color: var(--secondary-color);
    --pproducto-desc-titulo-tam: 3rem;
    --pproducto-desc-titulo-peso: 800;
    --pproducto-desc-titulo-color: var(--bg-black);
    --pproducto-desc-tam: 1rem;
    --pproducto-desc-color: var(--bg-black);
    --pproducto-desc-max-ancho: none;
    --pproducto-desc-larga-borde: var(--secondary-color);
    --pproducto-desc-larga-padding-top: 2rem;
    --pproducto-atributos-titulo-tam: 1.25rem;
    --pproducto-atributos-titulo-peso: 700;
    --pproducto-atributos-padding-top: 2rem;
    --pproducto-bc-align: right;
    --pproducto-bc-tam: 0.875rem;
    --pproducto-bc-link-color: var(--secondary-color);
    --pproducto-bc-link-hover-color: var(--secondary-color);
    --pproducto-dest-padding-top: 0;
    --pproducto-dest-padding-bottom: 2rem;
    --pproducto-dest-color-fondo: var(--bg-white);
    --pproducto-dest-container-max-width: 1200px;
    --pproducto-dest-empty-color: var(--secondary-color);
    --pproducto-dest-empty-tam: 1rem;
    --pproducto-dest-empty-opacidad: 0.6;
    --pproducto-dest-header-fondo: var(--secondary-color);
    --pproducto-dest-header-padding-top: 2rem;
    --pproducto-dest-header-padding-bottom: 2rem;
    --pproducto-dest-titulo-tam: 3rem;
    --pproducto-dest-titulo-color: var(--bg-white);
    --pproducto-dest-titulo-align: left;
    --pproducto-dest-titulo-peso: 800;
    --pproducto-dest-titulo-fuente: var(--font-1);
    --pproducto-dest-desc-tam: 1.125rem;
    --pproducto-dest-desc-color: var(--bg-white);
    --pproducto-dest-desc-align: left;
    --pproducto-dest-desc-peso: 300;
    --pproducto-dest-desc-opacidad: 0.75;
    --pproducto-dest-bc-align: right;
    --pproducto-dest-bc-tam: 0.875rem;
    --pproducto-dest-bc-link-color: var(--bg-white);
    --pproducto-dest-bc-link-hover-color: var(--bg-white);
}
