/* One e-Staf sidebar theme across personal, management and administration views. */
#sidebar.module-sidebar--estaf {
    background: linear-gradient(180deg, #21113f 0%, #3d2475 48%, #27164e 100%);
    color: #f4efff;
    animation: none;
}
#sidebar.module-sidebar--estaf .module-sidebar-head { position: relative; z-index: 30; overflow: visible; }
#sidebar.module-sidebar--estaf .module-back { color: #d9cdef; }
#sidebar.module-sidebar--estaf .module-identity-icon { background: #f5efff; color: #7842ff; }
#sidebar.module-sidebar--estaf .module-identity strong { color: #fff; }
#sidebar.module-sidebar--estaf .module-identity small { color: #d5c6ee; }
#sidebar.module-sidebar--estaf .sidebar-link,
#sidebar.module-sidebar--estaf .sidebar-submenu a,
#sidebar.module-sidebar--estaf .module-utility-link { color: #f0e9ff; }
#sidebar.module-sidebar--estaf .sidebar-link:hover,
#sidebar.module-sidebar--estaf .sidebar-submenu a:hover,
#sidebar.module-sidebar--estaf .module-utility-link:hover { background: #ffffff12; }
#sidebar.module-sidebar--estaf .sidebar-link.is-active,
#sidebar.module-sidebar--estaf .sidebar-submenu a.is-active,
#sidebar.module-sidebar--estaf .module-utility-link.is-active {
    background: linear-gradient(110deg, #ffdf53, #f8bf32);
    color: #241044;
    border-color: transparent;
    box-shadow: 0 7px 18px #f5b82e22;
}
#sidebar.module-sidebar--estaf .sidebar-submenu a::before { background: #b7a0df; }
#sidebar.module-sidebar--estaf .sidebar-submenu a.is-active::before { background: #482777; }
#sidebar.module-sidebar--estaf .sidebar-section-title { color: #c5b2e8; }
#sidebar.module-sidebar--estaf .espak-current-context { background: #ffffff14; border-color: #ffffff26; }
#sidebar.module-sidebar--estaf .espak-current-context small { color: #fff; }
#sidebar.module-sidebar--estaf .espak-current-context strong { color: #ffdc53; }
#sidebar.module-sidebar--estaf .espak-current-context span { color: #dbceef; font-size: .65rem; overflow-wrap: anywhere; }
#sidebar.module-sidebar--estaf .estaf-role-switcher { --role-menu-bg: #321b60; }
#sidebar.module-sidebar--estaf .estaf-role-switcher[open] > summary,
#sidebar.module-sidebar--estaf .estaf-role-switcher > summary:hover,
#sidebar.module-sidebar--estaf .estaf-role-switcher-menu button:hover,
#sidebar.module-sidebar--estaf .estaf-role-switcher-menu button:disabled { background: #ffda48; color: #261146; }
#sidebar.module-sidebar--estaf .estaf-role-switcher-menu button:hover small,
#sidebar.module-sidebar--estaf .estaf-role-switcher-menu button:disabled small { color: #4c346c; }
#sidebar.module-sidebar--estaf .estaf-role-switcher-menu { width: min(265px, calc(100vw - 48px)); max-height: min(440px, 55dvh); overflow-y: auto; }
#sidebar.module-sidebar--estaf .module-sidebar-foot { margin-top: auto; }
#sidebar.module-sidebar--estaf .sidebar-global-logout { border-top: 1px solid #ffffff26; }
#sidebar.module-sidebar--estaf .sidebar-logout { color: #ff5265; }
#sidebar.module-sidebar--estaf :is(a, button, summary):focus-visible { outline: 2px solid #ffdc53; outline-offset: 2px; }

