/* ==========================================================
   KAZOFI VISUAL v4 — PREMIUM MARKETPLACE
   Basado en clases reales auditadas del theme WoodMart 7.5.1
   SOLO estilos visuales — no modifica lógica PHP/WC/n8n
   ========================================================== */

/* ── Variables ──────────────────────────────────────────── */
:root {
  --kz-green:       #00C853;
  --kz-green-hover: #00E676;
  --kz-green-dark:  #124734;
  --kz-red:         #E53935;
  --kz-orange:      #FF6D00;
  --kz-bg:          #F4F6F8;
  --kz-white:       #ffffff;
  --kz-text:        #1a1a2e;
  --kz-muted:       #6b7280;
  --kz-border:      #eaecf0;
  --kz-shadow-sm:   0 1px 6px rgba(0,0,0,.06);
  --kz-shadow:      0 2px 14px rgba(0,0,0,.09);
  --kz-shadow-lg:   0 8px 32px rgba(0,0,0,.13);
  --kz-radius:      14px;
  --kz-radius-sm:   9px;
  --kz-radius-xs:   6px;
  --kz-transition:  .22s ease;
}

/* ══════════════════════════════════════════════════════════
   1. HEADER — verde oscuro premium
   ══════════════════════════════════════════════════════════ */
.whb-header,
.whb-row,
.whb-main-header,
.woodmart-header,
.site-header,
.header-main {
  background-color: var(--kz-green-dark) !important;
}

.whb-header .woodmart-navigation .menu > li > a,
.whb-header .woodmart-navigation .menu > li > span,
.woodmart-navigation > ul > li > a,
.whb-header a,
.whb-header .woodmart-logo-wrap a {
  color: #fff !important;
}

.whb-header .woodmart-navigation .menu > li > a:hover,
.woodmart-navigation > ul > li > a:hover {
  color: var(--kz-green) !important;
  opacity: 1 !important;
}

