/* Default Theme — menu.css
   Overrides nav/footer using CSS variables from ThemeEngine.
   The main nav styles are already in theme.css (copied from saastifly-website.html).
   This file layers on the CMS-controlled variables so the admin Theme Editor
   can customise colours without touching theme.css.
*/

nav {
    background: var(--sidebar-bg, rgba(13,31,60,0.97));
    font-family: var(--menu-font, 'DM Sans', sans-serif);
    font-size:   var(--menu-font-size, 14px);
}

.nl a {
    border-radius: var(--menu-border-radius, 8px);
    color:         var(--sidebar-text, rgba(255,255,255,0.75));
}

.nl a:hover,
.nl a.on {
    background: var(--sidebar-hover-bg, rgba(255,255,255,0.1));
    color:      white;
}

.logo .lm {
    background: linear-gradient(135deg, var(--accent-color, #1A6BFF), #0ABFBC);
}

.bp {
    background: linear-gradient(135deg, var(--accent-color, #1A6BFF), #3D8BFF);
    box-shadow: 0 4px 16px rgba(26,107,255,.35);
}

/* Active nav item from CMS */
.nl a.active {
    background: var(--active-item-bg, rgba(255,255,255,0.1));
    color:      var(--active-item-text, #fff);
}

/* Footer brand colour */
footer { background: var(--sidebar-bg, #0F172A); }
