:root,
[data-bs-theme="light"] {
    // Note: Custom variable values only support SassScript inside `#{}`.

    // Colors
    //
    // Generate palettes for full colors, grays, and theme colors.
    --moove-secondary-navigation-bg-color: #{$brand-primary};
    --moove-navbar-bg-color: #{$white};
    --moove-bg-white: #{$white};
    --moove-link-color: #{$brand-primary};
    --moove-gray-bg: #f8f9fa;
}

@if $enable-dark-mode {
    @include color-mode(dark, true) {
        --moove-secondary-navigation-bg-color: #{$gray-800};
        --moove-navbar-bg-color: #{$body-bg-dark};
        --moove-bg-white: #{$gray-800};
        --moove-link-color: #{$gray-300};
        --moove-gray-bg: #{$gray-900};
    }
}
