Style: Enhance overview button appearance and add hover effects for improved user experience

physics/templates/physics/exam_take.html

@@ -98,7 +98,7 @@
                 {% endif %}
 
                 <br />
-                <button type="submit" name="finish" class="save btn btn-default" title="Click to go to the overview page (your answers will be saved).">Overview</button>
+                <button type="submit" id="overview-button" name="finish" class="save btn btn-default" title="Click to go to the overview page (your answers will be saved).">Overview</button>
                 <button type="submit" id="goto-button" value="test" name="goto" class="hide">goto</button>
             </div>
         </form>
@@ -171,6 +171,7 @@
             --bg: #ffffff;
             --text: #212529;
             --muted: #6c757d;
+            --secondary: #6c757d;
             --card-bg: #ffffff;
             --card-border: #e9ecef;
             --primary: #0d6efd;
@@ -294,6 +295,17 @@
         .mt-2 .save { margin-right: 0.5rem; }
         .mt-2 .save.btn.btn-default { background: var(--feedback-bg); border: 1px solid var(--card-border); color: var(--text); }
 
+    /* Overview button - make it stand out using the primary color */
+    #overview-button { background: var(--primary); border-color: var(--primary); color: #fff; }
+    #overview-button:hover { filter: brightness(0.95); box-shadow: 0 3px 8px rgba(13,110,253,0.18); }
+
+    /* Previous / Next button colors */
+    .mt-2 button[name="previous"] { background: var(--secondary); border-color: var(--secondary); color: #fff; }
+    .mt-2 button[name="previous"]:hover { filter: brightness(0.95); box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
+
+    .mt-2 button[name="next"] { background: var(--primary); border-color: var(--primary); color: #fff; }
+    .mt-2 button[name="next"]:hover { filter: brightness(0.95); box-shadow: 0 3px 8px rgba(13,110,253,0.18); }
+
         /* Small helper: make labels wrap nicely on small screens */
         @media (max-width: 576px) {
             /* On small screens, stack the label and input for readability */