/* ==========================================================================
   Watermark overlay en imágenes de producto (CSS puro — cero modificación
   de archivos de imagen; los originales y los thumbs de PS permanecen
   intactos en disco).

   SVG inline como background: sin HTTP extra, escalable y auto-anti-aliasing.
   Aplica en esquina inferior-derecha con opacidad ~0.85.

   Contenedores cubiertos:
     .zcnc-row-image           → cards del listing zcnc
     .product-miniature__image → cards nativas PS (categoría, new-products,
                                  cross-sell, home, etc.)
     .product__cover            → imagen principal de ficha de producto
     .product__thumb-image      → miniaturas laterales de ficha de producto
     .product-images img        → galería en el quickview / modal

   NOTA de seguridad: el watermark es SÓLO visual. Si alguien hace
   right-click → "guardar imagen", obtiene la imagen RAW sin watermark.
   Para bloqueo a nivel fichero usar ps_watermark (modifica los thumbs en
   cache) o un image proxy server-side.
   ========================================================================== */

/* Contenedores que necesitamos convertir a position:relative para que el
   ::after absolute funcione. En Hummingbird/PS9 la estructura real es:
   - Cards (listing zcnc, categoría, search, related): .zcnc-row-image > img
   - Ficha producto: .product__images .carousel-item > picture > img
   - Modal fullscreen: .product-images-modal__body .carousel-item > picture > img
*/
.zcnc-row-image,
.product__images .carousel-item,
.product-images-modal__body .carousel-item {
    position: relative;
}

/* Overlay central — watermark grande, sutil, sin fondo.
   Texto blanco semi-transparente con sombra suave para legibilidad
   tanto sobre imágenes claras como oscuras. */
.zcnc-row-image::after,
.product__images .carousel-item::after,
.product-images-modal__body .carousel-item::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(120px, 55%, 560px);
    height: clamp(28px, 14%, 130px);
    background: no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 48'><text x='120' y='34' text-anchor='middle' font-family='Arial,Helvetica,sans-serif' font-size='30' font-weight='600' fill='white' letter-spacing='4'>ZonaCNC</text></svg>");
    opacity: .3;
    pointer-events: none;
    z-index: 5;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
    mix-blend-mode: overlay; /* se adapta al contraste del fondo */
}

/* Thumbnails (.product__thumbs .carousel-item y .product-thumb): el
   watermark central queda demasiado dominante en imágenes muy pequeñas.
   Lo deshabilitamos en thumbs — la ficha ya tiene watermark en la
   imagen principal, no hace falta repetirlo en las miniaturas. */
.product__thumbs .carousel-item::after,
.product-thumb::after {
    content: none !important;
}