.sidebar{color:#e2e8f0;z-index:100;background-color:#1e293b;flex-direction:column;width:260px;height:100vh;transition:transform .3s;display:flex;position:fixed;top:0;left:0}.sidebar.closed{transform:translate(-100%)}.sidebar-header{border-bottom:1px solid #334155;padding:20px 24px}.sidebar-logo{align-items:center;gap:12px;display:flex}.sidebar-logo img{object-fit:contain;width:36px;height:36px}.logo-text{color:#f8fafc;font-size:18px;font-weight:600}.sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:16px 12px;display:flex;overflow-y:auto}.nav-link{color:#94a3b8;border-radius:8px;align-items:center;gap:14px;padding:12px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-link:hover{color:#f1f5f9;background-color:#334155}.nav-link.active{color:#fff;background-color:#3b82f6}.sidebar-footer{border-top:1px solid #334155;padding:16px 12px}.logout-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:14px;width:100%;padding:12px 16px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.logout-btn:hover{color:#fff;background-color:#ef4444}@media (max-width:768px){.sidebar{width:260px}.sidebar.open{transform:translate(0)}.sidebar.closed{transform:translate(-100%)}}
.topbar{z-index:50;background-color:#fff;border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.topbar-left{align-items:center;gap:16px;display:flex}.menu-btn{color:#475569;cursor:pointer;background-color:#f1f5f9;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:background-color .2s;display:none}.menu-btn:hover{background-color:#e2e8f0}.search-box{color:#94a3b8;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;align-items:center;gap:8px;width:320px;padding:8px 14px;display:flex}.search-box input{color:#1e293b;background:0 0;border:none;outline:none;width:100%;font-size:14px}.search-box input::placeholder{color:#94a3b8}.topbar-right{align-items:center;gap:16px;display:flex}.icon-btn{color:#64748b;cursor:pointer;background-color:#0000;border:none;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex;position:relative}.icon-btn:hover{color:#1e293b;background-color:#f1f5f9}.badge{color:#fff;background-color:#ef4444;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;font-weight:600;display:flex;position:absolute;top:4px;right:4px}.user-profile{cursor:pointer;border-radius:8px;align-items:center;gap:12px;padding:4px 8px;transition:background-color .2s;display:flex}.user-profile:hover{background-color:#f8fafc}.user-avatar{color:#fff;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.user-info{flex-direction:column;line-height:1.2;display:flex}.user-name{color:#1e293b;font-size:14px;font-weight:600}.user-role{color:#94a3b8;font-size:12px}@media (max-width:768px){.menu-btn{display:flex}.search-box,.user-info{display:none}}
.admin-layout{background-color:#f3f4f6;min-height:100vh;display:flex}.admin-main{flex-direction:column;flex:1;transition:margin-left .3s;display:flex}.admin-main.sidebar-open{margin-left:260px}.admin-main.sidebar-closed{margin-left:0}.admin-content{flex:1;padding:24px;overflow-y:auto}.admin-auth-error{color:#1e293b;text-align:center;place-content:center;justify-items:center;gap:12px;min-height:100vh;padding:24px;display:grid}.admin-auth-error button{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:8px;padding:10px 18px}@media (max-width:768px){.admin-main.sidebar-open{margin-left:0}.admin-content{padding:16px}}