//background for nav header
@each $name, $color in $theme_backgrounds {
    [data-nav-headerbg="#{$name}"][data-theme-version="dark"],
    [data-nav-headerbg="#{$name}"] {
        @if $name != "color_1"  {
            .nav-header {
                background-color: $color;

                .brand-logo {
                    color: $white;

                    &:hover {
                        color: $white;
                    }
                }
				.hamburger .line{
					background:#fff;
				}
				
            }
			&[data-sidebar-style="full"][data-layout="vertical"]{
				.menu-toggle .nav-header .nav-control .hamburger .line{
					background:#fff ;
				}
			}
			
        }
		
	}
}



//background for header 
@each $name, $color in $theme_backgrounds {
    [data-headerbg="#{$name}"][data-theme-version="dark"],
    [data-headerbg="#{$name}"] {

        @if $name != "color_1"  {
            .header {
                background-color: $color;
                color: $white;
            }

            .header-left {
                input {
                    border-color: lighten($color: $color, $amount: 10%);
                    background-color: lighten($color: $color, $amount: 10%) !important;
                    color: $white;
                    // border-right-color: transparent;

                    &::placeholder {
                        color: $white;
                    }

                    &:focus {
                        border-color: darken($color: $color, $amount: 10%);
                    }
                }
				.search_icon{
				    background-color: lighten($color: $color, $amount: 10%)  !important;
					i{
						color: #fff;
					}
				}

                .btn {
                    background-color: darken($color: $color, $amount: 10%);
                    border-color: darken($color: $color, $amount: 10%);

                    &:hover, 
                    &:focus, 
                    &:active {
                        background-color: darken($color: $color, $amount: 20%);
                        border-color: darken($color: $color, $amount: 20%);
                    }
                }
            }

            .header-right {
                .dropdown {
                    &>a {
                        color: $white;
                    }
                }
				.pulse-css{
					background-color:$white;
					&:after,
					&:before{
						background-color:inherit;
					}
				}
            }

            .nav-control {
                background-color: darken($color: $color, $amount: 10%);
                color: $white;
            }
			
        }
    }
}

//styles for sidebar
@each $name, $color in $theme_backgrounds {
//:not([data-sidebar-style="modern"])
    [data-sibebarbg="#{$name}"][data-theme-version="dark"],
    [data-sibebarbg="#{$name}"] {
        @if $name != "color_1" {
			
			.deznav {
                background-color: $color;
				
                .metismenu {
					.nav-label{
						color:rgba(255,255,255,0.7);
						border-color:rgba(255,255,255,0.2);
					}
                    &>li {
                        &>a {
                            color:  rgba(255,255,255,0.7); //darken($color: $white, $amount: 0%);
							svg{
								color:$white;
							}							
                        }

                        &:hover, 
                        &:focus, 
                        &.mm-active {
            
                            &>a {
                                background-color: darken($color: $color, $amount: 10%);
                                color: $white;
            
                                // &::after {
                                //     border-color: transparent transparent $white transparent;
                                // }
                            }
                        }
						&.mm-active {
							background-color: darken($color: $color, $amount: 10%);
						}
                        @at-root [data-layout="horizontal"]#{&} {
                            // &:not(:last-child) {
                                border-color: lighten($color: $color, $amount: 10%);
                            // }
                        }
                    }

                    a {
                        color: rgba(255,255,255,0.7);

                        &:hover, 
                        &:focus, 
                        &.mm-active {
                            color: $white;
                        }
						&:before {
							background-color: darken($color: $color, $amount: 10%);
						}
                    }

                    ul {
                        background-color: darken($color: $color, $amount: 10%);
						border-color: rgba(255,255,255,0.2);
						&:after{
							background-color: rgba(255,255,255,0.2);
						}
                    }

                    // .has-arrow {
                    //     &:after {
                    //         border-color: transparent transparent darken($color: $white, $amount: 30%) transparent;
                    //     }
                    // }
                }
            }
			&[data-sidebar-style="mini"][data-layout="vertical"]{
				.deznav .metismenu > li:hover > a{
					background-color: darken($color: $color, $amount: 10%);
				}
			} 
			&[data-sidebar-style="modern"][data-layout="vertical"]{
				.deznav .metismenu li ul{
					background-color: darken($color: $color, $amount: 10%);
				}
			}
			&[data-sidebar-style="icon-hover"][data-layout="vertical"]{
				.deznav .metismenu ul{
					border-color: rgba(255,255,255,0.2);
				}	
			}
			&[data-layout="horizontal"]{
				.deznav .metismenu > li{
					border-color: rgba(255,255,255,0.2);
				}
			}
        } 
    }
}

[data-headerbg="transparent"]{
    .header{
		box-shadow: none;
        background: transparent;
    }
}
[data-headerbg="color_1"]{
	.nav-header .hamburger.is-active .line,
	.nav-header .hamburger .line{
		background:$primary !important;
	}
}
