use 'dark' class locally in header, hero or custom sections. adapt dark styles.

themes/hugoplate/layouts/partials/essentials/footer.html

@@ -1,3 +1,4 @@
+<div class="dark">
 <footer class="bg-theme-light dark:bg-darkmode-theme-light">
   <div class="container">
     <div class="row items-center py-10">
@@ -55,3 +56,4 @@
     </div>
   </div>
 </footer>
+</div>

themes/hugoplate/layouts/partials/essentials/header.html

@@ -1,5 +1,5 @@
 <header
-  class="header {{ if site.Params.navbar_fixed }}sticky top-0{{ end }} z-30">
+  class="header dark {{ if site.Params.navbar_fixed }}sticky top-0{{ end }} z-30">
   <nav class="navbar container">
     <!-- logo -->
     <div class="order-0">
@@ -126,7 +126,7 @@
       {{ if site.Params.navigation_button.enable }}
         <a
           href="{{ site.Params.navigation_button.link | relLangURL }}"
-          class="btn btn-outline-primary btn-sm hidden lg:inline-block">
+          class="btn btn-primary btn-sm hidden lg:inline-block">
           {{ site.Params.navigation_button.label }}
         </a>
       {{ end }}