/******* Do not edit this file *******
Code Snippets Manager
Saved: Nov 27 2025 | 09:08:47 */
@charset "UTF-8";
/* 1. Ocultar la barra lateral derecha a la fuerza */
div#right-sidebar, aside#right-sidebar, .is-right-sidebar, .widget-area.sidebar {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  position: absolute !important;
  z-index: -9999 !important;
}
/* 2. (Opcional) Estirar el contenido principal para ocupar todo el ancho */
/* Si al quitar la barra te queda un hueco blanco a la derecha, añade esto: */
#primary, .content-area, .site-main {
  width: 100% !important;
  float: none !important;
  max-width: 100% !important;
}
/* 1. Configurar el contenedor para que sea una rejilla de 4 columnas */
.gb-looper-a3002aed {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  /* 4 columnas iguales */
  gap: 15px !important;
  /* Espacio entre productos (puedes bajarlo a 10px o 5px) */
}
/* 2. Asegurar que cada producto ocupe su espacio correctamente */
.gb-looper-a3002aed .gb-loop-item {
  width: 100% !important;
  margin: 30 !important;
  /* Elimina márgenes extraños que causan separación */
}
/* 3. Ajustar las imágenes para que no se deformen al cambiar el tamaño */
.gb-looper-a3002aed img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}
/* --- OPCIONAL: Para que en Móvil no se vea todo aplastado --- */
@media (max-width: 768px) {
  .gb-looper-a3002aed {
    grid-template-columns: repeat(2, 1fr) !important;
    /* En móvil ponemos 2 columnas */
    gap: 10px !important;
  }
}
/* Configuración de las imágenes con proporción exacta */
.gb-looper-a3002aed img {
  width: 100% !important;
  /* El ancho se adapta a la columna (para que quepan 4) */
  /* Esta es la magia: Calcula la altura automáticamente basándose en tus medidas */
  aspect-ratio: 0.7152850647 !important;
  object-fit: cover !important;
  /* Rellena el hueco sin deformar la foto */
  object-position: top center !important;
  /* Enfoca la parte superior */
  margin-bottom: 20px !important;
}
/* --- AQUÍ, AL FINAL DE TODO, AGREGA ESTO --- */
/* Margen inferior para separar cada categoría */
.gb-looper-a3002aed .gb-loop-item {
  margin-bottom: 40px !important;
}
