/*
 * Gallery — Masonry Layout
 * Loaded separately so it doesn't require a LESS compile step.
 */

.gallery-wrapper.layout-type-masonry {
    text-align: left;
    columns: 3;
    column-gap: 16px;
}

.gallery-wrapper.layout-type-masonry .gallery-image-wrapper {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 0;
    vertical-align: unset;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    margin-bottom: 16px;
}

.gallery-wrapper.layout-type-masonry .gallery-image-wrapper:last-child {
    margin-bottom: 0;
}

.gallery-wrapper.layout-type-masonry .gallery-image {
    display: block;
    width: 100%;
    height: auto;
}

/* Gap variants */
.gallery-wrapper.layout-type-masonry[data-masonry-gap="small"] {
    column-gap: 8px;
}
.gallery-wrapper.layout-type-masonry[data-masonry-gap="small"] .gallery-image-wrapper {
    margin-bottom: 8px;
}

.gallery-wrapper.layout-type-masonry[data-masonry-gap="medium"] {
    column-gap: 16px;
}
.gallery-wrapper.layout-type-masonry[data-masonry-gap="medium"] .gallery-image-wrapper {
    margin-bottom: 16px;
}

.gallery-wrapper.layout-type-masonry[data-masonry-gap="large"] {
    column-gap: 24px;
}
.gallery-wrapper.layout-type-masonry[data-masonry-gap="large"] .gallery-image-wrapper {
    margin-bottom: 24px;
}

/* Column count variants */
.gallery-wrapper.layout-type-masonry[data-masonry-columns="2"] { columns: 2; }
.gallery-wrapper.layout-type-masonry[data-masonry-columns="3"] { columns: 3; }
.gallery-wrapper.layout-type-masonry[data-masonry-columns="4"] { columns: 4; }

/* Responsive */
@media (max-width: 768px) {
    .gallery-wrapper.layout-type-masonry { columns: 2; }
    .gallery-wrapper.layout-type-masonry[data-masonry-columns="2"] { columns: 1; }
}

@media (max-width: 480px) {
    .gallery-wrapper.layout-type-masonry { columns: 1 !important; }
}
