/* admin.sji.my.id — tampilan desktop (Fer 16/10/2026: komputer saja). Palet sama dengan lapor.sji. Tanpa huruf/skrip luar. */
:root{--bg:#EDF1EE;--sf:#fff;--ink:#13201A;--mut:#5A6A62;--line:#D5DED8;--acc:#1D6648;--acc2:#DBEBE2;--ok:#1C7448;--ok2:#DCF0E3;--warn:#9A5F0C;--warn2:#F7E9CF;--bad:#AE341E;--bad2:#F6DED7;--info:#2B5886;--info2:#DEE7F2;--gray:#7B827E;--gray2:#E7EAE8;--num:ui-monospace,"SF Mono",Menlo,Consolas,"Roboto Mono",monospace}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:13.5px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
button,select,input,textarea{font:inherit}
.top{height:50px;background:var(--sf);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 18px}
.top .logo{font-weight:700;color:var(--acc)}.top .logo span{color:var(--mut);font-weight:400}
select,input[type=date],input[type=text],input[type=password],input[type=number],input[type=tel],textarea{padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}
.top .kanan{margin-left:auto;display:flex;gap:14px;align-items:center;color:var(--mut)}.top .orang b{color:var(--ink)}
.rangka{display:flex;min-height:calc(100vh - 50px)}
.sisi{width:200px;background:var(--sf);border-right:1px solid var(--line);padding:12px 10px;flex:none}
.sisi a{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-radius:9px;color:var(--ink);text-decoration:none;margin-bottom:2px;cursor:pointer}
.sisi a:hover{background:var(--gray2)}.sisi a.aktif{background:var(--acc2);color:var(--acc);font-weight:600}
.sisi a small{color:var(--mut);font-size:11px}.sisi .lencana{background:var(--bad);color:#fff;font-size:11px;padding:1px 7px;border-radius:999px}
.sisi .sekat{height:1px;background:var(--line);margin:8px 6px}.sisi .judul{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em;padding:8px 12px 4px}
.isi{flex:1;padding:18px 24px;min-width:0}
h1{font-size:19px;margin:0 0 2px}h2{font-size:14px;margin:0}.sub{color:var(--mut);margin:0 0 14px}
.bar{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.pekan{display:flex;align-items:center;gap:4px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px}
.pekan button{border:0;background:none;padding:4px 10px;border-radius:999px;cursor:pointer}.pekan b{padding:0 8px;font-weight:600}
.ring{display:flex;gap:12px;margin-bottom:14px}.ring>div{background:var(--sf);border:1px solid var(--line);border-radius:12px;padding:10px 14px;flex:1;min-width:0}
.ring span{display:block;font-size:11.5px;color:var(--mut)}.ring b{font-family:var(--num);font-size:18px;font-weight:600;white-space:nowrap}.ring b.bad{color:var(--bad)}.ring b.ok{color:var(--ok)}.ring small{color:var(--mut);font-size:11.5px}
.kartu{background:var(--sf);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
.kartu h2{padding:10px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px}
.kartu h2 .r{margin-left:auto;font-weight:400;color:var(--mut);font-size:12.5px;display:flex;gap:6px;align-items:center}
.kartu.merah{border-color:var(--bad)}.kartu.merah h2{background:var(--bad2);color:var(--bad)}
table{width:100%;border-collapse:collapse}th,td{padding:7px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
th{font-size:11px;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.03em;background:#F7F9F8}
td.n,th.n{text-align:right;font-family:var(--num)}td.w{white-space:normal}tr:last-child td{border-bottom:0}
tr.redup td{color:var(--gray)}tr.klik{cursor:pointer}tr.klik:hover td{background:#F2F6F3}tr.total td{background:var(--acc2);font-weight:700;border-top:2px solid var(--acc)}
.cip{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11.5px;font-weight:600}
.cip.ok{background:var(--ok2);color:var(--ok)}.cip.warn{background:var(--warn2);color:var(--warn)}.cip.bad{background:var(--bad2);color:var(--bad)}.cip.info{background:var(--info2);color:var(--info)}.cip.gray{background:var(--gray2);color:var(--gray)}
.tbl{padding:5px 11px;border-radius:8px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:12.5px}
.tbl.utama{background:var(--acc);border-color:var(--acc);color:#fff}.tbl.hapus{color:var(--bad);border-color:#E4B9B0}.tbl.kecil{padding:3px 8px;font-size:12px}.tbl.on{background:var(--info2);border-color:var(--info);color:var(--info)}
.tbl:disabled{opacity:.5;cursor:default}.tbl+.tbl{margin-left:5px}
.cat{font-size:12px;color:var(--mut)}
.area-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.chip{display:flex;flex-direction:column;align-items:flex-start;padding:5px 10px;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer;position:relative;min-width:96px}.chip small{color:var(--mut);font-size:11px}.chip.aktif{background:var(--acc);border-color:var(--acc);color:#fff}.chip.aktif small{color:#DBEBE2}.chip .cip{position:absolute;top:-6px;right:-4px}
.lembar{background:var(--sf);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
.lembar .gulir{overflow:auto;max-height:calc(100vh - 250px)}
.lembar table{table-layout:fixed;min-width:980px}.lembar th{position:sticky;top:0;z-index:2}
.lembar th.hari{text-align:center;text-transform:none;font-size:12px;color:var(--ink)}.lembar th.hari small{display:block;color:var(--mut);font-weight:400;font-size:11px}
.lembar th.hari.kunci{color:var(--gray);background:#F1F3F2}
.lembar td{padding:3px 8px}.lembar td.lbl{padding-left:14px;white-space:normal}
.lembar tr.judul td{background:#E8EEEA;font-weight:700;cursor:pointer;padding:6px 10px}.lembar tr.judul td .tanda{display:inline-block;width:14px;color:var(--mut)}.lembar tr.judul td .r{float:right;font-weight:400;color:var(--mut);font-size:12px}
.lembar tr.rumus td{background:#F7F9F8;font-weight:600}.lembar tr.rumus td.n{font-family:var(--num)}
.sel{width:100%;text-align:right;font-family:var(--num);font-size:12.5px;padding:3px 6px;border:1px solid transparent;border-radius:6px;background:#FBFCFB}
.sel:hover{border-color:var(--line)}.sel:focus{border-color:var(--acc);outline:0;background:#fff}.sel.ubah{background:var(--info2);border-color:#A9C0DA}.sel.beda{background:var(--warn2);border-color:#E3C58E}
.sel:disabled{background:#F1F3F2;color:var(--gray)}.sel.teks{text-align:left;font-family:inherit}
.sis{display:block;text-align:right;font-family:var(--num);font-size:11px;color:var(--info);padding-right:6px;cursor:pointer}.sis.sama{color:var(--gray)}.sis b{color:var(--warn)}
.lembar td.baca{text-align:right;font-family:var(--num);color:var(--mut);font-size:12.5px}
.kaki{padding:10px 14px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;color:var(--mut);font-size:12.5px;background:#F7F9F8}.kaki .tbl{margin-left:auto}
.dua{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tiga{display:grid;grid-template-columns:minmax(0,3fr) minmax(320px,1fr);gap:14px}
.panel{background:var(--sf);border:1px solid var(--line);border-radius:12px;overflow:hidden}.panel .hd{padding:10px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;font-weight:600}.panel .hd .r{margin-left:auto;font-weight:400;color:var(--mut)}
.item{padding:9px 14px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center}.item:last-child{border-bottom:0}.item .t{flex:1;min-width:0}.item .t small{display:block;color:var(--mut)}
.kal{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;padding:12px}.kal div{border:1px solid var(--line);border-radius:9px;padding:6px 8px;min-height:64px;background:#fff;font-size:12px;cursor:pointer}.kal div b{display:block;font-family:var(--num);font-weight:600}.kal div.libur{background:var(--bad2)}.kal div.ganti{background:var(--info2)}.kal div.kosong{background:#F4F6F5;color:var(--gray);cursor:default}.kal div.ini{border-color:var(--acc)}.kal .hd6{background:none;border:0;min-height:0;color:var(--mut);font-weight:600;text-align:center;padding:0;cursor:default}
.chk{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:12px 14px}.chk label{display:flex;gap:6px;align-items:center;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer}.chk label.on{background:var(--acc2);border-color:var(--acc)}
.form{display:grid;grid-template-columns:170px 1fr;gap:8px 12px;padding:12px 14px;align-items:center}.form input,.form select,.form textarea{width:100%}
.masuk{max-width:420px;margin:70px auto;background:var(--sf);border:1px solid var(--line);border-radius:14px;padding:22px 26px}.masuk h1{margin-bottom:12px}.masuk label{display:block;margin:10px 0 4px;color:var(--mut);font-size:12.5px}.masuk input{width:100%}.masuk .tbl{width:100%;margin-top:14px;padding:9px}
.dialog{position:fixed;inset:0;background:rgba(19,32,26,.45);display:flex;align-items:center;justify-content:center;z-index:50}.dialog .kotak{background:var(--sf);border-radius:14px;min-width:420px;max-width:640px;max-height:90vh;overflow:auto;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.dialog .kotak h2{padding:12px 16px;border-bottom:1px solid var(--line)}.dialog .kaki{justify-content:flex-end}.dialog .kaki .tbl{margin-left:6px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:9px 16px;border-radius:999px;font-size:13px;z-index:60;max-width:70vw}
.link-kotak{font-family:var(--num);background:#F7F9F8;border:1px dashed var(--line);padding:8px 10px;border-radius:8px;word-break:break-all;margin:6px 0}
.pusat{text-align:center}
