/**
 * Gallery Masonry Layout Styles
 * 
 * @package FCBanikPD
 * @since 1.5.0
 */

/* CSS Column Masonry Layout - zachováva prirodzené aspect ratios */
.gallery-masonry {
    column-count: 6;
    column-gap: 16px;
    break-inside: avoid;
}

/* Responsive columns */
@media (max-width: 1200px) {
    .gallery-masonry {
        column-count: 4;
    }
}

@media (max-width: 768px) {
    .gallery-masonry {
        column-count: 2;
        column-gap: 12px;
    }
}

@media (max-width: 480px) {
    .gallery-masonry {
        column-count: 1;
        column-gap: 8px;
    }
}

/* Masonry items */
.masonry-item {
    display: inline-block;
    width: 100%;
    break-inside: avoid;
    page-break-inside: avoid;
}

/* Ensure images fit perfectly without white space */
.masonry-item img {
    vertical-align: top;
    display: block;
    width: 100%;
    height: auto;
}

.masonry-item .relative {
    line-height: 0;
}

/* Hover effects */
.masonry-item a {
    display: block;
    position: relative;
}

.masonry-item a:hover img {
    transform: scale(1.05);
}

/* Transition for smooth hover */
.masonry-item img {
    transition: transform 0.3s ease;
}