.sidebar{position:fixed;left:0;top:0;height:100vh;width:280px;background:linear-gradient(180deg,#0f172a,#1e293b);color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:1000;display:flex;flex-direction:column;border-right:1px solid rgba(148,163,184,.1);box-shadow:0 0 50px #0000001a;overflow:hidden}.sidebar.collapsed{width:70px;min-width:70px}.sidebar.hovered{width:280px;box-shadow:0 0 30px #3b82f64d}.sidebar-header{padding:1.5rem 1.25rem;border-bottom:1px solid rgba(148,163,184,.1);display:flex;align-items:center;justify-content:space-between;background:#0f172acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-height:85px;transition:all .3s ease}.sidebar.collapsed .sidebar-header{padding:1rem .5rem;justify-content:center;flex-direction:column;gap:.5rem}.brand{display:flex;align-items:center;gap:1rem;transition:all .3s ease}.sidebar.collapsed .brand{margin-bottom:.5rem}.sidebar.collapsed .brand img{margin-left:0!important;margin-top:0!important;height:30px!important}.brand-text{opacity:1;transition:opacity .2s ease}.sidebar.collapsed:not(.hovered) .brand-text{opacity:0;width:0;height:0;overflow:hidden}.brand-text h2{margin:0;font-size:1.25rem;font-weight:700;background:linear-gradient(135deg,#f1f5f9,#cbd5e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap}.brand-text span{font-size:.75rem;color:#94a3b8;font-weight:500;white-space:nowrap}.toggle-btn{background:#94a3b81a;border:1px solid rgba(148,163,184,.2);color:#cbd5e1;cursor:pointer;padding:.625rem;border-radius:8px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:40px;min-height:40px;flex-shrink:0}.sidebar.collapsed .toggle-btn{margin:0;padding:.5rem}.toggle-btn:hover{background:#94a3b833;border-color:#94a3b866;transform:scale(1.05)}.user-role-indicator{padding:.5rem 1rem;margin:.5rem;background-color:var(--role-bg);border-radius:6px;font-size:.75rem;font-weight:500;color:var(--role-color);text-align:center;white-space:nowrap;transition:all .3s ease;overflow:hidden}.sidebar.collapsed:not(.hovered) .user-role-indicator{display:none}[data-role=jpmc]{--role-bg: #fef3c7;--role-color: #92400e}[data-role=gorush]{--role-bg: #dbeafe;--role-color: #1e40af}.menu-section{flex:1;padding:1.5rem 0;overflow-y:auto;transition:all .3s ease}.menu{padding:0 1rem}.sidebar.collapsed .menu{padding:0 .5rem}.menu-item{position:relative;margin-bottom:.5rem;cursor:pointer;border-radius:12px;transition:all .2s cubic-bezier(.4,0,.2,1);overflow:hidden}.menu-item-content{display:flex;align-items:center;padding:1rem;position:relative;z-index:2}.sidebar.collapsed .menu-item-content{padding:.75rem .5rem;justify-content:center}.icon-wrapper{display:flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:1rem;transition:all .2s ease;color:#94a3b8}.sidebar.collapsed:not(.hovered) .icon-wrapper{margin-right:0}.label{flex:1;font-size:.9rem;font-weight:500;color:#e2e8f0;transition:all .2s ease;white-space:nowrap}.sidebar.collapsed:not(.hovered) .label{display:none}.menu-item-end{display:flex;align-items:center;gap:.5rem}.sidebar.collapsed:not(.hovered) .menu-item-end{display:none}.badge{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:6px;min-width:20px;text-align:center;box-shadow:0 2px 8px #f59e0b4d}.chevron{color:#64748b;transition:all .2s ease}.menu-item.hovered .chevron{color:#cbd5e1;transform:translate(2px)}.menu-item.active{background:linear-gradient(135deg,#3b82f626,#1d4ed81a);border:1px solid rgba(59,130,246,.2)}.menu-item.active .label{color:#93c5fd;font-weight:600}.menu-item.active .icon-wrapper{color:#3b82f6}.menu-item.hovered:not(.active){background:#94a3b814}.active-indicator{position:absolute;right:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background:linear-gradient(180deg,#3b82f6,#1d4ed8);border-radius:2px 0 0 2px;box-shadow:-2px 0 8px #3b82f666;transition:all .3s ease}.hover-indicator{position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(90deg,rgba(59,130,246,.05),transparent);z-index:1;border-left:2px solid rgba(59,130,246,.3)}.bottom-menu{padding:1rem;border-top:1px solid rgba(148,163,184,.1);background:#0f172a80;transition:all .3s ease}.sidebar.collapsed .bottom-menu{padding:.5rem}.sidebar-footer{padding:1rem 1.25rem;border-top:1px solid rgba(148,163,184,.1);background:#0f172acc;transition:all .3s ease}.sidebar.collapsed:not(.hovered) .sidebar-footer{display:none}.footer-content{text-align:center;font-size:.75rem;color:#64748b}.version{font-weight:600;color:#94a3b8;margin-bottom:.25rem}.copyright{opacity:.8}.menu-section::-webkit-scrollbar{width:4px}.menu-section::-webkit-scrollbar-track{background:#94a3b81a}.menu-section::-webkit-scrollbar-thumb{background:#94a3b84d;border-radius:2px}.menu-section::-webkit-scrollbar-thumb:hover{background:#94a3b880}.sidebar.collapsed .menu-item{position:relative}.sidebar.collapsed .menu-item:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);background:#000000e6;color:#fff;padding:.5rem .75rem;border-radius:6px;font-size:.875rem;white-space:nowrap;z-index:1000;margin-left:.5rem;pointer-events:none}@media (max-width: 768px){.sidebar:not(.collapsed){width:100vw;z-index:1100}.sidebar.collapsed.hovered{width:100vw}}
