diff --git a/src-ui/src/app/components/app-frame/app-frame.component.html b/src-ui/src/app/components/app-frame/app-frame.component.html
index 32dfaf79c..a24bad504 100644
--- a/src-ui/src/app/components/app-frame/app-frame.component.html
+++ b/src-ui/src/app/components/app-frame/app-frame.component.html
@@ -51,20 +51,20 @@
           <p class="small mb-0 px-3 text-muted" i18n>Logged in as {{this.settingsService.displayName}}</p>
           <div class="dropdown-divider"></div>
         </div>
-        <button ngbDropdownItem class="nav-link d-flex align-items-center" (click)="editProfile()">
-          <i-bs class="d-flex me-2" name="person"></i-bs>&nbsp;<ng-container i18n>My Profile</ng-container>
+        <button ngbDropdownItem class="nav-link" (click)="editProfile()">
+          <i-bs class="me-2" name="person"></i-bs>&nbsp;<ng-container i18n>My Profile</ng-container>
         </button>
-        <a ngbDropdownItem class="nav-link d-flex align-items-center" routerLink="settings" (click)="closeMenu()"
+        <a ngbDropdownItem class="nav-link" routerLink="settings" (click)="closeMenu()"
           *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.UISettings }">
-          <i-bs class="d-flex me-2" name="gear"></i-bs><ng-container i18n>Settings</ng-container>
+          <i-bs class="me-2" name="gear"></i-bs><ng-container i18n>Settings</ng-container>
         </a>
         <a ngbDropdownItem class="nav-link d-flex" href="accounts/logout/" (click)="onLogout()">
-          <i-bs class="d-flex me-2" height="19" name="door-open"></i-bs><ng-container i18n>Logout</ng-container>
+          <i-bs class="me-2" name="door-open"></i-bs><ng-container i18n>Logout</ng-container>
         </a>
         <div class="dropdown-divider"></div>
-        <a ngbDropdownItem class="nav-link d-flex align-items-center" target="_blank" rel="noopener noreferrer"
+        <a ngbDropdownItem class="nav-link" target="_blank" rel="noopener noreferrer"
           href="https://docs.paperless-ngx.com">
-          <i-bs class="d-flex me-2" name="question-circle"></i-bs><ng-container i18n>Documentation</ng-container>
+          <i-bs class="me-2" name="question-circle"></i-bs><ng-container i18n>Documentation</ng-container>
         </a>
       </div>
     </li>
@@ -86,17 +86,17 @@
       <div class="sidebar-sticky pt-3 d-flex flex-column justify-space-around">
         <ul class="nav flex-column">
           <li class="nav-item">
-            <a class="nav-link d-flex align-items-center" routerLink="dashboard" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="dashboard" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Dashboard" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="house"></i-bs><span>&nbsp;<ng-container i18n>Dashboard</ng-container></span>
+              <i-bs class="me-1" name="house"></i-bs><span>&nbsp;<ng-container i18n>Dashboard</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Document }">
-            <a class="nav-link d-flex align-items-center" routerLink="documents" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="documents" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Documents" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="files"></i-bs><span>&nbsp;<ng-container i18n>Documents</ng-container></span>
+              <i-bs class="me-1" name="files"></i-bs><span>&nbsp;<ng-container i18n>Documents</ng-container></span>
             </a>
           </li>
         </ul>
@@ -114,11 +114,11 @@
               <li class="nav-item w-100" cdkDrag [cdkDragDisabled]="!settingsService.organizingSidebarSavedViews"
                 cdkDragPreviewContainer="parent" cdkDragPreviewClass="navItemDrag" (cdkDragStarted)="onDragStart($event)"
                 (cdkDragEnded)="onDragEnd($event)">
-                <a class="nav-link d-flex align-items-center" [class.text-truncate]="!slimSidebarEnabled" routerLink="view/{{view.id}}"
+                <a class="nav-link" [class.text-truncate]="!slimSidebarEnabled" routerLink="view/{{view.id}}"
                   routerLinkActive="active" (click)="closeMenu()" [ngbPopover]="view.name"
                   [disablePopover]="!slimSidebarEnabled" placement="end" container="body" triggers="mouseenter:mouseleave"
                   popoverClass="popover-slim">
