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 d616209cb..95cb888e7 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
@@ -170,8 +170,7 @@
     }
 
     &:focus {
-      background-color: #fff;
-      color: #212529;
+      background-color: rgba(0, 0, 0, 0.3);
       flex-grow: 1;
       padding-left: 0.5rem;
     }
diff --git a/src-ui/src/app/components/manage/correspondent-list/correspondent-edit-dialog/correspondent-edit-dialog.component.html b/src-ui/src/app/components/manage/correspondent-list/correspondent-edit-dialog/correspondent-edit-dialog.component.html
index edc64964c..a11b6363e 100644
--- a/src-ui/src/app/components/manage/correspondent-list/correspondent-edit-dialog/correspondent-edit-dialog.component.html
+++ b/src-ui/src/app/components/manage/correspondent-list/correspondent-edit-dialog/correspondent-edit-dialog.component.html
@@ -11,7 +11,7 @@
     <app-input-check *ngIf="patternRequired" i18n-title title="Case insensitive" formControlName="is_insensitive" novalidate></app-input-check>
   </div>
   <div class="modal-footer">
-    <button type="button" class="btn btn-outline-dark" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
+    <button type="button" class="btn btn-outline-secondary" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
     <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive">Save</button>
   </div>
 </form>
diff --git a/src-ui/src/app/components/manage/document-type-list/document-type-edit-dialog/document-type-edit-dialog.component.html b/src-ui/src/app/components/manage/document-type-list/document-type-edit-dialog/document-type-edit-dialog.component.html
index 068f88552..03d17c35a 100644
--- a/src-ui/src/app/components/manage/document-type-list/document-type-edit-dialog/document-type-edit-dialog.component.html
+++ b/src-ui/src/app/components/manage/document-type-list/document-type-edit-dialog/document-type-edit-dialog.component.html
@@ -13,7 +13,7 @@
 
     </div>
     <div class="modal-footer">
-      <button type="button" class="btn btn-outline-dark" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
+      <button type="button" class="btn btn-outline-secondary" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
       <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive">Save</button>
     </div>
   </form>
diff --git a/src-ui/src/app/components/manage/tag-list/tag-edit-dialog/tag-edit-dialog.component.html b/src-ui/src/app/components/manage/tag-list/tag-edit-dialog/tag-edit-dialog.component.html
index fa9972eee..6ea3901a7 100644
--- a/src-ui/src/app/components/manage/tag-list/tag-edit-dialog/tag-edit-dialog.component.html
+++ b/src-ui/src/app/components/manage/tag-list/tag-edit-dialog/tag-edit-dialog.component.html
@@ -15,7 +15,7 @@
       <app-input-check *ngIf="patternRequired" i18n-title title="Case insensitive" formControlName="is_insensitive"></app-input-check>
     </div>
     <div class="modal-footer">
-      <button type="button" class="btn btn-outline-dark" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
+      <button type="button" class="btn btn-outline-secondary" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
       <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive">Save</button>
     </div>
   </form>
diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss
index ad81bd903..8ec52989c 100644
--- a/src-ui/src/theme.scss
+++ b/src-ui/src/theme.scss
@@ -1,10 +1,9 @@
 :root {
   // base color e.g. #17541f = hsl(128, 57%, 21%)
   --ngx-green: 128, 57%;
-  --l:21%;
+  --l: 21%;
 
-  --bs-primary: hsl(var(--ngx-green),var(--l));
-  --bs-primary-rgb: rgba(hsl(var(--ngx-green), var(--l)));
+  --bs-primary: hsl(var(--ngx-green), var(--l));
   --ngx-primary-faded: #d1ddd2;
   --ngx-primary-lighten-10: hsl(var(--ngx-green), calc(var(--l) + 10%));
   --ngx-primary-lighten-30: hsl(var(--ngx-green), calc(var(--l) + 30%));
@@ -59,6 +58,13 @@ svg.logo {
   }
 }
 
+.btn:focus,
+.dropdown-item:focus,
+.btn-check:focus + .btn,
+.form-control:focus {
+  box-shadow: 0 0 0 0.25rem hsla(var(--ngx-green), var(--l), 0.7);
+}
+
 .dropdown.show {
   > .btn-primary {
     background-color: var(--bs-primary);
@@ -154,7 +160,7 @@ textarea,
   background-color: var(--bs-body-bg);
   border-color: var(--bs-border-color);
 
-  &:hover {
+  &:hover, &:focus {
     background-color: var(--bs-body-bg);
   }
 }
@@ -173,6 +179,10 @@ textarea,
       background-color: var(--bs-body-bg);
       color: var(--bs-body-color);
     }
+
+    &.active {
+      background-color: var(--bs-primary);
+    }
   }
 }
 
@@ -194,4 +204,10 @@ table.table {
 
 .ngx-file-drop__drop-zone--over {
   background-color: var(--ngx-primary-darken-25)
+}
+
+.ngb-dp-header,
+.ngb-dp-weekdays,
+.ngb-dp-month {
+  background-color: var(--bs-body-bg);
 }
\ No newline at end of file
diff --git a/src-ui/src/theme_dark.scss b/src-ui/src/theme_dark.scss
index 636a7ae5d..827627e58 100644
--- a/src-ui/src/theme_dark.scss
+++ b/src-ui/src/theme_dark.scss
@@ -36,7 +36,7 @@ $border-color-dark-mode: #47494f;
   .navbar-brand {
     color: var(--bs-body-color);
   }
-
+  
   .border {
     border-color: var(--bs-border-color) !important;
   }
@@ -53,7 +53,7 @@ $border-color-dark-mode: #47494f;
     border-bottom: 1px solid var(--bs-border-color) !important;
   }
 
-  .text-dark {
+  .text-dark, .text-light {
     color: var(--bs-body-color) !important;
   }