/* ============================================================
 * europet-category.css
 * Categorías WooCommerce / grilla de categorías
 * ============================================================ */

/*
 * Objetivo v6:
 * - Mantener píldora premium abajo de la imagen.
 * - Ocultar contador/subtexto de productos dentro de la cápsula.
 * - Separar subcategorías y productos con corte real de fila vía flex.
 *
 * Por qué v5 quedó igual:
 * - El clear:both no sirve si Flatsome está usando flex/row.
 * - Cuando hay 3 subcategorías, el primer producto rellena la 4ª columna.
 * - Esta versión mete un "salto" invisible entre categorías y productos usando
 *   .products:has(.product-category)::before como item flex de 100%.
 *
 * Nota:
 * - En staging diseno.europet.cl Urbanist puede caer a Arial por URL de fuente local 404.
 *   No validar grosor de letra exacto ahí.
 * ============================================================ */


/* ------------------------------------------------------------
 * 1) Convertir el loop en flex controlado en categorías
 * ------------------------------------------------------------ */

body.tax-product_cat .products,
body.post-type-archive-product .products,
body.woocommerce-page .products {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
}

/* Subcategorías primero */
body.tax-product_cat .products > .product-category,
body.post-type-archive-product .products > .product-category,
body.woocommerce-page .products > .product-category {
  order: 1 !important;
  margin-bottom: 0 !important;
}

/* Separador invisible: fuerza nueva fila entre categorías y productos */
body.tax-product_cat .products:has(> .product-category)::before,
body.post-type-archive-product .products:has(> .product-category)::before,
body.woocommerce-page .products:has(> .product-category)::before {
  content: "" !important;
  display: block !important;
  order: 2 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  pointer-events: none !important;
}

/* Productos después del separador */
body.tax-product_cat .products > .product:not(.product-category),
body.tax-product_cat .products > .product-small:not(.product-category),
body.post-type-archive-product .products > .product:not(.product-category),
body.post-type-archive-product .products > .product-small:not(.product-category),
body.woocommerce-page .products > .product:not(.product-category),
body.woocommerce-page .products > .product-small:not(.product-category) {
  order: 3 !important;
}


/* ------------------------------------------------------------
 * 2) Card de categoría: base
 * ------------------------------------------------------------ */

body.tax-product_cat .product-category .col-inner,
body.tax-product_cat .product-category .box,
body.tax-product_cat .product-category .box-category,
body.post-type-archive-product .product-category .col-inner,
body.post-type-archive-product .product-category .box,
body.post-type-archive-product .product-category .box-category,
body.woocommerce-page .product-category .col-inner,
body.woocommerce-page .product-category .box,
body.woocommerce-page .product-category .box-category {
  position: relative !important;
}

body.tax-product_cat .product-category .box,
body.tax-product_cat .product-category .box-category,
body.post-type-archive-product .product-category .box,
body.post-type-archive-product .product-category .box-category,
body.woocommerce-page .product-category .box,
body.woocommerce-page .product-category .box-category {
  overflow: hidden !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.tax-product_cat .product-category .box-image,
body.post-type-archive-product .product-category .box-image,
body.woocommerce-page .product-category .box-image {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}

/* Gradiente inferior suave para lectura */
body.tax-product_cat .product-category .box-image::after,
body.post-type-archive-product .product-category .box-image::after,
body.woocommerce-page .product-category .box-image::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 42% !important;
  pointer-events: none !important;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.50) 58%,
    rgba(255,255,255,0.86) 100%
  ) !important;
  z-index: 2 !important;
}


/* ------------------------------------------------------------
 * 3) Píldora: pisar Flatsome .box-badge .box-text
 * ------------------------------------------------------------ */

body.tax-product_cat .product-category .box-text,
body.tax-product_cat .product-category .box-badge .box-text,
body.tax-product_cat .product-category .box-text.box-text-middle,
body.tax-product_cat .product-category .box-category .box-text,
body.post-type-archive-product .product-category .box-text,
body.post-type-archive-product .product-category .box-badge .box-text,
body.post-type-archive-product .product-category .box-text.box-text-middle,
body.post-type-archive-product .product-category .box-category .box-text,
body.woocommerce-page .product-category .box-text,
body.woocommerce-page .product-category .box-badge .box-text,
body.woocommerce-page .product-category .box-text.box-text-middle,
body.woocommerce-page .product-category .box-category .box-text {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  bottom: 10px !important;

  transform: none !important;
  translate: none !important;

  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;

  padding: 0 12px !important;
  margin: 0 !important;
  background: transparent !important;
  text-align: center !important;
  pointer-events: none !important;
  z-index: 7 !important;

  transition: none !important;
}

