*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f5f7f9;color:#333;padding-top:80px;padding-left:250px}.app-container{display:flex;min-height:100vh}.sidebar{width:250px;background:linear-gradient(135deg,#2c3e50,#4a6491);color:#fff;padding:20px 0;box-shadow:2px 0 10px #0000001a;position:fixed;top:0;left:0;height:100vh;z-index:1000;overflow-y:auto}.logo{padding:0 20px 20px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:20px}.logo h2{font-weight:600;font-size:1.5rem}.nav-menu{display:flex;flex-direction:column;gap:5px;padding:0 10px}.nav-item{display:flex;align-items:center;padding:12px 15px;border-radius:8px;color:#e0e0e0;text-decoration:none;transition:all .3s ease}.nav-item:hover{background-color:#ffffff1a;color:#fff}.nav-item.router-link-active{background-color:#42b983;color:#fff;font-weight:500}.icon{margin-right:12px;font-size:1.2rem}.text{font-size:1rem}.main-content{flex:1;display:flex;flex-direction:column;margin-left:0;width:calc(100% - 250px)}.main-header{background-color:#fff;padding:15px 25px;box-shadow:0 2px 4px #0000000d;position:fixed;top:0;left:250px;right:0;z-index:900;height:80px;display:flex;align-items:center}.header-content{display:flex;justify-content:space-between;align-items:center;width:100%}.header-content h1{font-size:1.8rem;color:#2c3e50;font-weight:600}.current-page{display:flex;flex-direction:column;align-items:flex-end}.current-path{font-size:.8rem;color:#7f8c8d;margin-bottom:3px}.current-title{font-size:1.2rem;color:#42b983;font-weight:500}.content-area{flex:1;padding:25px;margin-top:80px;overflow-y:auto;min-height:calc(100vh - 80px)}@media (max-width: 768px){body{padding-left:0;padding-top:140px}.app-container{flex-direction:column}.sidebar{width:100%;height:auto;position:fixed;top:0;left:0;z-index:1000;padding:10px 0}.nav-menu{display:flex;flex-direction:row;justify-content:space-around;width:100%;overflow-x:auto;padding:0 10px;scrollbar-width:none}.nav-item{padding:8px 12px;white-space:nowrap}.main-content{width:100%;margin-left:0}.main-header{position:fixed;top:80px;left:0;right:0;height:120px}.header-content{flex-direction:column;align-items:flex-start;gap:10px}.current-page{align-items:flex-start;margin-top:10px}.content-area{margin-top:140px;padding:15px}}