-                  <i-bs class="d-flex me-1" name="funnel"></i-bs><span>&nbsp;{{view.name}}</span>
+                  <i-bs class="me-1" name="funnel"></i-bs><span>&nbsp;{{view.name}}</span>
                 </a>
                 @if (settingsService.organizingSidebarSavedViews) {
                   <div class="position-absolute end-0 top-0 px-3 py-2" [class.me-n3]="slimSidebarEnabled" cdkDragHandle>
@@ -139,11 +139,11 @@
           <ul class="nav flex-column mb-2">
             @for (d of openDocuments; track d) {
               <li class="nav-item w-100">
-                <a class="nav-link d-flex align-items-center" [class.text-truncate]="!slimSidebarEnabled" routerLink="documents/{{d.id}}"
+                <a class="nav-link" [class.text-truncate]="!slimSidebarEnabled" routerLink="documents/{{d.id}}"
                   routerLinkActive="active" (click)="closeMenu()" [ngbPopover]="d.title | documentTitle"
                   [disablePopover]="!slimSidebarEnabled" placement="end" container="body" triggers="mouseenter:mouseleave"
                   popoverClass="popover-slim">
-                  <i-bs class="d-flex me-1" name="file-text"></i-bs><span>&nbsp;{{d.title | documentTitle}}</span>
+                  <i-bs class="me-1" name="file-text"></i-bs><span>&nbsp;{{d.title | documentTitle}}</span>
                   <span class="close" (click)="closeDocument(d); $event.preventDefault()">
                     <i-bs class="toolbaricon" name="x"></i-bs>
                   </span>
@@ -152,10 +152,10 @@
             }
             @if (openDocuments.length >= 1) {
               <li class="nav-item w-100">
-                <a class="nav-link d-flex align-items-center" [class.text-truncate]="!slimSidebarEnabled" [routerLink]="[]" (click)="closeAll()"
+                <a class="nav-link" [class.text-truncate]="!slimSidebarEnabled" [routerLink]="[]" (click)="closeAll()"
                   ngbPopover="Close all" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
                   container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-                  <i-bs class="d-flex me-1" name="x"></i-bs><span>&nbsp;<ng-container i18n>Close all</ng-container></span>
+                  <i-bs class="me-1" name="x"></i-bs><span>&nbsp;<ng-container i18n>Close all</ng-container></span>
                 </a>
               </li>
             }
@@ -168,57 +168,57 @@
         <ul class="nav flex-column mb-2">
           <li class="nav-item"
             *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Correspondent }">
-            <a class="nav-link d-flex align-items-center" routerLink="correspondents" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="correspondents" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Correspondents" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="person"></i-bs><span>&nbsp;<ng-container i18n>Correspondents</ng-container></span>
+              <i-bs class="me-1" name="person"></i-bs><span>&nbsp;<ng-container i18n>Correspondents</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Tag }"
             tourAnchor="tour.tags">
-            <a class="nav-link d-flex align-items-center" routerLink="tags" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Tags"
+            <a class="nav-link" routerLink="tags" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Tags"
               i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end" container="body"
               triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="tags"></i-bs><span>&nbsp;<ng-container i18n>Tags</ng-container></span>
+              <i-bs class="me-1" name="tags"></i-bs><span>&nbsp;<ng-container i18n>Tags</ng-container></span>
             </a>
           </li>
           <li class="nav-item"
             *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.DocumentType }">
-            <a class="nav-link d-flex align-items-center" routerLink="documenttypes" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="documenttypes" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Document Types" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="hash"></i-bs><span>&nbsp;<ng-container i18n>Document Types</ng-container></span>
+              <i-bs class="me-1" name="hash"></i-bs><span>&nbsp;<ng-container i18n>Document Types</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.StoragePath }">
-            <a class="nav-link d-flex align-items-center" routerLink="storagepaths" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="storagepaths" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Storage Paths" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="folder"></i-bs><span>&nbsp;<ng-container i18n>Storage Paths</ng-container></span>
+              <i-bs class="me-1" name="folder"></i-bs><span>&nbsp;<ng-container i18n>Storage Paths</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.CustomField }">
-            <a class="nav-link d-flex align-items-center" routerLink="customfields" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="customfields" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Custom Fields" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="ui-radios"></i-bs><span>&nbsp;<ng-container i18n>Custom Fields</ng-container></span>
+              <i-bs class="me-1" name="ui-radios"></i-bs><span>&nbsp;<ng-container i18n>Custom Fields</ng-container></span>
             </a>
           </li>
           <li class="nav-item"
             *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Workflow }"
             tourAnchor="tour.workflows">
-            <a class="nav-link d-flex align-items-center" routerLink="workflows" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="workflows" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Workflows" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="boxes"></i-bs><span>&nbsp;<ng-container i18n>Workflows</ng-container></span>
+              <i-bs class="me-1" name="boxes"></i-bs><span>&nbsp;<ng-container i18n>Workflows</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.MailAccount }"
             tourAnchor="tour.mail">
-            <a class="nav-link d-flex align-items-center" routerLink="mail" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Mail"
+            <a class="nav-link" routerLink="mail" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Mail"
               i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end" container="body"
               triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="envelope"></i-bs><span>&nbsp;<ng-container i18n>Mail</ng-container></span>
