/*
Theme Name: American Hobbies Store
Theme URI: https://americanhobbiesstore.cl
Description: Tema hijo de Kadence para American Hobbies Store. Reproduce el diseño de la maqueta sobre WooCommerce real (catálogo sincronizado con el POS): header, footer y cards con datos dinámicos.
Author: Uli + Claude
Template: kadence
Version: 1.4.4
*/

/* ===== Paleta de marca AHS ===== */
:root{
  --ahs-turquesa: #1ABC9C;
  --ahs-turquesa-dark: #16A085;
  --ahs-rojo: #E63946;
  --ahs-negro: #0E0E10;
  --ahs-on-turquesa: #06231d;
  --ahs-texto: #1F1F23;
  --ahs-gris: #6B6B72;
  --ahs-fondo: #F5F5F7;
  --ahs-borde: #E5E5EA;
  --ahs-container: 1200px;
}

/* ===== Ocultar header/footer propios de Kadence (usamos los nuestros) ===== */
#masthead, .site-header, #colophon, .site-footer,
.site-top-header-wrap, .site-main-header-wrap, .site-bottom-header-wrap{
  display: none !important;
}

/* ===== Barra superior (anuncio) ===== */
.ahs-topbar{
  background: var(--ahs-negro);
  color: #fff;
  font-size: 12.5px;
  text-align: center;
  padding: 8px 16px;
}

/* ===== Cabecera ===== */
.ahs-header{
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--ahs-borde);
}
.ahs-header-inner{
  max-width: var(--ahs-container);
  margin: 0 auto;
  padding: 0 24px;
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.ahs-logo{ display: block; flex-shrink: 0; }
.ahs-logo img{ height: 70px !important; width: auto !important; max-width: none !important; display: block; }
.ahs-logo-text{ font-family: "Outfit", sans-serif; font-weight: 800; font-size: 22px; color: var(--ahs-negro); }

.ahs-nav{
  display: flex;
  align-items: center;
  gap: 28px;
  font-size: 14px;
  font-weight: 600;
}
.ahs-nav a{
  position: relative;
  color: var(--ahs-texto);
  text-decoration: none;
  transition: color .2s ease;
}
.ahs-nav a::after{
  content: "";
  position: absolute; left: 0; bottom: -6px;
  width: 0; height: 2px; background: var(--ahs-turquesa);
  transition: width .25s ease;
}
.ahs-nav a:hover{ color: var(--ahs-turquesa); }
.ahs-nav a:hover::after{ width: 100%; }
.ahs-nav a.ahs-nav-ofertas{ color: var(--ahs-rojo); }

.ahs-icons{ display: flex; align-items: center; gap: 20px; flex-shrink: 0; }
.ahs-icons a{ color: var(--ahs-texto); transition: color .2s ease; position: relative; display: inline-flex; }
.ahs-icons a:hover{ color: var(--ahs-turquesa); }
.ahs-icons svg{ width: 22px; height: 22px; }
.ahs-cart-count{
  position: absolute; top: -7px; right: -8px;
  background: var(--ahs-turquesa); color: #fff;
  font-size: 10px; font-weight: 700;
  width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}

/* Tira de categorías */
.ahs-catstrip{ background: var(--ahs-fondo); border-top: 1px solid var(--ahs-borde); }
.ahs-catstrip-inner{
  max-width: var(--ahs-container);
  margin: 0 auto; padding: 0 24px;
  height: 44px;
  display: flex; align-items: center; justify-content: center;
  gap: 22px; font-size: 14px; flex-wrap: wrap;
}
.ahs-catstrip-inner a{ color: var(--ahs-texto); text-decoration: none; transition: color .2s ease; }
.ahs-catstrip-inner a:hover{ color: var(--ahs-turquesa); }
.ahs-catstrip-inner a.is-first{ font-weight: 600; }

/* ===== Botón de menú (solo móvil) ===== */
.ahs-menu-btn{
  display: none;
  background: none; border: 0; padding: 6px; margin-left: -6px;
  color: var(--ahs-texto); cursor: pointer; border-radius: 8px;
}
.ahs-menu-btn:hover{ color: var(--ahs-turquesa); background: var(--ahs-fondo); }
.ahs-menu-btn svg{ width: 26px; height: 26px; display: block; }

/* ===== Buscador ===== */
.ahs-buscar-btn{
  background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--ahs-texto); display: inline-flex; transition: color .2s ease;
}
.ahs-buscar-btn:hover{ color: var(--ahs-turquesa); }
.ahs-buscar-btn svg{ width: 22px; height: 22px; display: block; }

.ahs-buscador{
  border-top: 1px solid var(--ahs-borde);
  background: var(--ahs-fondo);
  padding: 14px 24px;
}
.ahs-form-buscar{
  max-width: 680px; margin: 0 auto;
  display: flex; gap: 8px;
}
.ahs-form-buscar input[type="search"]{
  flex: 1; min-width: 0;
  padding: 12px 16px;
  font-family: inherit; font-size: 15px;
  border: 1px solid var(--ahs-borde); border-radius: 8px;
  background: #fff; color: var(--ahs-texto);
}
.ahs-form-buscar input[type="search"]:focus{
  outline: none; border-color: var(--ahs-turquesa);
  box-shadow: 0 0 0 3px rgba(26,188,156,.18);
}
.ahs-form-buscar button{
  flex-shrink: 0;
  padding: 0 18px;
  background: var(--ahs-turquesa); color: #fff;
  border: 0; border-radius: 8px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .2s ease;
}
.ahs-form-buscar button:hover{ background: var(--ahs-negro); }
.ahs-form-buscar button svg{ width: 20px; height: 20px; }

/* ===== Panel de navegación móvil =====
   IMPORTANTE: el atributo `hidden` del HTML oculta gracias a la hoja del
   navegador ([hidden]{display:none}), pero cualquier `display` declarado en
   una clase le gana por especificidad. Sin estas reglas el panel queda
   visible siempre y el botón de cerrar no tiene efecto. */
.ahs-drawer[hidden],
.ahs-drawer-fondo[hidden],
.ahs-buscador[hidden]{
  display: none !important;
}

