/* =========================================================
   WALON: Cyber Walon, tarjetas y ficha (2 al 8 de noviembre de 2026)
   Réplica de la propuesta de diseño aprobada. Solo CSS.
   - Tarjetas: se apoyan en la clase product_cat-cyber-walon que WooCommerce
     ya pone en cada <li> (catálogo, "Mostrar más" y filas de productos).
   - Ficha: se apoyan en la clase de body wcy-pdp-cyber (ver campaign.php).
   Se carga solo mientras walon_cyber_is_active() sea verdadero.
   Tipografía de la campaña: Barlow Condensed / Barlow (alojada en el tema).
   El tema fuerza precios y títulos con !important, por eso los selectores
   llevan el prefijo "html body" y la repetición de clases.
   ========================================================= */

@font-face{font-family:"Wcy Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("../../assets/fonts/barlow/BarlowCondensed-700.woff2") format("woff2")}
@font-face{font-family:"Wcy Barlow Condensed";font-style:italic;font-weight:700;font-display:swap;src:url("../../assets/fonts/barlow/BarlowCondensed-700-italic.woff2") format("woff2")}
@font-face{font-family:"Wcy Barlow";font-style:normal;font-weight:400;font-display:swap;src:url("../../assets/fonts/barlow/Barlow-400.woff2") format("woff2")}
@font-face{font-family:"Wcy Barlow";font-style:normal;font-weight:500;font-display:swap;src:url("../../assets/fonts/barlow/Barlow-500.woff2") format("woff2")}
@font-face{font-family:"Wcy Barlow";font-style:normal;font-weight:600;font-display:swap;src:url("../../assets/fonts/barlow/Barlow-600.woff2") format("woff2")}

/* ---------------- TARJETAS ---------------- */

/* Porcentaje: celeste del banner, pegado a la esquina superior izquierda */
html body li.product.product_cat-cyber-walon .ast-onsale-card,
html .woocommerce ul.products li.product.product_cat-cyber-walon .ast-onsale-card{
  top:0 !important;left:0 !important;border-radius:0 !important;
  background:#00AAD2 !important;color:#0b0b0b !important;box-shadow:none !important;
  font:italic 700 1.15rem/1.1 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;letter-spacing:.01em !important;
  padding:4px 9px 3px !important;
}

/* Franja Cyber al pie de la foto (escritorio). La barra "Vista rápida" de la
   tienda (z-index 5) pasa por encima al pasar el cursor. */
li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap{container-type:inline-size}
li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::before,
li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::after{
  position:absolute;bottom:0;height:30px;line-height:30px;z-index:3;pointer-events:none;
  font-family:"Wcy Barlow Condensed","Arial Narrow",sans-serif;font-weight:700;font-size:.86rem;
  text-transform:uppercase;color:#0b0b0b;white-space:nowrap;
}
li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::before{
  content:"Cyber";left:0;right:0;box-sizing:border-box;padding-left:38px;letter-spacing:.12em;overflow:hidden;
  background:#8FE6C8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 12.43 50.75 35.14' fill='%230b0b0b'%3E%3Cpolygon points='31.23 24.14 21.47 38.78 21.47 38.78 15.61 47.57 9.76 38.78 0 24.14 11.71 24.14 15.61 30 19.52 24.14 11.71 12.43 23.42 12.43 31.23 24.14'/%3E%3Cpolygon points='50.75 24.14 35.13 47.57 29.28 38.78 39.04 24.14 31.23 12.43 42.94 12.43 50.75 24.14'/%3E%3C/svg%3E") no-repeat 10px center / 21px auto;
}
li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::after{
  content:"Hasta el 8 nov";right:10px;letter-spacing:.08em;font-weight:600;
}
@container (max-width:205px){
  li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::after{display:none}
}

/* Orden como en la propuesta: nombre arriba, precio debajo */
html body li.product.product_cat-cyber-walon .astra-shop-summary-wrap,
html .woocommerce ul.products li.product.product_cat-cyber-walon .astra-shop-summary-wrap{display:flex !important;flex-direction:column;gap:6px}
html body li.product.product_cat-cyber-walon .astra-shop-summary-wrap .ast-loop-product__link,
html .woocommerce ul.products li.product.product_cat-cyber-walon .astra-shop-summary-wrap .ast-loop-product__link{order:-1}

/* Nombre */
html body li.product.product_cat-cyber-walon .woocommerce-loop-product__title.woocommerce-loop-product__title.woocommerce-loop-product__title,
html .woocommerce ul.products li.product.product_cat-cyber-walon .woocommerce-loop-product__title.woocommerce-loop-product__title.woocommerce-loop-product__title{
  font-family:"Wcy Barlow","Arial",sans-serif !important;font-weight:600 !important;font-size:.98rem !important;
  line-height:1.25 !important;text-transform:none !important;letter-spacing:0 !important;color:#0b0b0b !important;
  max-height:none !important;
}

/* Precio */
html body li.product.product_cat-cyber-walon .price,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price{
  display:flex !important;flex-wrap:wrap;align-items:baseline;gap:4px 10px;
  font:700 1.55rem/1.15 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;letter-spacing:.01em;color:#04708f !important;
}
html body li.product.product_cat-cyber-walon .price ins,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price ins,
html body li.product.product_cat-cyber-walon .price ins *,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price ins *,
html body li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount,
html body li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount *,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount *{
  color:#04708f !important;font:700 1.55rem/1.15 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;background:none !important;text-decoration:none !important;letter-spacing:.01em;
}
html body li.product.product_cat-cyber-walon .price ins,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price ins{order:-1}
html body li.product.product_cat-cyber-walon .price del,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price del,
html body li.product.product_cat-cyber-walon .price del *,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price del *{
  color:#53605b !important;font:400 .92rem/1.2 "Wcy Barlow","Arial",sans-serif !important;letter-spacing:0;opacity:1;text-decoration:line-through !important;
}
html body li.product.product_cat-cyber-walon .wpdp-pct,
html .woocommerce ul.products li.product.product_cat-cyber-walon .wpdp-pct{
  background:#00AAD2 !important;color:#0b0b0b !important;border-radius:0 !important;
  font:italic 700 1rem/1.1 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;padding:3px 8px 2px !important;
}

/* Celular: sin franja (la vista rápida es solo de escritorio y la foto queda limpia) */
@media (max-width:768px){
  li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::before,
  li.product.product_cat-cyber-walon .astra-shop-thumbnail-wrap::after{display:none}
  html body li.product.product_cat-cyber-walon .ast-onsale-card,
html .woocommerce ul.products li.product.product_cat-cyber-walon .ast-onsale-card{font-size:.95rem !important;padding:3px 8px 2px !important}
  html body li.product.product_cat-cyber-walon .price,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price,
  html body li.product.product_cat-cyber-walon .price ins,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price ins,
  html body li.product.product_cat-cyber-walon .price ins *,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price ins *,
  html body li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount,
  html body li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount *,
html .woocommerce ul.products li.product.product_cat-cyber-walon .price > .woocommerce-Price-amount *{font-size:1.3rem !important}
  html body li.product.product_cat-cyber-walon .woocommerce-loop-product__title.woocommerce-loop-product__title.woocommerce-loop-product__title,
html .woocommerce ul.products li.product.product_cat-cyber-walon .woocommerce-loop-product__title.woocommerce-loop-product__title.woocommerce-loop-product__title{font-size:.86rem !important}
}

/* ---------------- FICHA DE PRODUCTO ---------------- */

html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary h1.product_title.entry-title{
  font-family:"Wcy Barlow Condensed","Arial Narrow",sans-serif !important;font-weight:700 !important;
  font-size:clamp(1.55rem,3.4vw,2.4rem) !important;line-height:1 !important;text-transform:uppercase !important;letter-spacing:.005em !important;color:#0b0b0b !important;
}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price{
  display:flex !important;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:6px 0 8px;
}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price ins{order:1}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price del{order:2}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price ins,
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price ins *{
  background:none !important;text-decoration:none !important;color:#04708f !important;
  font:700 2.7rem/1 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;letter-spacing:0;
}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price del,
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price del *{
  color:#53605b !important;font:400 1rem/1.2 "Wcy Barlow","Arial",sans-serif !important;opacity:1;text-decoration:line-through !important;
}
html body.single-product.wcy-pdp-cyber.wcy-pdp-cyber.wcy-pdp-cyber div.summary.entry-summary p.price .wpdp-pct{
  order:3;background:#00AAD2 !important;color:#0b0b0b !important;border-radius:0 !important;
  font:italic 700 1.15rem/1.1 "Wcy Barlow Condensed","Arial Narrow",sans-serif !important;padding:3px 9px 2px !important;margin:0 !important;
}

/* Foto principal (escritorio): sello Cyber con isotipo en lugar del porcentaje rojo */
body.wcy-pdp-cyber .ast-article-single > .ast-onsale-card{
  top:10px !important;left:10px !important;border-radius:0 !important;box-shadow:none !important;
  background:#8FE6C8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 12.43 50.75 35.14' fill='%230b0b0b'%3E%3Cpolygon points='31.23 24.14 21.47 38.78 21.47 38.78 15.61 47.57 9.76 38.78 0 24.14 11.71 24.14 15.61 30 19.52 24.14 11.71 12.43 23.42 12.43 31.23 24.14'/%3E%3Cpolygon points='50.75 24.14 35.13 47.57 29.28 38.78 39.04 24.14 31.23 12.43 42.94 12.43 50.75 24.14'/%3E%3C/svg%3E") no-repeat 10px center / 27px auto !important;
  color:transparent !important;font-size:0 !important;line-height:1 !important;
  display:inline-flex !important;align-items:center;min-height:30px;padding:5px 12px 4px 46px !important;
}
body.wcy-pdp-cyber .ast-article-single > .ast-onsale-card::after{
  content:"Cyber";font:700 .95rem/1 "Wcy Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#0b0b0b;
}
/* Celular: sin sello sobre la foto */
@media (max-width:921px){
  body.wcy-pdp-cyber .ast-article-single > .ast-onsale-card{display:none !important}
}

/* Bloque "Precio Cyber Walon" y ahorro */
.wcy-pdp{margin:16px 0 10px;background:linear-gradient(115deg,#8FE6C8,#B3E2B8);color:#0b0b0b;display:grid;gap:3px;padding:14px 16px}
.wcy-pdp__k{font:700 1.1rem/1.1 "Wcy Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.wcy-pdp__d{font:italic 700 1.7rem/1.1 "Wcy Barlow Condensed","Arial Narrow",sans-serif}
.wcy-pdp__t{font:400 .85rem/1.4 "Wcy Barlow","Arial",sans-serif;color:#1d2b26}
.wcy-save{display:block;width:max-content;margin:0 0 10px;font:600 .95rem/1.3 "Wcy Barlow","Arial",sans-serif;color:#0f6b3d;background:#dff3e6;padding:4px 10px}
.wcy-save[hidden]{display:none}