.whb-header .woodmart-header-toolbar a,
.woodmart-mini-cart .cart-toggle-button,
.woodmart-header-toolbar .header-tools-item .wd-tools-icon,
.whb-header svg,
.whb-header .header-tools-icon {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

.woodmart-cart-count,
.woodmart-cart-amount,
.whb-header .wd-header-cart .count {
  background: var(--kz-red) !important;
  color: #fff !important;
  border-radius: 50% !important;
}

.woodmart-navigation .sub-menu,
.woodmart-navigation ul ul,
.whb-header .sub-menu {
  background: var(--kz-green-dark) !important;
  border: none !important;
  box-shadow: var(--kz-shadow-lg) !important;
}

.woodmart-navigation .sub-menu li a,
.whb-header .sub-menu li a {
  color: rgba(255,255,255,.85) !important;
}

.woodmart-navigation .sub-menu li a:hover,
.whb-header .sub-menu li a:hover {
  color: var(--kz-green) !important;
  background: rgba(255,255,255,.06) !important;
}

/* ══════════════════════════════════════════════════════════
   2. FONDO GLOBAL — solo en páginas WooCommerce
   ══════════════════════════════════════════════════════════ */
body.woocommerce,
body.woocommerce-page,
body.woocommerce .site-content,
body.woocommerce-page .site-content,
body.woocommerce main,
body.woocommerce-page main,
body.woocommerce .woodmart-site-main,
body.woocommerce-page .woodmart-site-main {
  background-color: var(--kz-bg) !important;
}

/* ══════════════════════════════════════════════════════════
   3. TIPOGRAFÍA GLOBAL
   ══════════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5,
.woocommerce h1, .woocommerce h2, .woocommerce h3 {
  letter-spacing: -.2px;
  font-weight: 700;
}

.woocommerce .page-title,
.woodmart-page-title,
.woodmart-title-block h1 {
  color: var(--kz-green-dark) !important;
  font-weight: 800 !important;
}

.woocommerce .woocommerce-breadcrumb,
.breadcrumbs {
  color: #9ca3af !important;
  font-size: .82rem !important;
}

.woocommerce .woocommerce-breadcrumb a,
.breadcrumbs a {
  color: var(--kz-green-dark) !important;
}

/* ══════════════════════════════════════════════════════════
   4. BOTONES GLOBALES — verde con hover brillante
   ══════════════════════════════════════════════════════════ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit,
.woocommerce .cart .button,
.woocommerce .checkout-button,
.add_to_cart_button,
.woodmart-btn,
.wd-add-btn,
.woodmart-button,
a.checkout-button,
.wc-proceed-to-checkout a,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background-color: var(--kz-green) !important;
  background: var(--kz-green) !important;
  color: #fff !important;
  border-color: var(--kz-green) !important;
  border-radius: var(--kz-radius-sm) !important;
  font-weight: 700 !important;
  letter-spacing: .15px !important;
  transition: background var(--kz-transition), box-shadow var(--kz-transition), transform .15s ease !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce .checkout-button:hover,
.add_to_cart_button:hover,
.woodmart-btn:hover,
.wd-add-btn:hover,
.wc-proceed-to-checkout a:hover {
  background-color: var(--kz-green-hover) !important;
  background: var(--kz-green-hover) !important;
  border-color: var(--kz-green-hover) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(0,200,83,.38) !important;
  transform: translateY(-1px) !important;
}

/* Botón ghost/outline */
.woodmart-btn-style-ghost,
.woocommerce a.button.button-ghost {
  background: transparent !important;
  border: 2px solid var(--kz-green) !important;
  color: var(--kz-green) !important;
}

.woodmart-btn-style-ghost:hover {
  background: var(--kz-green) !important;
  color: #fff !important;
}

/* ══════════════════════════════════════════════════════════
   5. BADGES — sale, nuevo, stock
   ══════════════════════════════════════════════════════════ */
.woocommerce span.onsale,
span.onsale,
.onsale,
.woodmart-label,
.woodmart-product-label,
.wd-label-sale,
.wd-label.wd-label-sale,
.product-label.onsale {
  background: var(--kz-red) !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
  padding: 3px 9px !important;
  border: none !important;
  box-shadow: none !important;
  line-height: 1.4 !important;
}

.wd-label.wd-label-new,
.woodmart-label.new-label {
  background: var(--kz-green-dark) !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  padding: 3px 9px !important;
}

.wd-label.wd-label-stock,
.product-label.stock {
  background: var(--kz-orange) !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  padding: 3px 9px !important;
}

.product-labels.labels-rounded {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  z-index: 3 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  pointer-events: none !important;
}

/* ══════════════════════════════════════════════════════════
   6. SHOP — PRODUCT CARDS (clases reales WoodMart)
   ══════════════════════════════════════════════════════════ */

/* Card container */
.wd-product.wd-col.product-grid-item,
.woocommerce ul.products li.product {
  background: var(--kz-white) !important;
  border: 1px solid var(--kz-border) !important;
  border-radius: var(--kz-radius) !important;
  box-shadow: var(--kz-shadow-sm) !important;
  overflow: hidden !important;
  transition: box-shadow var(--kz-transition), transform var(--kz-transition), border-color var(--kz-transition) !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
}

.wd-product.wd-col.product-grid-item:hover,
.woocommerce ul.products li.product:hover {
  box-shadow: var(--kz-shadow-lg) !important;
  transform: translateY(-5px) !important;
  border-color: #d1d5db !important;
}

/* Imagen del producto — portrait friendly */
.product-element-top.wd-quick-shop {
  background: #f8f9fa !important;
  overflow: hidden !important;
  position: relative !important;
  min-height: 200px !important;
}

.product-element-top.wd-quick-shop .product-image-link {
  display: block !important;
}

.product-element-top.wd-quick-shop .attachment-woocommerce_thumbnail,
.product-element-top.wd-quick-shop img {
  width: 100% !important;
  display: block !important;
  transition: transform .35s ease !important;
  object-fit: cover !important;
  min-height: 220px !important;
  max-height: 280px !important;
}

.wd-product:hover .attachment-woocommerce_thumbnail,
li.product:hover .attachment-woocommerce_thumbnail {
  transform: scale(1.04) !important;
}

/* Contenido de la card */
.product-element-bottom.product-information {
  padding: 14px 16px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  flex: 1 !important;
  background: var(--kz-white) !important;
}

/* Título — h3.wd-entities-title */
.product-element-bottom .wd-entities-title {
  font-size: .9rem !important;
  font-weight: 700 !important;
  color: var(--kz-text) !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}

.product-element-bottom .wd-entities-title a {
  color: var(--kz-text) !important;
  text-decoration: none !important;
}

.product-element-bottom .wd-entities-title a:hover {
  color: var(--kz-green-dark) !important;
}

/* Categoría del producto */
.product-element-bottom .wd-product-cats {
  font-size: .72rem !important;
  color: var(--kz-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
  margin: 0 !important;
}

.product-element-bottom .wd-product-cats a {
  color: var(--kz-muted) !important;
}

/* Rating + precio */
.product-element-bottom .product-rating-price {
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

.product-element-bottom .price {
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  color: var(--kz-text) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  flex-wrap: wrap !important;
  line-height: 1.2 !important;
}

.product-element-bottom .price ins,
.product-element-bottom .price ins .woocommerce-Price-amount {
  color: var(--kz-red) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.product-element-bottom .price del,
.product-element-bottom .price del .woocommerce-Price-amount {
  color: #b0b8c1 !important;
  font-size: .85rem !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

/* Estrellitas */
.product-element-bottom .star-rating {
  font-size: .75rem !important;
  margin: 0 !important;
}

.star-rating span::before,
.woocommerce .star-rating span::before {
  color: #f59e0b !important;
}

/* Botón "Añadir al carrito" en grid */
.add-to-cart-loop,
.add_to_cart_button.ajax_add_to_cart,
.product-element-bottom .button {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 11px 14px !important;
  font-size: .85rem !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  background: var(--kz-green) !important;
  color: #fff !important;
  border: none !important;
  margin-top: auto !important;
  cursor: pointer !important;
  transition: background var(--kz-transition), box-shadow var(--kz-transition) !important;
}

.add-to-cart-loop:hover,
.add_to_cart_button.ajax_add_to_cart:hover,
.product-element-bottom .button:hover {
  background: #00b347 !important;
  box-shadow: 0 4px 16px rgba(0,200,83,.35) !important;
  color: #fff !important;
}

/* Grid layout */
.products.wd-products.wd-grid-g {
  gap: 20px !important;
}

/* ══════════════════════════════════════════════════════════
   7. SHOP — SIDEBAR & TOOLBAR
   ══════════════════════════════════════════════════════════ */
.woocommerce-page .widget,
.woodmart-sidebar .widget,
.area-sidebar-shop .widget {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  padding: 20px 22px !important;
  margin-bottom: 16px !important;
  box-shadow: var(--kz-shadow-sm) !important;
  border: 1px solid var(--kz-border) !important;
}

.woodmart-sidebar .widget-title,
.woocommerce-page .widget-title,
.area-sidebar-shop .widget-title {
  font-size: .82rem !important;
  font-weight: 700 !important;
  color: var(--kz-green-dark) !important;
  text-transform: uppercase !important;
  letter-spacing: .6px !important;
  margin-bottom: 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--kz-border) !important;
}

.woocommerce-widget-layered-nav-list__item a {
  color: #444 !important;
  font-size: .875rem !important;
}

.woocommerce-widget-layered-nav-list__item a:hover {
  color: var(--kz-green) !important;
}

.widget_price_filter .ui-slider .ui-slider-range {
  background: var(--kz-green) !important;
}

.widget_price_filter .ui-slider .ui-slider-handle {
  background: var(--kz-green) !important;
  border-color: var(--kz-green) !important;
}

.widget_price_filter .price_slider_amount .button {
  background: var(--kz-green) !important;
  color: #fff !important;
  border-radius: var(--kz-radius-xs) !important;
  font-size: .8rem !important;
  padding: 6px 14px !important;
}

/* Toolbar (ordenar / per page) */
.woocommerce-ordering select {
  border-radius: var(--kz-radius-xs) !important;
  border: 1.5px solid var(--kz-border) !important;
  padding: 7px 12px !important;
  font-size: .875rem !important;
  background: var(--kz-white) !important;
  color: var(--kz-text) !important;
}

.woocommerce-result-count {
  font-size: .82rem !important;
  color: var(--kz-muted) !important;
}

/* ══════════════════════════════════════════════════════════
   8. PRODUCT PAGE — layout premium
   ══════════════════════════════════════════════════════════ */

/* Página de producto: fondo blanco, card elevada */
.single-product .content-layout-wrapper {
  background: transparent !important;
}

.single-product .col-lg-6.product-images,
.single-product .col-md-6.product-images {
  padding-right: 24px !important;
}

/* Galería: thumbnails a la izquierda (ya configurado por theme) */
.woocommerce-product-gallery.wd-has-thumb {
  border-radius: var(--kz-radius) !important;
  overflow: hidden !important;
}

.woocommerce-product-gallery .wp-post-image {
  border-radius: var(--kz-radius-sm) !important;
  width: 100% !important;
}

/* Summary — columna derecha */
.single-product .summary.entry-summary {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  padding: 28px !important;
  box-shadow: var(--kz-shadow) !important;
  border: 1px solid var(--kz-border) !important;
}

/* Breadcrumb en producto */
.single-breadcrumbs-wrapper {
  font-size: .78rem !important;
  color: var(--kz-muted) !important;
}

/* Título del producto */
.single-product h1.product_title.wd-entities-title {
  font-size: 1.7rem !important;
  font-weight: 800 !important;
  color: var(--kz-text) !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

/* Rating en producto */
.single-product .woocommerce-product-rating {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

.single-product .woocommerce-review-link {
  font-size: .82rem !important;
  color: var(--kz-muted) !important;
}

/* Precio del producto */
.single-product p.price,
.single-product span.price {
  background: linear-gradient(135deg, #f0fff6 0%, #e8f8ef 100%) !important;
  border: 1.5px solid #c3e6cb !important;
  border-radius: var(--kz-radius-sm) !important;
  padding: 14px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
}

.single-product p.price .woocommerce-Price-amount,
.single-product span.price .woocommerce-Price-amount {
  font-size: 1.8rem !important;
  font-weight: 800 !important;
  color: var(--kz-green-dark) !important;
}

.single-product p.price del .woocommerce-Price-amount,
.single-product span.price del .woocommerce-Price-amount {
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  color: #9ca3af !important;
}

.single-product p.price ins .woocommerce-Price-amount,
.single-product span.price ins .woocommerce-Price-amount {
  font-size: 1.8rem !important;
  font-weight: 800 !important;
  color: var(--kz-red) !important;
}

/* Short description */
.single-product .woocommerce-product-details__short-description {
  font-size: .92rem !important;
  color: #4b5563 !important;
  line-height: 1.65 !important;
  border-left: 3px solid var(--kz-green) !important;
  padding-left: 14px !important;
  margin: 0 !important;
}

/* Cantidad */
.single-product .quantity .qty {
  border: 1.5px solid var(--kz-border) !important;
  border-radius: var(--kz-radius-xs) !important;
  padding: 10px 12px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  width: 70px !important;
  background: var(--kz-white) !important;
  color: var(--kz-text) !important;
}

/* CTA "Añadir al carrito" en producto */
.single-product .single_add_to_cart_button.button.alt {
  background: linear-gradient(135deg, var(--kz-green) 0%, #00a83a 100%) !important;
  min-height: 54px !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .5px !important;
  width: 100% !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(0,200,83,.30) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: none !important;
  padding: 14px 24px !important;
  flex: 1 !important;
}

.single-product .single_add_to_cart_button.button.alt:hover {
  background: linear-gradient(135deg, var(--kz-green-hover) 0%, var(--kz-green) 100%) !important;
  box-shadow: 0 6px 28px rgba(0,200,83,.45) !important;
  transform: translateY(-2px) !important;
  color: #fff !important;
}

/* Cart form layout */
.single-product form.cart {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.single-product form.cart .cart-action-wrap {
  display: flex !important;
  gap: 12px !important;
  align-items: stretch !important;
}

/* Trust bar — bloque visual debajo del CTA */
.single-product .cart-bottom-area,
.single-product .woodmart-add-to-cart-wrap + * {
  margin-top: 2px !important;
}

.single-product form.cart::after {
  content: "🚚 Envío rápido en Perú   •   🔒 Pago 100% seguro   •   ✅ Garantía total";
  display: block !important;
  padding: 11px 16px !important;
  background: #f0faf4 !important;
  border: 1px solid #c3e6cb !important;
  border-radius: var(--kz-radius-sm) !important;
  font-size: .78rem !important;
  color: var(--kz-green-dark) !important;
  font-weight: 600 !important;
  text-align: center !important;
  letter-spacing: .2px !important;
}

/* Stock indicators */
.single-product .stock.in-stock {
  color: var(--kz-green-dark) !important;
  font-weight: 700 !important;
  font-size: .85rem !important;
}

.single-product .stock.out-of-stock {
  color: var(--kz-red) !important;
  font-weight: 700 !important;
  font-size: .85rem !important;
}

/* Product meta (SKU, categories) */
.single-product .product_meta {
  border-top: 1px solid var(--kz-border) !important;
  padding-top: 12px !important;
  font-size: .8rem !important;
  color: var(--kz-muted) !important;
}

.single-product .product_meta a {
  color: var(--kz-green-dark) !important;
}

/* ══════════════════════════════════════════════════════════
   9. PRODUCT TABS — estilo Vital Sphere
   ══════════════════════════════════════════════════════════ */

.woocommerce-tabs.wc-tabs-wrapper {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  overflow: hidden !important;
  border: 1px solid var(--kz-border) !important;
  box-shadow: var(--kz-shadow-sm) !important;
  margin-top: 28px !important;
}

/* Nav tabs */
.wd-nav.wd-nav-tabs.wc-tabs {
  border-bottom: 2px solid var(--kz-border) !important;
  background: #fafbfc !important;
  margin: 0 !important;
  padding: 0 20px !important;
  display: flex !important;
  gap: 0 !important;
  list-style: none !important;
}

.wd-nav.wd-nav-tabs.wc-tabs li {
  background: transparent !important;
  border: none !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  margin-bottom: -2px !important;
  list-style: none !important;
}

.wd-nav.wd-nav-tabs.wc-tabs li.active {
  border-bottom-color: var(--kz-green) !important;
  background: transparent !important;
}

.wd-nav.wd-nav-tabs.wc-tabs li a {
  display: block !important;
  padding: 14px 20px !important;
  font-weight: 600 !important;
  font-size: .875rem !important;
  color: var(--kz-muted) !important;
  background: transparent !important;
  border: none !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: color var(--kz-transition) !important;
}

.wd-nav.wd-nav-tabs.wc-tabs li.active a {
  color: var(--kz-green-dark) !important;
  font-weight: 700 !important;
}

.wd-nav.wd-nav-tabs.wc-tabs li a:hover {
  color: var(--kz-green) !important;
}

/* Tab panels */
.woocommerce-Tabs-panel {
  padding: 24px 28px !important;
  background: var(--kz-white) !important;
  border: none !important;
}

/* ══════════════════════════════════════════════════════════
   10. CARRITO — limpio y estructurado
   ══════════════════════════════════════════════════════════ */
.woocommerce-cart-form {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--kz-shadow-sm) !important;
  border: 1px solid var(--kz-border) !important;
}

.woocommerce table.shop_table {
  border-radius: var(--kz-radius) !important;
  border: none !important;
  overflow: hidden !important;
  width: 100% !important;
}

.woocommerce table.shop_table thead th {
  background: var(--kz-green-dark) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: .85rem !important;
  border: none !important;
  padding: 12px 16px !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
}

.woocommerce table.shop_table td {
  border-color: var(--kz-border) !important;
  padding: 14px 16px !important;
  vertical-align: middle !important;
}

.woocommerce-cart-form .product-thumbnail img {
  border-radius: var(--kz-radius-sm) !important;
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
}

/* Totales del carrito */
.woocommerce .cart_totals,
.woocommerce-page .cart_totals {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  border: 1px solid var(--kz-border) !important;
  padding: 22px !important;
  box-shadow: var(--kz-shadow) !important;
}

.cart_totals h2 {
  font-size: .95rem !important;
  font-weight: 800 !important;
  color: var(--kz-green-dark) !important;
  border-bottom: 2px solid var(--kz-border) !important;
  padding-bottom: 10px !important;
  margin-bottom: 16px !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
}

.wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a {
  min-height: 52px !important;
  font-size: .95rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
}

/* Mensajes de WooCommerce */
.woocommerce-message {
  border-top-color: var(--kz-green) !important;
  background: #f0fdf4 !important;
  border-radius: var(--kz-radius-xs) !important;
}

.woocommerce-message::before {
  color: var(--kz-green) !important;
}

.woocommerce-info {
  border-top-color: var(--kz-green-dark) !important;
}

/* ══════════════════════════════════════════════════════════
   11. CHECKOUT — limpio, claro, con confianza
   ══════════════════════════════════════════════════════════ */
.woocommerce-checkout #customer_details,
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  padding: 24px !important;
  box-shadow: var(--kz-shadow-sm) !important;
  border: 1px solid var(--kz-border) !important;
  margin-bottom: 20px !important;
}

.woocommerce-checkout h3,
.woocommerce-checkout .woocommerce-billing-fields h3 {
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: var(--kz-green-dark) !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--kz-border) !important;
  margin-bottom: 18px !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
}

.woocommerce-checkout label,
.woocommerce form .form-row label {
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: #374151 !important;
  margin-bottom: 5px !important;
  display: block !important;
}

/* Campos del formulario */
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="number"],
.woocommerce input[type="password"],
.woocommerce select,
.woocommerce textarea,
.woocommerce .input-text {
  border-radius: var(--kz-radius-xs) !important;
  border: 1.5px solid #d1d5db !important;
  padding: 11px 14px !important;
  font-size: .9rem !important;
  transition: border-color var(--kz-transition), box-shadow var(--kz-transition) !important;
  background: var(--kz-white) !important;
  color: var(--kz-text) !important;
}

.woocommerce input[type="text"]:focus,
.woocommerce input[type="email"]:focus,
.woocommerce input[type="tel"]:focus,
.woocommerce input[type="password"]:focus,
.woocommerce textarea:focus,
.woocommerce .input-text:focus {
  border-color: var(--kz-green) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,200,83,.12) !important;
}

/* Order review */
#order_review,
.woocommerce-checkout-review-order {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  border: 1px solid var(--kz-border) !important;
  padding: 24px !important;
  box-shadow: var(--kz-shadow) !important;
}

#payment {
  background: var(--kz-white) !important;
  border-radius: var(--kz-radius) !important;
  border: 1px solid var(--kz-border) !important;
  overflow: hidden !important;
}

/* Botón "Realizar pedido" */
#place_order,
.woocommerce-checkout #place_order {
  min-height: 54px !important;
  font-size: 1rem !important;
  width: 100% !important;
  display: block !important;
  text-transform: uppercase !important;
  letter-spacing: .5px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, var(--kz-green) 0%, #00a83a 100%) !important;
  box-shadow: 0 4px 20px rgba(0,200,83,.28) !important;
}

#place_order:hover {
  box-shadow: 0 6px 28px rgba(0,200,83,.42) !important;
  transform: translateY(-1px) !important;
}

/* ══════════════════════════════════════════════════════════
   12. FORMULARIOS — validación visual
   ══════════════════════════════════════════════════════════ */
.woocommerce form .form-row.woocommerce-invalid .select2-container,
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
  border-color: var(--kz-red) !important;
}

