#sidebar_collapse { position: absolute; top: 15px; left: 199px; padding: 0 8px; border-radius: 6px; height: 32px; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; align-content: center; cursor: pointer; color: #3f3f46; z-index: 9999; pointer-events: auto; opacity: 0; transition: 0.15s opacity linear; }

#sidebar_collapse:hover { background-color: #f4f4f5; color: #18181b; }

#sidebar_collapse:hover svg { color: #18181b; }

#sidebar_collapse svg { color: #3f3f46; width: 16px; height: 16px; padding: 0; margin: 0; }

#sidebar_collapse.closed { opacity: 0; pointer-events: none; }

#content_left { background: #fafafa; padding: 8px; overflow: hidden; width: 240px; transition: 0.2s width linear; font-family: "Geist", sans-serif; }

#content_left.closed { width: 64px; }

#content_left.closed .btn_nav { width: 36px; }

#content_left.closed .btn_nav span { opacity: 0; width: 0; margin-left: 0; }

#content_left.closed .menu_title { opacity: 0; height: 0; }

#content_left.closed .btn_nav_collapse_icon { opacity: 1; transition: 0.2s opacity linear 0.2s; }

#content_left.closed .menu_spacer { opacity: 1; }

#content_left #sidebar { height: 100%; width: 224px; position: relative; }

#base_left { height: 100%; }

#base_left #left_header { height: 48px; line-height: 32px; padding: 8px; font-size: 16px; }

#base_left #left_header .btn_nav { width: auto; font-weight: 600; color: #3f3f46; }

#base_left #left_header .btn_nav.logobtn { padding-left: 4px !important; column-gap: 8px !important; }

#base_left #left_header .btn_nav.logobtn span { margin-left: 0; font-size: 22px !important; }

#base_left #left_header .btn_nav .logo_wrapper { display: inline-block; font-family: 'Switzer'; font-weight: 500; font-style: italic; height: 24px !important; width: 24px !important; }

#base_left #left_header .btn_nav .logo_wrapper img { height: 24px !important; width: 24px !important; }

#base_left #left_header .btn_nav span { display: inline-block; font-family: 'Switzer' !important; font-size: 22px; user-select: none; -webkit-user-select: none; }

#base_left .menu_spacer { opacity: 0; transition: 0.2s opacity linear; width: 36px; height: 1px; border-bottom: 1px solid #e4e4e7; margin-top: 12px; margin-bottom: 12px; }

#left_menus { height: calc(100% - 48px); width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; row-gap: 8px; }

#left_header, #left_top, #left_middle, #left_bottom1, #left_bottom2, #left_footer { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; flex-wrap: nowrap; justify-content: space-between; row-gap: 4px; padding: 8px; }

#left_header a, #left_top a, #left_middle a, #left_bottom1 a, #left_bottom2 a, #left_footer a { text-decoration: none; }

#left_bottom1 { margin-top: auto; }

.menu_title { color: rgba(63, 63, 70, 0.7); font-size: 12px; font-weight: 500; padding: 0 8px; opacity: 1; height: 16px; transition: 0.15s opacity linear, 0.2s height linear; margin-top: 12px; user-select: none; -webkit-user-select: none; }

.btn_nav { height: 32px; width: 208px; transition: 0.2s width linear; color: #3f3f46; font-family: "Geist", sans-serif; font-size: 14px; line-height: 32px; border: none; background: transparent; cursor: pointer; border-radius: 6px; font-weight: 400; display: flex; flex-direction: row; align-items: center; column-gap: 0; }

.btn_nav:hover { background-color: #f4f4f5; color: #18181b; }

.btn_nav .svg_wrapper { padding-top: 6px; display: inline-block; }

.btn_nav span { opacity: 1; transition: 0.15s opacity linear, 0.2s margin-left linear; margin-left: 8px; white-space: nowrap; user-select: none; -webkit-user-select: none; }

.btn_nav .last_right { margin-left: auto; }

.btn_nav svg { height: 16px; }

.btn_nav.btn_nav_collapse_icon { width: 36px; opacity: 0; transition: 0.2s opacity linear 0s; background: white; color: #18181b; border: 1px solid #e4e4e7; pointer: cursor !important; }

.btn_nav.btn_nav_collapse_icon:hover { pointer: cursor !important; background: #f4f4f4; }

a.active .btn_nav { background: #18181b; color: #fafafa; }

a.active .btn_nav:hover { background: rgba(24, 24, 27, 0.9); }

#left_footer { margin-top: 8px; padding: 0; }

#left_footer .btn_nav { height: auto; padding: 8px; }

#left_footer .btn_nav img { width: 32px; height: 32px; border-radius: 8px; }

#left_footer .btn_nav #footer_initials { width: 32px; height: 32px; border-radius: 8px; background-color: #171717; color: white; display: flex; flex-direction: column; justify-content: center; align-items: center; }

#left_footer .btn_nav #footer_info { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; }

#left_footer .btn_nav #footer_info > span { height: 16px; line-height: 16px; color: #3f3f46; }

#left_footer .btn_nav #footer_info > span:first-child { font-weight: 600; font-size: 14px; }

#left_footer .btn_nav #footer_info > span:nth-child(2) { text-overflow: ellipsis; max-width: 130px; overflow: hidden; white-space: nowrap; font-size: 12px; font-weight: 400; }

#left_footer .btn_nav > *:last-child { margin-left: auto; }

#left_footer svg { width: 16px !important; }

.btn_popup { position: relative; }

.btn_popup .btn_popup_popup { padding: 4px; display: flex; flex-direction: column; row-gap: 4px; align-items: left; justify-content: left; visibility: hidden; position: absolute; transform: translateY(-100%); right: 0; top: 0; background: white; border-radius: 8px; border: 1px solid #e4e4e7; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); }

.btn_popup .btn_popup_popup a { max-height: 32px; }

.btn_popup .btn_popup_popup a button.btn_nav { height: 32px !important; padding: 0 6px !important; justify-content: flex-start; }

.btn_popup .btn_popup_popup a button.btn_nav .svg_wrapper { margin-top: 0 !important; }

.btn_popup .btn_popup_popup a button.btn_nav span { margin-left: 8px !important; }

.btn_popup .btn_popup_popup form { display: inline-block; width: 100% !important; padding: 0 !important; margin: 0 !important; column-gap: 0; row-gap: 0; max-height: 32px; }

.btn_popup .btn_popup_popup form button.btn_nav { max-height: 32px; width: 100%; margin: 0; justify-content: flex-start; padding: 8px 12px !important; }

.btn_popup .btn_popup_popup form button.btn_nav span { margin-left: 8px !important; font-weight: 400; color: #3f3f46; font-family: "Geist", sans-serif; font-size: 14px; line-height: 32px; }

.btn_popup .btn_popup_popup form button.btn_nav span:hover { background-color: #f4f4f5; color: #18181b; }

.btn_popup.active .btn_popup_popup { visibility: visible; }
