#side-bar { width: 19.2rem; height: 100%; padding-top: 0.4rem; background-color: #F8F8F8; 
            border-right: 1px solid #EAEAEA; border-radius: 22px 0 0 22px; transition: all 0.5s ease; }


    #side-bar .menu-list { list-style: none; padding: 0; margin: 0.15rem 0.5rem; }
    #side-bar .menu-item { display: grid; grid-template-columns: 1.65rem auto minmax(max-content, 1rem); align-items: center; position: relative; 
                           padding: 0.4rem; margin: 0.1rem 0; cursor: pointer;  border-radius: 0.5rem; transition: 0.5s ease; white-space: nowrap; 
                           font-size: 15px; font-weight: 600; font-family: 'Outfit'; }

        #side-bar .menu-item:hover { background-color: #E7E8EB; }
        #side-bar .menu-item.selected { background-color: #DCE9FA; }
        #side-bar .menu-item.faded { opacity: 0.6; }
        #side-bar .menu-item.disabled { pointer-events: none; opacity: 0.6; }
        #side-bar .menu-item.disabled .arrow { visibility: hidden; }
    #side-bar .separator { margin: 12px 0; border-top: 1px solid lightgray; }

        #side-bar .menu-item .text { overflow: hidden; text-overflow: ellipsis; margin-left: 0.4rem; transition: 0.5s ease; opacity: 1; }
            #side-bar .menu-item .text.add-new { color: #4C79C2 !important; }
            #side-bar .menu-item .text.error { color: #EF5350 !important; }
            #side-bar .menu-item .text.emptySource { color: #f7931e !important; }
        #side-bar .menu-item .num { border: 1px solid #F8F8F8; background-color: #E7E8EB; font-size: 11px; text-align: center; 
                                    padding: 0.1rem 0.3rem; border-radius: 0.2rem; min-width: 0.35rem; display: inline-block; margin-left: 0.3rem }

        #side-bar .menu-item .warn { background: url('../../../../bundle/i/newUI/message-sprite.svg') no-repeat; background-size: auto 1rem; 
                                     height: 1rem; width: 1rem; display: inline-block; }
            #side-bar .menu-item .warn.yellow { background-position: -1rem 0; }
            #side-bar .menu-item .warn.red { background-position: -2rem 0; }

        #side-bar .menu-item .tooltip { position: absolute; top: -2.1rem; left: 2.8rem; background-color: white; border-radius: 0.5rem; 
                                        display: none; grid-template-columns: 1fr auto 1fr; padding: 0.5rem 0.9rem; z-index: 101; opacity: 0;
                                        color: #6D6D6D; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); }

    #side-bar .menu-list.nested { margin: 0 0 0 2.8rem; visibility: visible; max-height: 1200px; transition: visibility .333s, max-height .333s; overflow: hidden; }
    #side-bar .menu-list.nested-1 { margin: 0 0 0 1.2rem !important; }
    #side-bar .menu-list.smaller .menu-item { padding: 0.36rem; }

    #side-bar .menu-list.collapse { visibility: hidden; max-height: 0; }
    #side-bar .menu-item.close { height: 1.5rem; width: 1.5rem; margin-left: 0.2rem; }

    #side-bar .menu-item .arrow-wrap { height: 1.5rem; width: 1.5rem; display: inline-block; align-content: center; }
    #side-bar .menu-item .arrow { background: url('arrows.svg') no-repeat; background-size: auto 0.8rem; height: 0.8rem; width: 0.8rem; 
                                  transition: transform 0.5s ease-out; display: table; margin: 0 auto; }
        #side-bar .menu-item .arrow.up { background-position: 0 0; }
        #side-bar .menu-item .arrow.down { background-position: 0 0; transform: rotate(-180deg); }

    #side-bar .menu-item .icon { background: url('side-menu-sprite.svg') no-repeat; background-size: auto 24px; height: 24px; width: 24px; }
        #side-bar .menu-item .icon.arrow-l { background-position: 0 0; }
        #side-bar .menu-item .icon.dashboard { background-position: -52px 0; }
        #side-bar .menu-item .icon.tunnels { background-position: -78px 0; }
        #side-bar .menu-item .icon.contacts { background-position: -104px 0; }
        #side-bar .menu-item .icon.calendars { background-position: -130px 0; }
        #side-bar .menu-item .icon.notes { background-position: -156px 0; }
        #side-bar .menu-item .icon.collections { background-position: -182px 0; }
        #side-bar .menu-item .icon.history { background-position: -208px 0; }
        #side-bar .menu-item .icon.pf { background-position: -234px 0; }
        #side-bar .menu-item .icon.billing { background-position: -260px 0; }
        #side-bar .menu-item .icon.mailboxes { background-position: -286px 0; }
        #side-bar .menu-item .icon.sesettings { background-position: -312px 0; }

        #side-bar .menu-item .icon.app-consent { background-position: -339px 0; }
        #side-bar .menu-item .icon.contact-fields { background-position: -364px 0; }
        #side-bar .menu-item .icon.notes-suffix { background-position: -390px 0; }
        #side-bar .menu-item .icon.obfuscation { background-position: -416px 0; }
        #side-bar .menu-item .icon.purge-cache { background-position: -442px 0; }
        #side-bar .menu-item .icon.location { background-position: -468px 0; }
        #side-bar .menu-item .icon.service-account { background-position: -494px 0; }
        #side-bar .menu-item .icon.manage-roles { background-position: -520px 0; }
        #side-bar .menu-item .icon.reporting { background-position: -546px 0; }
        #side-bar .menu-item .icon.folder-purge { background-position: -571px 0; }
        #side-bar .menu-item .icon.intergration { background-position: -598px 0; }
        #side-bar .menu-item .icon.native-sync { background-position: -624px 0; }
        #side-bar .menu-item .icon.powershell { background-position: -650px 0; }
        #side-bar .menu-item .icon.about { background-position: -676px 0; }
        #side-bar .menu-item .icon.partnership { background-position: -702px 0; }
        #side-bar .menu-item .icon.plus { background-position: -728px 0; }

    #side-bar .menu-item .icon-s { background: url('../../../../bundle/i/newUI/sources-sprite.svg') no-repeat; background-size: auto 49px; height: 24px; width: 24px; }
        #side-bar .menu-item .icon-s.item_1 { background-position: 0 0; }
        #side-bar .menu-item .icon-s.item_2 { background-position: -25px 0; }
        #side-bar .menu-item .icon-s.item_3 { background-position: -50px 0; }
        #side-bar .menu-item .icon-s.item_4 { background-position: -175px 0; }
        #side-bar .menu-item .icon-s.item_5 { background-position: -125px 0; }
        #side-bar .menu-item .icon-s.item_6 { background-position: -200px 0; }
        #side-bar .menu-item .icon-s.item_7 { background-position: -75px 0; }
        #side-bar .menu-item .icon-s.item_8 { background-position: -125px 0; }
        #side-bar .menu-item .icon-s.item_9 { background-position: -100px 0; }
        #side-bar .menu-item .icon-s.item_10 { background-position: -150px 0; }
        #side-bar .menu-item .icon-s.item_11 { background-position: -225px 0; }

    #side-bar.collapse { width: 3.4rem; }
        #side-bar.collapse .menu-item .text { opacity: 0; pointer-events: none; transform: translateX(-20%); transition: 0.5s ease; }
        #side-bar.collapse .menu-item .tooltip { display: grid; visibility: hidden; }
        #side-bar.collapse .menu-item .arrow { display: none; }
        #side-bar.collapse .menu-item.close { display: none; }
        #side-bar.collapse .menu-item:hover .tooltip { visibility: visible; top: 50%; transform: translateY(-50%); transition: 0.5s ease; opacity: 1; }