.woocommerce form .form-row.woocommerce-validated .select2-container--default .select2-selection--single,
.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
  border-color: var(--kz-green) !important;
}

/* ══════════════════════════════════════════════════════════
   13. PAGINACIÓN
   ══════════════════════════════════════════════════════════ */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  border-color: var(--kz-border) !important;
  border-radius: var(--kz-radius-xs) !important;
  margin: 0 2px !important;
  color: var(--kz-text) !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--kz-green) !important;
  color: #fff !important;
  border-color: var(--kz-green) !important;
}

/* ══════════════════════════════════════════════════════════
   14. FOOTER
   ══════════════════════════════════════════════════════════ */
.site-footer a:hover {
  color: var(--kz-green) !important;
}

/* ══════════════════════════════════════════════════════════
   15. MISC — scroll, mensajes, notificaciones
   ══════════════════════════════════════════════════════════ */
html { scroll-behavior: smooth; }

/* Notificación de carrito flotante */
.wd-cart-notice,
.added_to_cart {
  background: var(--kz-green) !important;
  color: #fff !important;
  border-radius: var(--kz-radius-sm) !important;
}

/* ══════════════════════════════════════════════════════════
   16. RESPONSIVE — TABLET (768–1024px)
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) and (min-width: 769px) {
  .single-product .summary.entry-summary {
    padding: 20px !important;
  }

  .single-product .col-lg-6.product-images {
    padding-right: 16px !important;
  }

  .single-product h1.product_title.wd-entities-title {
    font-size: 1.45rem !important;
  }
}

/* ══════════════════════════════════════════════════════════
   17. RESPONSIVE — MÓVIL (< 768px)
   OBJETIVO: replicar vista mobile de mockups
   ══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* Fondos */
  body.woocommerce,
  body.woocommerce-page {
    background: var(--kz-bg) !important;
  }

  /* Shop: 2 columnas compactas */
  .woocommerce ul.products,
  .products.wd-products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  .product-element-top.wd-quick-shop .attachment-woocommerce_thumbnail {
    min-height: 150px !important;
    max-height: 180px !important;
  }

  .product-element-bottom.product-information {
    padding: 10px 12px 14px !important;
    gap: 5px !important;
  }

  .product-element-bottom .wd-entities-title {
    font-size: .78rem !important;
  }

  .product-element-bottom .price {
    font-size: .95rem !important;
  }

  .add-to-cart-loop,
  .add_to_cart_button.ajax_add_to_cart,
  .product-element-bottom .button {
    padding: 9px 10px !important;
    font-size: .78rem !important;
    border-radius: 8px !important;
  }

  /* Producto page: stack vertical */
  .single-product .col-lg-6.product-images,
  .single-product .col-md-6.product-images {
    padding-right: 0 !important;
    width: 100% !important;
  }

  .single-product .summary.entry-summary {
    padding: 18px !important;
    gap: 12px !important;
    margin-top: 12px !important;
    border-radius: var(--kz-radius-sm) !important;
  }

  .single-product h1.product_title.wd-entities-title {
    font-size: 1.3rem !important;
  }

  .single-product p.price .woocommerce-Price-amount,
  .single-product span.price ins .woocommerce-Price-amount {
    font-size: 1.5rem !important;
  }

  /* CTA sticky en móvil */
  .single-product .single_add_to_cart_button.button.alt {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    border-radius: 0 !important;
    width: 100vw !important;
    min-height: 58px !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,.18) !important;
    font-size: .95rem !important;
    margin: 0 !important;
    padding: 16px !important;
  }

  /* Espacio para no tapar contenido con el CTA sticky */
  .single-product .summary.entry-summary {
    padding-bottom: 80px !important;
  }

  /* Trust bar compacta */
  .single-product form.cart::after {
    font-size: .7rem !important;
    padding: 8px 10px !important;
  }

  /* Tabs: scroll horizontal */
  .wd-nav.wd-nav-tabs.wc-tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding: 0 12px !important;
    scrollbar-width: none !important;
  }

  .wd-nav.wd-nav-tabs.wc-tabs::-webkit-scrollbar {
    display: none !important;
  }

  .wd-nav.wd-nav-tabs.wc-tabs li a {
    padding: 12px 14px !important;
    font-size: .8rem !important;
    white-space: nowrap !important;
  }

  .woocommerce-Tabs-panel {
    padding: 18px !important;
  }

  /* Checkout mobile */
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout .woocommerce-billing-fields {
    padding: 16px !important;
  }

  #place_order {
    min-height: 52px !important;
    font-size: .9rem !important;
  }

  /* Carrito: tabla scroll horizontal */
  .woocommerce-cart-form {
    overflow-x: auto !important;
  }

  .woocommerce table.shop_table td {
    padding: 10px 12px !important;
  }

  /* Hover effects off en móvil */
  .wd-product.wd-col.product-grid-item:hover,
  .woocommerce ul.products li.product:hover {
    transform: none !important;
  }

  .woocommerce a.button:hover,
  .add_to_cart_button:hover {
    transform: none !important;
  }
}

