// =============================================================================
// 31-modules / image / mixins
// =============================================================================

@use "sass:map";
@use "./image.config" as config;

@mixin ss-image {
    display: block;
    max-width: 100%;
    height: auto;
}

@mixin ss-image-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@mixin ss-image-contain {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@mixin ss-image-rounded {
    border-radius: map.get(config.$image-config, "radius-rounded");
}

@mixin ss-image-circle {
    border-radius: map.get(config.$image-config, "radius-circle");
}

@mixin ss-image-bordered {
    border: map.get(config.$image-config, "border-width") solid
        map.get(config.$image-config, "border-color");
}