.sidebar{position:fixed;top:0;left:0;width:50px;max-width:100vw;height:100vh;transition:.4s;overflow-x:hidden;-webkit-user-select:none;user-select:none;background:var(--bs-primary);z-index:9997}.sidebar-section{overflow:hidden;margin-bottom:0;position:relative;z-index:1}.sidebar-section-title{font-size:.8rem;margin:10px;font-weight:700;opacity:0;transition:1s;color:var(--bs-secondary)}.sidebar-item{font-size:1rem;display:block;padding:10px;margin:10px 2px;max-width:100%;border-radius:5px;position:relative;overflow:hidden;text-align:center;transition:.2s;color:#fff!important}.sidebar-item i{float:left;display:block;width:100%;padding:3px 0;transition:width .4s,opacity .4s,color 0s}.sidebar-item:hover{background:var(--bs-secondary)}.sidebar-item span{margin-left:10px;opacity:0;width:0;display:block;transition:width .4s,opacity .4s,background-color .2s,color 0s;overflow:hidden;white-space:nowrap}.sidebar-toggle-button{font-size:2rem;padding:5px 10px}.sidebar-header,.sidebar-footer{position:relative;z-index:1}.sidebar-item-active{background:rgba(var(--bs-secondary-rgb),.7)}.sidebar.open{width:300px}.sidebar.open .sidebar-section-title{visibility:visible;opacity:1}.sidebar.open .sidebar-item span,.sidebar.open .sidebar-header span{text-align:left;opacity:1}.sidebar.open .sidebar-item:hover{padding-left:15px;padding-right:5px}.sidebar.open .sidebar-item{text-align:left;margin:10px}.sidebar.open .sidebar-item i{width:30px;padding:3px 0}.sidebar.open .sidebar-item span{display:block;width:calc(100% - 30px)}.sidebar.open .sidebar-header i{transform:rotate(180deg)}.sidebar-header i{width:30px}.sidebar-header a{width:calc(100% - 30px);height:100%;transform:translate(20px,3px);margin-left:10px;display:block;overflow:hidden;white-space:nowrap;transition:.4s;font-size:1.5rem}.sidebar-toggle-button i{cursor:pointer}.sidebar-header{overflow:hidden}.sidebar-item{text-decoration:none}.sidebar #toggle-icon{position:relative;display:block;height:22px;width:28px;float:left;margin:10px auto;overflow:hidden;cursor:pointer}.sidebar #toggle-icon .toggle-icon-bar{display:block;height:2px;width:100%;position:absolute;left:0;background-color:var(--bs-secondary);transition:.4s;opacity:1}.sidebar #toggle-icon .toggle-icon-bar:nth-child(1){top:0}.sidebar #toggle-icon .toggle-icon-bar:nth-child(2){bottom:0}.sidebar.open #toggle-icon .toggle-icon-bar:nth-child(-n+2){opacity:0}.sidebar #toggle-icon .toggle-icon-bar:nth-child(3),.sidebar #toggle-icon .toggle-icon-bar:nth-child(4){top:calc(50% - 1px)}.sidebar.open #toggle-icon .toggle-icon-bar:nth-child(3){transform:rotate(45deg)}.sidebar.open #toggle-icon .toggle-icon-bar:nth-child(4){transform:rotate(-45deg)}