/*
  custom-gallery.css (1.6)
  - Kwadratowe kafelki (aspect-ratio: 1/1)
  - Odstęp 10px
  - Brak podpisów (ukryte)
*/

/* KONTENER GALERII */
.cg-gallery {
  margin: 0 auto;
  /* W paginacji i tak przeładowujemy stronę, więc nic specjalnego nie trzeba tu robić. */
}

/* ELEMENT GALERII */
.cg-item {
  width: calc(25% - 10px); /* 4 kolumny przy szerokich ekranach */
  margin: 0 0 10px;
  float: left;             /* kluczowe przy fitRows */
  box-sizing: border-box;
  position: relative;
  aspect-ratio: 1 / 1;    /* gwarantuje kwadrat */
  overflow: hidden;
  background: #fff;
  border-radius: 5px;
  text-align: center;
}

/* Responsywne kolumny */
@media (max-width: 992px) {
  .cg-item {
    width: calc(33.333% - 10px); /* 3 kolumny */
  }
}
@media (max-width: 768px) {
  .cg-item {
    width: calc(50% - 10px); /* 2 kolumny */
  }
}
@media (max-width: 480px) {
  .cg-item {
    width: 100%;
    margin-bottom: 10px;
  }
}

/* OBRAZ – wypełnia cały kwadrat */
.cg-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* CAPTION – wyłączony (jeśli byłby generowany) */
.cg-caption {
  display: none;
}

/* PAGINACJA (opcjonalnie styluj wg uznania) */
.cg-pagination {
  text-align: center;
  margin: 20px 0;
}
.cg-pagination .page-numbers {
  display: inline-block;
  margin: 0 5px;
  padding: 6px 12px;
  background: #f0f0f0;
  border-radius: 4px;
  text-decoration: none;
  color: #333;
}
.cg-pagination .page-numbers.current {
  background: #bada55;
  font-weight: bold;
  color: #000;
}