.estaf-sidebar-selector{margin-top:12px}.estaf-sidebar-selector label{display:block;font-size:.72rem;font-weight:700;color:#fff;margin-bottom:7px}.estaf-sidebar-selector>div{display:flex;gap:6px}.estaf-sidebar-selector select{min-width:0;width:100%;color:#ffdc53;background:#392460;border:1px solid #ffffff30;border-radius:10px;padding:12px 8px;font-size:.78rem}.estaf-sidebar-selector button{color:#ffdc53;background:#ffffff14;border:1px solid #ffffff30;border-radius:10px;min-width:40px}.estaf-context-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:12px;font-size:.78rem}.estaf-context-breadcrumb form{display:inline;margin:0}.estaf-context-breadcrumb button{border:0;background:none;padding:0;color:#65469b}.estaf-organisation-card button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:16px;border:1px solid #e5def3;border-radius:10px;background:#faf8ff;color:#42276e;text-align:left;margin-bottom:10px}.estaf-list-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;margin-right:8px}

/* Peranan / Paparan switcher: Paparan = yellow, Peranan = amber-orange */
#sidebar.module-sidebar--estaf .estaf-switch{--view:#ffdc53;--view-ink:#261146;--role:#ffab5c;--role-ink:#2b1300}
#sidebar.module-sidebar--estaf .estaf-switch-current{min-height:56px;align-content:center;gap:5px}
#sidebar.module-sidebar--estaf .estaf-switch-current strong{display:block;font-size:.92rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sidebar.module-sidebar--estaf .estaf-switch.is-view .estaf-switch-current{border-color:#ffdc5340;background:linear-gradient(135deg,#ffdc531c,#ffffff0d)}
#sidebar.module-sidebar--estaf .estaf-switch.is-view .estaf-switch-current strong{color:var(--view)}
#sidebar.module-sidebar--estaf .estaf-switch.is-role .estaf-switch-current{border-color:#ffab5c55;background:linear-gradient(135deg,#ffab5c24,#ffffff0d)}
#sidebar.module-sidebar--estaf .estaf-switch.is-role .estaf-switch-current strong{color:var(--role)}
#sidebar.module-sidebar--estaf .estaf-switch-chip{justify-self:start;display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;background:#ffab5c26;border:1px solid #ffab5c4d;color:#ffd0a3;font-size:.62rem;font-weight:700;letter-spacing:.02em}
#sidebar.module-sidebar--estaf .estaf-switch-chip i{font-size:.66rem}
#sidebar.module-sidebar--estaf .estaf-switch.is-role .estaf-switch-toggle>summary{border-color:#ffab5c55}
#sidebar.module-sidebar--estaf .estaf-switch.is-role .estaf-switch-toggle[open]>summary,#sidebar.module-sidebar--estaf .estaf-switch.is-role .estaf-switch-toggle>summary:hover{background:var(--role);color:var(--role-ink)}
#sidebar.module-sidebar--estaf .estaf-switch-menu{width:min(290px,calc(100vw - 48px));max-height:min(520px,65dvh);padding:6px}
#sidebar.module-sidebar--estaf .estaf-switch-section{padding:4px 2px 6px}
#sidebar.module-sidebar--estaf .estaf-switch-section+.estaf-switch-section{margin-top:4px;border-top:1px solid #ffffff1f;padding-top:8px}
#sidebar.module-sidebar--estaf .estaf-switch-section>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 8px 7px;border:0}
#sidebar.module-sidebar--estaf .estaf-switch-section>header strong{display:inline-flex;align-items:center;gap:6px;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}
#sidebar.module-sidebar--estaf .estaf-switch-section>header strong::before{content:"";width:8px;height:8px;border-radius:3px}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role>header strong{color:var(--role)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role>header strong::before{background:var(--role)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view>header strong{color:var(--view)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view>header strong::before{background:var(--view)}
#sidebar.module-sidebar--estaf .estaf-switch-section>header small{color:#cbbde5;font-size:.6rem}
#sidebar.module-sidebar--estaf .estaf-switch-menu a{display:grid;grid-template-columns:20px 1fr;align-items:center;gap:8px;width:100%;padding:8px 9px;border-radius:9px;color:#fff;text-decoration:none;margin-top:2px}
#sidebar.module-sidebar--estaf .estaf-switch-menu a>i{font-size:.85rem}
#sidebar.module-sidebar--estaf .estaf-switch-menu a strong{display:block;font-size:.7rem;font-weight:700;line-height:1.3}
#sidebar.module-sidebar--estaf .estaf-switch-menu :is(a,button) small{display:block;font-size:.58rem;color:#cbbde5}
/* Role items: amber */
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role button:hover{background:#ffab5c24;color:#fff}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role button:disabled{background:var(--role);color:var(--role-ink)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role button>i{color:var(--role)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-role button:disabled>i{color:var(--role-ink)}
/* View items: yellow */
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view :is(a,button):hover{background:#ffdc5324;color:#fff}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view :is(a.is-current,button:disabled){background:var(--view);color:var(--view-ink)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view :is(a.is-current,button:disabled) small{color:#4c346c}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view :is(a,button)>i{color:var(--view)}
#sidebar.module-sidebar--estaf .estaf-switch-section.is-view :is(a.is-current,button:disabled)>i{color:var(--view-ink)}
#sidebar.module-sidebar--estaf .estaf-switch-group{margin-top:6px}
#sidebar.module-sidebar--estaf .estaf-switch-group>small{display:block;padding:6px 9px 2px;color:#b7a0df;font-size:.58rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
#sidebar.module-sidebar--estaf .estaf-switch-search{display:flex;align-items:center;gap:7px;margin:0 4px 6px;padding:0 9px;height:32px;border-radius:9px;background:#ffffff14;border:1px solid #ffffff24;color:#cbbde5}
#sidebar.module-sidebar--estaf .estaf-switch-search input{flex:1;min-width:0;border:0;background:transparent;color:#fff;font-size:.7rem;outline:0}
#sidebar.module-sidebar--estaf .estaf-switch-search input::placeholder{color:#b7a0df}

/* Paparan pages: breadcrumb + back to Paparan Saya */
.estaf-scope-crumbs{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 18px}
.estaf-scope-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:6px;list-style:none;margin:0;padding:0;font-size:.82rem}
.estaf-scope-crumbs li+li::before{content:"\203A";margin-right:6px;color:#94a3b8}
.estaf-scope-crumbs a{color:#2563eb;text-decoration:none}.estaf-scope-crumbs li:last-child{color:#172b4d;font-weight:600}
.estaf-scope-back{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;background:#fff8db;border:1px solid #f4dd8b;color:#6b4e00;font-size:.8rem;font-weight:700;text-decoration:none}
.estaf-scope-back:hover{background:#ffefb0;color:#4d3800}
#sidebar.module-sidebar--estaf .estaf-switch .estaf-switch-toggle{position:static}
#sidebar.module-sidebar--estaf .estaf-switch .estaf-switch-menu{left:0;right:0;width:auto;z-index:1060}
#sidebar.module-sidebar--estaf .estaf-switch{z-index:30}
#sidebar.module-sidebar--estaf .estaf-switch-current strong{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}