/* ══════════════════════════════════════════════════════════
   18. ELEMENTOS INYECTADOS VIA PHP HOOKS
   ══════════════════════════════════════════════════════════ */

/* Trust bar — 3 columnas */
.kz-trust-bar {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
  margin-top: 14px !important;
  padding: 14px !important;
  background: #f8fffe !important;
  border: 1px solid #c3e6cb !important;
  border-radius: 10px !important;
}

.kz-trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.kz-trust-icon {
  font-size: 1.3rem !important;
  flex-shrink: 0 !important;
}

.kz-trust-text {
  display: flex !important;
  flex-direction: column !important;
}

.kz-trust-text strong {
  font-size: .78rem !important;
  font-weight: 700 !important;
  color: #124734 !important;
  line-height: 1.2 !important;
}

.kz-trust-text span {
  font-size: .7rem !important;
  color: #6b7280 !important;
  line-height: 1.2 !important;
}

/* Urgency badge */
.kz-urgency-badge {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #fff3e0 !important;
  border: 1px solid #ffcc80 !important;
  border-radius: 8px !important;
  padding: 9px 14px !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  color: #e65100 !important;
  margin-bottom: 10px !important;
}

.kz-urgency-dot {
  width: 8px !important;
  height: 8px !important;
  background: #e65100 !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  animation: kz-pulse 1.4s ease-in-out infinite !important;
}

