/**
 * Galería de fotos — presentación de miniaturas.
 *
 * Feature: publicacion-galeria-fotos
 * Muestra las imágenes de una galería (paragraph "galeria", field_image con
 * formatter Colorbox) en una cuadrícula de 4 columnas responsiva.
 * El visor Colorbox (clic para ver en grande y navegar) no se altera.
 */

/* Cuadrícula de miniaturas dentro de la galería de un nodo fotogaleria. */
.node--type-fotogaleria .field--name-field-image {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Cada item de imagen ocupa su celda. */
.node--type-fotogaleria .field--name-field-image .field__item {
  margin: 0;
  overflow: hidden;
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  background: #f5f5f5;
}

/* Las miniaturas llenan la celda manteniendo proporción, altura uniforme. */
.node--type-fotogaleria .field--name-field-image .field__item a,
.node--type-fotogaleria .field--name-field-image .field__item img {
  display: block;
  width: 100%;
  height: 100%;
}

.node--type-fotogaleria .field--name-field-image .field__item img {
  height: 175px;
  object-fit: cover;
  transition: transform 0.25s ease;
}

.node--type-fotogaleria .field--name-field-image .field__item a:hover img {
  transform: scale(1.04);
}

/* Responsivo: reduce columnas conforme baja el ancho de pantalla. */
@media (max-width: 992px) {
  .node--type-fotogaleria .field--name-field-image {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .node--type-fotogaleria .field--name-field-image {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .node--type-fotogaleria .field--name-field-image {
    grid-template-columns: 1fr;
  }
}
