/* SIJALU 021 — Premium Comfort Workspace. Scoped to app; printed reports stay white. */
body.sijalu-app{
 --si21-bg:#0c1628;--si21-bg2:#101e32;--si21-panel:#17283d;--si21-panel2:#1c3149;
 --si21-panel3:#203850;--si21-line:#31465d;--si21-text:#e8f1f7;--si21-dim:#abc0d0;
 --si21-muted:#8ea6ba;--si21-mint:#65dfce;--si21-gold:#f0c27a;--si21-blue:#84b9fb;
 --si21-shadow:0 18px 48px #040c1a45;
 background:radial-gradient(ellipse at 80% -18%,#1b3850 0,transparent 45%),linear-gradient(180deg,#101e32,#0c1526 68%)!important;
 color:var(--si21-text);color-scheme:dark;
}
body.sijalu-app .main{background:transparent!important;min-width:0}
body.sijalu-app .content{color:var(--si21-text)}
body.sijalu-app .sidebar{background:linear-gradient(180deg,#0e1c31 0%,#142840 66%,#0d1d30 100%)!important;border-right:1px solid #39526b80}
body.sijalu-app .topbar{background:#12243bF5!important;border-bottom:1px solid #2e475e!important;backdrop-filter:blur(16px);box-shadow:0 8px 22px #040d1c28}
body.sijalu-app .topbar strong,body.sijalu-app .si-topbar-heading strong{color:#edf7fa!important}
body.sijalu-app .topbar small,body.sijalu-app .si-topbar-heading small,body.sijalu-app .si-topbar-date{color:#9eb6c7!important}
body.sijalu-app .page-heading h1{color:#eff7fb!important;letter-spacing:-.035em}
body.sijalu-app .page-heading p{color:#a5bacb!important}
body.sijalu-app .panel,body.sijalu-app .stat,body.sijalu-app .wp-card,
body.sijalu-app .wp-kpi,body.sijalu-app .insight-kpi,body.sijalu-app .live-metric,
body.sijalu-app .wp-attention-item,body.sijalu-app .si-cms-media-card{
 background:linear-gradient(148deg,#1b3149 0%,#15273b 94%)!important;
 color:#e5eff5!important;border:1px solid var(--si21-line)!important;
 box-shadow:var(--si21-shadow);border-radius:18px;
}
body.sijalu-app .panel:nth-of-type(3n),body.sijalu-app .wp-card:nth-of-type(2n){background:linear-gradient(148deg,#1d334a,#19293f)!important}
body.sijalu-app .panel h2,body.sijalu-app .panel h3,body.sijalu-app .panel h4,
body.sijalu-app .panel-title,body.sijalu-app .stat strong,body.sijalu-app .wp-card-heading h3,
body.sijalu-app .wp-kpi strong,body.sijalu-app .insight-kpi strong,
body.sijalu-app .wp-section-title h3,body.sijalu-app .wp-attention-item strong,
body.sijalu-app .wp-action strong,body.sijalu-app .wp-attendance-legend strong,
body.sijalu-app .wp-realization-main>strong,body.sijalu-app .wp-teacher-status{
 color:#f0f7fc!important;
}
body.sijalu-app .hint,body.sijalu-app .muted,body.sijalu-app .stat-label,
body.sijalu-app .stat small,body.sijalu-app .wp-kpi-top,body.sijalu-app .wp-kpi small,
body.sijalu-app .wp-metric-footnote,body.sijalu-app .wp-chart-note,
body.sijalu-app .wp-attention-item small,body.sijalu-app .wp-section-aside,
body.sijalu-app .wp-attendance-legend span,body.sijalu-app .wp-card p,
body.sijalu-app .wp-action small,body.sijalu-app .wp-bar-day,body.sijalu-app .wp-bar-count{
 color:#b0c3d1!important;
}
body.sijalu-app .section-label,body.sijalu-app .wp-section-kicker{color:var(--si21-mint)!important}
body.sijalu-app .wp-exec-hero,body.sijalu-app .wp-launch-hero{background:linear-gradient(120deg,#163b52,#17364f 42%,#144b5c)!important;border:1px solid #4a7b87!important}
body.sijalu-app .wp-launch-toolbar h3,body.sijalu-app .wp-launch-recent h3{color:#e6f4fa!important}
body.sijalu-app .wp-module-card{background:linear-gradient(145deg,#1c334d,#172a40)!important;border:1px solid #35536b!important;box-shadow:0 13px 36px #06101f3a}
body.sijalu-app .wp-module-card:hover{border-color:#59d7c9!important;background:linear-gradient(145deg,#23435b,#1c3149)!important}
body.sijalu-app .wp-module-copy strong{color:#eff7fa!important}
body.sijalu-app .wp-module-copy small,body.sijalu-app .wp-launch-toolbar p{color:#a6bece!important}
body.sijalu-app .wp-module-icon{background:#244d62!important;color:#94f2da!important}
body.sijalu-app a:not(.btn):not(.wp-stage):not(.wp-subtab):not(.wp-main-link):not(.wp-module-card):not(.wp-module-option){color:#83d8e5}
body.sijalu-app a:not(.btn):hover{text-decoration:none}
/* Inputs and table contrast */
body.sijalu-app .field,body.sijalu-app label.field,body.sijalu-app label{color:#c4d5e2}
body.sijalu-app input:not([type=checkbox]):not([type=radio]),body.sijalu-app textarea,
body.sijalu-app select,body.sijalu-app .field input,body.sijalu-app .field select,
body.sijalu-app .field textarea{
 background:#101f33!important;color:#eff7fc!important;border:1px solid #496179!important;
 border-radius:10px!important;box-shadow:inset 0 1px 4px #0612202a;min-height:39px;
}
body.sijalu-app input::placeholder,body.sijalu-app textarea::placeholder{color:#8fa5b9}
body.sijalu-app input:focus,body.sijalu-app textarea:focus,body.sijalu-app select:focus{
 border-color:#63d7c8!important;outline:2px solid #63d7c852!important;outline-offset:0;
}
body.sijalu-app input[type=checkbox],body.sijalu-app input[type=radio]{accent-color:#4bc8bf;cursor:pointer}
body.sijalu-app table{color:#d5e7ef}
body.sijalu-app thead th{background:#21364b!important;color:#e4f2f9!important;border-bottom:1px solid #48667b!important}
body.sijalu-app td,body.sijalu-app th{border-bottom:1px solid #33485e!important}
body.sijalu-app tbody tr:hover{background:#243d54!important}
body.sijalu-app tbody tr:nth-child(even){background:#1a2b40a3}
body.sijalu-app tbody tr:nth-child(even):hover{background:#243d54!important}
body.sijalu-app .table-scroll{border:1px solid #324960;border-radius:12px;scrollbar-color:#4d7183 #162637}
/* Informational surfaces */
body.sijalu-app .alert{background:#133e38!important;color:#c8f9e8!important;border-color:#28796b!important}
body.sijalu-app .alert.err{background:#462530!important;color:#ffd5dc!important;border-color:#8c4b57!important}
body.sijalu-app .pill{background:#234968!important;color:#d6ebff!important}
body.sijalu-app .pill.ok{background:#1b5749!important;color:#aff3d7!important}
body.sijalu-app .pill.warn{background:#564027!important;color:#ffe4ac!important}
body.sijalu-app .pill.bad{background:#62313a!important;color:#ffced0!important}
body.sijalu-app .kpi-note{background:#1f394c!important;color:#d1e4f3!important}
body.sijalu-app .wp-attention-item{box-shadow:none!important;border-radius:12px!important}
body.sijalu-app .wp-realization-track,body.sijalu-app .wp-attendance-bar,
body.sijalu-app .wp-bar-track{background:#263d53!important}
body.sijalu-app .wp-action{color:#d2e6ee!important;border-bottom-color:#334b61!important}
body.sijalu-app .wp-action-icon,body.sijalu-app .wp-kpi-symbol{background:#234c60!important;color:#76e5cf!important}
/* Product button system: distinctive, tactile, not excessively bright. */
body.sijalu-app .btn,body.sijalu-app button.btn{
 border:1px solid #526b82!important;background:linear-gradient(160deg,#2b4660,#1e344c)!important;
 color:#eff7fb!important;border-radius:10px!important;padding:9px 15px;
 min-height:38px;font-weight:760;letter-spacing:.008em;
 box-shadow:0 4px 11px #04112230;transition:background .18s,transform .18s,border-color .18s,box-shadow .18s;
}
body.sijalu-app .btn:hover{transform:translateY(-1px);background:linear-gradient(160deg,#355875,#29455d)!important;border-color:#74a3b6!important;box-shadow:0 8px 15px #04112252}
body.sijalu-app .btn.primary,body.sijalu-app button.btn.primary,
body.sijalu-app .btn[type=submit]:not(.soft):not(.danger){
 background:linear-gradient(112deg,#1b8e85,#1a9db1)!important;color:#f9ffff!important;
 border-color:#50c7c6!important;box-shadow:0 9px 20px #07838b3d;
}
body.sijalu-app .btn.primary:hover{background:linear-gradient(112deg,#1aa59a,#1ab0bb)!important;box-shadow:0 11px 23px #109ca04e}
body.sijalu-app .btn.soft{background:#213c53!important;color:#baf3ef!important;border-color:#456678!important}
body.sijalu-app .btn.danger{background:#492d39!important;color:#ffd1d9!important;border-color:#88505d!important}
body.sijalu-app .btn.danger:hover{background:#63313e!important}
body.sijalu-app .btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
body.sijalu-app .btn.small{min-height:30px;padding:5px 10px;border-radius:8px!important}
body.sijalu-app .mini-form{display:inline-flex}
body.sijalu-app .si-cms-tabs{flex-wrap:wrap;gap:8px}
body.sijalu-app .si-cms-tabs .btn.primary{outline:2px solid var(--si21-mint);outline-offset:2px}
/* Active stages are intentionally very prominent, with double signaling. */
body.sijalu-app .wp-flow{background:linear-gradient(145deg,#192d43,#13283b)!important;border:1px solid #38536c!important;box-shadow:0 18px 40px #06102030}
body.sijalu-app .wp-flow-bread,body.sijalu-app .wp-flow-bread strong{color:#d7e9f4!important}
body.sijalu-app .wp-stage{background:#172e44!important;border:1px solid #43617b!important;color:#b4d0e0!important;position:relative;min-height:49px}
body.sijalu-app .wp-stage:hover{border-color:#72b8c4!important;background:#24475c!important}
body.sijalu-app .wp-stage.active{
 background:linear-gradient(110deg,#0e8f8b,#14758b)!important;color:#fff!important;
 border:2px solid #8cf6e6!important;box-shadow:0 0 0 3px #2fb4bb28,0 10px 24px #00bfb83b!important;
}
body.sijalu-app .wp-stage.active::after{content:"";position:absolute;left:13px;right:13px;bottom:3px;height:3px;border-radius:6px;background:var(--si21-gold)}
body.sijalu-app .wp-stage.active .wp-stage-number{color:#f7df9d!important}
body.sijalu-app .wp-subtabs{border-top:1px solid #365166!important}
body.sijalu-app .wp-subtab{background:#23374b!important;border:1px solid #3c5369!important;color:#c7d8e6!important;min-height:39px}
body.sijalu-app .wp-subtab.active{
 background:linear-gradient(112deg,#296b6b,#28576b)!important;
 border:1px solid #70ead3!important;color:#fff!important;box-shadow:inset 0 -3px 0 var(--si21-gold)!important;
 font-weight:850;
}
body.sijalu-app .wp-subtab:hover{border-color:#5ccbbb!important}
/* Premium module picker; anchors are the source of truth, no native select. */
.si021-module-picker{position:relative;margin:4px 3px 14px;z-index:20}
.si021-module-picker>summary{list-style:none;display:flex;align-items:center;gap:11px;cursor:pointer;min-height:60px;
 border:1px solid #5f8697;border-radius:14px;padding:9px 11px;background:linear-gradient(127deg,#29445d,#20334f);color:#eef8ff;
 box-shadow:inset 0 1px 0 #ffffff12,0 10px 22px #030e1f40;transition:border .18s,background .18s}
.si021-module-picker>summary::-webkit-details-marker{display:none}
.si021-module-picker>summary:hover,.si021-module-picker[open]>summary{border-color:#6ee4d4;background:#2b5066}
.si021-switch-glyph,.si021-option-icon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:#15525b;color:#86f6dc}
.si021-switch-glyph svg,.si021-option-icon svg{width:19px;height:19px}
.si021-switch-label{display:grid;flex:1;min-width:0;gap:3px}
.si021-switch-label small{font-size:9px;letter-spacing:.14em;color:#a9c7d4;font-weight:800}
.si021-switch-label strong{font-size:12px;color:#fff;white-space:normal;line-height:1.35}
.si021-switch-chevron{margin-left:auto;color:#d2e8f0;font-size:23px;transition:transform .2s}
.si021-module-picker[open] .si021-switch-chevron{transform:rotate(180deg)}
.si021-module-panel{position:absolute;left:0;right:0;top:calc(100% + 7px);background:#182c43;border:1px solid #5e8193;
 border-radius:14px;box-shadow:0 24px 38px #030b1de0;padding:9px;z-index:55;max-height:min(440px,65vh);overflow:auto}
.si021-module-find input{width:100%;min-height:38px;background:#0e1e34;color:#f0f8ff;border:1px solid #547189;border-radius:9px;padding:9px 11px;font-size:12px}
.si021-module-list{display:grid;gap:3px;margin-top:8px}
.si021-module-option{display:flex;align-items:center;gap:10px;padding:9px;border-radius:10px;text-decoration:none;color:#e0edf5;border:1px solid transparent;transition:background .18s}
.si021-module-option:hover{background:#29475e;border-color:#548b99;text-decoration:none}
.si021-module-option.is-current{background:#174d52;border-color:#52bcae;color:#fff}
.si021-module-option>span:nth-child(2){min-width:0;display:grid;gap:2px;flex:1}
.si021-module-option strong{font-size:12px;color:#f8fbff;line-height:1.35}
.si021-module-option small{font-size:10px;color:#acc7d7}
.si021-option-check{font-size:17px;color:#88f3d5}
.si021-module-empty{font-size:12px;color:#bfd3df;padding:9px}
.si021-module-picker:focus-within>summary{outline:2px solid #68ded0;outline-offset:2px}
/* Safe operational workflow: compact wizard, no form until user asks for it. */
.si021-workflow .si021-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}
.si021-eyebrow{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#76ead7;font-weight:860;margin-bottom:6px}
.si021-action-header{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:18px 0}
.si021-stepbar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:18px;padding:12px;background:#11273a;border:1px solid #3a6470;border-radius:12px}
.si021-stepbar span{color:#bceadd;font-size:11px;font-weight:740}
.si021-edit-form{padding:18px;border-radius:15px;background:#11283d;border:1px solid #4e7986;margin:17px 0 21px;box-shadow:0 10px 28px #030b1938}
.si021-js .si021-edit-form:not(.is-open){display:none}
.si021-mode{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.si021-mode label{display:flex;align-items:center;gap:7px;cursor:pointer;border:1px solid #45677a;border-radius:10px;padding:10px 14px;background:#1c374b;font-weight:750;font-size:12px;transition:background .2s}
.si021-mode label:has(input:checked){border-color:#6de0cc;background:#205759;color:#f4fffd;box-shadow:inset 0 -2px 0 #e2bb78}
.si021-selection-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:12px 0}
.si021-selection-actions input[type=search]{flex:1;min-width:160px;max-width:290px}
.si021-picked{margin-left:auto;color:#9ff0df;font-size:12px;font-weight:750}
.si021-preview{background:#1e394a;border:1px solid #4c7e80;color:#e0f8f2;padding:12px 14px;margin-top:16px;border-radius:11px;font-size:12px;line-height:1.7}
.si021-preview strong{color:#dffbed}
.si021-pick-table select{min-width:140px}
.si021-workflow .si021-edit-form[aria-busy=true]{opacity:.75;pointer-events:none}
/* Website CMS keeps the list at the top and edits contextually. */
.si021-js .si021-cms-editor:not(.is-open){display:none}
.si021-cms-editor{border-color:#56857f!important;scroll-margin-top:92px}
.si021-cms-list{scroll-margin-top:90px}
.si021-cms-add{margin-left:auto}
.si-cms-media-card{overflow:hidden}
/* comfortable focus and no accidental animations in report output */
body.sijalu-app :is(a,button,input,textarea,select,summary):focus-visible{outline:2px solid #79f3dd!important;outline-offset:3px}
@media(max-width:680px){.si021-module-panel{max-height:50vh}.si021-mode{display:grid;grid-template-columns:1fr}.si021-action-header{align-items:flex-start;flex-direction:column}.si021-edit-form{padding:12px}.si021-stepbar{flex-direction:column}.si021-picked{margin-left:0}}
@media print{
 body.sijalu-app{background:#fff!important;color:#111!important;color-scheme:light}
 body.sijalu-app .panel,body.sijalu-app .stat,body.sijalu-app .wp-card,body.sijalu-app .wp-kpi{background:#fff!important;color:#111!important;border-color:#bbb!important;box-shadow:none!important}
 body.sijalu-app .panel h2,body.sijalu-app .panel h3,body.sijalu-app td,body.sijalu-app th{color:#111!important}
 body.sijalu-app thead th{background:#eee!important;color:#111!important}
 .si021-module-picker,.si021-action-header,.si021-edit-form{display:none!important}
}
@media(prefers-reduced-motion:reduce){body.sijalu-app *,body.sijalu-app *::before,body.sijalu-app *::after{transition:none!important;animation:none!important}}
.si021-module-option[hidden],.si021-module-empty[hidden],.si021-single[hidden],.si021-multiselect[hidden],.si021-pick-table tr[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Secondary page templates that previously remained bright. */
body.sijalu-app .si-form-panel,body.sijalu-app .ws-card,body.sijalu-app .ws-link-card,
body.sijalu-app .si-metric,body.sijalu-app .live-card,body.sijalu-app .review-card,
body.sijalu-app .si-entry-panel,body.sijalu-app .si-ttd-box,
body.sijalu-app .upload-card{
 background:linear-gradient(147deg,#1e354a,#182c40)!important;color:#e5f0f8!important;
 border:1px solid #3d596f!important;box-shadow:0 12px 29px #06122532!important;
}
body.sijalu-app .si-form-panel h3,body.sijalu-app .ws-card strong,
body.sijalu-app .live-card h3,body.sijalu-app .si-metric strong{color:#f3f9fe!important}
body.sijalu-app .live-card.si-kategori-belum{background:#403626!important;border-color:#9b7a41!important;color:#ffe0a5!important}
body.sijalu-app .live-card.si-kategori-mengajar{background:#184137!important;border-color:#4eab8c!important;color:#cffbe7!important}
body.sijalu-app .si-user-dropdown-menu{background:#172b40!important;border:1px solid #547286!important;box-shadow:0 25px 46px #03132470!important}
body.sijalu-app .si-user-dropdown-menu a,body.sijalu-app .si-user-dropdown-menu button{color:#d9edf6!important}
body.sijalu-app .si-user-dropdown-menu a:hover,body.sijalu-app .si-user-dropdown-menu button:hover{background:#29465d!important}
body.sijalu-app .si-dropdown-greeting{color:#fff!important;border-bottom-color:#3d576e!important}
body.sijalu-app .si-dropdown-greeting small{color:#afc4d6!important}
body.sijalu-app .si-user-meta small{background:#234358!important;color:#cae1ed!important}
body.sijalu-app .si-user-dropdown>summary:hover,body.sijalu-app .si-user-dropdown[open]>summary{background:#2b465e!important}
body.sijalu-app .si-topbar-page-icon,body.sijalu-app .si-menu-toggle{background:#233b54!important;border-color:#496a81!important;color:#8ae8d8!important}
body.sijalu-app .si-app-footer{background:#102239!important;border-top:1px solid #2e485e!important;color:#a9bfd0!important}
body.sijalu-app .si-app-footer small{color:#859daf!important}
body.sijalu-app .ws-search-launch,body.sijalu-app .wp-lookup{background:#213c53!important;color:#d7edf5!important;border-color:#4b6a7e!important}
body.sijalu-app .ws-search-launch:hover,body.sijalu-app .wp-lookup:hover{background:#2a5064!important}
body.sijalu-app .si-cms-media-card small{color:#b9cad8!important}
body.sijalu-app .wp-holiday{background:#473827!important;color:#ffdda7!important;border-color:#856643!important}
body.sijalu-app .wp-hero-filter{background:#204c5d;border-color:#7aadb0}
body.sijalu-app .wp-hero-filter input{background:#122d41!important;color:#f1f7fa!important}
body.sijalu-app .wp-hero-filter label{color:#d9f3f2!important}
body.sijalu-app .wp-chart-bars{border-color:#3b546a!important}
body.sijalu-app .wp-attendance-bar{border:1px solid #456678}
body.sijalu-app .btn[data-si021-icon]::before{content:attr(data-si021-icon);display:inline-grid;place-items:center;flex-shrink:0;
 font-size:14px;font-weight:900;line-height:1;margin-right:3px;color:#f1d59a}
body.sijalu-app .btn.danger[data-si021-icon]::before{color:#ffb3bc}
body.sijalu-app .btn.primary[data-si021-icon]::before{color:#e2fffa}