/* =========================================
   TARJETAS UNIFORMES + TÍTULOS LIMITADOS
   --------------------------------------------
   Asegura que todas las tarjetas tengan la misma
   altura, y que los títulos no excedan 3 líneas.
============================================ */

/* Asegura que cada tarjeta tenga altura uniforme */
ul.products li.product {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Fuerza una altura mínima en tarjetas (ajustable) */
body:not(.single-product) .product {
  min-height: 200px !important; /* Ajusta si usas más o menos contenido */
}

/* El título se limita a 3 líneas y muestra puntos suspensivos si es más largo */
/* ====================================
   [TÍTULO PRODUCTO - LÍMITES Y PUNTOS SUSPENSIVOS]
   ------------------------------------
   Limita el título del producto a 3 líneas
   y muestra "..." si se desborda.
==================================== */
body:not(.single-product) .product .woocommerce-loop-product__title {
  display: -webkit-box;              /* Define caja flexible para WebKit */
  -webkit-line-clamp: 3;             /* Limita a 3 líneas */
  -webkit-box-orient: vertical;      /* Orientación vertical para el recorte */
  overflow: hidden;                  /* Oculta texto que se salga */
  text-overflow: ellipsis;           /* Muestra puntos suspensivos al cortar */
  height: 4.5em;                    /* Altura total: 3 líneas x 1.5em de línea */
  line-height: 1.5em;                /* Altura de línea */
}

/* ====================================
   [CONTENEDOR BOTONES EN TARJETA PRODUCTO]
   ------------------------------------
   Empuja el contenedor de botones
   hacia la parte inferior de la tarjeta
==================================== */
.product .custom-add-to-cart-wrapper {
  margin-top: auto !important; /* Margen superior automático para empujar abajo */
}

/* ====================================
   [DIVISOR ENTRE IMAGEN Y TÍTULO]
   ------------------------------------
   Línea discontinua clara separando
   la imagen del nombre del producto
==================================== */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  border-top: 1px dashed rgba(0, 0, 0, 0.1); /* Línea superior discontinua tenue */
  padding-top: 8px;      /* Espacio interno arriba */
  margin-top: 8px;       /* Margen externo arriba */
  margin-left: 1em;      /* Margen izquierdo para separar del borde */
}

/* ====================================
   [FORMULARIO DE CANTIDAD PERSONALIZADO]
   ------------------------------------
   Elimina márgenes inferiores para que no afecte layout
==================================== */
.alcansan-desktop-cart-form {
  margin-bottom: 0em !important; /* Quita margen inferior */
}

/* ====================================
   [FOOTER DE LA TARJETA DE PRODUCTO]
   ------------------------------------
   Contenedor inferior de la tarjeta,
   ocupa todo el ancho con fondo translúcido,
   sombra sutil, bordes redondeados y altura mínima
==================================== */
.alcansan-product-footer {
  background-color: rgba(240, 240, 240, 0.4); /* Fondo gris claro semi-transparente */
  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1); /* Sombra hacia arriba para dar profundidad */
  padding: 12px;               /* Espacio interno */
  width: 100%;                 /* Ocupa todo el ancho de la tarjeta */
  margin-top: auto;            /* Empuja hacia abajo (rellena espacio flexible) */
  display: flex;               /* Flexbox para alinear contenidos */
  flex-direction: column;      /* Dirección vertical */
  justify-content: center;     /* Centra verticalmente el contenido */
  border-top: 1px solid rgba(0, 0, 0, 0.1); /* Línea superior tenue */
  border-bottom-left-radius: 12px;   /* Bordes redondeados en la parte inferior izquierda */
  border-bottom-right-radius: 12px;  /* Bordes redondeados en la parte inferior derecha */
  min-height: 90px;           /* Altura mínima para consistencia visual */
  box-sizing: border-box;     /* Padding incluido en ancho total */
  margin-bottom: -1em !important; /* Ajuste negativo para corregir espacios */
  margin-left: 0em !important;     /* Elimina margen izquierdo extra */
}