@keyframes kz-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .5; transform: scale(1.3); }
}

/* Payment row */
.kz-payment-row {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  margin-top: 10px !important;
  padding: 10px 14px !important;
  background: #fafafa !important;
  border: 1px solid #eaecf0 !important;
  border-radius: 8px !important;
}

.kz-payment-label {
  font-size: .73rem !important;
  color: #6b7280 !important;
  font-weight: 600 !important;
  margin-right: 2px !important;
}

.kz-payment-badge {
  padding: 4px 10px !important;
  border-radius: 20px !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  letter-spacing: .2px !important;
}

.kz-yape  { background: #6a1b9a !important; color: #fff !important; }
.kz-plin  { background: #0d47a1 !important; color: #fff !important; }
.kz-card  { background: #37474f !important; color: #fff !important; }
.kz-transfer { background: #2e7d32 !important; color: #fff !important; }

/* Popular / Featured badges en cards */
.kz-popular-badge,
.kz-featured-badge {
  display: inline-block !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: .68rem !important;
  font-weight: 700 !important;
  margin: 2px 0 !important;
}

.kz-popular-badge {
  background: #fff3e0 !important;
  color: #e65100 !important;
  border: 1px solid #ffcc80 !important;
}

.kz-featured-badge {
  background: #fffde7 !important;
  color: #f57f17 !important;
  border: 1px solid #ffe082 !important;
}

/* Mobile: trust bar 1 columna */
@media (max-width: 768px) {
  .kz-trust-bar {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 12px !important;
  }

  .kz-payment-row {
    gap: 5px !important;
  }

  .kz-urgency-badge {
    font-size: .76rem !important;
    padding: 8px 12px !important;
  }
}