diff --git a/assets/sass/_theme/_configuration.sass b/assets/sass/_theme/_configuration.sass
index b0abc58c1a568c5e10a90261b31909fc3be10276..4cee973588942fef4a8cdf79bf0060813608deba 100644
--- a/assets/sass/_theme/_configuration.sass
+++ b/assets/sass/_theme/_configuration.sass
@@ -149,6 +149,7 @@ $zindex-header: 52 !default
 $zindex-body-overlay: 51 !default
 $zindex-toc: 60 !default
 $zindex-toc-cta: 49 !default
+$zindex-modal: 72 !default
 $zindex-aside: 48 !default
 $zindex-footer: 70 !default
 
diff --git a/assets/sass/_theme/design-system/header.sass b/assets/sass/_theme/design-system/header.sass
index b9d6f48c93e8d0e5c7d390890c39a01e897338f3..18d59951a754b18f8247a033a3168446be60c562 100644
--- a/assets/sass/_theme/design-system/header.sass
+++ b/assets/sass/_theme/design-system/header.sass
@@ -69,10 +69,12 @@ body
             display: block
             opacity: 1
             pointer-events: inherit
-    html.has-offcanvas-opened &,
-    html.has-modal-opened &
+    html.has-offcanvas-opened &
         &::after
             z-index: $zindex-header + 1
+    html.has-modal-opened &
+        &::after
+            z-index: $zindex-modal - 1
     html.is-animating:not(.has-menu-opened) &
         &::after
             display: block
diff --git a/assets/sass/_theme/design-system/layout.sass b/assets/sass/_theme/design-system/layout.sass
index f583af1971bb2c993bfaa6bcb9bb1257565a1281..c836ae9f8fbc0e1173769fde3ab95d234648b6f2 100644
--- a/assets/sass/_theme/design-system/layout.sass
+++ b/assets/sass/_theme/design-system/layout.sass
@@ -107,7 +107,7 @@ details
     top: 0
     width: 100%
     margin: 0
-    z-index: $zindex-toc
+    z-index: $zindex-modal
     &[aria-hidden="true"]
         display: none
     .modal-content