@use 'iro-sass/src/index' as iro;
@use 'functions' as fn;

$dirs: (
    '': '',
    't': '-top',
    'r': '-right',
    'b': '-bottom',
    'l': '-left',
);

@include iro.bem-utility('d-block') {
    display: block;
}

@include iro.bem-utility('d-contents') {
    display: contents;
}

@include iro.bem-utility('o-auto') {
    overflow: auto;
}

@include iro.bem-utility('elp') {
    overflow:      hidden;
    text-overflow: ellipsis;
}

@include iro.bem-utility('p-static') {
    position: static;
}

@include iro.bem-utility('p-relative') {
    position: relative;
}

@each $dir, $suffix in $dirs {
    @include iro.bem-utility('m#{$dir}-auto') {
        margin#{$suffix}: auto;
    }

    @each $size in (0 50 100) {
        @include iro.bem-utility('m#{$dir}-#{$size}') {
            margin#{$suffix}: fn.global-dim(--size --#{$size});
        }
    }
}

@each $dir, $suffix in $dirs {
    @include iro.bem-utility('p#{$dir}-auto') {
        padding#{$suffix}: auto;
    }

    @each $size in (0 50 100) {
        @include iro.bem-utility('p#{$dir}-#{$size}') {
            padding#{$suffix}: fn.global-dim(--size --#{$size});
        }
    }
}