@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

* {
     box-sizing: border-box;
}

body {
    overflow-x: hidden;
}

.menu-main {
    margin-bottom: 0;
}

.menu-main .bx-nav-parent-arrow {
    display: inline-block;
    vertical-align: middle;
    padding: 0px 8px;
    transition: all 0.2s ease-in;
}

.centered-dropdown {
  position: static !important; /*необходимо для выравнивания раскрывающегося меню по центру по горизонтали*/
}

.nav-item .dropdown-toggle,
.nav-item.bx-nav-1-lvl > a {
    color: var(--MaybeBlack);
}

/*раскрывающееся меню 2 уровня 1 и 2 пункт*/
.custom-dropdown-style {
    left: 50% !important;
    transform: translateX(-50%) !important; /*выравнивание по горизонтали*/
    top: auto !important;
    inset: auto;
    width: 1400px !important;
    padding: 0 !important;
    margin-top: 43px !important;
    background-color: #ffffff !important;
    z-index: 1050 !important;
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
    overflow-x: hidden !important; /*для того чтобы скругление углов сохранялось при наведении на btn*/
    overflow-y: visible !important;
}

/*линия со стрелкой над меню 2 уровня пункт 1*/
.custom-dropdown-style--first::before {
    content: "";
    position: absolute;
    top: -16px;
    left: 0;
    width: 100%;
    height: 18px;
    background: url('/local/templates/cirspb_2021/svg/arrow-line.svg') no-repeat left top;
    background-size: 100% 100%;
    z-index: 2000;
    pointer-events: none;
}

/*линия со стрелкой над меню 2 уровня пункт 2*/
.custom-dropdown-style--second::before {
    content: "";
    position: absolute;
    top: -16px;
    left: 0;
    width: 100%;
    height: 18px;
    background: url('/local/templates/cirspb_2021/svg/arrow-line--second.svg') no-repeat left top;
    background-size: 100% 100%;
    z-index: 2000;
    pointer-events: none;
}

.custom-dropdown-style .bx-nav-list-2-lvl {
    flex-wrap: wrap !important;
}
    
.custom-dropdown-style .bx-nav-2-lvl {
    display: flex !important;
    flex: 1 1 220px !important;
    height: 124px;
}

.custom-dropdown-style .dropdown-btn {
    position: relative !important;
    padding: 28px !important;
}

/*левая линия между кнопками*/
.custom-dropdown-style .dropdown-btn::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%)!important;
    width: 1px;
    height: 79px;
    background-color: #878787;
}


/* Убираем левую линию у первого */
.bx-nav-list-2-lvl > li:first-child .dropdown-btn::before {
    opacity: 0 !important;
}

/* Убираем линию слева, если текущий или предыдущий элемент в ховере */
.bx-nav-list-2-lvl > li:hover .dropdown-btn::before,
.bx-nav-list-2-lvl > li:hover + li .dropdown-btn::before {
    opacity: 0 !important;
}

.custom-dropdown-style .dropdown-btn:hover,
.custom-dropdown-style .bx-nav-2-lvl:hover{
    background-color: #EEEEEE !important;
}


.custom-dropdown-style .dropdown-btn > a {
    font-size: 15px !important;/*было 14*/
    line-height: 16px !important;
    font-weight: 500 !important;
    color: #181D23;
}

.custom-dropdown-style .dropdown-btn .dropdown-btn-description {
    font-size: 11px !important;/*было 10*/
    line-height: 11px !important;/*было 10*/
    font-weight: 400 !important;
    color: #52565B;
}

@media only screen and (max-width: 1499px) {
    .custom-dropdown-style {
        max-width: 80vw !important;
        border-top: 1px solid #878787 !important;
    }
    .custom-dropdown-style .bx-nav-2-lvl {
        flex: 1 1 250px !important;
    }  
}

@media only screen and (min-width: 1200px) {
    .menu-main {
        padding-left: 0;
    }

    .bx-nav-parent-arrow {
        padding: 0;
    }

    .bx-nav-catinfo {
        position: absolute;
        left: 65%;
        top: 0;
    }

    .bx-nav-catinfo img {
        max-width: 200px;
        width: auto;
        max-height: 150px;
        margin: 0 0 10px;
    }
}

@media only screen and (max-width: 767px) {
    .custom-dropdown-style .bx-nav-2-lvl {
        height: auto !important;
    }
    
    .custom-dropdown-style .dropdown-btn {
        max-width: 100vw !important;
        padding: 20px !important;
        word-break: break-word; /*перенос длинных слов*/
      }
    
    .custom-dropdown-style .dropdown-btn::before {
        height: 50px !important;
    }

    .dropdown-btn-description {
        max-width: 100% !important;
        overflow-wrap: break-word !important;
        word-break: break-word !important;
        white-space: normal !important;
      }
    
    .menu-main__img {
        max-width: 0 !important;
        min-width: 0 !important;
    }
    
    .menu-main__icon {
        display: none;
    }
}

@media only screen and (max-width: 575px) {
    .menu-main__img {
        max-width: 50px !important;
        min-width: 50px !important;
    }
    
    .menu-main__icon {
        display: block;
    }
}
}