//
// Default Theme Mode
//

@if $theme-default ==true {

    // Background Light left-sidebar
    html[data-menu-color='light'] {
        --#{$prefix}sidenav-bg: #{$white};
        --#{$prefix}sidenav-border-color: #{$gray-300};
        --#{$prefix}sidenav-item-color: #667787;
        --#{$prefix}sidenav-item-hover-color: #{$primary};
        --#{$prefix}sidenav-item-hover-bg: transparent;
        --#{$prefix}sidenav-item-active-color: #{$primary};
        --#{$prefix}sidenav-item-active-bg: transparent;
    }

    // Dark Left Sidebar
    html[data-menu-color='dark'] {
        --#{$prefix}sidenav-bg:                     #23303c;
        --#{$prefix}sidenav-border-color:           #23303c;
        --#{$prefix}sidenav-item-color:             #8495ab;
        --#{$prefix}sidenav-item-hover-color:       #bccee4;
        --#{$prefix}sidenav-item-hover-bg:          #2f3742;
        --#{$prefix}sidenav-item-active-color:      #ced6df;
        --#{$prefix}sidenav-item-active-bg:         #1c262f;
    }

    // Background Gray left-sidebar
    html[data-menu-color='gray'] {
        --#{$prefix}sidenav-bg:                       #e9ebef;
        --#{$prefix}sidenav-border-color:             #e7e9eb;
        --#{$prefix}sidenav-item-color:               #{$gray-700};
        --#{$prefix}sidenav-item-hover-color:         #{$primary};
        --#{$prefix}sidenav-item-hover-bg:          #dbdfe7;
        --#{$prefix}sidenav-item-active-color:        #212b29;
        --#{$prefix}sidenav-item-active-bg:         #dbdfe7;
    }

    // Gradient Menu
    html[data-menu-color='gradient'] {
        --#{$prefix}sidenav-bg:                       #{linear-gradient(135deg, #1e4258, #313144)};
        --#{$prefix}sidenav-border-color:             null;
        --#{$prefix}sidenav-item-color:             #799cb7;
        --#{$prefix}sidenav-item-hover-color:       #bccee4;
        --#{$prefix}sidenav-item-hover-bg:          #2f3742;
        --#{$prefix}sidenav-item-active-color:      #cfdff1;
        --#{$prefix}sidenav-item-active-bg:         #2f4358;
    }

    // Image Menu
    html[data-menu-color='image'] {
        --#{$prefix}sidenav-bg:                       #{linear-gradient(to bottom right, rgba(16,16,30,0.85), #2f434e), url('/public/images/sidenav-bg.jpg') center/cover no-repeat};
        --#{$prefix}sidenav-border-color:             null;
        --#{$prefix}sidenav-item-color:             #799cb7;
        --#{$prefix}sidenav-item-hover-color:       #bccee4;
        --#{$prefix}sidenav-item-hover-bg:          #253542;
        --#{$prefix}sidenav-item-active-color:      #cfdff1;
        --#{$prefix}sidenav-item-active-bg:         #253542;
    }

    // Dark Mode
    html[data-bs-theme='dark'][data-menu-color='dark'],
    html[data-bs-theme='dark'][data-menu-color='gray'],
    html[data-bs-theme='dark'][data-menu-color='light'] {
        --#{$prefix}sidenav-bg:                     #1e1f27;
        --#{$prefix}sidenav-border-color:           #2c2d38;
        --#{$prefix}sidenav-item-color:             #8495ab;
        --#{$prefix}sidenav-item-hover-color:       #bccee4;
        --#{$prefix}sidenav-item-hover-bg:          #2f3742;
        --#{$prefix}sidenav-item-active-color:      #ced6df;
        --#{$prefix}sidenav-item-active-bg:         #22232c;
    }

    // Light Topbar
    html[data-topbar-color='light'] {
        --#{$prefix}topbar-bg:                      #ffffff;
        --#{$prefix}topbar-item-color:                #{$gray-700};
        --#{$prefix}topbar-item-hover-color:          #{$primary};
        --#{$prefix}topbar-search-bg:                 transparent;
        --#{$prefix}topbar-search-border:           #e7e9eb;
    }

    // Gray Topbar
    html[data-topbar-color='gray'] {
        --#{$prefix}topbar-bg:                      #e9ebef;
        --#{$prefix}topbar-item-color:                #{$gray-700};
        --#{$prefix}topbar-item-hover-color:          #{$primary};
        --#{$prefix}topbar-search-bg:               #e0e1e9;
        --#{$prefix}topbar-search-border:           #e0e1e9;
    }

    // Dark Topbar
    html[data-topbar-color='dark'] {
        --#{$prefix}topbar-bg:                      #38414a;
        --#{$prefix}topbar-item-color:              #adb5bf;
        --#{$prefix}topbar-item-hover-color:        #e0eeff;
        --#{$prefix}topbar-search-bg:               #3f4952;
        --#{$prefix}topbar-search-border:           #3f4952;
    }

    // Gradient Topbar
    html[data-topbar-color='gradient'] {
        --#{$prefix}topbar-bg:                        #{linear-gradient(to bottom, #1e4258, #313144)};
        --#{$prefix}topbar-item-color:              rgba(255, 255, 255, 0.7);
        --#{$prefix}topbar-item-hover-color:        #ffffff;
        --#{$prefix}topbar-search-bg:               rgba(255, 255, 255, 0.1);
        --#{$prefix}topbar-search-border:           rgba(255, 255, 255, 0.1);
    }

    // Topbar (Dark Mode)
    html[data-bs-theme='dark'][data-topbar-color='light'],
    html[data-bs-theme='dark'][data-topbar-color='dark'],
    html[data-bs-theme='dark'][data-topbar-color='gray'] {
        --#{$prefix}topbar-bg:                      #252630;
        --#{$prefix}topbar-item-color:              #adb5bf;
        --#{$prefix}topbar-item-hover-color:        #e0eeff;
        --#{$prefix}topbar-search-bg:               #2d2e3c;
        --#{$prefix}topbar-search-border:           #2d2e3c;
    }
}

/* Dark Mode */
@if $enable-dark-mode {
    @include color-mode(dark, true) {
        --#{$prefix}light: #252630;
        --#{$prefix}light-rgb: #{to-rgb(#252630)};
        --#{$prefix}dark: #4b4d5c;
        --#{$prefix}dark-rgb: #{to-rgb(#4b4d5c)};
        --#{$prefix}box-shadow: #{0px 0px 30px rgba(0, 0, 0, 0.3)};
    }
}