/* Portal BJKW — Sidebar overlay + tombol toggle (tidak mengganggu layout modul) */
#portalSidebarToggle {
  position: fixed; top: 12px; left: 12px; z-index: 99998;
  width: 44px; height: 44px; border-radius: 10px; border: none; cursor: pointer;
  background: linear-gradient(135deg, #00529B, #003366); color: #FFD100;
  box-shadow: 0 4px 14px rgba(0,51,102,.35); font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  transition: transform .25s ease, box-shadow .25s ease;
}
#portalSidebarToggle:hover { transform: scale(1.06); box-shadow: 0 6px 18px rgba(0,51,102,.5); }
#portalSidebar {
  position: fixed; top: 0; left: 0; bottom: 0; width: 264px; z-index: 99999;
  background: #ffffff; box-shadow: 4px 0 24px rgba(0,51,102,.18);
  transform: translateX(-105%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column; font-family: 'Inter', system-ui, sans-serif;
}
#portalSidebar.psb-open { transform: translateX(0); }
#portalSidebarOverlay {
  position: fixed; inset: 0; background: rgba(0,30,60,.45); z-index: 99997;
  opacity: 0; pointer-events: none; transition: opacity .3s ease; backdrop-filter: blur(2px);
}
#portalSidebarOverlay.psb-show { opacity: 1; pointer-events: auto; }
.psb-header {
  padding: 18px 18px 14px; background: linear-gradient(135deg, #00529B 0%, #003366 100%);
  color: #fff; display: flex; align-items: center; gap: 12px;
}
.psb-logo {
  width: 44px; height: 44px; border-radius: 50%; background: #FFD100; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-weight: 800; color: #003366; font-size: 13px;
  box-shadow: 0 2px 8px rgba(0,0,0,.25); overflow: hidden;
}
.psb-logo img { width: 100%; height: 100%; object-fit: cover; }
.psb-title { font-size: 14px; font-weight: 700; line-height: 1.3; }
.psb-sub { font-size: 11px; opacity: .85; margin-top: 2px; color: #FFD100; }
.psb-list { flex: 1; overflow-y: auto; padding: 10px 0; }
.psb-item {
  display: flex; align-items: center; gap: 12px; padding: 11px 20px; cursor: pointer;
  color: #475569; font-size: 13.5px; font-weight: 500; text-decoration: none;
  border-left: 4px solid transparent; transition: all .25s ease;
}
.psb-item:hover, .psb-item.psb-aktif {
  background: #E8F0F8; border-left-color: #FFD100; color: #00529B; font-weight: 600; padding-left: 24px;
}
.psb-ico { width: 20px; text-align: center; font-size: 15px; transition: transform .25s; }
.psb-item:hover .psb-ico { transform: scale(1.15); }
.psb-group { padding: 12px 20px 6px; font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; color: #94a3b8; text-transform: uppercase; }
.psb-footer {
  padding: 12px 18px; border-top: 1px solid #e2e8f0; font-size: 11px; color: #64748b;
  display: flex; justify-content: space-between; align-items: center; background: #f8fafc;
}
.psb-logout {
  color: #dc2626; cursor: pointer; font-weight: 600; text-decoration: none; font-size: 12px;
}
.psb-logout:hover { text-decoration: underline; }
.psb-user { font-weight: 600; color: #00529B; }
