@use "bulma/sass/utilities/initial-variables" as iv;
@use "bulma/sass/utilities/css-variables" as cv;
@use "bulma/sass/utilities/extends" as extends;

$image-placeholder-blur-enabled: true !default;
$image-placeholder-blur: 10px !default;

.#{iv.$class-prefix}b-image-wrapper {
    @include cv.register-vars((
        "image-placeholder-blur-enabled": #{$image-placeholder-blur-enabled},
        "image-placeholder-blur": #{$image-placeholder-blur},
    ))
}

.#{iv.$class-prefix}b-image-wrapper {
    > img {
        object-fit: cover;

        &.has-ratio,
        &.placeholder {
            @extend %overlay;
            height: 100%;
            width: 100%;
        }
        @if $image-placeholder-blur-enabled {
            &.placeholder {
                filter: blur(cv.getVar('image-placeholder-blur'));
            }
        }
    }
}