/* frontend-gallery.css */
.gallery_grid {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;  /* Μείωση του gap από 10px σε 5px */
    padding: 5px;  /* Μείωση του padding επίσης */
    max-width: 1400px;
    margin: 0 auto;
}

.gallery_image_item {
    flex: 1 1 250px;  /* Μείωση του flex-basis από 300px σε 250px */
    min-width: 250px;  /* Αντίστοιχη μείωση του min-width */
    max-width: calc(33.333% - 5px);  /* Αλλαγή σε τρεις στήλες με μικρότερο gap */
    position: relative;
    margin-bottom: 5px;  /* Μείωση του margin */
}

.gallery_image_item img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    display: block;
    border-radius: 4px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Διατήρηση aspect ratio για μεγάλες εικόνες */
.gallery_image_item img[width][height] {
    height: auto;
    min-height: 250px;
    max-height: 400px;
}

.gallery_image_item:hover img {
    filter: brightness(1.05);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

/* Responsive breakpoints */
@media (max-width: 1200px) {
    .gallery_image_item {
        flex: 1 1 200px;
        min-width: 200px;
        max-width: calc(50% - 5px);
    }
}

@media (max-width: 768px) {
    .gallery_image_item {
        flex: 1 1 180px;
        min-width: 180px;
        max-width: calc(50% - 5px);
    }
    .gallery_image_item img {
        height: 200px;
    }
    .gallery_image_item img[width][height] {
        min-height: 200px;
        max-height: 300px;
    }
}

@media (max-width: 480px) {
    .gallery_grid {
        gap: 4px;
    }
    .gallery_image_item {
        min-width: 100%;
    }
    .gallery_image_item img {
        height: auto;
        min-height: 200px;
    }
}