added safe search

static/css/style.css

@@ -1336,6 +1336,69 @@ p {
     letter-spacing: normal;
 }
 
+/* Variables for light theme */
+:root {
+    --background-color: #ffffff;
+    --text-color: #000000;
+    --highlight: #007bff;
+    --border-color: #dddddd;
+    --search-bg: #f1f3f4;
+    --search-bg-input: #ffffff;
+    --search-bg-input-border: #dfe1e5;
+    --button: #f8f9fa;
+    --link: #1a0dab;
+    --fg: #202124;
+    --html-bg: #ffffff;
+    --snip-border: #dfe1e5;
+    --snip-background: #ffffff;
+    --image-view: #ffffff;
+    --image-view-titlebar: #f1f3f4;
+    --search-button: #5f6368;
+    --image-select: #e8f0fe;
+    --view-image-color: #f8f9fa;
+    --footer-bg: #f2f2f2;
+    --footer-font: #70757a;
+    --border: #e0e0e0;
+    --link-visited: #660099;
+    --publish-info: #70757a;
+    --green: #3c802c;
+}
+
+/* Styles for dark theme */
+@media (prefers-color-scheme: dark) {
+    :root {
+        --background-color: #202124;
+        --text-color: #e8eaed;
+        --highlight: #8ab4f8;
+        --border-color: #5f6368;
+        --search-bg: #303134;
+        --search-bg-input: #202124;
+        --search-bg-input-border: #5f6368;
+        --button: #3c4043;
+        --link: #8ab4f8;
+        --fg: #e8eaed;
+        --html-bg: #202124;
+        --snip-border: #5f6368;
+        --snip-background: #303134;
+        --image-view: #202124;
+        --image-view-titlebar: #303134;
+        --search-button: #e8eaed;
+        --image-select: #5f6368;
+        --view-image-color: #202124;
+        --footer-bg: #303134;
+        --footer-font: #e8eaed;
+        --border: #5f6368;
+        --link-visited: #c79ff;
+        --publish-info: #e8eaed;
+        --green: #8ab4f8;
+    }
+}
+
+body, h1, p, a, input, button {
+    color: var(--text-color); /* Applies the text color based on theme */
+    background-color: var(--background-color); /* Applies the background color based on theme */
+}
+
 @media only screen and (max-width: 1320px) {
 
     .snip {