+              <i-bs class="me-1" name="envelope"></i-bs><span>&nbsp;<ng-container i18n>Mail</ng-container></span>
             </a>
           </li>
         </ul>
@@ -229,45 +229,45 @@
         <ul class="nav flex-column mb-2">
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.UISettings }"
             tourAnchor="tour.settings">
-            <a class="nav-link d-flex align-items-center" routerLink="settings" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="settings" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Settings" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="gear"></i-bs><span>&nbsp;<ng-container i18n>Settings</ng-container></span>
+              <i-bs class="me-1" name="gear"></i-bs><span>&nbsp;<ng-container i18n>Settings</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }">
-            <a class="nav-link d-flex align-items-center" routerLink="config" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="config" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Configuration" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="sliders2-vertical"></i-bs><span>&nbsp;<ng-container i18n>Configuration</ng-container></span>
+              <i-bs class="me-1" name="sliders2-vertical"></i-bs><span>&nbsp;<ng-container i18n>Configuration</ng-container></span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.User }">
-            <a class="nav-link d-flex align-items-center" routerLink="usersgroups" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="usersgroups" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="Users & Groups" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="people"></i-bs><span>&nbsp;<ng-container i18n>Users & Groups</ng-container></span>
+              <i-bs class="me-1" name="people"></i-bs><span>&nbsp;<ng-container i18n>Users & Groups</ng-container></span>
             </a>
           </li>
           <li class="nav-item"
             *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.PaperlessTask }"
             tourAnchor="tour.file-tasks">
-            <a class="nav-link d-flex align-items-center" routerLink="tasks" routerLinkActive="active" (click)="closeMenu()"
+            <a class="nav-link" routerLink="tasks" routerLinkActive="active" (click)="closeMenu()"
               ngbPopover="File Tasks" i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end"
               container="body" triggers="mouseenter:mouseleave" popoverClass="popover-slim">
               @if (tasksService.failedFileTasks.length > 0 && slimSidebarEnabled) {
                 <span class="badge bg-danger position-absolute top-0 end-0">{{tasksService.failedFileTasks.length}}</span>
               }
-              <i-bs class="d-flex me-1" name="list-task"></i-bs><span class="align-items-center" [class.d-md-flex]="!slimSidebarEnabled">&nbsp;<ng-container i18n>File Tasks@if (tasksService.failedFileTasks.length > 0) {
-                    <span><span class="badge bg-danger ms-2 d-md-flex">{{tasksService.failedFileTasks.length}}</span></span>
-                  }</ng-container></span>
+              <i-bs class="me-1" name="list-task"></i-bs><span>&nbsp;<ng-container i18n>File Tasks</ng-container>@if (tasksService.failedFileTasks.length > 0) {
+                    <span><span class="badge bg-danger ms-2">{{tasksService.failedFileTasks.length}}</span></span>
+              }</span>
             </a>
           </li>
           <li class="nav-item" *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }">
-            <a class="nav-link d-flex align-items-center" routerLink="logs" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Logs"
+            <a class="nav-link" routerLink="logs" routerLinkActive="active" (click)="closeMenu()" ngbPopover="Logs"
               i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end" container="body"
               triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="text-left"></i-bs><span>&nbsp;<ng-container i18n>Logs</ng-container></span>
+              <i-bs class="me-1" name="text-left"></i-bs><span>&nbsp;<ng-container i18n>Logs</ng-container></span>
             </a>
           </li>
           <li class="nav-item mt-2" tourAnchor="tour.outro">
@@ -275,7 +275,7 @@
               target="_blank" rel="noopener noreferrer" href="https://docs.paperless-ngx.com" ngbPopover="Documentation"
               i18n-ngbPopover [disablePopover]="!slimSidebarEnabled" placement="end" container="body"
               triggers="mouseenter:mouseleave" popoverClass="popover-slim">
-              <i-bs class="d-flex me-1" name="question-circle"></i-bs><span class="ms-1">&nbsp;<ng-container i18n>Documentation</ng-container></span>
+              <i-bs class="d-flex" name="question-circle"></i-bs><span class="ms-1">&nbsp;<ng-container i18n>Documentation</ng-container></span>
             </a>
           </li>
           <li class="nav-item" [class.visually-hidden]="slimSidebarEnabled">
diff --git a/src-ui/src/app/components/app-frame/app-frame.component.scss b/src-ui/src/app/components/app-frame/app-frame.component.scss
index bf182f4b4..b9ac4f7f6 100644
--- a/src-ui/src/app/components/app-frame/app-frame.component.scss
+++ b/src-ui/src/app/components/app-frame/app-frame.component.scss
@@ -152,9 +152,9 @@ main {
     font-weight: bold;
   }
 
-  .sidebaricon {
-    margin-right: 4px;
-    color: inherit;
+  i-bs {
+    position: relative;
+    top: -1px;
   }
 }