

/* Start:/local/templates/main/components/bitrix/menu/side/style.css?17877461912705*/
.side--menu {margin-top: 16px}
.side--menu li {margin-bottom: 0;margin-left: 0 !important;padding-left: 0 !important;}
.side--menu li:before {display: none !important;}
.side--menu li a {display: flex;align-items: center;gap:10px;border-radius: 12px;padding: 12px 16px;transition: .4s;text-decoration: none !important;font-size:16px;}
.side--menu li a.selected,
.side--menu li a:hover {background-color: #FFF7F5;color:var(--main)}
.side--menu li i {width: 29px;height: 20px;min-width: 20px;display: flex;align-items: center;justify-content: center}
.side--menu li i svg{width: 100%;height: 100%;transition: .4s}
.side--menu li i.svg-inline-stroke svg{stroke: #39414DCC;fill:transparent}
.side--menu li i.svg-inline-fill svg{fill: #39414DCC;stroke: transparent}
.side--menu li a:hover i.svg-inline-stroke svg,
.side--menu li a:hover i.svg-inline-fill svg,
.side--menu li a.selected i.svg-inline-stroke svg{stroke: var(--main)}
.side--menu li a.selected i.svg-inline-fill svg{fill: var(--main)}

.side--menu li.--logout a {padding: 16px;color:#9CA0A9}
.side--menu li.--logout a:hover {color:var(--main)}

.page--with-side {display: flex;gap: 40px;--width:320px;position: relative}
.page--side {width: var(--width);min-width: var(--width);}
.page--side ul {list-style-type: none}
.page--box {width: calc(100% - var(--width) - 40px)}

@media all and (max-width: 1152px) {
    .page--with-side {--width: 250px;gap:20px;}
}

@media all and (max-width: 1024px) {
    .page--with-side .personal--side{transition: .4s ease;position: absolute;top:0;left:0;width: 100%;height: 100%;z-index: 5;background-color: #fff;transform: translateX(-100%)}
    .page--with-side.--opened .personal--side{transform: translateX(0)}
}

@media all and (max-width: 900px) {
    .page--with-side {flex-direction:column;gap:16px;}
    .page--box {width:100%}
    .page--side {width:100%}
}

@media (max-width: 900px) {
    .side--menu {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;

        padding: 10px;
        margin: 0;
        list-style: none;
        gap: 12px;

        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .side--menu::-webkit-scrollbar {
        display: none !important;
    }

    .side--menu li {
        display: block !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
    }

    .side--menu a {
        display: block;
        white-space: nowrap;
        padding: 10px 20px;
        font-size: 14px;
        border: 1px solid #e5e5ea;
        border-radius: 20px;

    }

}
/* End */
/* /local/templates/main/components/bitrix/menu/side/style.css?17877461912705 */
