.doc-type-icon {
    display: inline-flex;
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
}

@each $name in (
    'service-protokoll',
    'abnahme-dokumente',
    'sla-reports',
    'monitoring-reports',
    'security-assessments',
    'abrechnungsdaten',
    'vertragsunterlagen',
    'default',
    'ms-sharepoint',
    'ms-onedrive',
    'ms-teams',
) {
    .doc-type-icon-#{$name} {
        background-color: currentColor;
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: contain;
        mask-image: url('/img/document-types/icons/#{$name}.svg');