Footer should have differnent color in dark mode

[MathyouMB]

As a user, I want the site footer to match the rest of the theme in both light and dark mode so that it looks consistent and visually polished.

---

🧠 Context

Right now, the footer styling in dark mode looks off because it doesn’t blend with the rest of the theme:

This issue stems from a temporary override added to src/css/custom.css:

.footer--dark {
  background-color: #1a1a1a !important;
}

This override works fine in light mode, but in dark mode, it no longer matches the navbar or overall page background.

---

🛠️ Implementation Plan

1. Update the footer styling in custom.css

   • Use a @media query or [data-theme='dark'] selector to conditionally style the footer

2. In Dark Mode:

   • Match the background color of the footer to the navbar or default dark background used across the site

3. In Light Mode:

   • Keep the current #1a1a1a background color

4. Test the fix

   • Toggle between light and dark mode to ensure the footer looks appropriate and seamless in both cases

---

✅ Acceptance Criteria

• In light mode, the footer background color remains #1a1a1a
• In dark mode, the footer background matches the navbar or site-wide dark color
• No !important override is required in final implementation
• Footer styling appears consistent with the rest of the theme