:root{--sidebar-width:250px;--sidebar-collapsed-width:65px;--transition-speed:0.3s}.sidebar{width:var(--sidebar-collapsed-width);background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;padding:20px 15px;height:100vh;transition:all var(--transition-speed) ease;position:fixed;top:0;left:0;z-index:1000;overflow-x:hidden;display:flex;flex-direction:column;justify-content:flex-start}.sidebar:hover{width:var(--sidebar-width)}.main-content{margin-left:var(--sidebar-collapsed-width);padding:20px;transition:margin-left var(--transition-speed) ease}.sidebar .logo-container{display:flex;align-items:center;margin-bottom:30px;cursor:pointer;white-space:nowrap;overflow:hidden}.sidebar:hover .logo-container{justify-content:flex-start}.sidebar .logo-container img{width:35px;height:35px;min-width:35px;border-radius:8px;transition:margin var(--transition-speed) ease}.sidebar .logo-text{font-size:1.2rem;font-weight:600;margin-left:15px;opacity:0;transition:opacity var(--transition-speed) ease;white-space:nowrap}.sidebar.open .logo-text,.sidebar:hover .logo-text{opacity:1}.sidebar .nav-item{display:flex;align-items:center;padding:12px 0;margin:8px 0;border-radius:8px;cursor:pointer;transition:all var(--transition-speed) ease;white-space:nowrap;overflow:hidden}.sidebar .nav-item i{padding-left:10px;min-width:30px;font-size:1.2rem;text-align:center;transition:transform var(--transition-speed) ease}.sidebar .nav-item span{margin-left:10px;opacity:0;transition:opacity var(--transition-speed) ease;white-space:normal;word-break:break-word;overflow:visible;width:auto;max-width:calc(var(--sidebar-width) - 60px);display:inline-block}.sidebar.open .nav-item span,.sidebar:hover .nav-item span{opacity:1}.sidebar .nav-item:hover{background-color:rgba(255,255,255,.15);transform:translateX(5px)}.sidebar .nav-item.active{background-color:rgba(255,255,255,.25)}.sidebar .logout{color:#ff6b6b;margin-top:auto}.sidebar-toggle{position:fixed;top:20px;right:20px;width:50px;height:50px;background-color:var(--primary-color);border-radius:50%;border:none;color:#fff;font-size:1.5rem;cursor:pointer;box-shadow:0 4px 8px rgba(0,0,0,.2);z-index:1050;display:none;align-items:center;justify-content:center;transition:.3s}.sidebar-toggle:hover{transform:scale(1.1);background-color:var(--secondary-color)}.page-fade-in,.page-fade-out{transition:opacity .15s}.page-fade-out{opacity:.9}.page-fade-in{opacity:1}.sidebar-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:999;opacity:0;visibility:hidden;transition:.3s}.sidebar-backdrop.show{opacity:1;visibility:visible}@media (max-width:768px){.sidebar{transform:translateX(-100%);width:var(--sidebar-width)}.sidebar.open{transform:translateX(0)}.main-content{margin-left:0}.sidebar-toggle{display:flex}}.sidebar-content{flex:1 1 auto;display:flex;flex-direction:column}.sidebar-group{margin-bottom:10px;border-radius:10px;background:rgba(255,255,255,.05);overflow:hidden}.sidebar-group-header{display:flex;align-items:center;cursor:pointer;padding:10px 8px;font-weight:600;font-size:1rem;color:#fff;background:rgba(0,0,0,.08);border-radius:10px 10px 0 0;transition:background .2s;user-select:none}.sidebar-group-header:hover{background:rgba(0,0,0,.15)}.sidebar-group-header i{margin-right:8px}.group-chevron{margin-left:auto;transition:transform .7s cubic-bezier(.4,2,.6,1);transform:rotate(0)}.sidebar-group .sidebar-group-items{max-height:0;opacity:0;overflow:hidden;transition:max-height 2s cubic-bezier(.4,2,.6,1),opacity 1.2s;padding-left:8px;background:0 0;width:100%;box-sizing:border-box}.sidebar-group.open .sidebar-group-items{max-height:800px;opacity:1;transition:max-height 2s cubic-bezier(.4,2,.6,1),opacity 1.2s}.sidebar-group-items .nav-item{margin:4px 0;width:100%;box-sizing:border-box;white-space:normal;word-break:break-word;overflow:visible}.sidebar-group.open .group-chevron{transform:rotate(90deg)}