/* EstilosCMC ficha — opciones globales de la Ficha de producto (1.16.0). Se carga SOLO con un estilo de ficha distinto de «Original», después
   del CSS del estilo. Las clases las pone el módulo en <body> (Estiloscmc::fichaOptionClasses): pp-img-nobg, pp-img-noframe, pp-tags-keep,
   pp-flags-keep. Etiquetas y banderas NO se tratan aquí: cada hoja de estilo condiciona sus reglas con :where(:not(.pp-tags-keep)) /
   :where(:not(.pp-flags-keep)) (tools/ficha_transform.py), así que con la opción «Conservar el estilo original» el estilo simplemente no
   se aplica a ellas. Aquí solo van las opciones de la imagen principal, que anulan fondos y recuadros del estilo. */

/* ---------- Imagen principal sin fondo ---------- */
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .images-container,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .product-cover,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image #product-images-large,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image #product-images-large .swiper-wrapper,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image #product-images-large .product-lmage-large,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image #product-images-large .easyzoom {
  background: none !important;
}
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image::before,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image::after,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .images-container::before,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .images-container::after,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .product-cover::before,
html body.pp-on.pp-img-nobg:not(.pp-p13-banda-azul) .col-product-image .product-cover::after {
  background: none !important;
}

/* ---------- Imagen principal sin recuadro (borde, sombra, contorno) ---------- */
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .images-container,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .product-cover,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image #product-images-large,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image #product-images-large .swiper-wrapper,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image #product-images-large .product-lmage-large,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image #product-images-large .easyzoom {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image::before,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image::after,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .images-container::before,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .images-container::after,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .product-cover::before,
html body.pp-on.pp-img-noframe:not(.pp-p13-banda-azul) .col-product-image .product-cover::after {
  border: 0 !important;
  box-shadow: none !important;
}

/* ---------- Excepciones: estilos cuyo escenario de la imagen no es el contenedor de la imagen ---------- */
/* p49 Hoja inferior: el escenario azul es el pseudoelemento ::before de la fila (la hoja de compra lo cubre a medias). */
html body.pp-on.pp-img-nobg.pp-p49-hoja-inferior .product-info-row::before { background: none !important; }
html body.pp-on.pp-img-noframe.pp-p49-hoja-inferior .product-info-row::before { border: 0 !important; box-shadow: none !important; }
/* p13 Banda azul: la tarjeta blanca de la imagen se queda (va sobre la banda azul; sin ella la caja blanca de los PNG se vería sobre el azul). */

/* ======================================================================================================================================
   1.19.0 — Panel de compra sin recuadro (clase pp-panel-noframe). El panel es #col-product-info (la tarjeta donde van nombre, precio,
   descripción corta, insignia, variante, cantidad y botón). El tema lo pinta con fondo blanco, sombra y radio (todo !important) y cada estilo
   lo redefine con reglas fuertes: aquí se gana con especificidad (html body.pp-on.pp-panel-noframe …) y !important. El RELLENO se conserva
   (no se toca padding): así el contenido no se pega al borde de la columna. El borde se deja con ancho intacto y color transparente para
   que la caja no cambie de medida (1 px) ni se mueva el contenido.
   ====================================================================================================================================== */
html body.pp-on.pp-panel-noframe:not(.pp-p13-banda-azul) #col-product-info {
  background: none !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  outline: 0 !important;
}
html body.pp-on.pp-panel-noframe:not(.pp-p13-banda-azul) #col-product-info::before,
html body.pp-on.pp-panel-noframe:not(.pp-p13-banda-azul) #col-product-info::after {
  background: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* ---------- Excepciones y estilos cuyo «recuadro» del panel no es #col-product-info ---------- */
/* p13 Banda azul: la tarjeta blanca del panel se queda (el título y el precio van encima de la banda azul; sin la tarjeta se leerían azul sobre azul).
   p43 Compra dock: el «dock» oscuro (.product-info-row::after) es el concepto del estilo y lleva texto claro; se queda. En ambos, sin regla aquí. */

/* p42 Tres columnas: el recuadro del panel es la caja tintada de la tercera columna (.product-info-row::before, con borde superior azul).
   El pseudoelemento se queda como celda de la rejilla (el layout no cambia) pero sin pintar nada. */
html body.pp-on.pp-panel-noframe.pp-p42-tres-columnas .product-info-row::before {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* p45 Hoja superpuesta: la «hoja» blanca (::before, con su tirador y su sombra) y la hoja azul de atrás (::after) son el recuadro del panel. Se vacían
   sin quitarlas de la rejilla (celdas y márgenes iguales). */
html body.pp-on.pp-panel-noframe.pp-p45-hoja-superpuesta .product-info-row::before,
html body.pp-on.pp-panel-noframe.pp-p45-hoja-superpuesta .product-info-row::after {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* …y la línea bajo el título (border-bottom de la cabecera) llega hasta los bordes de la hoja: sin hoja quedaría como una raya suelta. */
html body.pp-on.pp-panel-noframe.pp-p45-hoja-superpuesta #col-product-info .product_header_container { border-bottom: 0 !important; }

/* p49 Hoja inferior: además de la hoja (#col-product-info), la bandeja de compra tintada (#add-to-cart-or-refresh) llega hasta los bordes de la hoja
   (márgenes negativos) y quedaría como una franja suelta: pasa a ser una zona normal sin fondo ni borde, con los mismos márgenes laterales que el resto.
   En móvil la hoja sube 30 px sobre la imagen (margen negativo) y lleva un tirador: sin hoja, el texto taparía la imagen, así que se anula. */
html body.pp-on.pp-panel-noframe.pp-p49-hoja-inferior #col-product-info #add-to-cart-or-refresh {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 18px 0 18px !important;
  padding: 0 !important;
}
@media (max-width: 767.98px) {
  html body.pp-on.pp-panel-noframe.pp-p49-hoja-inferior .product-info-row .col-product-info { margin-top: 0 !important; }
  html body.pp-on.pp-panel-noframe.pp-p49-hoja-inferior #col-product-info #add-to-cart-or-refresh { margin: 16px 0 0 !important; }
}

/* 2026-10-13: opción «Texto Impuestos incluidos bajo el precio» = Ocultar (clase pp-tax-hide en <body>). */
body.pp-tax-hide .tax-shipping-delivery-label { display: none !important; }