Fix and improve colour on navbar and tool menus - closes #12

Author: EllaKaye

forwards-dark.scss

@@ -81,4 +81,12 @@ div.callout.callout-style-default.callout-caution.callout-titled > div.callout-h
 .mt-container[data-theme=dark] {
     --mt-color-bg: #{$verydarkpurple} !important; 
     --mt-color-bg-hover:#{$darkpurple} !important; 
+}
+
+.navbar-nav .dropdown-menu .dropdown-item:hover {
+    background-color: $darkpurple;
+}
+
+.dropdown-item.quarto-navbar-tools-item:hover {
+    background-color: $darkpurple;
 }

forwards-light.scss

@@ -135,4 +135,52 @@ iframe.slide-deck {
 
 .mt-container[data-theme=light] {
     --mt-color-bg-hover:#{$darkpurple10} !important; 
+}
+
+.navbar-nav .dropdown-menu .dropdown-item:hover {
+    background-color: $darkpurple10;
+}
+
+.dropdown-item.quarto-navbar-tools-item:hover {
+    background-color: $darkpurple10;
+}
+
+/* Keep dropdown toggle orange when dropdown is open and items are being hovered */
+.navbar-nav .dropdown.show .dropdown-toggle,
+.navbar-nav .dropdown:hover .dropdown-toggle {
+    color: $orange !important;
+}
+
+/* Tools dropdown toggle hover - make it orange */
+.quarto-navbar-tools .dropdown-toggle:hover,
+.quarto-navbar-tools a.dropdown-toggle:hover {
+    color: $orange !important;
+}
+
+/* Keep tools dropdown toggle orange when dropdown is open and you're hovering items */
+.quarto-navbar-tools.show .dropdown-toggle,
+.quarto-navbar-tools:hover .dropdown-toggle,
+.quarto-navbar-tools .dropdown.show .dropdown-toggle {
+    color: $orange !important;
+}
+
+/* Force regular navbar dropdown toggle to stay orange when open */
+.navbar-nav .nav-item.dropdown.show > .nav-link.dropdown-toggle,
+.navbar-nav .nav-item.dropdown.show > .dropdown-toggle,
+.navbar-nav .dropdown.show > .dropdown-toggle {
+    color: $orange !important;
+}
+
+/* Force tools dropdown toggle to stay orange when open */
+.quarto-navbar-tools.show > .dropdown-toggle,
+.quarto-navbar-tools.show > a.dropdown-toggle,
+div[class*="quarto-navbar-tools"].show > a,
+div[class*="quarto-navbar-tools"][aria-expanded="true"] > a {
+    color: $orange !important;
+}
+
+/* Catch any focus states that might be interfering */
+.dropdown-toggle:focus,
+.dropdown-toggle.show:focus {
+    color: $orange !important;
 }