@use '../../scss/config.scss' as *;

.avatar {
    --border: var(--w-avatar-border, var(--w-color-primary-70));

    @include border-radius(max);

    object-fit: cover;

    &:not(.borderless) {
        border: 3px solid var(--border);
    }
}

.group {
    @include layout(inline-flex, v-center);

    &.reverse {
        @include layout(row-reverse);

        img {
            @include layer(fg);
        }

        img:not(:first-child) {
            margin-right: -10px;
            margin-left: 0;
        }
    }

    img:not(:first-child) {
        margin-left: -10px;
    }

    img {
        z-index: var(--w-avatar-index);
    }
}