.sidebar{overflow:hidden}.navbar-actions{gap:14px}.navbar-actions form{margin:0}.profile{padding-left:12px;max-width:220px}.profile>span:last-child{overflow-wrap:anywhere}.feedback{margin-bottom:20px;padding:16px 20px;border-radius:10px;border:1px solid var(--border);line-height:1.6}.feedback-error{background:#fff1ed;color:#8a3025}.feedback-success{background:var(--soft);color:var(--primary)}.module-card{padding:24px;margin-bottom:24px}.module-card h2{margin-bottom:10px}.module-card>p{color:var(--muted);margin-bottom:18px}.module-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.stack-form{display:grid;gap:18px}.stack-form label{display:grid;gap:7px;font-weight:600}.stack-form input,.stack-form select,.stack-form textarea,.search-form input,.search-form select{width:100%;min-width:0;padding:11px 12px;border:1px solid var(--border);border-radius:7px;background:var(--white);color:var(--text);font:inherit}.stack-form textarea{min-height:86px;resize:vertical}.stack-form small{font-weight:400;line-height:1.5}.form-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.search-form{display:flex;gap:12px;flex-wrap:wrap;padding:20px 24px;align-items:end}.search-form label{display:grid;gap:6px;flex:1;min-width:150px;font-size:calc(12px * var(--font-scale, 1))}.search-form .button{flex-shrink:0}.unit-checks{display:grid;gap:10px;max-height:340px;overflow:auto;padding:15px;border:1px solid var(--border);border-radius:8px}.unit-checks label{display:flex;gap:10px;align-items:start;font-weight:400}.unit-checks input{width:auto;margin-top:3px}.unit-checks small{margin-top:3px}.module-tabs{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap}.module-tabs a{padding:10px 16px;border:1px solid var(--border);border-radius:8px}.module-tabs a[aria-current="page"]{background:var(--soft);color:var(--primary);border-color:var(--primary)}.row-links{display:flex;gap:14px;white-space:nowrap}.row-links a{text-decoration:underline;color:var(--primary)}.empty-row{text-align:center;padding:32px!important;color:var(--muted)}.import-summary{margin-bottom:24px}.import-summary summary{padding:20px;cursor:pointer;line-height:1.8}.import-summary .table-wrap{max-height:380px;overflow:auto}.auth-page{display:grid;place-items:center;min-height:100vh;padding:24px;background:linear-gradient(145deg,var(--soft),var(--background))}.auth-card{width:100%;max-width:430px;background:var(--white);padding:36px;border:1px solid var(--border);border-radius:18px;box-shadow:0 20px 60px #153f3510}.auth-card h1{font-size:calc(28px * var(--font-scale, 1));margin:20px 0 8px}.auth-card>p{color:var(--muted);margin-bottom:26px}.auth-card .brand{color:var(--primary);font-size:calc(23px * var(--font-scale, 1))}.auth-card .brand-symbol{background:var(--soft);color:var(--primary);border-color:var(--border)}.auth-card .button{justify-content:center}.auth-footer{margin-top:24px;text-align:center;line-height:1.7}.danger-zone{border-left:3px solid #b34b3c}.unit-list{margin:24px 0}.module-card details>summary{cursor:pointer;font-weight:600;margin-bottom:18px}.module-grid>.module-card{min-width:0}.module-card .table-wrap table{min-width:420px}.account-form{max-width:800px}.stack-form fieldset{border:0;padding:0;margin:0;min-width:0}.stack-form legend{font-weight:600;margin-bottom:10px}
@media(max-width:1000px){.module-grid{grid-template-columns:1fr}.navbar-actions .profile{display:none}.navbar-actions{gap:8px}.module-card{padding:20px}.sidebar-note{margin-top:24px}}
@media(max-width:600px){.module-card{padding:18px}.search-form{padding:16px}.auth-card{padding:26px}.navbar-actions .button{padding:8px}.search-form label{flex-basis:100%}.row-links{gap:10px}}
:root[data-mode="dark"] .feedback-error{background:#44241e;color:#ffb5a5}
.auth-page>#toolbarContainer{position:fixed}
.swal2-popup.sijf-notification{font:inherit;background:var(--white);color:var(--text);border:1px solid var(--border);border-radius:16px}.sijf-notification .swal2-title{font-size:calc(24px * var(--font-scale, 1));color:var(--text);letter-spacing:0}.sijf-notification .swal2-html-container{font-size:calc(14px * var(--font-scale, 1));line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}.sijf-notification .swal2-actions{gap:12px}.sijf-notification .swal2-validation-message{background:var(--soft);color:var(--text)}.swal2-container{z-index:2100}.swal2-container .button{margin:0}.swal2-container .swal2-timer-progress-bar{background:var(--primary)}
/* Form ubah akun dalam dialog, termasuk layar kecil dan daftar unit panjang. */
.account-edit-modal{width:min(760px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow-y:auto}
.account-edit-modal .modal-header{align-items:flex-start}
.account-edit-modal .modal-header p{font-size:calc(12px * var(--font-scale, 1));margin-top:8px}
.account-edit-modal .stack-form>label{align-content:start}
.account-edit-modal .unit-checks{max-height:260px;overflow-y:auto}
@media(min-width:600px){.account-edit-modal .stack-form{grid-template-columns:repeat(2,minmax(0,1fr))}.account-edit-modal .stack-form>label:nth-of-type(5),.account-edit-modal .stack-form>fieldset,.account-edit-modal .stack-form>.notice,.account-edit-modal .stack-form>.form-actions{grid-column:1/-1}}
/* Kontrol header dan menu akun. */
.navbar{min-height:82px;height:auto;padding-top:12px;padding-bottom:12px;gap:16px}
.navbar-actions{flex-shrink:0;gap:10px}
.header-dropdown{position:relative}
.header-dropdown>summary{list-style:none;cursor:pointer}
.header-dropdown>summary::-webkit-details-marker{display:none}
.header-tool{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid var(--border);border-radius:10px;background:var(--white);color:var(--text);font:inherit;font-weight:600;cursor:pointer}
.header-tool:hover,.account-trigger:hover{background:var(--soft)}
.header-tool:focus-visible,.account-trigger:focus-visible,.font-reset:focus-visible,.logout-button:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.header-tool:disabled{opacity:.4;cursor:default}
.header-panel{position:absolute;right:0;top:calc(100% + 12px);z-index:50;padding:16px;min-width:210px;background:var(--white);color:var(--text);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 24px #00000014}
.header-dropdown:not([open])>.header-panel{display:none}
.font-panel>strong{display:block;font-size:calc(13px * var(--font-scale, 1));margin-bottom:12px}
.font-controls{display:flex;align-items:center;justify-content:space-between;gap:12px}
.font-reset{border:0;background:transparent;color:var(--text);font:inherit;cursor:pointer;padding:8px}
.navbar-actions .account-trigger{display:flex;max-width:280px;padding:4px 8px 4px 14px;border-radius:10px;min-height:44px}
.account-label{min-width:0;overflow-wrap:anywhere}
.account-chevron{margin-left:4px;color:var(--muted)}
.account-dropdown[open] .account-chevron{transform:rotate(180deg)}
.account-panel{min-width:180px;padding:8px}
.logout-button{display:flex;align-items:center;gap:10px;width:100%;padding:12px;border:0;border-radius:8px;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.logout-button:hover{background:var(--soft)}
@media(max-width:700px){.navbar{min-height:72px;gap:8px}.navbar-actions{gap:6px}.account-trigger{padding:4px;border-left:0}.account-trigger>.account-label{display:none}.account-trigger>.account-chevron{display:block}.header-tool{width:36px;height:36px}.breadcrumb{min-width:0;overflow-wrap:anywhere}.header-panel{max-width:calc(100vw - 32px)}}

.account-trigger>.avatar{flex-shrink:0}
.jabatan-filters{display:flex;gap:16px;padding:0 24px 16px;flex-wrap:wrap}.jabatan-filters label{display:grid;gap:6px;min-width:180px}.jabatan-source{margin:12px 24px 24px;padding-top:16px;border-top:1px solid var(--border);font-size:calc(12px * var(--font-scale,1));color:var(--muted);line-height:1.7}.jabatan-modal{width:min(700px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow-y:auto}.jabatan-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.jabatan-levels{border:1px solid var(--border);border-radius:10px;padding:12px 16px;margin:0}.jabatan-levels legend{padding:0 6px}.jabatan-levels>div{display:grid;grid-template-columns:1fr 1fr;gap:12px}.jabatan-levels>div[hidden]{display:none}.jabatan-levels label{display:flex;align-items:center;gap:8px}.jabatan-levels input{width:18px;height:18px;margin:0;accent-color:var(--primary)}#jabatan-error[hidden],#jabatan-review-note[hidden],#jabatan-source-link[hidden]{display:none}@media(max-width:600px){.jabatan-form-grid,.jabatan-levels>div{grid-template-columns:1fr}.jabatan-filters{padding:0 16px 16px}.jabatan-filters label{flex:1}.jabatan-source{margin:12px 16px 20px}}
.jabatan-modal .stack-form{gap:12px}.jabatan-modal .form-actions{position:sticky;bottom:-28px;margin:0 -28px -28px;padding:16px 28px;background:var(--white);border-top:1px solid var(--border);z-index:1}.jabatan-source a{text-decoration:underline;text-underline-offset:3px}@media(max-width:760px){.jabatan-modal .form-actions{bottom:-20px;margin:0 -20px -20px;padding:16px 20px}}

.unit-head-fields{border:1px solid var(--border);border-radius:10px;padding:18px;display:grid;gap:16px;min-width:0}.unit-head-fields legend{padding:0 6px;font-weight:600}
.brand-logo{display:block;width:48px;height:48px;padding:5px;object-fit:contain;flex-shrink:0;background:#fff;border:1px solid #ffffff40;border-radius:12px}.sidebar>.brand{gap:12px}.mobile-brand .brand-logo{padding:3px}
.mobile-brand{display:none}
@media(max-width:760px){.navbar>.breadcrumb{display:none}.mobile-brand{display:flex;align-items:center;gap:8px;flex:1;min-width:0;font-size:calc(18px * var(--font-scale,1));font-weight:700;color:var(--primary);letter-spacing:.5px}.mobile-brand .brand-logo{width:32px;height:32px;border-radius:6px}.mobile-brand>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.navbar>.mobile-toggle{flex-shrink:0}}
.sidebar>.brand,.sidebar>.workspace-label,.sidebar>.workspace-name,.sidebar>.nav-label,.sidebar>.sidebar-note{flex-shrink:0}
.sidebar .workspace-label{margin-top:22px}.sidebar .workspace-name{margin-bottom:18px}
.sidebar .nav-label{padding-top:14px;padding-bottom:8px}
.sidebar-nav{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--sidebar-muted) transparent;padding:0 5px 4px 0}
.sidebar-nav .nav-item{padding:10px 12px;margin:4px 0;border:1px solid transparent}
.sidebar-nav .nav-item.active{background:#ffffff24;border-color:var(--accent);box-shadow:inset 4px 0 var(--accent);font-weight:700}
.sidebar-nav a:hover{background:#ffffff15}
.sidebar .sidebar-note{margin-top:12px;padding-top:12px}
@media(max-height:650px){.sidebar{padding-top:16px;padding-bottom:16px}.sidebar .workspace-label{margin-top:12px}.sidebar .workspace-name{margin-bottom:10px}.sidebar .sidebar-note small{display:none}}

/* Modal pengumuman hanya menampilkan judul, isi, dan tombol pengakuan. */
.pengumuman-modal.swal2-popup{width:560px;max-width:calc(100vw - 32px);padding:28px 24px;border-radius:16px}.pengumuman-modal .swal2-title{padding:0;text-align:left;font-size:calc(22px * var(--font-scale,1));line-height:1.4;overflow-wrap:anywhere}.pengumuman-modal .swal2-html-container{margin:18px 0 0;text-align:left;max-height:55vh;overflow-y:auto;white-space:pre-wrap}.pengumuman-modal .swal2-actions{margin:24px 0 0;justify-content:flex-end;width:100%}
@media(max-width:760px){.pengumuman-modal.swal2-popup{padding:22px 20px}.pengumuman-modal .swal2-title{font-size:calc(19px * var(--font-scale,1))}}
.pengumuman-modal .swal2-html-container{padding:0}
.unit-checks [data-unit-option][hidden], .unit-checks [data-unit-no-results][hidden] { display:none; } .unit-search-summary { margin:12px 0; color:var(--muted); font-size:calc(12px * var(--font-scale, 1)); }

.auth-card > .login-lock-danger {
    padding: 14px 16px;
    margin: 0 0 20px;
    border: 1px solid #f87171;
    border-left: 4px solid #b91c1c;
    border-radius: 10px;
    background: #fef2f2;
    color: #991b1b;
    line-height: 1.6;
}
.login-lock-danger strong { color: inherit; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.login-lock-danger[hidden] { display: none; }

.auth-page.auth-login-page {
    background-color: #18352d;
    background-image: linear-gradient(rgba(12, 30, 25, .48), rgba(12, 30, 25, .48)), url('../../images/logo/bg-tepas-bkpsdm.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
