/* OZ Cotizador — Loops (base estructural, sin diseño del cliente)
 *
 * Este archivo solo define estructura/layout mínimos para que las cards funcionen.
 * El look (colores, sombras, bordes, tipografía) debe ir en:
 * - `design-packs/*/css/pack.css` (recomendado), o
 * - el theme, si el proyecto lo requiere.
 */

/* Misma familia que el tema (variables OZ) o pila sistema; evita Times New Roman por herencia/UA. */
.ozc-product-card,
.ozc-post-card,
.ozc-single-product {
  font-family: var(
    --OZ-Font-Base,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif
  );
}

/* Excluir carruseles OZ Sliders (.ozs__track): el grid del Cotizador no debe aplicarse al ul horizontal del plugin. */
.ozc-loops--replace ul.products:not(.ozs__track) {
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 18px;
}

.ozc-loops--replace ul.products li.first,
.ozc-loops--replace ul.products li.last {
  clear: none;
}

.ozc-product-card,
.ozc-post-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: 0;
}

.ozc-product-card {
  padding-bottom: 16px;
}

.ozc-product-card--related {
  padding-bottom: 14px;
}

.ozc-product-card__media,
.ozc-post-card__media {
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

.ozc-product-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  max-width: calc(100% - 24px);
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ozc-product-card__media img,
.ozc-post-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ozc-post-card__body {
  padding: 14px 14px 16px;
  display: grid;
  gap: 10px;
}

.ozc-product-card__section {
  padding: 0 14px;
  margin-top: 10px;
}

.ozc-product-card__section:first-child {
  margin-top: 14px;
}

.ozc-product-card__media + .ozc-product-card__section {
  margin-top: 14px;
}

.ozc-product-card__title,
.ozc-post-card__title {
  margin: 0;
  line-height: 1.25;
  word-break: break-word;
  min-height: calc(1.25em * 2);
  /* El recorte a 2 lineas va en el ENLACE de dentro, no aqui: el h3 es hijo
   * de un contenedor flex y eso convierte su -webkit-box en block, asi que el
   * line-clamp no se aplicaba y lo que cortaba era el max-height. Como
   * overflow recorta en la caja de relleno, asomaba parte de la 3.a linea. */
  display: block;
}

.ozc-product-card__title > a,
.ozc-post-card__title > a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.ozc-product-card__title,
.ozc-product-card__category {
  text-align: center;
}

/* Línea “Marca: …” (visible en design packs que ocultan el badge) */
.ozc-product-card__brand {
  display: none;
  text-align: center;
}

.ozc-product-card__title a,
.ozc-post-card__title a {
  color: inherit;
  text-decoration: none;
}

.ozc-product-card__actions,
.ozc-post-card__actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.ozc-product-card__actions {
  flex-direction: column;
  align-items: stretch;
}

.ozc-product-card__btn,
.ozc-post-card__btn,
.ozc-product-card__wa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  font-size: 13px;
  width: 100%;
}

/* WooCommerce agrega un link "Ver carrito" junto al botón; lo ocultamos y usamos estado "Agregado". */
.ozc-product-card a.added_to_cart,
.ozc-product-card a.added_to_cart.wc-forward,
.ozc-product-card a.wc-forward {
  display: none;
}

.ozc-product-card__btn--loading {
  opacity: 0.7;
}

.ozc-product-card__btn--added::before {
  content: '✓';
  font-weight: 900;
  margin-right: 8px;
}

.ozc-product-card__wa {
  width: 100%;
  display: block;
}

/* Altura única para fila cantidad + añadir al carrito (anula estilos del tema). */
.ozc-single-product {
  margin: 18px 0 26px;
  --ozc-pdp-action-h: 52px;
  --ozc-pdp-action-gap: 12px;
}

.ozc-single-product__inner {
  display: grid;
  grid-template-columns: minmax(320px, 1.15fr) minmax(320px, 0.85fr);
  gap: 26px;
  align-items: start;
}

/* Muchos themes fuerzan el layout nativo de Woo (gallery 48% + summary 48% con floats).
   Como reubicamos el summary en otra columna, anulamos esos estilos para evitar “huecos”. */
.ozc-single-product .woocommerce-product-gallery {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* No forzar ancho en __wrapper/__image: FlexSlider usa inline; !important rompe el slide. */
.ozc-single-product .woocommerce-product-gallery figure {
  max-width: 100%;
}

/*
 * Fila única: cantidad (izquierda) + añadir al carrito (derecha).
 * Algunos temas envuelven ambos en un div en bloque o fuerzan width:100% al botón; :has() cubre el envoltorio.
 */
.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form),
.ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: var(--ozc-pdp-action-gap, 12px);
  width: 100%;
  box-sizing: border-box;
}

.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button),
.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: var(--ozc-pdp-action-gap, 12px);
  width: 100%;
  box-sizing: border-box;
}

.ozc-single-product__cta form.cart {
  margin-block: 0;
}

.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) .quantity,
.ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart .quantity {
  flex: 0 0 auto;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) .single_add_to_cart_button,
.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) button[type='submit'].single_add_to_cart_button,
.ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart .single_add_to_cart_button,
.ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart button[type='submit'].single_add_to_cart_button {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  max-width: 100%;
  align-self: center;
}

.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button) .quantity,
.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) .quantity {
  flex: 0 0 auto;
}

.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button) .single_add_to_cart_button,
.ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) .single_add_to_cart_button {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  max-width: 100%;
}

/* Cantidad + botón: misma altura física (importante vs tema / steppers alternativos) */
.ozc-single-product__cta form.cart .quantity {
  display: inline-flex !important;
  align-items: center !important;
  height: var(--ozc-pdp-action-h) !important;
  min-height: var(--ozc-pdp-action-h) !important;
  max-height: var(--ozc-pdp-action-h) !important;
  border-radius: 8px;
  border: 1px solid currentColor;
  background: transparent;
  overflow: hidden;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ozc-single-product__cta form.cart .quantity .oz-qty-stepper {
  display: inline-flex !important;
  align-items: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ozc-single-product__cta form.cart .quantity .oz-qty-stepper__btn,
.ozc-single-product__cta form.cart .quantity .oz-qty-stepper__btn--dec,
.ozc-single-product__cta form.cart .quantity .oz-qty-stepper__btn--inc {
  height: var(--ozc-pdp-action-h) !important;
  min-height: 0 !important;
  max-height: var(--ozc-pdp-action-h) !important;
  width: 2.75rem !important;
  min-width: 2.75rem !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  align-self: center !important;
}

.ozc-single-product__cta .ozc-qty-btn {
  width: 44px !important;
  height: var(--ozc-pdp-action-h) !important;
  min-height: 0 !important;
  max-height: var(--ozc-pdp-action-h) !important;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-weight: 900;
  line-height: 1 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.ozc-single-product__cta form.cart .quantity input.qty,
.ozc-single-product__cta form.cart .quantity .oz-qty-stepper__input {
  width: 58px !important;
  min-width: 48px !important;
  height: var(--ozc-pdp-action-h) !important;
  min-height: 0 !important;
  max-height: var(--ozc-pdp-action-h) !important;
  border: 0 !important;
  text-align: center;
  outline: none;
  box-shadow: none;
  background: transparent;
  line-height: 1.2 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  -moz-appearance: textfield;
}

.ozc-single-product__cta form.cart .quantity input.qty::-webkit-outer-spin-button,
.ozc-single-product__cta form.cart .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ozc-single-product__cta form.cart .single_add_to_cart_button,
.ozc-single-product__cta form.cart .button.alt {
  height: var(--ozc-pdp-action-h) !important;
  min-height: var(--ozc-pdp-action-h) !important;
  max-height: var(--ozc-pdp-action-h) !important;
  padding: 0 1.25rem !important;
  margin: 0 !important;
  border-radius: 999px;
  box-sizing: border-box !important;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  font-size: inherit;
}

.ozc-product-card--compact {
  padding-bottom: 12px;
}

.ozc-product-card--compact .ozc-product-card__section {
  padding: 0 10px;
}

.ozc-product-card__qty {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  height: 40px;
  border-radius: 999px;
  border: 1px solid currentColor;
  background: transparent;
  overflow: hidden;
}

.ozc-product-card__qty-btn {
  width: 44px;
  height: 40px;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-weight: 900;
  line-height: 1;
}

.ozc-product-card__qty-input {
  flex: 1 1 auto;
  min-width: 56px;
  height: 40px;
  border: 0;
  background: transparent;
  padding: 0 12px;
  text-align: center;
  font-weight: 700;
  outline: none;
}

/* Quitar “spinners” del input number */
.ozc-product-card__qty-input::-webkit-outer-spin-button,
.ozc-product-card__qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ozc-product-card__qty-input[type="number"] {
  -moz-appearance: textfield;
}

@media screen and (max-width: 960px) {
  .ozc-single-product__inner {
    grid-template-columns: 1fr;
  }
}

/* Móvil / tablet estrecha: título 26px; cantidad arriba, añadir al carrito ancho completo debajo (incluye landscape ~844px) */
@media screen and (max-width: 991px) {
  .ozc-single-product__title .product_title,
  .ozc-single-product__title h1 {
    font-size: 26px !important;
    line-height: 1.2;
  }

  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form),
  .ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button),
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 12px;
  }

  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) .quantity,
  .ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart .quantity,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button) .quantity,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) .quantity {
    align-self: flex-start;
    flex: 0 0 auto !important;
  }

  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) .single_add_to_cart_button,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) button[type='submit'].single_add_to_cart_button,
  .ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart .single_add_to_cart_button,
  .ozc-single-product__cta form.cart.variations_form .woocommerce-variation-add-to-cart button[type='submit'].single_add_to_cart_button,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(.single_add_to_cart_button) .single_add_to_cart_button,
  .ozc-single-product__cta form.cart:not(.variations_form):not(.grouped_form) > div:has(.quantity):has(button[type='submit'].single_add_to_cart_button) .single_add_to_cart_button {
    width: 100% !important;
    flex: 0 0 auto !important;
    max-width: none !important;
  }

  .ozc-single-product__wa {
    margin-top: 4px;
  }

  .ozc-single-product__wa .ozc-product-card__wa-btn {
    width: 100%;
    box-sizing: border-box;
  }
}


/* ── Botón "Ficha técnica" en producto individual (junto a "Consultar").
   Solo aparece si el producto tiene ficha (se renderiza desde single-product-card.php). ── */
.ozc-product-card__ficha-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  font-size: 13px;
}
.ozc-product-card__ficha-btn:hover { opacity: .85; }
/* Ficha + Consultar lado a lado (50/50). Si solo hay uno, llena el ancho. */
.ozc-single-product__wa { display: flex; gap: 10px; flex-wrap: wrap; }
.ozc-single-product__wa > .ozc-product-card__ficha-btn,
.ozc-single-product__wa > .ozc-product-card__wa-btn { flex: 1 1 0; min-width: 0; width: auto; }


/* ==== 29-09-2026: añadido del pack herramientasperu del sitio (su 3.7.1 lo tenia en
   design-packs/herramientasperu/css/pack.css; la 3.8.5 trae el pack sin este bloque
   y la maleta no lleva packs, asi que va aqui: se carga despues del CSS del plugin). ==== */

/* ── Movil (<=575px): el tema (woocommerce/shop-archive.css) fuerza
   font-size:14px y min-height:44px sobre .ozc-product-card__btn con mas
   especificidad que este pack, asi que el texto «Agregar a cotizacion»
   reaparecia encima del icono y lo aplastaba a 0 de ancho. Repetimos la
   misma especificidad del tema para devolver el boton a solo icono.
   El texto sigue en el aria-label, asi que no se pierde accesibilidad. ── */
@media (max-width: 575px) {
  body.ozc-loops--replace .oz-shop-layout__main .ozc-product-card--pack-herramientasperu .ozc-product-card__btn--primary {
    width: 40px;
    height: 40px;
    min-height: 40px;
    font-size: 0;
    line-height: 0;
  }
  body.ozc-loops--replace .oz-shop-layout__main .ozc-product-card--pack-herramientasperu .ozc-product-card__btn--primary::before {
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
  }
}

/* ── Tableta apaisada y cualquier rejilla apretada ─────────────────────────
   La tarjeta pone el titulo y el boton uno al lado del otro a partir de 768px
   de VENTANA, pero lo que manda de verdad es el ancho de la TARJETA: en una
   tablet apaisada, con el filtro lateral y la vista de 4 columnas, cada
   tarjeta mide ~130px y el titulo se quedaba en 3px, aplastado contra el
   boton. Con una consulta de contenedor la tarjeta se apila sola cuando es
   estrecha, mire como mire la ventana. Por encima de 200px no cambia nada. */
@media (min-width: 769px) {
  .ozc-loops--replace ul.products li.product {
    container-type: inline-size;
  }

  @container (max-width: 200px) {
    .ozc-product-card--pack-herramientasperu {
      grid-template-columns: 1fr;
      grid-template-areas:
        "media"
        "category"
        "title"
        "price"
        "excerpt"
        "brand"
        "actions";
    }
  }
}