/* Caja interna de píldora */
body.tax-product_cat .product-category .box-text .box-text-inner,
body.tax-product_cat .product-category .box-badge .box-text .box-text-inner,
body.post-type-archive-product .product-category .box-text .box-text-inner,
body.post-type-archive-product .product-category .box-badge .box-text .box-text-inner,
body.woocommerce-page .product-category .box-text .box-text-inner,
body.woocommerce-page .product-category .box-badge .box-text .box-text-inner {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: auto !important;
  max-width: calc(100% - 18px) !important;
  min-width: 0 !important;
  min-height: 0 !important;

  padding: 5px 12px !important;
  margin: 0 auto !important;

  border-radius: 999px !important;
  background: rgba(255,255,255,0.97) !important;
  border: 1px solid rgba(111,45,189,0.16) !important;
  box-shadow: 0 8px 20px rgba(36,23,53,0.12) !important;
  backdrop-filter: blur(5px);

  pointer-events: auto !important;

  font-size: 0 !important;
  line-height: 0 !important;
}


/* ------------------------------------------------------------
 * 4) Texto visible de categoría
 * ------------------------------------------------------------ */

body.tax-product_cat .product-category .box-text h5,
body.tax-product_cat .product-category .box-text .name,
body.tax-product_cat .product-category .box-text .header-title,
body.tax-product_cat .product-category .box-text .woocommerce-loop-category__title,
body.post-type-archive-product .product-category .box-text h5,
body.post-type-archive-product .product-category .box-text .name,
body.post-type-archive-product .product-category .box-text .header-title,
body.post-type-archive-product .product-category .box-text .woocommerce-loop-category__title,
body.woocommerce-page .product-category .box-text h5,
body.woocommerce-page .product-category .box-text .name,
body.woocommerce-page .product-category .box-text .header-title,
body.woocommerce-page .product-category .box-text .woocommerce-loop-category__title {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;

  color: #3f2a56 !important;
  font-size: 10.5px !important;
  line-height: 1.15 !important;
  font-weight: 650 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;

  white-space: normal !important;
  text-wrap: balance;
}

/* Ocultar contador/subtexto en variantes de Flatsome/Woo */
body.tax-product_cat .product-category .box-text .count,
body.tax-product_cat .product-category .box-text .is-xsmall,
body.tax-product_cat .product-category .box-text p,
body.tax-product_cat .product-category .box-text small,
body.tax-product_cat .product-category .box-text .category-count,
body.post-type-archive-product .product-category .box-text .count,
body.post-type-archive-product .product-category .box-text .is-xsmall,
body.post-type-archive-product .product-category .box-text p,
body.post-type-archive-product .product-category .box-text small,
body.post-type-archive-product .product-category .box-text .category-count,
body.woocommerce-page .product-category .box-text .count,
body.woocommerce-page .product-category .box-text .is-xsmall,
body.woocommerce-page .product-category .box-text p,
body.woocommerce-page .product-category .box-text small,
body.woocommerce-page .product-category .box-text .category-count {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* ------------------------------------------------------------
 * 5) Móvil
 * ------------------------------------------------------------ */

@media (max-width: 849px) {
  body.tax-product_cat .products:has(> .product-category)::before,
  body.post-type-archive-product .products:has(> .product-category)::before,
  body.woocommerce-page .products:has(> .product-category)::before {
    height: 28px !important;
  }

  body.tax-product_cat .product-category .box-text,
  body.tax-product_cat .product-category .box-badge .box-text,
  body.post-type-archive-product .product-category .box-text,
  body.post-type-archive-product .product-category .box-badge .box-text,
  body.woocommerce-page .product-category .box-text,
  body.woocommerce-page .product-category .box-badge .box-text {
    bottom: 8px !important;
    padding: 0 8px !important;
  }

  body.tax-product_cat .product-category .box-text .box-text-inner,
  body.post-type-archive-product .product-category .box-text .box-text-inner,
  body.woocommerce-page .product-category .box-text .box-text-inner {
    max-width: calc(100% - 12px) !important;
    padding: 5px 10px !important;
  }

  body.tax-product_cat .product-category .box-text h5,
  body.tax-product_cat .product-category .box-text .name,
  body.tax-product_cat .product-category .box-text .header-title,
  body.tax-product_cat .product-category .box-text .woocommerce-loop-category__title,
  body.post-type-archive-product .product-category .box-text h5,
  body.post-type-archive-product .product-category .box-text .name,
  body.post-type-archive-product .product-category .box-text .header-title,
  body.post-type-archive-product .product-category .box-text .woocommerce-loop-category__title,
  body.woocommerce-page .product-category .box-text h5,
  body.woocommerce-page .product-category .box-text .name,
  body.woocommerce-page .product-category .box-text .header-title,
  body.woocommerce-page .product-category .box-text .woocommerce-loop-category__title {
    font-size: 9.8px !important;
    letter-spacing: .035em !important;
  }
}