move css to default

_includes/header.html

@@ -1,23 +1,5 @@
 <header class="site-header">
-    <style>
-        header {
-            position: fixed;
-            top: 0;
-            width: 100%;
-            z-index: 1000; /* Ensure it stays above other content */
-            background-color: #fff; /* or any background you prefer */
-            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional: adds a shadow to make it stand out */
-            }
 
-        body {
-        padding-top: 60px; /* Adjust according to your header's height */
-        }
-
-        body.dark-mode header {
-        background-color: #333;
-        color: white;
-        }
-    </style>
 
     <div class="wrapper">
       {%- assign default_paths = site.pages | map: "path" -%}

_layouts/default.html

@@ -26,10 +26,22 @@
 </script>
 
 <style>
+
+  header {
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 1000; /* Ensure it stays above other content */
+    background-color: #fff; /* or any background you prefer */
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional: adds a shadow to make it stand out */
+  }
+
   body {
     display: flex;
     margin: 0;
+    padding-top: 60px; /* Adjust according to your header's height */
   }
+
   .toc {
     width: 20%;
     padding: 20px;
@@ -153,6 +165,11 @@
     color: white;
   }
 
+  body.dark-mode header {
+    background-color: #333;
+    color: white;
+  }
+
     .theme-toggle-button {
         position: fixed;
         right: 20px;