#navbar-container{width:var(--sidebar-width);flex-shrink:0}#navbar-container.hidden{display:none}.sidebar{width:var(--sidebar-width);height:100vh;background:#0b3828;border-right:none;position:fixed;top:0;left:0;display:flex;flex-direction:column;z-index:50;overflow:hidden}.sidebar-logo{padding:20px 20px 18px;border-bottom:var(--border-thin);flex-shrink:0}.sidebar-logo-name{font-size:20px;font-weight:800;color:#fff;display:flex;align-items:center;gap:12px;width:100%}.sidebar-logo-sub{font-size:11px;color:rgba(255,255,255,.45);margin-top:3px;padding-left:68px}.sidebar-nav{flex:1;padding:14px 10px;overflow-y:auto}.sidebar-section-label{font-size:10px;font-weight:600;color:rgba(255,255,255,.55);letter-spacing:.8px;text-transform:uppercase;padding:0 8px;margin:6px 0 6px}.sidebar-link{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-md);font-size:13px;font-weight:500;color:rgba(255,255,255,.65);cursor:pointer;transition:background .14s ease,color .14s ease;margin-bottom:2px;user-select:none}.sidebar-link:hover{background:rgba(255,255,255,.08);color:#fff}.sidebar-link.active{background:#bdde48;color:#0b3828;font-weight:700}.sidebar-link svg{flex-shrink:0;opacity:.65}.sidebar-link.active svg,.sidebar-link:hover svg{opacity:1}.sidebar-link.active svg{color:#0b3828}.sidebar-footer{padding:12px 10px;border-top:1px solid rgba(255,255,255,.1);flex-shrink:0}.sidebar-back{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--radius-md);font-size:12px;color:rgba(255,255,255,.45);cursor:pointer;transition:background .14s ease,color .14s ease;margin-bottom:6px;user-select:none}.sidebar-back:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.8)}.sidebar-user{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-md);cursor:pointer;transition:background .14s ease;user-select:none}.sidebar-user:hover{background:rgba(255,255,255,.07)}.sidebar-avatar{width:32px;height:32px;background:rgba(189,222,72,.2);color:#bdde48;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex-shrink:0}.sidebar-user-info{min-width:0}.sidebar-user-name{font-size:12px;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-role{font-size:11px;color:rgba(255,255,255,.45)}.bottom-nav{display:none}.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;opacity:0;pointer-events:none;transition:opacity .22s ease}.drawer-overlay.open{display:block;opacity:1;pointer-events:auto}.drawer{display:none;position:fixed;top:0;right:0;left:auto;width:280px;height:100vh;background:#0b3828;z-index:201;flex-direction:column;transform:translateX(100%);transition:transform .26s cubic-bezier(.22, 1, .36, 1);box-shadow:-4px 0 24px rgba(0,0,0,.12)}.drawer.open{transform:translateX(0)}.drawer-header{display:flex;justify-content:space-between;align-items:center;padding:18px 18px 16px;border-bottom:1px solid rgba(255,255,255,.1);flex-shrink:0}.drawer-logo{display:flex;align-items:center}.drawer-close{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);color:rgba(255,255,255,.5);cursor:pointer;transition:background .14s ease;background:0 0;border:none}.drawer-close:hover{background:rgba(255,255,255,.08)}.drawer-nav{flex:1;padding:14px 10px;overflow-y:auto}.drawer-section-label{font-size:10px;font-weight:600;color:rgba(255,255,255,.55);letter-spacing:.8px;text-transform:uppercase;padding:0 8px;margin:6px 0 6px}.drawer-link{display:flex;align-items:center;gap:10px;padding:10px 10px;border-radius:var(--radius-md);font-size:14px;font-weight:500;color:rgba(255,255,255,.65);cursor:pointer;transition:background .14s ease,color .14s ease;margin-bottom:2px;user-select:none}.drawer-link:hover{background:rgba(255,255,255,.08);color:#fff}.drawer-link.active{background:#bdde48;color:#0b3828;font-weight:700}.drawer-link svg{flex-shrink:0;opacity:.65}.drawer-link.active svg,.drawer-link:hover svg{opacity:1}.drawer-link.active svg{color:#0b3828}.drawer-footer{padding:12px 10px;border-top:1px solid rgba(255,255,255,.1);flex-shrink:0}.drawer-back{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:var(--radius-md);font-size:13px;color:rgba(255,255,255,.45);cursor:pointer;transition:background .14s ease;margin-bottom:6px;user-select:none}.drawer-back:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.8)}.drawer-user{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-md);cursor:pointer;transition:background .14s ease;user-select:none}.drawer-user:hover{background:rgba(255,255,255,.07)}.mobile-header{display:none}.mobile-header-logo{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800;color:#fff}.mobile-header-menu{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);cursor:pointer;color:rgba(255,255,255,.65);transition:background .14s ease,color .14s ease;background:0 0;border:none;-webkit-tap-highlight-color:transparent}.mobile-header-menu:active,.mobile-header-menu:hover{background:rgba(255,255,255,.1);color:#fff}@media (max-width:767px){#navbar-container{width:100%}.sidebar{display:none}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#0b3828;border-top:1px solid rgba(255,255,255,.1);height:var(--bottomnav-height);z-index:100}.bottom-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;color:rgba(255,255,255,.5);cursor:pointer;padding:6px 4px;transition:color .14s ease;user-select:none;-webkit-tap-highlight-color:transparent}.bottom-nav-item.active{color:#bdde48;font-weight:600}.bottom-nav-item svg{flex-shrink:0}.drawer{display:flex}.mobile-header{display:flex;justify-content:space-between;align-items:center;padding:0 16px;height:52px;background:var(--color-surface);border-bottom:var(--border-thin);position:fixed;top:0;left:0;right:0;z-index:99}}
.notif-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #D93636;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  border-radius: 99px;
  margin-left: auto;
  line-height: 1;
}
