/*!
 * KNO Bootstrap v1.0.0 (https://kraineuolek.com/)
 * Copyright 2023-2025 by Oleksandr Khrashchevskyi
 * Licensed (https://kraineuolek.com/)
 */

header .navbar .dropdown_submenu_depth_02 > ul,
header .navbar .dropdown_submenu_depth_03 > ul,
header .navbar .dropdown_submenu_depth_04 > ul {
    list-style: none;
    margin: 0;
    padding: 0px;
    width: 300px;
    background: var(--global-color-00) !important;
    border-radius:15px;
    border: none !important;
    border: 1px solid var(--global-color-01) !important;
}

header .navbar .dropdown_submenu_depth_03 > ul{
    width: 300px;
}
header .navbar .dropdown_submenu_depth_04 > ul{
    width: 300px;
}
header .navbar .dropdown_submenu_depth_02 > ul li,
header .navbar .dropdown_submenu_depth_03 > ul li,
header .navbar .dropdown_submenu_depth_04 > ul li {
    border-bottom: 1px solid var(--global-color-01);
}

header .navbar .dropdown_submenu_depth_02 > ul li:last-child,
header .navbar .dropdown_submenu_depth_03 > ul li:last-child,
header .navbar .dropdown_submenu_depth_04 > ul li:last-child {
    border-bottom: none;
}

header .navbar .dropdown_submenu_depth_02 > ul > li > a,
header .navbar .dropdown_submenu_depth_03 > ul > li > a,
header .navbar .dropdown_submenu_depth_04 > ul > li > a {
    display: block;
    padding: 5px 7.5px;
    color: var(--global-color-03) !important;
    text-align: center;
    text-decoration: none;
    position: relative;
    white-space: normal !important;
    font-size: 16px !important;
    transition: var(--animation-duraton-1000);
}
header .navbar .dropdown_submenu_depth_02 > ul > li > a:hover,
header .navbar .dropdown_submenu_depth_03 > ul > li > a:hover,
header .navbar .dropdown_submenu_depth_04 > ul > li > a:hover {
    background: var(--global-color-01) !important;
    color: var(--global-color-00) !important;
}
header .navbar .dropdown_submenu_depth_02 > ul > li:nth-child(1) > a:hover,
header .navbar .dropdown_submenu_depth_03 > ul > li:nth-child(1) > a:hover,
header .navbar .dropdown_submenu_depth_04 > ul > li:nth-child(1) > a:hover{
    border-top-right-radius: var(--global-border-radius-15);
    border-top-left-radius: var(--global-border-radius-15);
}
header .navbar .dropdown_submenu_depth_02 > ul > li:last-child > a:hover,
header .navbar .dropdown_submenu_depth_03 > ul > li:last-child > a:hover,
header .navbar .dropdown_submenu_depth_04 > ul > li:last-child > a:hover{
    border-bottom-right-radius: var(--global-border-radius-15);
    border-bottom-left-radius: var(--global-border-radius-15);
}

header .navbar .dropdown_submenu_depth_02:hover > .dropdown-menu,
header .navbar .dropdown_submenu_depth_03:hover > .dropdown-menu,
header .navbar .dropdown_submenu_depth_04:hover > .dropdown-menu {
    display: block;
}
header .navbar .dropdown-item.active,
header .navbar .dropdown_submenu_depth_03 > a.active,
header .navbar .dropdown_submenu_depth_03 > ul li a.active,
header .navbar .dropdown_submenu_depth_04 > ul li a.active{
    background: var(--global-color-02) !important;
}
header .navbar .dropdown_submenu_depth_03,
header .navbar .dropdown_submenu_depth_04 {
    position: relative;
}
header .navbar .dropdown_submenu_depth_03 > ul,
header .navbar .dropdown_submenu_depth_04 > ul {
    position: absolute;
    top: 0px !important;
    left: calc(100% - 0.5px);
    margin: 0;
}
header .navbar .dropdown_submenu_depth_04 > ul{
    top: -1px !important;
}





@media (max-width: 991.98px) {
    header .dropdown-toggle::after {
        display: none !important;
    }
    header ul li.dropdown_submenu_depth_02 > a > i{
        background: var(--global-color-02) !important;
        color: var(--global-color-00) !important;
    }



    header ul li.dropdown_submenu_depth_02 > a > i{
        height: 100%;
        aspect-ratio: 1;
        background: var(--global-color-01);
        color: var(--global-color-02);
        justify-content: center;
        display: flex;
        align-items: center;
    }
    header ul li.dropdown_submenu_depth_02 > ul,
    header ul li.dropdown_submenu_depth_03 > ul,
    header ul li.dropdown_submenu_depth_04 > ul {
        position: relative !important;
        width: 100% !important;
        left: 0px !important;
        top: 0px !important;
    }
    header ul li.dropdown_submenu_depth_02 > ul > li > a{
        padding-left: 15px !important;
    }
    header ul li.dropdown_submenu_depth_02 > ul > li > a:before{
       left: 5px !important;
    }

    header ul li.dropdown_submenu_depth_03 > ul > li > a{
        padding-left: 25px !important;
        position: relative;
    }
    header ul li.dropdown_submenu_depth_03 > ul > li > a:before{
        left: 15px !important;
    }

    header ul li.dropdown_submenu_depth_04 > ul > li > a{
        padding-left: 35px !important;
        position: relative;
    }
    header ul li.dropdown_submenu_depth_04 > ul > li > a:before{
        left: 25px !important;
    }

    header ul li.dropdown_submenu_depth_02 > ul > li > a::before,
    header ul li.dropdown_submenu_depth_03 > ul > li > a::before,
    header ul li.dropdown_submenu_depth_04 > ul > li > a::before {
        content: '\2022';
        font-size: 15px;
        color: var(--global-color-00);
        margin-right: 10px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
    header ul.navbar-nav li.dropdown_submenu_depth_02 > a,
    header ul.navbar-nav li.dropdown_submenu_depth_03 > a,
    header ul.navbar-nav li.dropdown_submenu_depth_04 > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
    }
    header .dropdown_submenu_depth_02 > a > i,
    header .dropdown_submenu_depth_03 > a > i,
    header .dropdown_submenu_depth_04 > a > i {
        font-size: 15px !important;
        color: var(--global-color-00);
        cursor: pointer;
        margin-left: auto;
        width: 30px;
        text-align: center;
    }
}



@media (max-width:575.98px){
    header .navbar .dropdown_submenu_depth_02 > ul, 
    header .navbar .dropdown_submenu_depth_03 > ul, 
    header .navbar .dropdown_submenu_depth_04 > ul{
        border-radius: 0px !important;
    }
        header .navbar .dropdown_submenu_depth_03 > ul,
        header .navbar .dropdown_submenu_depth_04 > ul{
            border-bottom: 0px !important;
            border-left: 0px !important;
            border-right: 0px !important;
        }
}