.ahs-drawer-fondo{
  position: fixed; inset: 0; z-index: 90;
  background: rgba(14,14,16,.55);
  backdrop-filter: blur(2px);
}
.ahs-drawer{
  position: fixed; top: 0; left: 0; bottom: 0; z-index: 91;
  width: min(88vw, 340px);
  background: #fff;
  display: flex; flex-direction: column;
  overflow-y: auto;
  box-shadow: 6px 0 34px rgba(0,0,0,.28);
  animation: ahs-drawer-in .22s ease;
}
@keyframes ahs-drawer-in{ from{ transform: translateX(-100%); } to{ transform: none; } }
@media (prefers-reduced-motion: reduce){
  .ahs-drawer{ animation: none; }
}
.ahs-drawer-head{
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; border-bottom: 1px solid var(--ahs-borde);
}
.ahs-drawer-titulo{
  font-family: "Outfit", sans-serif; font-weight: 800; font-size: 15px;
  text-transform: uppercase; letter-spacing: .12em; color: var(--ahs-negro);
}
.ahs-drawer-cerrar{
  background: none; border: 0; padding: 4px; cursor: pointer;
  color: var(--ahs-gris); display: inline-flex; border-radius: 6px;
}
.ahs-drawer-cerrar:hover{ color: var(--ahs-negro); background: var(--ahs-fondo); }
.ahs-drawer-cerrar svg{ width: 22px; height: 22px; }
.ahs-drawer-buscador{ padding: 14px 18px; border-bottom: 1px solid var(--ahs-borde); }
.ahs-drawer-nav{ display: flex; flex-direction: column; padding: 8px 0; }
.ahs-drawer-nav a{
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px;
  padding: 12px 18px;
  color: var(--ahs-texto); text-decoration: none;
  font-weight: 600; font-size: 15.5px;
  border-left: 3px solid transparent;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.ahs-drawer-nav a:hover{
  background: var(--ahs-fondo); color: var(--ahs-turquesa-dark);
  border-left-color: var(--ahs-turquesa);
}
.ahs-drawer-nav--sec a{ font-weight: 500; font-size: 14.5px; padding: 10px 18px; }
.ahs-drawer-count{
  font-size: 12px; color: var(--ahs-gris); font-weight: 500;
  background: var(--ahs-fondo); border-radius: 20px; padding: 2px 9px;
}
.ahs-drawer-bloque{ border-top: 1px solid var(--ahs-borde); padding: 6px 0; }
.ahs-drawer-bloque h4{
  margin: 12px 18px 4px;
  font-size: 11.5px; text-transform: uppercase; letter-spacing: .12em;
  color: var(--ahs-gris); font-weight: 700;
}
.ahs-drawer-wsp{
  margin: 16px 18px 24px;
  padding: 13px 16px;
  background: var(--ahs-turquesa); color: #fff;
  border-radius: 9px; text-align: center; text-decoration: none;
  font-family: "Outfit", sans-serif; font-weight: 700; font-size: 14.5px;
  transition: background .2s ease;
}
.ahs-drawer-wsp:hover{ background: var(--ahs-negro); color: #fff; }

@media (max-width: 900px){
  .ahs-nav{ display: none; }
  .ahs-menu-btn{ display: inline-flex; }
  /* Logo al centro entre la hamburguesa y los iconos. */
  .ahs-header-inner{ gap: 12px; height: 74px; }
  .ahs-logo{ margin-right: auto; }
  .ahs-logo img{ height: 52px !important; }
  .ahs-icons{ gap: 16px; }
}
@media (max-width: 480px){
  .ahs-logo img{ height: 42px !important; }
  .ahs-header-inner{ padding: 0 16px; height: 66px; }
  .ahs-buscador{ padding: 12px 16px; }
  /* La cuenta vive en el panel: en pantallas muy chicas gana espacio el carrito. */
  .ahs-icono-cuenta{ display: none; }
}

/* ===== Hero del catálogo ===== */
.ahs-shop-hero{
  background: linear-gradient(120deg, var(--ahs-turquesa-dark), var(--ahs-turquesa) 55%, #0f6b5c);
  color: #fff;
  border-radius: 16px;
  padding: 40px 44px;
  margin: 0 0 28px;
}

/* Variante con la foto de la categoría de fondo. El velo oscuro se abre
   hacia la derecha para que la imagen respire donde no hay texto. */
.ahs-archive-hero--foto{
  --ahs-archive-img: none;
  background-image:
    linear-gradient(100deg, rgba(14,14,16,.93) 0%, rgba(14,14,16,.76) 42%, rgba(14,14,16,.34) 72%, rgba(22,160,133,.28) 100%),
    var(--ahs-archive-img);
  background-size: cover;
  background-position: center;
  min-height: 240px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ahs-archive-hero--foto .ahs-shop-eyebrow{ color: var(--ahs-turquesa); opacity: 1; }
.ahs-archive-hero--foto h1{ text-shadow: 0 2px 18px rgba(0,0,0,.35); }

@media (max-width: 768px){
  .ahs-shop-hero{ padding: 30px 24px; border-radius: 12px; }
  .ahs-archive-hero--foto{
    min-height: 200px;
    background-position: 65% center;
    background-image:
      linear-gradient(160deg, rgba(14,14,16,.90) 0%, rgba(14,14,16,.78) 55%, rgba(14,14,16,.62) 100%),
      var(--ahs-archive-img);
  }
}
.ahs-shop-eyebrow{
  text-transform: uppercase; letter-spacing: .12em;
  font-size: 13px; font-weight: 700; opacity: .85; margin: 0 0 6px;
}
.ahs-shop-hero h1{ color: #fff; font-size: clamp(34px, 5vw, 54px); line-height: 1.02; margin: 0 0 12px; }
.ahs-shop-sub{ max-width: 640px; font-size: 17px; line-height: 1.5; opacity: .95; margin: 0 0 14px; }
.ahs-shop-stats{ font-size: 15px; opacity: .95; margin: 0; }
.ahs-shop-stats strong{ color: #fff; }

/* ===== Cards de producto ===== */
ul.products li.product{
  position: relative;
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 14px;
  transition: box-shadow .25s ease, transform .25s ease;
}
ul.products li.product:hover{
  box-shadow: 0 8px 24px rgba(14,14,16,.08);
  transform: translateY(-2px);
}
.ahs-card-eyebrow{
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ahs-gris); margin-bottom: 2px;
}
ul.products li.product .woocommerce-loop-product__title{ font-weight: 600; font-size: 16px; }
ul.products li.product .price{ color: var(--ahs-texto); font-weight: 800; font-family: "Outfit", sans-serif; }
ul.products li.product .price del{ color: var(--ahs-gris); font-weight: 400; }
ul.products li.product .price ins{ color: var(--ahs-rojo); text-decoration: none; }

/* ===== Badges ===== */
.woocommerce span.onsale{
  background: var(--ahs-rojo); color: #fff;
  border-radius: 4px; padding: 4px 10px;
  font-weight: 700; font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
  min-height: auto; line-height: 1.4; left: 12px; top: 12px; margin: 0;
}
/* Los badges se apilan en la esquina superior izquierda, no en esquinas
   opuestas: con la card angosta, uno a cada lado terminaban encontrándose
   en el medio. El orden es OFERTA arriba y NUEVO debajo. */
.ahs-badge-nuevo{
  position: absolute; top: 12px; left: 12px; right: auto; z-index: 9;
  background: var(--ahs-turquesa); color: var(--ahs-on-turquesa);
  border-radius: 4px; padding: 4px 10px;
  font-weight: 700; font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
}
/* Con oferta encima, baja una fila (alto del badge + separación). */
.ahs-badge-nuevo--segundo{ top: 42px; }

/* ===== Botones ===== */
.woocommerce a.button, .woocommerce button.button,
.woocommerce a.button.alt, .woocommerce button.button.alt{
  background: var(--ahs-turquesa); color: #fff;
  font-weight: 600; border-radius: 4px; text-transform: uppercase;
  letter-spacing: .03em; font-size: 13px;
}
.woocommerce a.button:hover, .woocommerce button.button:hover{
  background: var(--ahs-negro); color: #fff;
}

/* ===== Footer ===== */
.ahs-footer{ background: var(--ahs-negro); color: #fff; padding: 56px 0 0; }
.ahs-footer-inner{ max-width: var(--ahs-container); margin: 0 auto; padding: 0 24px; }
.ahs-footer-grid{
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; padding-bottom: 44px;
}
.ahs-footer h4{
  color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: .12em;
  font-weight: 700; margin: 0 0 16px;
}
.ahs-footer-desc{ color: rgba(255,255,255,.7); font-size: 14px; line-height: 1.6; margin: 0 0 18px; }
.ahs-footer-contact{ color: rgba(255,255,255,.7); font-size: 14px; display: flex; flex-direction: column; gap: 8px; }
.ahs-footer ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.ahs-footer ul a{ color: rgba(255,255,255,.7); text-decoration: none; font-size: 14px; transition: color .2s; }
.ahs-footer ul a:hover{ color: var(--ahs-turquesa); }
.ahs-footer-hours{ color: rgba(255,255,255,.7); font-size: 14px; display: flex; flex-direction: column; gap: 4px; margin-top: 14px; }
.ahs-footer-strong{ color: #fff; font-weight: 600; margin-top: 8px; }
.ahs-footer-bottom{
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 22px 0; display: flex; justify-content: space-between; align-items: center;
  gap: 16px; flex-wrap: wrap; font-size: 12px; color: rgba(255,255,255,.5);
}
.ahs-footer-pay{ display: flex; gap: 10px; }
.ahs-footer-pay span{ background: rgba(255,255,255,.1); border-radius: 4px; padding: 4px 12px; font-size: 11px; font-weight: 600; }

@media (max-width: 900px){
  .ahs-footer-grid{ grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media (max-width: 560px){
  .ahs-footer-grid{ grid-template-columns: 1fr; }
}

/* ===================================================
 * FICHA DE PRODUCTO (single product)
 * =================================================== */

/* Layout 2 columnas. La foto manda: en esta tienda es lo que vende, así que
   la galería se lleva más ancho que la columna de compra. */
.single-product div.product{
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  grid-template-rows: auto;
  gap: 40px 52px;
  align-items: start;
  max-width: var(--ahs-container);
  margin: 32px auto;
  padding: 0 24px;
}

/* Galería ocupa columna izquierda, filas 1 y 2.
   WooCommerce le aplica `float:left; width:48%` por su cuenta, pensado para
   un layout flotante. Dentro del grid eso la dejaba ocupando la mitad de su
   propia columna — de ahí que la foto se viera diminuta. */
.single-product div.product .woocommerce-product-gallery{
  grid-column: 1;
  grid-row: 1 / 3;
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
}
.single-product div.product .summary{
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.woocommerce-product-gallery__wrapper{ width: 100%; margin: 0; }

/* Resumen ocupa columna derecha, fila 1 */
.single-product div.product .summary{
  grid-column: 2;
  grid-row: 1;
}

/* Tabs debajo del resumen */
.single-product div.product .woocommerce-tabs{
  grid-column: 1 / -1;
  grid-row: 3;
}

/* Relacionados y upsells */
.single-product div.product .related,
.single-product div.product .up-sells{
  grid-column: 1 / -1;
}

/* Galería: imagen principal */
.woocommerce-product-gallery__image img{
  border-radius: 12px;
  border: 1px solid var(--ahs-borde);
  width: 100%;
  height: auto;
  display: block;
}

/* Thumbnails.
   El slider las posiciona sobre la imagen principal; acá se bajan a su
   propia fila, debajo de la foto. */
.flex-control-thumbs{
  position: static !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 0 !important;
  padding: 0;
  list-style: none;
  width: 100%;
}
.flex-control-thumbs li{
  flex-shrink: 0;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}
.flex-control-thumbs li img{
  border-radius: 8px;
  border: 2px solid var(--ahs-borde);
  cursor: pointer;
  width: 78px;
  height: 78px;
  object-fit: cover;
  opacity: 1;
  transition: border-color .2s ease, transform .2s ease;
}
.flex-control-thumbs li img:hover{ transform: translateY(-2px); }
.flex-control-thumbs li img.flex-active,
.flex-control-thumbs li img:hover{
  border-color: var(--ahs-turquesa);
}

/* Badge oferta en ficha */
.single-product span.onsale{
  font-size: 12px;
  padding: 5px 12px;
  left: auto; top: auto;
  position: relative;
  display: inline-block;
  margin-bottom: 10px;
}

/* Título. La especificidad extra es para ganarle al tamaño que impone
   Kadence, que lo dejaba desproporcionado frente al resto de la ficha. */
.single-product div.product .summary h1.product_title,
.single-product h1.product_title{
  font-family: "Outfit", sans-serif;
  font-size: clamp(24px, 2.4vw, 34px);
  font-weight: 800;
  color: var(--ahs-negro);
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0 0 12px;
}

/* Valoraciones fuera: no se usan en esta tienda. */
.single-product .woocommerce-product-rating,
.single-product .star-rating,
.single-product .woocommerce-review-link,
.single-product #reviews,
.single-product #tab-reviews,
.single-product li.reviews_tab{
  display: none !important;
}

/* Valoraciones (estrellitas) */
.single-product .woocommerce-product-rating{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 14px;
  color: var(--ahs-gris);
}
.single-product .star-rating{ color: #F5A623; }

/* Precio */
.single-product p.price,
.single-product span.price{
  font-family: "Outfit", sans-serif;
  font-size: 28px;
  font-weight: 800;
  color: var(--ahs-negro);
  line-height: 1;
  margin: 0 0 20px;
}
.single-product p.price del,
.single-product span.price del{
  color: var(--ahs-gris);
  font-size: 18px;
  font-weight: 400;
  margin-right: 10px;
}
.single-product p.price ins,
.single-product span.price ins{
  text-decoration: none;
  color: var(--ahs-rojo);
}

/* Descripción corta */
.single-product .woocommerce-product-details__short-description{
  font-size: 15px;
  line-height: 1.65;
  color: var(--ahs-texto);
  margin-bottom: 24px;
}
.single-product .woocommerce-product-details__short-description p{ margin: 0 0 8px; }

/* Formulario agregar al carrito */
.single-product form.cart{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.single-product form.cart .quantity{
  display: flex;
  align-items: center;
  border: 2px solid var(--ahs-borde);
  border-radius: 6px;
  overflow: hidden;
}
.single-product form.cart .qty{
  width: 52px;
  height: 44px;
  text-align: center;
  border: none;
  font-size: 16px;
  font-weight: 700;
  color: var(--ahs-negro);
  background: #fff;
  -moz-appearance: textfield;
}
.single-product form.cart .qty::-webkit-inner-spin-button,
.single-product form.cart .qty::-webkit-outer-spin-button{ -webkit-appearance: none; }

.single-product form.cart button.single_add_to_cart_button{
  flex: 1;
  min-width: 180px;
  padding: 12px 24px;
  font-size: 15px;
  font-weight: 700;
  font-family: "Outfit", sans-serif;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: var(--ahs-turquesa);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background .2s ease;
  height: 48px;
}
.single-product form.cart button.single_add_to_cart_button:hover{
  background: var(--ahs-negro);
}

/* Meta (SKU, categorías, etiquetas) */
.single-product .product_meta{
  font-size: 13px;
  color: var(--ahs-gris);
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px solid var(--ahs-borde);
  padding-top: 20px;
  margin-top: 4px;
}
.single-product .product_meta span{ display: flex; gap: 6px; }
.single-product .product_meta .sku_wrapper,
.single-product .product_meta .posted_in,
.single-product .product_meta .tagged_as{ display: flex; gap: 6px; }
.single-product .product_meta a{
  color: var(--ahs-turquesa);
  text-decoration: none;
  font-weight: 600;
}
.single-product .product_meta a:hover{ color: var(--ahs-turquesa-dark); }

/* ===== Tabs (descripción, información adicional, reseñas) ===== */
.woocommerce-tabs.wc-tabs-wrapper{
  border-top: 2px solid var(--ahs-borde);
  margin-top: 0;
}

.woocommerce-tabs ul.tabs{
  display: flex;
  gap: 0;
  padding: 0;
  margin: 0 0 -1px;
  list-style: none;
  background: transparent;
  border-bottom: 2px solid var(--ahs-borde);
}
.woocommerce-tabs ul.tabs::before{ display: none; }
.woocommerce-tabs ul.tabs li{
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  padding: 0;
}
.woocommerce-tabs ul.tabs li a{
  display: block;
  padding: 14px 24px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ahs-gris);
  text-decoration: none;
  transition: color .2s;
}
.woocommerce-tabs ul.tabs li.active{
  border-bottom: 2px solid var(--ahs-turquesa);
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover{
  color: var(--ahs-turquesa);
}

.woocommerce-tabs .panel{
  padding: 28px 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--ahs-texto);
}
.woocommerce-tabs .panel h2{ display: none; }
.woocommerce-tabs .panel table.shop_attributes{
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.woocommerce-tabs .panel table.shop_attributes th,
.woocommerce-tabs .panel table.shop_attributes td{
  padding: 10px 16px;
  border-bottom: 1px solid var(--ahs-borde);
  text-align: left;
}
.woocommerce-tabs .panel table.shop_attributes th{
  font-weight: 600;
  color: var(--ahs-negro);
  width: 200px;
}

/* ===== Productos relacionados ===== */
.related.products > h2,
.up-sells.products > h2{
  font-family: "Outfit", sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: var(--ahs-negro);
  margin: 0 0 20px;
  padding-top: 8px;
  border-top: 2px solid var(--ahs-borde);
}

/* ===== Breadcrumb ===== */
.woocommerce-breadcrumb{
  font-size: 13px;
  color: var(--ahs-gris);
  max-width: var(--ahs-container);
  margin: 16px auto 0;
  padding: 0 24px;
}
.woocommerce-breadcrumb a{
  color: var(--ahs-gris);
  text-decoration: none;
  transition: color .2s;
}
.woocommerce-breadcrumb a:hover{ color: var(--ahs-turquesa); }

/* ===== Responsive ficha ===== */
@media (max-width: 768px){
  .single-product div.product{
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .single-product div.product .woocommerce-product-gallery{
    grid-column: 1; grid-row: 1;
  }
  .single-product div.product .summary{
    grid-column: 1; grid-row: 2;
  }
  .single-product div.product .woocommerce-tabs{
    grid-column: 1; grid-row: 3;
  }
}

/* ===================================================
 * HOME (front-page.php)
 * =================================================== */
.ahs-home{ background: #fff; }
.ahs-home .ahs-section-inner,
.ahs-benefits-inner,
.ahs-hero-inner,
.ahs-cta-inner{
  max-width: var(--ahs-container);
  margin: 0 auto;
  padding: 0 24px;
}

/* ----- Botones de la home ----- */
.ahs-btn-primary,
.ahs-btn-ghost{
  display: inline-block;
  font-family: "Outfit", sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .03em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 14px 28px;
  border-radius: 6px;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  cursor: pointer;
}
.ahs-btn-primary{ background: var(--ahs-turquesa); color: #fff; border: 2px solid var(--ahs-turquesa); }
.ahs-btn-primary:hover{ background: var(--ahs-negro); border-color: var(--ahs-negro); color: #fff; }
.ahs-btn-ghost{ background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.55); }
.ahs-btn-ghost:hover{ border-color: #fff; background: rgba(255,255,255,.12); color: #fff; }
.ahs-btn-ghost--light{ /* sobre fondo claro */ }

/* ----- Hero ----- */
.ahs-hero{
  /* --ahs-hero-img la fija front-page.php (inline) con la foto de portada.
     El degradado va ENCIMA de la foto (semi-transparente) para que el
     texto blanco siga siendo legible; sin foto, --ahs-hero-img queda
     "none" y solo se ve el degradado de marca de siempre. */
  --ahs-hero-img: none;
  background-image:
    linear-gradient(100deg, rgba(14,14,16,.93) 0%, rgba(14,14,16,.78) 34%, rgba(14,14,16,.44) 64%, rgba(14,14,16,.18) 100%),
    var(--ahs-hero-img);
  background-size: cover;
  /* Encuadre alto y a la derecha: ahí está la fachada con el letrero de la
     tienda. Centrado verticalmente el letrero quedaba cortado. */
  background-position: 68% 32%;
  min-height: 580px;
  display: flex;
  align-items: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
/* Hero con foto de producto: el encuadre baja y va a la derecha, que es donde
   están los autos, y el velo se abre más que con la foto del local para que
   el producto se vea sin apagarse. */
.ahs-hero--producto{
  background-position: 62% 62%;
  background-image:
    linear-gradient(100deg, rgba(14,14,16,.93) 0%, rgba(14,14,16,.74) 40%, rgba(14,14,16,.30) 72%, rgba(14,14,16,.06) 100%),
    var(--ahs-hero-img);
}
/* Con producto, el halo turquesa estorba más de lo que aporta. */
.ahs-hero--producto::after{ opacity: .5; }

/* Halo turquesa de marca. Suave, para no teñir la foto cálida del local. */
.ahs-hero::after{
  content: "";
  position: absolute; top: -30%; right: -10%;
  width: 55%; height: 160%;
  background: radial-gradient(circle, rgba(26,188,156,.16) 0%, transparent 65%);
  pointer-events: none;
}
.ahs-hero-inner{ position: relative; z-index: 1; width: 100%; padding-top: 72px; padding-bottom: 80px; }
.ahs-hero-eyebrow{
  text-transform: uppercase; letter-spacing: .14em;
  font-size: 13px; font-weight: 700; color: var(--ahs-turquesa); margin: 0 0 14px;
}
.ahs-hero-title{
  font-family: "Outfit", sans-serif;
  font-weight: 800;
  color: #fff;
  font-size: clamp(36px, 6vw, 64px);
  line-height: 1.04;
  margin: 0 0 18px;
}
.ahs-hero-sub{
  max-width: 560px;
  font-size: 18px; line-height: 1.55;
  color: rgba(255,255,255,.82);
  margin: 0 0 30px;
}
.ahs-hero-cta{ display: flex; gap: 14px; flex-wrap: wrap; }

/* ----- Banner promocional ancho (cupón, Fast & Furious) ----- */
.ahs-promo{
  --ahs-promo-img: none;
  position: relative;
  overflow: hidden;
  /* Velo suave: las imágenes ya se generaron con el lado izquierdo oscuro
     y despejado, así que el degradado solo asegura el contraste del texto
     sin apagar el color de la mitad derecha. */
  background-image:
    linear-gradient(100deg, rgba(14,14,16,.78) 0%, rgba(14,14,16,.48) 45%, rgba(14,14,16,.06) 100%),
    var(--ahs-promo-img);
  background-size: cover;
  background-position: center;
  color: #fff;
}
.ahs-promo-inner{
  max-width: var(--ahs-container);
  margin: 0 auto;
  padding: 40px 24px;
  min-height: 270px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* Sin esto el flex estira los hijos a todo el ancho y el botón cruza
     el banner de lado a lado. */
  align-items: flex-start;
}
.ahs-promo-eyebrow{
  text-transform: uppercase; letter-spacing: .14em;
  font-size: 13px; font-weight: 700; color: var(--ahs-turquesa); margin: 0 0 12px;
}
.ahs-promo-title{
  font-family: "Outfit", sans-serif;
  font-weight: 800; color: #fff;
  font-size: clamp(28px, 4.2vw, 42px);
  line-height: 1.1;
  max-width: 620px;
  margin: 0 0 12px;
}
.ahs-promo-text{
  max-width: 480px;
  font-size: 16px; line-height: 1.55;
  color: rgba(255,255,255,.85);
  margin: 0 0 24px;
}
/* Variante con foco visual a la derecha (ej. autos): texto se alinea a la
   izquierda igual, pero el degradado se refuerza más a la izquierda para
   dejar la imagen más despejada del lado derecho. */
.ahs-promo--derecha{
  background-image:
    linear-gradient(100deg, rgba(14,14,16,.90) 0%, rgba(14,14,16,.60) 42%, rgba(14,14,16,0) 100%),
    var(--ahs-promo-img);
}
/* Tablet: el degradado horizontal deja de servir (la imagen se recorta y el
   texto ocupa casi todo el ancho), así que se refuerza parejo. */
@media (max-width: 900px){
  .ahs-promo,
  .ahs-promo--derecha{
    background-image:
      linear-gradient(100deg, rgba(14,14,16,.90) 0%, rgba(14,14,16,.74) 55%, rgba(14,14,16,.45) 100%),
      var(--ahs-promo-img);
    background-position: 72% center;
  }
  .ahs-promo-inner{ min-height: 240px; padding: 34px 24px; }
  .ahs-promo-text{ max-width: 560px; }
}

/* Móvil: el banner se apila — la imagen pasa a ser una banda superior que
   se funde en negro, y el texto queda debajo sobre fondo sólido. Así la
   foto se ve completa y el copy no pelea con ella. */
@media (max-width: 640px){
  .ahs-promo,
  .ahs-promo--derecha{
    background-image: none;
    background-color: var(--ahs-negro);
  }
  .ahs-promo::before{
    content: "";
    display: block;
    height: 190px;
    background-image:
      linear-gradient(180deg, rgba(14,14,16,0) 45%, rgba(14,14,16,.55) 78%, var(--ahs-negro) 100%),
      var(--ahs-promo-img);
    background-size: cover;
    background-position: center;
  }
  .ahs-promo-inner{
    min-height: 0;
    padding: 4px 20px 40px;
  }
  .ahs-promo-title{ font-size: 27px; }
  .ahs-promo-text{ max-width: none; font-size: 15.5px; }
}

/* ----- Beneficios -----
   Banda clara entre el hero y el banner del cupón (dos bloques oscuros).
   Tarjetas con icono de línea en pastilla turquesa, en vez de emoji. */
.ahs-benefits{
  background: #fff;
  border-bottom: 1px solid var(--ahs-borde);
}
.ahs-benefits-inner{
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
  padding-top: 22px; padding-bottom: 22px;
}
.ahs-benefit{
  display: flex; align-items: center; gap: 13px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.ahs-benefit:hover{
  border-color: var(--ahs-turquesa);
  box-shadow: 0 6px 18px rgba(14,14,16,.07);
  transform: translateY(-2px);
}
.ahs-benefit-ico{
  flex-shrink: 0;
  width: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px;
  background: linear-gradient(140deg, rgba(26,188,156,.16), rgba(22,160,133,.10));
  color: var(--ahs-turquesa-dark);
  transition: background .25s ease, color .25s ease;
}
.ahs-benefit-ico svg{ width: 22px; height: 22px; display: block; }
.ahs-benefit:hover .ahs-benefit-ico{
  background: var(--ahs-turquesa);
  color: #fff;
}
.ahs-benefit div{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ahs-benefit strong{
  font-family: "Outfit", sans-serif;
  font-size: 14.5px; color: var(--ahs-negro); font-weight: 700;
  letter-spacing: -.01em; line-height: 1.25;
}
.ahs-benefit span{ font-size: 12.5px; color: var(--ahs-gris); line-height: 1.35; }

/* ----- Secciones ----- */
.ahs-section{ padding: 56px 0; }
.ahs-section--soft{ background: var(--ahs-fondo); }
.ahs-section-head{
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 28px;
}
.ahs-section-head h2{
  font-family: "Outfit", sans-serif;
  font-weight: 800; font-size: clamp(24px, 3.5vw, 34px);
  color: var(--ahs-negro); margin: 0;
}
.ahs-section-link{
  color: var(--ahs-turquesa); font-weight: 600; font-size: 14px;
  text-decoration: none; white-space: nowrap;
}
.ahs-section-link:hover{ color: var(--ahs-turquesa-dark); }

/* ----- Grid de categorías ----- */
.ahs-cat-grid{
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.ahs-cat-card{
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--ahs-borde); border-radius: 12px;
  overflow: hidden; text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.ahs-cat-card:hover{
  box-shadow: 0 10px 28px rgba(14,14,16,.10);
  transform: translateY(-3px);
  border-color: var(--ahs-turquesa);
}
.ahs-cat-media{
  display: block; height: 210px;
  background-size: cover; background-position: center;
  background-color: var(--ahs-fondo);
  transition: transform .35s ease;
}
/* La foto viene de un producto de la categoría: un leve zoom al pasar
   el mouse la hace sentir viva sin recortar distinto el encuadre. */
.ahs-cat-card{ overflow: hidden; }
.ahs-cat-card:hover .ahs-cat-media{ transform: scale(1.06); }
.ahs-cat-media--placeholder{
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--ahs-turquesa-dark), var(--ahs-turquesa));
  color: #fff; font-family: "Outfit", sans-serif; font-weight: 800; font-size: 48px;
}
.ahs-cat-body{ padding: 16px 18px; display: flex; flex-direction: column; gap: 2px; }
.ahs-cat-name{ font-weight: 700; font-size: 16px; color: var(--ahs-negro); }
.ahs-cat-count{ font-size: 13px; color: var(--ahs-gris); }

/* ----- Grid de productos en la home (override del layout flotante de WC) ----- */
.ahs-home .woocommerce{ width: 100%; }
.ahs-home ul.products{
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
.ahs-home ul.products::before,
.ahs-home ul.products::after{ content: none; display: none; }
.ahs-home ul.products li.product{
  width: auto !important; margin: 0 !important; float: none !important; padding: 14px;
}

/* ----- Banda CTA final ----- */
.ahs-cta-band{
  background: linear-gradient(120deg, var(--ahs-turquesa-dark), var(--ahs-turquesa));
  color: #fff; text-align: center;
}
.ahs-cta-inner{ padding-top: 56px; padding-bottom: 56px; }
.ahs-cta-band h2{
  font-family: "Outfit", sans-serif; font-weight: 800;
  font-size: clamp(26px, 4vw, 38px); color: #fff; margin: 0 0 10px;
}
.ahs-cta-band p{ font-size: 17px; color: rgba(255,255,255,.9); margin: 0 0 26px; }
.ahs-cta-actions{ display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.ahs-cta-band .ahs-btn-primary{ background: #fff; color: var(--ahs-negro); border-color: #fff; }
.ahs-cta-band .ahs-btn-primary:hover{ background: var(--ahs-negro); color: #fff; border-color: var(--ahs-negro); }

/* ----- Responsive home ----- */
@media (max-width: 900px){
  .ahs-benefits-inner{ grid-template-columns: 1fr 1fr; }
  .ahs-cat-grid{ grid-template-columns: 1fr 1fr; }
  .ahs-home ul.products{ grid-template-columns: repeat(2, 1fr); }
  /* La foto del local se recorta al angostarse: se encuadra en la vitrina
     (a la derecha del original) y el velo pasa a vertical. */
  .ahs-hero{
    min-height: 500px;
    background-position: 68% 30%;
    background-image:
      linear-gradient(170deg, rgba(14,14,16,.86) 0%, rgba(14,14,16,.74) 45%, rgba(14,14,16,.88) 100%),
      var(--ahs-hero-img);
  }
  /* Con producto el encuadre baja: los autos están en la mitad inferior. */
  .ahs-hero--producto{
    background-position: 60% 68%;
    background-image:
      linear-gradient(170deg, rgba(14,14,16,.88) 0%, rgba(14,14,16,.70) 45%, rgba(14,14,16,.82) 100%),
      var(--ahs-hero-img);
  }
}
@media (max-width: 640px){
  .ahs-hero{
    /* En vertical la foto casi no cabe: se baja el alto mínimo para no
       dejar un bloque enorme antes del contenido. */
    min-height: 420px;
    background-position: 72% 28%;
    background-image:
      linear-gradient(180deg, rgba(14,14,16,.88) 0%, rgba(14,14,16,.80) 50%, rgba(14,14,16,.92) 100%),
      var(--ahs-hero-img);
  }
  .ahs-hero--producto{
    background-position: 58% 70%;
    background-image:
      linear-gradient(180deg, rgba(14,14,16,.90) 0%, rgba(14,14,16,.76) 45%, rgba(14,14,16,.86) 100%),
      var(--ahs-hero-img);
  }
  .ahs-hero-title{ font-size: 34px; }
  .ahs-hero-sub{ font-size: 16.5px; }
  /* Botones a ancho completo: objetivo táctil cómodo. */
  .ahs-hero-cta{ display: grid; grid-template-columns: 1fr; gap: 10px; width: 100%; }
  .ahs-hero-cta .ahs-btn-primary,
  .ahs-hero-cta .ahs-btn-ghost{ text-align: center; }
}
@media (max-width: 560px){
  .ahs-benefits-inner{ grid-template-columns: 1fr; gap: 10px; }
  /* Tarjetas más bajas: 4 apiladas no deben empujar la página entera. */
  .ahs-benefit{ padding: 11px 13px; gap: 11px; }
  .ahs-benefit-ico{ width: 36px; height: 36px; border-radius: 9px; }
  .ahs-benefit-ico svg{ width: 19px; height: 19px; }
  .ahs-cat-grid{ grid-template-columns: 1fr; }
  /* En una sola columna la card es ancha: la foto necesita más alto. */
  .ahs-cat-media{ height: 220px; }
  .ahs-home ul.products{ grid-template-columns: 1fr; }
  .ahs-hero-inner{ padding-top: 48px; padding-bottom: 52px; }
}

/* ===================================================
 * BASE WOOCOMMERCE: carrito, checkout, mi cuenta, avisos
 * (primera versión funcional de marca — se pule después)
 * =================================================== */

/* Header de archivo de categoría (variante del hero de tienda) */
.ahs-archive-hero .ahs-shop-sub p{ margin: 0 0 6px; }

/* ----- Contador de resultados + ordenar (barra superior del catálogo) ----- */
.woocommerce .woocommerce-result-count{
  color: var(--ahs-gris); font-size: 14px; margin: 0 0 18px;
}
.woocommerce .woocommerce-ordering{ margin: 0 0 18px; }
.woocommerce .woocommerce-ordering select,
.woocommerce form .form-row select,
.woocommerce .select2-selection{
  border: 1px solid var(--ahs-borde) !important;
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 14px;
  background: #fff;
  color: var(--ahs-texto);
  height: auto;
}

/* ----- Avisos (mensajes, info, errores) ----- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews{
  border: 1px solid var(--ahs-borde);
  border-left-width: 4px;
  border-radius: 8px;
  background: #fff;
  padding: 14px 18px;
  font-size: 14px;
  color: var(--ahs-texto);
  list-style: none;
  margin: 0 0 24px;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before{ top: 16px; }
.woocommerce-message{ border-left-color: var(--ahs-turquesa); }
.woocommerce-message::before{ color: var(--ahs-turquesa); }
.woocommerce-info{ border-left-color: var(--ahs-turquesa-dark); }
.woocommerce-info::before{ color: var(--ahs-turquesa-dark); }
.woocommerce-error{ border-left-color: var(--ahs-rojo); }
.woocommerce-error::before{ color: var(--ahs-rojo); }

/* ----- Tablas (carrito, totales, mis pedidos) ----- */
.woocommerce table.shop_table{
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}
.woocommerce table.shop_table th{
  background: var(--ahs-fondo);
  color: var(--ahs-negro);
  font-family: "Outfit", sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 14px 16px;
}
.woocommerce table.shop_table td{
  padding: 16px;
  border-top: 1px solid var(--ahs-borde);
  vertical-align: middle;
}
.woocommerce table.cart img{ width: 64px; border-radius: 8px; border: 1px solid var(--ahs-borde); }
.woocommerce .cart .product-name a{ color: var(--ahs-texto); font-weight: 600; text-decoration: none; }
.woocommerce .cart .product-name a:hover{ color: var(--ahs-turquesa); }

/* Selector de cantidad genérico */
.woocommerce .quantity .qty{
  border: 1px solid var(--ahs-borde);
  border-radius: 6px;
  padding: 8px;
  width: 64px;
  text-align: center;
  font-weight: 700;
  color: var(--ahs-negro);
}

/* ----- Carrito: acciones + totales ----- */
.woocommerce .cart .actions .coupon .input-text{
  border: 1px solid var(--ahs-borde);
  border-radius: 6px;
  padding: 10px 12px;
  min-width: 180px;
}
.woocommerce .cart-collaterals .cart_totals{
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 8px 20px 20px;
}
.woocommerce .cart-collaterals .cart_totals h2{
  font-family: "Outfit", sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: var(--ahs-negro);
  margin: 16px 0 12px;
}
.woocommerce .cart_totals .order-total .amount{ color: var(--ahs-negro); font-weight: 800; }
.woocommerce .wc-proceed-to-checkout a.checkout-button{
  display: block;
  text-align: center;
  font-size: 15px;
  padding: 14px 24px;
}

/* ----- Checkout ----- */
.woocommerce-checkout h3{
  font-family: "Outfit", sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: var(--ahs-negro);
  margin-bottom: 16px;
}
.woocommerce form .form-row label{
  font-size: 13px;
  font-weight: 600;
  color: var(--ahs-texto);
  margin-bottom: 4px;
  display: block;
}
.woocommerce form .form-row .input-text,
.woocommerce form .form-row textarea{
  border: 1px solid var(--ahs-borde);
  border-radius: 6px;
  padding: 11px 13px;
  font-size: 14px;
  width: 100%;
  color: var(--ahs-texto);
  background: #fff;
}
.woocommerce form .form-row .input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
  outline: none;
  border-color: var(--ahs-turquesa);
  box-shadow: 0 0 0 3px rgba(26,188,156,.15);
}
.woocommerce-checkout #order_review,
.woocommerce-checkout #order_review_heading{
  background: #fff;
}
.woocommerce-checkout #payment{
  background: var(--ahs-fondo);
  border-radius: 12px;
}
.woocommerce-checkout #payment ul.payment_methods{ border-bottom: 1px solid var(--ahs-borde); }
.woocommerce #payment #place_order,
.woocommerce-checkout button#place_order{
  width: 100%;
  padding: 15px 24px;
  font-size: 16px;
  font-weight: 700;
  font-family: "Outfit", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ----- Mi cuenta ----- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation li{
  border-bottom: 1px solid var(--ahs-borde);
}
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child{ border-bottom: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display: block;
  padding: 13px 18px;
  color: var(--ahs-texto);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  transition: background .2s, color .2s;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{
  background: var(--ahs-fondo);
  color: var(--ahs-turquesa);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
  background: var(--ahs-turquesa);
  color: #fff;
}
.woocommerce-account .woocommerce-MyAccount-content{
  font-size: 15px;
  line-height: 1.65;
  color: var(--ahs-texto);
}

/* ----- Paginación ----- */
.woocommerce nav.woocommerce-pagination ul{
  border: none;
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 32px;
}
.woocommerce nav.woocommerce-pagination ul li{ border: none; margin: 0; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  border: 1px solid var(--ahs-borde);
  border-radius: 6px;
  padding: 8px 14px;
  color: var(--ahs-texto);
  font-weight: 600;
  min-width: auto;
}
.woocommerce nav.woocommerce-pagination ul li a:hover{
  border-color: var(--ahs-turquesa);
  color: var(--ahs-turquesa);
  background: #fff;
}
.woocommerce nav.woocommerce-pagination ul li span.current{
  background: var(--ahs-turquesa);
  border-color: var(--ahs-turquesa);
  color: #fff;
}

/* ----- Carrito/checkout responsive ----- */
@media (max-width: 768px){
  .woocommerce table.shop_table th{ font-size: 12px; padding: 10px 12px; }
  .woocommerce table.shop_table td{ padding: 12px; }
}

/* ===================================================
 * AJUSTES v0.4.3 (feedback: cards, filtros, títulos, ficha, cuenta)
 * =================================================== */

/* ----- Ocultar títulos sin estilar de Kadence/Woo (los reemplazan hero/banner) ----- */
.woocommerce-products-header,
.post-type-archive-product .entry-header,
.post-type-archive-product .entry-hero,
.tax-product_cat .entry-header,
.tax-product_cat .entry-hero,
.tax-product_tag .entry-header,
.tax-product_tag .entry-hero,
.woocommerce-cart .entry-header,
.woocommerce-cart .entry-hero,
.woocommerce-checkout .entry-header,
.woocommerce-checkout .entry-hero,
.woocommerce-account .entry-header,
.woocommerce-account .entry-hero{ display: none !important; }

/* ----- Cards más compactas (catálogo) ----- */
ul.products li.product{ padding: 11px; border-radius: 10px; }
ul.products li.product img{ border-radius: 6px; }
ul.products li.product .ahs-card-eyebrow{ font-size: 10.5px; }
ul.products li.product .woocommerce-loop-product__title{ font-size: 14.5px; line-height: 1.3; padding-top: 8px; }
ul.products li.product .price{ font-size: 15px; }
ul.products li.product a.button,
ul.products li.product a.add_to_cart_button{ font-size: 12px; padding: 8px 12px; margin-top: 8px; }
.woocommerce span.onsale,
.ahs-badge-nuevo{ font-size: 10px; padding: 3px 8px; }
/* Badge más bajo acá: el desplazamiento del segundo se ajusta. */
.ahs-badge-nuevo--segundo{ top: 37px; }

/* ----- Badge "Agotado" + atenuar producto sin stock ----- */
.ahs-badge-agotado{
  position: absolute; top: 11px; left: 11px; z-index: 9;
  background: var(--ahs-negro); color: #fff;
  border-radius: 4px; padding: 4px 10px;
  font-weight: 700; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
}
ul.products li.product.outofstock > a img,
ul.products li.product.outofstock img{ opacity: .5; filter: grayscale(.25); }
ul.products li.product.outofstock .price{ color: var(--ahs-gris); }

/* ----- Barra de filtros ----- */
.ahs-filtros{ margin: 0 0 26px; display: flex; flex-direction: column; gap: 14px; }
.ahs-filtros-cats{ display: flex; flex-wrap: wrap; gap: 8px; }
.ahs-filtros-cats a{
  padding: 7px 14px; border: 1px solid var(--ahs-borde); border-radius: 999px;
  font-size: 13px; font-weight: 600; color: var(--ahs-texto);
  text-decoration: none; background: #fff; transition: .2s;
}
.ahs-filtros-cats a:hover{ border-color: var(--ahs-turquesa); color: var(--ahs-turquesa); }
.ahs-filtros-cats a.is-active{ background: var(--ahs-turquesa); border-color: var(--ahs-turquesa); color: #fff; }
.ahs-filtros-tools{ display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.ahs-filtro-buscar, .ahs-filtro-precio{ display: flex; align-items: center; gap: 6px; margin: 0; }
.ahs-filtro-buscar input[type="search"],
.ahs-filtro-precio input[type="number"]{
  border: 1px solid var(--ahs-borde); border-radius: 6px;
  padding: 9px 12px; font-size: 14px; background: #fff; color: var(--ahs-texto);
}
.ahs-filtro-buscar input[type="search"]{ min-width: 220px; }
.ahs-filtro-precio input[type="number"]{ width: 92px; -moz-appearance: textfield; }
.ahs-filtro-precio input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance: none; }
.ahs-filtro-sep{ color: var(--ahs-gris); }
.ahs-filtro-buscar button,
.ahs-filtro-precio button{
  background: var(--ahs-turquesa); color: #fff; border: none; border-radius: 6px;
  padding: 9px 16px; font-weight: 700; font-size: 13px; cursor: pointer;
  font-family: "Outfit", sans-serif; white-space: nowrap;
}
.ahs-filtro-buscar button:hover,
.ahs-filtro-precio button:hover{ background: var(--ahs-negro); }
@media (max-width: 600px){
  .ahs-filtros-tools{ flex-direction: column; align-items: stretch; }
  .ahs-filtro-buscar{ width: 100%; }
  .ahs-filtro-buscar input[type="search"]{ flex: 1; min-width: 0; }
}

/* ----- Banner de página (carrito/checkout/cuenta), variante más compacta ----- */
.ahs-page-banner{ padding: 26px 32px; margin-bottom: 26px; }
.ahs-page-banner h1{ font-size: clamp(26px, 4vw, 38px); }

/* ----- Ficha de producto: centrada, imagen más grande, botón corregido ----- */
.single-product div.product{
  max-width: 1120px;
  grid-template-columns: 1.2fr 1fr;
  gap: 40px 48px;
  margin: 28px auto 56px;
}
.single-product div.product .summary{ padding-top: 4px; }

/* Botón "Añadir al carrito": el texto se quedaba fuera; lo contenemos */
.single-product form.cart button.single_add_to_cart_button{
  flex: 1 1 auto;
  min-width: 0;
  height: auto;
  padding: 14px 22px;
  line-height: 1.2;
  letter-spacing: .03em;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px){
  .single-product div.product{ grid-template-columns: 1fr; gap: 24px; }
  /* Sin esto, las posiciones fijas del grid de escritorio (grid-row 1/3,
     columna 2) desordenan los bloques al colapsar a una sola columna. */
  .single-product div.product .woocommerce-product-gallery,
  .single-product div.product .summary,
  .single-product div.product .woocommerce-tabs,
  .single-product div.product .related,
  .single-product div.product .up-sells{
    grid-column: 1;
    grid-row: auto;
  }
  .flex-control-thumbs li img{ width: 64px; height: 64px; }
}

/* ===================================================
 * MI CUENTA
 * =================================================== */

/* ----- Con sesión iniciada: menú lateral + contenido ----- */
.woocommerce-account.logged-in .woocommerce{
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  max-width: var(--ahs-container);
  margin: 0 auto;
}
.woocommerce-account.logged-in .woocommerce-notices-wrapper{ grid-column: 1 / -1; }
/* Kadence puede mandar la navegación a la derecha con una clase del body;
   acá el orden lo define el grid, no ese ajuste. */
.woocommerce-account .woocommerce-MyAccount-navigation{
  grid-column: 1;
  order: 0;
}
.woocommerce-account .woocommerce-MyAccount-content{
  grid-column: 2;
  order: 1;
}
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation{
  position: sticky;
  top: 104px;
}
.woocommerce-account .woocommerce-MyAccount-content{
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 26px 28px;
  font-size: 15px;
  line-height: 1.65;
  color: var(--ahs-texto);
}
.woocommerce-account .woocommerce-MyAccount-content > p:first-child{ margin-top: 0; }

/* Ítems del menú, con icono según la sección */
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display: flex;
  align-items: center;
  gap: 11px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a::before{
  content: "";
  width: 18px; height: 18px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  opacity: .85;
}
.woocommerce-MyAccount-navigation-link--dashboard a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--orders a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Cpath d='M8 9h8M8 13h5'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Cpath d='M8 9h8M8 13h5'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--edit-address a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 1 0-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 1 0-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--edit-account a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-7 8-7s8 3 8 7'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-7 8-7s8 3 8 7'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--downloads a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10m0 0 4-4m-4 4-4-4'/%3E%3Cpath d='M5 19h14'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10m0 0 4-4m-4 4-4-4'/%3E%3Cpath d='M5 19h14'/%3E%3C/svg%3E");
}
.woocommerce-MyAccount-navigation-link--customer-logout a{ color: var(--ahs-gris); }
.woocommerce-MyAccount-navigation-link--customer-logout a::before{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 12H4m0 0 4-4m-4 4 4 4'/%3E%3Cpath d='M10 5h9v14h-9'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 12H4m0 0 4-4m-4 4 4 4'/%3E%3Cpath d='M10 5h9v14h-9'/%3E%3C/svg%3E");
}

/* Tabla de pedidos: legible y sin apretar en pantallas medianas */
.woocommerce-account .woocommerce-orders-table{ font-size: 14px; }
.woocommerce-account .woocommerce-orders-table .button{
  padding: 8px 14px;
  font-size: 12px;
}
.woocommerce-account .woocommerce-Message{
  background: var(--ahs-fondo);
  border-top-color: var(--ahs-turquesa);
}

/* ----- Sin sesión: acceso centrado ----- */
.woocommerce-account:not(.logged-in) .woocommerce{
  max-width: 460px;
  margin: 0 auto;
}
.woocommerce-account:not(.logged-in) .u-columns{
  display: flex; flex-wrap: wrap; gap: 24px; justify-content: center;
}
.woocommerce-account:not(.logged-in) .u-columns .u-column1,
.woocommerce-account:not(.logged-in) .u-columns .u-column2{
  flex: 1 1 320px; max-width: 440px; width: auto !important; float: none !important;
}
/* Con el registro desactivado solo hay login: no debe quedar a lo ancho. */
.woocommerce-account:not(.logged-in) form.woocommerce-form-login{
  max-width: 460px;
  margin: 0 auto;
}
.woocommerce form.login,
.woocommerce form.register{
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 28px;
  background: #fff;
  height: 100%;
}
.woocommerce-account h2{
  font-family: "Outfit", sans-serif; font-weight: 800;
  font-size: 20px; color: var(--ahs-negro); margin: 0 0 16px;
}
.woocommerce form.login .button,
.woocommerce form.register .button{ width: 100%; padding: 13px; text-align: center; }
.woocommerce form.login .woocommerce-form-login__rememberme{
  display: block;
  margin: 4px 0 14px;
  font-size: 14px;
  color: var(--ahs-gris);
}
.woocommerce form.login .lost_password{
  margin: 14px 0 0;
  text-align: center;
  font-size: 14px;
}
.woocommerce form.login .lost_password a{ color: var(--ahs-turquesa-dark); }

/* Aviso: tener cuenta es opcional (no frenar la compra) */
.ahs-cuenta-nota{
  max-width: 460px;
  margin: 18px auto 0;
  padding: 14px 16px;
  background: var(--ahs-fondo);
  border-radius: 10px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--ahs-gris);
  text-align: center;
}
.ahs-cuenta-nota a{ color: var(--ahs-turquesa-dark); text-decoration: underline; }

@media (max-width: 900px){
  .woocommerce-account.logged-in .woocommerce{ grid-template-columns: 1fr; gap: 20px; }
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content{ grid-column: 1; }
  /* El menú pasa arriba, en fila con scroll: ocupa poco y se ve completo. */
  .woocommerce-account .woocommerce-MyAccount-navigation{ position: static; }
  .woocommerce-account .woocommerce-MyAccount-navigation ul{
    display: flex;
    overflow-x: auto;
    border-radius: 10px;
    scrollbar-width: none;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar{ display: none; }
  .woocommerce-account .woocommerce-MyAccount-navigation li{
    border-bottom: 0;
    border-right: 1px solid var(--ahs-borde);
    flex-shrink: 0;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li:last-child{ border-right: 0; }
  .woocommerce-account .woocommerce-MyAccount-navigation li a{ white-space: nowrap; font-size: 13.5px; }
  .woocommerce-account .woocommerce-MyAccount-content{ padding: 20px; }
}

/* ----- Subcategorías en archivo de categoría padre ----- */
.ahs-subcats{ margin: 0 0 36px; }
.ahs-subcats-title{
  font-family: "Outfit", sans-serif; font-weight: 800;
  font-size: 22px; color: var(--ahs-negro); margin: 0 0 18px;
}
/* Subcategorías: 3 columnas (no 4) para que la foto tenga presencia real. */
.ahs-cat-grid--sub{ grid-template-columns: repeat(3, 1fr); }
.ahs-cat-grid--sub .ahs-cat-media{ height: 190px; }
@media (max-width: 900px){
  .ahs-cat-grid--sub{ grid-template-columns: repeat(2, 1fr); }
  .ahs-cat-grid--sub .ahs-cat-media{ height: 170px; }
}
@media (max-width: 560px){
  .ahs-cat-grid--sub{ grid-template-columns: 1fr; }
  .ahs-cat-grid--sub .ahs-cat-media{ height: 200px; }
}

/* ===================================================
 * PÁGINAS DE CONTENIDO (legales, ayuda, nosotros)
 * El tema oculta el título que pinta Kadence, así que
 * cada página trae su propio encabezado .ahs-pagina-hero.
 * =================================================== */
.ahs-pagina-hero{
  background: linear-gradient(120deg, var(--ahs-negro) 0%, #15151a 55%, var(--ahs-turquesa-dark) 150%);
  color: #fff;
  padding: 52px 24px;
  margin: 0 0 40px;
}
.ahs-pagina-hero-inner{ max-width: var(--ahs-container); margin: 0 auto; }
.ahs-pagina-hero h1{
  font-family: "Outfit", sans-serif; font-weight: 800; color: #fff;
  font-size: clamp(28px, 4.5vw, 42px); line-height: 1.1; margin: 0 0 10px;
}
.ahs-pagina-hero p{
  font-size: 17px; line-height: 1.5; color: rgba(255,255,255,.82);
  max-width: 640px; margin: 0;
}

.ahs-legal{
  max-width: 820px;
  margin: 0 auto;
  padding: 0 24px 64px;
  color: var(--ahs-texto, #1F1F23);
  font-size: 16px;
  line-height: 1.7;
}
.ahs-legal h2{
  font-family: "Outfit", sans-serif; font-weight: 800;
  font-size: 24px; color: var(--ahs-negro);
  margin: 40px 0 14px; padding-top: 8px;
}
.ahs-legal h2:first-child{ margin-top: 0; }
.ahs-legal h3{
  font-family: "Outfit", sans-serif; font-weight: 700;
  font-size: 18px; color: var(--ahs-negro); margin: 26px 0 8px;
}
.ahs-legal p{ margin: 0 0 14px; }
.ahs-legal ul, .ahs-legal ol{ margin: 0 0 16px; padding-left: 22px; }
.ahs-legal li{ margin: 0 0 8px; }
.ahs-legal strong{ color: var(--ahs-negro); font-weight: 600; }
.ahs-legal a{ color: var(--ahs-turquesa-dark); text-decoration: underline; }

/* Bloque destacado (avisos importantes: retracto, garantía) */
.ahs-legal-nota{
  border-left: 4px solid var(--ahs-turquesa);
  background: var(--ahs-fondo);
  padding: 16px 18px;
  border-radius: 0 8px 8px 0;
  margin: 0 0 22px;
}
.ahs-legal-nota p:last-child{ margin-bottom: 0; }
.ahs-legal-nota--alerta{ border-left-color: var(--ahs-rojo); }

/* Ficha de datos de la empresa */
.ahs-legal-datos{
  border: 1px solid var(--ahs-borde);
  border-radius: 10px;
  padding: 18px 20px;
  margin: 0 0 26px;
  background: #fff;
}
.ahs-legal-datos dl{ margin: 0; display: grid; grid-template-columns: 190px 1fr; gap: 8px 14px; }
.ahs-legal-datos dt{ font-weight: 600; color: var(--ahs-gris); }
.ahs-legal-datos dd{ margin: 0; color: var(--ahs-negro); }

/* Tabla simple (plazos, couriers). En móvil la tabla no se deforma: hace
   scroll horizontal dentro de su propio contenedor, sin arrastrar la página. */
.ahs-tabla-scroll{
  overflow-x: auto;
  margin: 0 0 22px;
  -webkit-overflow-scrolling: touch;
}
.ahs-legal table{
  width: 100%; border-collapse: collapse; margin: 0 0 22px; font-size: 15px;
}
.ahs-tabla-scroll table{ margin: 0; min-width: 480px; }
.ahs-legal th, .ahs-legal td{
  border: 1px solid var(--ahs-borde); padding: 10px 12px; text-align: left; vertical-align: top;
}
.ahs-legal th{ background: var(--ahs-fondo); font-weight: 600; color: var(--ahs-negro); }

.ahs-legal-actualizado{
  margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--ahs-borde);
  font-size: 14px; color: var(--ahs-gris);
}

@media (max-width: 600px){
  .ahs-pagina-hero{ padding: 38px 20px; margin-bottom: 28px; }
  .ahs-legal{ padding: 0 20px 48px; font-size: 15.5px; }
  .ahs-legal-datos dl{ grid-template-columns: 1fr; gap: 2px; }
  .ahs-legal-datos dt{ margin-top: 10px; }
  .ahs-legal h2{ font-size: 21px; margin-top: 32px; }
  .ahs-legal h3{ font-size: 17px; }
  .ahs-pagina-hero p{ font-size: 15.5px; }
}

/* Barra legal del footer (obligatoria para operar con pagos en línea) */
.ahs-footer-legal{
  display: flex; flex-wrap: wrap; gap: 8px 24px;
  padding: 20px 0 4px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.ahs-footer-legal a{
  color: rgba(255,255,255,.72); text-decoration: none; font-size: 13px; transition: color .2s;
}
.ahs-footer-legal a:hover{ color: var(--ahs-turquesa); }
.ahs-footer-bottom .ahs-footer-dim{ color: rgba(255,255,255,.38); }
@media (max-width: 560px){
  .ahs-footer-legal{ flex-direction: column; gap: 10px; }
}

/* ----- Envíos por pagar (carrito y checkout) ----- */
.ahs-por-pagar{
  display: inline-block;
  margin-left: 6px;
  background: var(--ahs-turquesa);
  color: var(--ahs-on-turquesa);
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  padding: 2px 8px; border-radius: 4px;
  vertical-align: middle;
}
/* .ahs-envio-nota vive más abajo, junto a "Aviso de envío por pagar" — esta
   copia había quedado duplicada de una versión anterior y no hacía nada. */

/* ----- Ficha de producto: datos del artículo ----- */
.ahs-ficha-datos{
  list-style: none;
  margin: 0 0 22px;
  padding: 14px 0;
  border-top: 1px solid var(--ahs-borde);
  border-bottom: 1px solid var(--ahs-borde);
  display: flex; flex-wrap: wrap; gap: 10px 30px;
}
.ahs-ficha-datos li{ display: flex; flex-direction: column; gap: 1px; }
.ahs-ficha-dato-label{
  font-size: 11px; text-transform: uppercase; letter-spacing: .1em;
  color: var(--ahs-gris); font-weight: 600;
}
.ahs-ficha-dato-valor{
  font-family: "Outfit", sans-serif;
  font-size: 15px; font-weight: 700; color: var(--ahs-negro);
}

/* ----- Ficha de producto: bloque de confianza ----- */
.ahs-ficha-confianza{
  list-style: none;
  margin: 4px 0 26px;
  padding: 14px 16px;
  background: var(--ahs-fondo);
  border-radius: 12px;
  display: flex; flex-direction: column; gap: 13px;
}
.ahs-ficha-confianza li{ display: flex; align-items: flex-start; gap: 11px; }
.ahs-ficha-confianza-ico{
  flex-shrink: 0;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9px;
  background: #fff;
  border: 1px solid var(--ahs-borde);
  color: var(--ahs-turquesa-dark);
}
.ahs-ficha-confianza-ico svg{ width: 18px; height: 18px; display: block; }
.ahs-ficha-confianza li > span:last-child{
  font-size: 13px; line-height: 1.45; color: var(--ahs-gris);
  min-width: 0; /* deja que el texto se ajuste en columnas angostas */
}
.ahs-ficha-confianza strong{
  display: block;
  font-size: 13.5px; color: var(--ahs-negro); font-weight: 600;
  line-height: 1.3;
  margin-bottom: 2px;
}
.ahs-ficha-confianza a{
  display: inline-block;
  margin-top: 2px;
  color: var(--ahs-turquesa-dark); text-decoration: underline;
  white-space: nowrap;
}
.ahs-ficha-confianza a:hover{ color: var(--ahs-negro); }

@media (max-width: 560px){
  .ahs-ficha-datos{ gap: 10px 22px; }
  .ahs-ficha-confianza{ padding: 14px; gap: 14px; }
  .ahs-ficha-confianza li > span:last-child{ font-size: 13.5px; }
}

/* ----- Migas de pan (ficha de producto) ----- */
.ahs-breadcrumb-wrap{
  max-width: var(--ahs-container);
  margin: 20px auto 0;
  padding: 0 24px;
}
.ahs-breadcrumb{
  font-size: 13.5px;
  color: var(--ahs-gris);
  display: flex; flex-wrap: wrap; align-items: center; gap: 2px;
}
.ahs-breadcrumb a{
  color: var(--ahs-gris); text-decoration: none;
  transition: color .2s ease;
}
.ahs-breadcrumb a:hover{ color: var(--ahs-turquesa-dark); text-decoration: underline; }
.ahs-bc-sep{ margin: 0 8px; color: var(--ahs-borde); }
/* El último tramo es el producto actual: sin link y en oscuro. */
.ahs-breadcrumb{ color: var(--ahs-texto); }

@media (max-width: 560px){
  .ahs-breadcrumb-wrap{ padding: 0 20px; margin-top: 14px; }
  .ahs-breadcrumb{ font-size: 12.5px; }
}

/* ----- Filtros por atributo (escala, colección, marca) ----- */
.ahs-filtros{
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 14px 18px;
  margin: 0 0 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ahs-filtro-fila{
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}
.ahs-filtro-label{
  flex-shrink: 0;
  min-width: 74px;
  font-size: 11.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--ahs-gris);
}
.ahs-filtro-chips{ display: flex; flex-wrap: wrap; gap: 7px; }
.ahs-chip{
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid var(--ahs-borde);
  border-radius: 20px;
  background: #fff;
  color: var(--ahs-texto);
  font-size: 13.5px; font-weight: 600;
  text-decoration: none;
  transition: border-color .18s ease, background .18s ease, color .18s ease;
}
.ahs-chip:hover{ border-color: var(--ahs-turquesa); color: var(--ahs-turquesa-dark); }
.ahs-chip.is-activo{
  background: var(--ahs-turquesa);
  border-color: var(--ahs-turquesa);
  color: #fff;
}
.ahs-filtro-limpiar{
  align-self: flex-start;
  font-size: 13px; color: var(--ahs-rojo);
  text-decoration: underline;
}
.ahs-filtro-limpiar:hover{ color: var(--ahs-negro); }

@media (max-width: 600px){
  .ahs-filtros{ padding: 12px 14px; gap: 12px; }
  .ahs-filtro-fila{ flex-direction: column; align-items: stretch; gap: 6px; }
  .ahs-filtro-label{ min-width: 0; }
  /* Chips en fila con scroll: no empujan la página a lo alto. */
  .ahs-filtro-chips{
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .ahs-filtro-chips::-webkit-scrollbar{ display: none; }
  .ahs-chip{ flex-shrink: 0; }
}

/* ----- Card "Ver todos" en la grilla de escalas ----- */
.ahs-cat-card--todos{ border-color: var(--ahs-turquesa); }
.ahs-cat-card--todos .ahs-cat-name{ color: var(--ahs-turquesa-dark); }
.ahs-cat-card--todos .ahs-cat-media--placeholder{
  font-size: 40px;
}

/* ----- Selector de sagas (subcategorías dentro de una escala) ----- */
.ahs-sagas{
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--ahs-borde);
  border-radius: 12px;
  padding: 14px 18px;
  margin: 0 0 20px;
}
@media (max-width: 600px){
  .ahs-sagas{ flex-direction: column; align-items: stretch; gap: 8px; padding: 12px 14px; }
  .ahs-sagas .ahs-filtro-chips{
    flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .ahs-sagas .ahs-filtro-chips::-webkit-scrollbar{ display: none; }
}

/* ===================================================
 * CARRITO (clásico) — layout de dos columnas
 *
 * Por defecto la columna de totales queda angosta y, con cinco métodos de
 * envío listados, el botón de pagar cae fuera de la vista. Acá el resumen
 * es un panel propio que acompaña el scroll.
 * =================================================== */
/* OJO: Kadence envuelve el formulario y los totales en
   .kadence-woo-cart-form-wrap. El grid va en ESE contenedor; puesto en
   .woocommerce dejaba el wrap entero en una columna y la otra vacía. */
.woocommerce-cart .kadence-woo-cart-form-wrap{
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.woocommerce-cart .woocommerce-notices-wrapper{ grid-column: 1 / -1; }
.woocommerce-cart .woocommerce-cart-form{
  grid-column: 1;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.woocommerce-cart .cart-collaterals{
  grid-column: 2;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
.woocommerce-cart .cart-collaterals .cart_totals{
  width: 100% !important;
  float: none !important;
  /* Acompaña el scroll: el total y el botón quedan siempre a la vista.
     88px del header + aire. */
  position: sticky;
  top: 104px;
}

/* Tabla de productos más liviana */
.woocommerce-cart table.shop_table td{ padding: 14px 16px; }
.woocommerce-cart table.cart img{ width: 72px; }
.woocommerce-cart .product-remove a.remove{
  color: var(--ahs-gris) !important;
  font-size: 20px;
  transition: color .2s ease;
}
.woocommerce-cart .product-remove a.remove:hover{
  color: var(--ahs-rojo) !important;
  background: transparent !important;
}

/* Fila de acciones (cupón + actualizar) */
.woocommerce-cart .cart .actions{ padding: 14px 16px; }
.woocommerce-cart .cart .actions .coupon{ display: flex; gap: 8px; flex-wrap: wrap; }

/* ----- Panel de resumen ----- */
.woocommerce-cart .cart_totals h2{ font-size: 18px !important; margin: 14px 0 10px !important; }
.woocommerce-cart .cart_totals table.shop_table{
  border: 0;
  border-radius: 0;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td{
  background: transparent;
  border-top: 1px solid var(--ahs-borde);
  padding: 12px 0;
  font-size: 14px;
  text-transform: none;
  letter-spacing: 0;
}
.woocommerce-cart .cart_totals tr:first-child th,
.woocommerce-cart .cart_totals tr:first-child td{ border-top: 0; }
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td{
  font-family: "Outfit", sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: var(--ahs-negro);
  padding-top: 14px;
}

/* ----- Métodos de envío como opciones seleccionables ----- */
.woocommerce-cart .woocommerce-shipping-totals th{ padding-bottom: 6px !important; }
.woocommerce-cart ul#shipping_method{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
/* WooCommerce deja el radio FUERA del label, así que el label se estira sobre
   toda la fila (queda clickeable entera) y el radio se posiciona encima. */
.woocommerce-cart ul#shipping_method li{
  margin: 0;
  padding: 0;
  text-indent: 0;
  position: relative;
}
/* flex:1 1 auto es necesario, no decorativo: Kadence deja el <li> en flex-row,
   así que el label se encoge al contenido y la tarjeta no llega al borde. Con
   el label angosto, el radio —posicionado en absoluto a 13px del <li>— quedaba
   FUERA del recuadro. Se nota sobre todo en móvil. */
.woocommerce-cart ul#shipping_method li label{
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 10px 12px 10px 38px;
  border: 1px solid var(--ahs-borde);
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ahs-texto);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease;
}
.woocommerce-cart ul#shipping_method li label:hover{
  border-color: var(--ahs-turquesa);
  background: rgba(26,188,156,.05);
}
.woocommerce-cart ul#shipping_method li input[type="radio"]{
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  margin: 0;
  accent-color: var(--ahs-turquesa);
}
/* Opción elegida: el label es hermano del input marcado. */
.woocommerce-cart ul#shipping_method li input[type="radio"]:checked + label{
  border-color: var(--ahs-turquesa);
  background: rgba(26,188,156,.10);
  font-weight: 600;
}
.woocommerce-cart ul#shipping_method .amount{ display: none; } /* siempre $0 */
.ahs-envio-gratis{
  margin-left: auto;
  background: var(--ahs-turquesa);
  color: var(--ahs-on-turquesa);
  font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  padding: 2px 8px; border-radius: 4px;
}

/* ----- Botón de pago ----- */
.woocommerce-cart .wc-proceed-to-checkout{ padding: 16px 0 4px !important; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
  font-size: 15px;
  padding: 15px 24px;
  border-radius: 8px;
}

@media (max-width: 900px){
  .woocommerce-cart .kadence-woo-cart-form-wrap{ grid-template-columns: 1fr; gap: 22px; }
  .woocommerce-cart .woocommerce-cart-form,
  .woocommerce-cart .cart-collaterals{ grid-column: 1; }
  /* Apilado, el sticky estorbaría: el resumen ya queda al final. */
  .woocommerce-cart .cart-collaterals .cart_totals{ position: static; }
}

/* ----- Banner de cupón: dos columnas y más bajo -----
   SIN USO desde que se retiró el cupón de lanzamiento (ago-2026). Se conserva
   porque sirve tal cual para la próxima promoción con código: basta llamar a
   ahs_promo_banner() con 'modificador' => 'ahs-promo--cupon' y el bloque del
   código en 'aparte'. La imagen assets/banners/cupon-lanzamiento.jpg también
   sigue disponible (es abstracta, no dice "lanzamiento").

   El código es el dato que el cliente debe retener, así que sale del párrafo
   y ocupa su propia columna. Al no llevar texto largo, el banner puede ser
   bastante más delgado que los promocionales con foto. */
.ahs-promo--cupon .ahs-promo-inner{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 36px;
  min-height: 0;
  padding: 30px 24px;
}
.ahs-promo--cupon .ahs-promo-title{ font-size: clamp(24px, 3.2vw, 34px); margin-bottom: 8px; }
.ahs-promo--cupon .ahs-promo-text{ margin-bottom: 18px; font-size: 15px; }
.ahs-promo-texto{ min-width: 0; }

.ahs-cupon{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 18px 30px;
  border: 2px dashed rgba(255,255,255,.45);
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  text-align: center;
}
.ahs-cupon-label{
  font-size: 11.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .16em;
  color: var(--ahs-turquesa);
}
.ahs-cupon-codigo{
  font-family: "Outfit", sans-serif;
  font-size: clamp(26px, 3.4vw, 36px);
  font-weight: 800;
  letter-spacing: .06em;
  color: #fff;
  line-height: 1;
}

@media (max-width: 780px){
  /* Apilado: el cupón queda bajo el texto, a lo ancho. */
  .ahs-promo--cupon .ahs-promo-inner{
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 26px 20px;
  }
  .ahs-cupon{ padding: 14px 20px; }
  /* Este banner no usa la variante apilada con foto arriba. */
  .ahs-promo--cupon::before{ display: none; }
  .ahs-promo--cupon{
    background-image:
      linear-gradient(100deg, rgba(14,14,16,.90) 0%, rgba(14,14,16,.72) 55%, rgba(14,14,16,.45) 100%),
      var(--ahs-promo-img) !important;
    background-color: transparent;
    background-size: cover;
    background-position: 70% center;
  }
}

/* ----- Aviso de envío por pagar -----
   Un "$0" se lee como envío gratis, y esa confusión recién se descubre
   cuando el courier le cobra al cliente. Por eso se repite en los tres
   momentos donde mira el costo: carrito, elección de courier y resumen.

   Es información, no una alerta: usa el borde turquesa de .ahs-legal-nota
   (mismo lenguaje visual del resto del sitio), no el rojo — un cuadro rojo
   ahí se lee como que algo salió mal con el pedido.

   En el carrito la nota es una FILA propia con colspan=2 (ver
   ahs_fila_aviso_envio en functions.php), no un párrafo dentro del <li> del
   método: ahí quedaba aplastada a ~98px porque el <li> es flex-row con
   flex-wrap:nowrap. Como fila, ocupa los 409px de la tabla. */
.ahs-envio-nota{
  margin: 0;
  padding: 10px 12px;
  background: rgba(26,188,156,.07);
  border-left: 3px solid var(--ahs-turquesa);
  border-radius: 0 6px 6px 0;
  font-size: 12.5px;
  line-height: 1.5;
  font-weight: 400;
  color: var(--ahs-texto);
}
.ahs-envio-nota strong{ color: var(--ahs-negro); }

/* La fila del aviso y la de envío son un solo bloque visual: el borde
   separador va arriba del aviso y no entre medio de los dos. */
.woocommerce-cart .cart_totals tr.ahs-envio-aviso > td{
  border-top: 1px solid var(--ahs-borde);
  padding: 12px 0 0;
}
.woocommerce-cart .cart_totals tr.ahs-envio-aviso + tr.woocommerce-shipping-totals > th,
.woocommerce-cart .cart_totals tr.ahs-envio-aviso + tr.woocommerce-shipping-totals > td{
  border-top: 0;
  padding-top: 10px;
}

/* ----- Checkout de BLOQUES -----
   Los hooks PHP del checkout clásico no corren acá (los bloques se dibujan
   en JS desde la Store API), así que el aviso se agrega por CSS sobre los
   contenedores de WooCommerce. Mismo estilo turquesa que el carrito, por
   coherencia: es la misma información en las tres pantallas.

   TODO lo de acá va condicionado a que haya courier elegido. El resumen usa
   EXACTAMENTE el mismo markup para courier y para retiro en tienda —mismas
   clases, mismo <strong>Gratis</strong>, solo cambia el texto de la etiqueta—,
   así que sin condicionar, a quien retira en tienda se le mostraba
   "Envío por pagar: lo cobra el courier al entregar", que es falso.
   Se distingue con :has() sobre el contenedor del checkout: el selector de
   tarifas (.wc-block-components-shipping-rates-control) existe solo en la
   pestaña "Enviar"; en "Retiro en Local" lo reemplaza
   .wc-block-checkout__pickup-options. Verificado en el sitio real. */
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wp-block-woocommerce-checkout-shipping-methods-block::after,
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wp-block-woocommerce-checkout-order-summary-shipping-block::after{
  display: block;
  padding: 10px 12px;
  background: rgba(26,188,156,.07);
  border-left: 3px solid var(--ahs-turquesa);
  border-radius: 0 6px 6px 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: #1F1F23;
}
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wp-block-woocommerce-checkout-shipping-methods-block::after{
  content: "El envío no está incluido: el flete lo cobra la empresa de transporte al entregarte el pedido. Acá pagas solo los productos.";
  margin-top: 12px;
}
/* En el resumen es donde aparece "Envío $0" justo antes de pagar. */
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wp-block-woocommerce-checkout-order-summary-shipping-block::after{
  content: "Envío por pagar: lo cobra el courier al entregar.";
  margin-top: 8px;
  font-size: 12px;
}

/* En el RESUMEN del pedido el monto del envío también decía "Gratis" al lado
   de "Starken · Por pagar". Se reemplaza por "Por pagar", que es lo que el
   cliente necesita leer en la columna donde busca los montos. Igual que
   arriba, solo con courier: en retiro el "Gratis" es verdad y se deja. */
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wc-block-components-totals-shipping .wc-block-components-totals-item__value > strong{
  display: none;
}
.wp-block-woocommerce-checkout:has(.wc-block-components-shipping-rates-control)
  .wc-block-components-totals-shipping .wc-block-components-totals-item__value::after{
  content: "Por pagar";
  font-weight: 700;
}

/* El courier decía "Starken · Por pagar" y al lado "Gratis", contradiciéndose
   justo antes de pagar. El "Gratis" lo agrega WooCommerce porque el método
   cuesta $0, y el filtro que limpia la etiqueta en el carrito
   (woocommerce_cart_shipping_method_full_label) NO corre acá: los bloques se
   dibujan en JS desde la Store API. Se oculta el precio, igual que el $0 del
   carrito; el aviso turquesa de arriba explica quién cobra el flete.

   El selector se ancla en .wc-block-components-shipping-rates-control, que
   envuelve SOLO las tarifas de courier. El retiro en tienda vive aparte, en
   .wc-block-checkout__pickup-options, y ahí el "gratis" sí es verdad y se
   deja tal cual. Verificado en el sitio real, en las dos pestañas. */
.wc-block-components-shipping-rates-control .wc-block-components-radio-control__secondary-label{
  display: none !important;
}