/* Fix for wp-block-column flex-basis issue */
.wp-block-column {
    max-width: 100%;
}

.wp-block-column[style*='flex-basis:66'] {
    max-width: 66.6%;
}

.wp-block-column[style*='flex-basis:33'] {
    max-width: 33.3%;
}

.wp-block-column[style*='flex-basis:50'] {
    max-width: 50%;
}

.wp-block-column[style*='flex-basis:25'] {
    max-width: 25%;
}

.wp-block-column[style*='flex-basis:75'] {
    max-width: 75%;
}
.image-gallery-slider {
    margin: 48px 0;

    @media(max-width: 768px) {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
        left: var(--swiper-navigation-sides-offset, 0);
    }
    .swiper-button-next,
    .swiper-rtl .swiper-button-prev {
        right: var(--swiper-navigation-sides-offset, 0);
        left: auto;
    }
}

.image-gallery-slider__main {
    @media(max-width: 768px) {
        padding-bottom: 80px;
    }
    img {
        width: 100%;
        height: auto;
        border-radius: 4px;
    }
}

.image-gallery-slider__pagination {
    @media (max-width: 768px) {
        display: none;
    }
    margin-top: 20px;
    img {
        border-radius: 4px;
        height: 80px;
        width: 100%;
        object-fit: cover;
    }
    .swiper-slide-thumb-active img {
        border: 4px solid var(--text-icon-action, #0080ea);
    }
}

/* Custom Navigation Arrows with your icon */
.swiper-button-next,
.swiper-button-prev {
    width: 44px;
    height: 44px;
    margin-top: -22px;
    background: #ebeef5;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    color: #4e4b66;
    transition: all 0.3s ease;
    @media (max-width: 768px) {
        top: var(--swiper-navigation-top-offset, calc(100% - 40px));
    }
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background: #ffffff;
    color: #0080ea;
    transform: scale(1.05);
}

.swiper-button-next::after,
.swiper-button-prev::after {
    content: '';
    width: 20px;
    height: 20px;
    background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.70169 5.36831C8.21272 5.85729 8.21272 6.64716 8.70169 7.13614L13.5663 12.0008L8.70169 16.8654C8.21272 17.3544 8.21272 18.1443 8.70169 18.6333C9.19066 19.1222 9.98054 19.1222 10.4695 18.6333L16.2244 12.8784C16.7133 12.3895 16.7133 11.5996 16.2244 11.1106L10.4695 5.35577C9.99308 4.87934 9.19066 4.87934 8.70169 5.36831Z' fill='currentColor'/%3E%3C/svg%3E")
        center/contain no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.70169 5.36831C8.21272 5.85729 8.21272 6.64716 8.70169 7.13614L13.5663 12.0008L8.70169 16.8654C8.21272 17.3544 8.21272 18.1443 8.70169 18.6333C9.19066 19.1222 9.98054 19.1222 10.4695 18.6333L16.2244 12.8784C16.7133 12.3895 16.7133 11.5996 16.2244 11.1106L10.4695 5.35577C9.99308 4.87934 9.19066 4.87934 8.70169 5.36831Z' fill='currentColor'/%3E%3C/svg%3E")
        center/contain no-repeat;
    font-size: 0;
}

.swiper-button-prev::after {
    transform: rotate(180deg);
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
