diff --git a/web/src/authentik.css b/web/src/authentik.css
index 17630882e..1467a7e27 100644
--- a/web/src/authentik.css
+++ b/web/src/authentik.css
@@ -170,9 +170,6 @@ html > form > input {
     }
     /* tabs */
     .pf-c-tabs {
-        background-color: var(--ak-dark-background-light);
-    }
-    .pf-c-tabs.pf-m-vertical {
         background-color: transparent;
     }
     .pf-c-tabs.pf-m-box.pf-m-vertical .pf-c-tabs__list::before {
@@ -294,14 +291,11 @@ html > form > input {
         color: var(--ak-dark-foreground);
     }
     /* modal */
-    .pf-c-modal-box__header {
-        background-color: var(--ak-dark-background-light);
-    }
+    .pf-c-modal-box,
+    .pf-c-modal-box__header,
+    .pf-c-modal-box__footer,
     .pf-c-modal-box__body {
-        background-color: var(--ak-dark-background-light);
-    }
-    .pf-c-modal-box__footer {
-        background-color: var(--ak-dark-background-light);
+        background-color: var(--ak-dark-background);
     }
     /* sidebar */
     .pf-c-nav {
diff --git a/web/src/elements/forms/ConfirmationForm.ts b/web/src/elements/forms/ConfirmationForm.ts
index dd4360d89..ed5b463ba 100644
--- a/web/src/elements/forms/ConfirmationForm.ts
+++ b/web/src/elements/forms/ConfirmationForm.ts
@@ -55,14 +55,14 @@ export class ConfirmationForm extends ModalButton {
     }
 
     renderModalInner(): TemplateResult {
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">
                         <slot name="header"></slot>
                     </h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <form class="pf-c-form pf-m-horizontal">
                     <slot class="pf-c-content" name="body"></slot>
                 </form>
diff --git a/web/src/elements/forms/DeleteBulkForm.ts b/web/src/elements/forms/DeleteBulkForm.ts
index e8d6deb7d..7ec4dc782 100644
--- a/web/src/elements/forms/DeleteBulkForm.ts
+++ b/web/src/elements/forms/DeleteBulkForm.ts
@@ -177,12 +177,12 @@ export class DeleteBulkForm extends ModalButton {
     }
 
     renderModalInner(): TemplateResult {
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <form class="pf-c-form pf-m-horizontal">
                     <p class="pf-c-title">
                         ${t`Are you sure you want to delete ${this.objects.length} ${this.objectLabel}?`}
@@ -190,7 +190,7 @@ export class DeleteBulkForm extends ModalButton {
                     <slot name="notice"></slot>
                 </form>
             </section>
-            <section class="pf-c-page__main-section">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <ak-delete-objects-table
                     .objects=${this.objects}
                     .usedBy=${this.usedBy}
diff --git a/web/src/elements/forms/DeleteForm.ts b/web/src/elements/forms/DeleteForm.ts
index adfeda08f..481629b41 100644
--- a/web/src/elements/forms/DeleteForm.ts
+++ b/web/src/elements/forms/DeleteForm.ts
@@ -71,12 +71,12 @@ export class DeleteForm extends ModalButton {
         } else {
             objName = "";
         }
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <form class="pf-c-form pf-m-horizontal">
                     <p>${t`Are you sure you want to delete ${this.objectLabel} ${objName} ?`}</p>
                 </form>
@@ -88,7 +88,7 @@ export class DeleteForm extends ModalButton {
                               return html``;
                           }
                           return html`
-                              <section class="pf-c-page__main-section">
+                              <section class="pf-c-modal-box__body pf-c-page__main-section">
                                   <form class="pf-c-form pf-m-horizontal">
                                       <p>${t`The following objects use ${objName} `}</p>
                                       <ul class="pf-c-list">
diff --git a/web/src/elements/forms/ModalForm.ts b/web/src/elements/forms/ModalForm.ts
index 7f3fd244e..adef5706a 100644
--- a/web/src/elements/forms/ModalForm.ts
+++ b/web/src/elements/forms/ModalForm.ts
@@ -58,14 +58,14 @@ export class ModalForm extends ModalButton {
         return html`${this.loading
                 ? html`<ak-loading-overlay ?topMost=${true}></ak-loading-overlay>`
                 : html``}
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">
                         <slot name="header"></slot>
                     </h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <slot name="form"></slot>
             </section>
             <footer class="pf-c-modal-box__footer">
diff --git a/web/src/locales/en.po b/web/src/locales/en.po
index 06b5de472..2b73d94e2 100644
--- a/web/src/locales/en.po
+++ b/web/src/locales/en.po
@@ -5959,7 +5959,6 @@ msgstr "X509 Subject"
 
 #: src/elements/oauth/UserRefreshList.ts
 #: src/pages/applications/ApplicationCheckAccessForm.ts
-#: src/pages/crypto/CertificateKeyPairListPage.ts
 #: src/pages/groups/GroupListPage.ts
 #: src/pages/groups/MemberSelectModal.ts
 #: src/pages/outposts/ServiceConnectionListPage.ts
@@ -5974,6 +5973,10 @@ msgstr "X509 Subject"
 msgid "Yes"
 msgstr "Yes"
 
+#: src/pages/crypto/CertificateKeyPairListPage.ts
+msgid "Yes ({0})"
+msgstr "Yes ({0})"
+
 #: src/pages/outposts/OutpostForm.ts
 msgid "You can only select providers that match the type of the outpost."
 msgstr "You can only select providers that match the type of the outpost."
diff --git a/web/src/locales/fr_FR.po b/web/src/locales/fr_FR.po
index 038038ddf..fd762306b 100644
--- a/web/src/locales/fr_FR.po
+++ b/web/src/locales/fr_FR.po
@@ -5896,7 +5896,6 @@ msgstr "Sujet X509"
 
 #: src/elements/oauth/UserRefreshList.ts
 #: src/pages/applications/ApplicationCheckAccessForm.ts
-#: src/pages/crypto/CertificateKeyPairListPage.ts
 #: src/pages/groups/GroupListPage.ts
 #: src/pages/groups/MemberSelectModal.ts
 #: src/pages/outposts/ServiceConnectionListPage.ts
@@ -5911,6 +5910,10 @@ msgstr "Sujet X509"
 msgid "Yes"
 msgstr "Oui"
 
+#: src/pages/crypto/CertificateKeyPairListPage.ts
+msgid "Yes ({0})"
+msgstr ""
+
 #: src/pages/outposts/OutpostForm.ts
 msgid "You can only select providers that match the type of the outpost."
 msgstr "Vous pouvez uniquement sélectionner des fournisseurs qui correspondent au type d'avant-poste."
diff --git a/web/src/locales/pseudo-LOCALE.po b/web/src/locales/pseudo-LOCALE.po
index e9403bf46..068fc5bb3 100644
--- a/web/src/locales/pseudo-LOCALE.po
+++ b/web/src/locales/pseudo-LOCALE.po
@@ -5937,7 +5937,6 @@ msgstr ""
 
 #: src/elements/oauth/UserRefreshList.ts
 #: src/pages/applications/ApplicationCheckAccessForm.ts
-#: src/pages/crypto/CertificateKeyPairListPage.ts
 #: src/pages/groups/GroupListPage.ts
 #: src/pages/groups/MemberSelectModal.ts
 #: src/pages/outposts/ServiceConnectionListPage.ts
@@ -5952,6 +5951,10 @@ msgstr ""
 msgid "Yes"
 msgstr ""
 
+#: src/pages/crypto/CertificateKeyPairListPage.ts
+msgid "Yes ({0})"
+msgstr ""
+
 #: src/pages/outposts/OutpostForm.ts
 msgid "You can only select providers that match the type of the outpost."
 msgstr ""
diff --git a/web/src/pages/groups/MemberSelectModal.ts b/web/src/pages/groups/MemberSelectModal.ts
index b0153bea1..f19c30a61 100644
--- a/web/src/pages/groups/MemberSelectModal.ts
+++ b/web/src/pages/groups/MemberSelectModal.ts
@@ -63,12 +63,14 @@ export class MemberSelectTable extends TableModal<User> {
     }
 
     renderModalInner(): TemplateResult {
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">${t`Select users to add`}</h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">${this.renderTable()}</section>
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
+                ${this.renderTable()}
+            </section>
             <footer class="pf-c-modal-box__footer">
                 <ak-spinner-button
                     .callAction=${() => {
diff --git a/web/src/pages/users/GroupSelectModal.ts b/web/src/pages/users/GroupSelectModal.ts
index 64c53ad36..6e63a81ec 100644
--- a/web/src/pages/users/GroupSelectModal.ts
+++ b/web/src/pages/users/GroupSelectModal.ts
@@ -61,12 +61,14 @@ export class GroupSelectModal extends TableModal<Group> {
     }
 
     renderModalInner(): TemplateResult {
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">${t`Select groups to add user to`}</h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">${this.renderTable()}</section>
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
+                ${this.renderTable()}
+            </section>
             <footer class="pf-c-modal-box__footer">
                 <ak-spinner-button
                     .callAction=${() => {
diff --git a/web/src/pages/users/UserActiveForm.ts b/web/src/pages/users/UserActiveForm.ts
index 1134022c0..29b3eb998 100644
--- a/web/src/pages/users/UserActiveForm.ts
+++ b/web/src/pages/users/UserActiveForm.ts
@@ -25,12 +25,12 @@ export class UserActiveForm extends DeleteForm {
     }
 
     renderModalInner(): TemplateResult {
-        return html`<section class="pf-c-page__main-section pf-m-light">
+        return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
                 <div class="pf-c-content">
                     <h1 class="pf-c-title pf-m-2xl">${t`Update ${this.objectLabel}`}</h1>
                 </div>
             </section>
-            <section class="pf-c-page__main-section pf-m-light">
+            <section class="pf-c-modal-box__body pf-c-page__main-section">
                 <form class="pf-c-form pf-m-horizontal">
                     <p>
                         ${t`Are you sure you want to update ${this.objectLabel} "${this.obj?.name}"?`}