:root{
  --primary:#0f7a4f;
  --primary-dark:#0b4934;
  --sidebar:#09251d;
  --soft:#e8f7ee;
  --bg:#f4f7f5;
  --text:#16261f;
  --muted:#68746f;
  --border:#dce6e0;
  --danger:#c0392b;
  --warning:#d8a229;
  --radius:20px;
  --shadow:0 16px 44px rgba(10,45,32,.09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.45}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
.admin-shell{min-height:100vh;display:flex;background:linear-gradient(180deg,#f8fbf9 0%,var(--bg) 100%)}
.sidebar{position:fixed;inset:0 auto 0 0;width:294px;background:var(--sidebar);color:#fff;z-index:60;overflow:auto;transition:transform .25s ease,box-shadow .25s ease;border-right:1px solid rgba(255,255,255,.08)}
.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.sidebar-brand{display:flex;align-items:center;gap:11px;min-height:57px;padding:10px 14px;background:rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.1)}
.sidebar-brand img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:10px;padding:4px}.sidebar-brand strong{display:block;font-size:16px;letter-spacing:.05em}.sidebar-brand small{display:block;color:rgba(255,255,255,.68);font-size:11px;max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-user{display:flex;gap:10px;align-items:center;margin:12px 12px 8px;padding:10px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.sidebar-user span{width:35px;height:35px;border-radius:8px;display:grid;place-items:center;background:var(--primary);font-weight:900}.sidebar-user strong{display:block;font-size:13px}.sidebar-user small{display:block;color:rgba(255,255,255,.65);font-size:11px}
.sidebar-menu{padding:7px 10px 18px;display:grid;gap:3px}.menu-link,.submenu-title{position:relative;display:flex;align-items:center;gap:9px;width:100%;min-height:36px;border:0;border-radius:5px;padding:9px 10px;color:rgba(255,255,255,.84);font-weight:800;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease}.menu-link span{width:23px;height:23px;border-radius:6px;display:grid;place-items:center;background:rgba(255,255,255,.09);font-size:10px;font-weight:900;letter-spacing:.02em}.menu-link:hover,.submenu-title:hover,.menu-link.active,.submenu-title.active{background:rgba(255,255,255,.12);color:#fff}.menu-link.active:before,.submenu-link.active:before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:#fff}.menu-link.danger{margin-top:8px;color:#ffd6d6}.menu-group summary{list-style:none}.menu-group summary::-webkit-details-marker{display:none}.menu-group>.menu-link:after,.submenu-title:after{content:"";margin-left:auto;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);opacity:.62;transition:transform .2s ease}.menu-group[open]>.menu-link:after,.menu-group[open]>.submenu-title:after{transform:rotate(45deg)}
.submenu{display:grid;gap:1px;margin:2px 0 4px 16px;padding-left:13px;border-left:1px solid rgba(255,255,255,.1);animation:menuDrop .18s ease}.submenu.level-1{margin-left:6px}.submenu-link{position:relative;display:block;color:rgba(255,255,255,.66);padding:7px 9px;border-radius:5px;font-size:13px;font-weight:700;transition:background .18s ease,color .18s ease,padding-left .18s ease}.submenu-link:hover,.submenu-link.active{background:rgba(255,255,255,.1);color:#fff;padding-left:13px}.submenu-title{font-size:13px;min-height:32px;padding:7px 9px;color:rgba(255,255,255,.72)}
@keyframes menuDrop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.main-area{margin-left:294px;min-width:0;flex:1}.topbar{position:sticky;top:0;z-index:40;min-height:58px;background:rgba(244,247,245,.94);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;justify-content:space-between;padding:10px 20px}.topbar-title h1{margin:0;font-size:21px;line-height:1.1;letter-spacing:-.02em}.topbar-title p{margin:2px 0 0;color:var(--muted);font-size:12px}.topbar-actions{display:flex;align-items:center;gap:10px}.sidebar-toggle{display:none;border:1px solid var(--border);background:#fff;border-radius:8px;padding:8px 11px;font-weight:900;color:var(--primary);cursor:pointer}.user-chip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--border);border-radius:999px;padding:6px 10px;box-shadow:0 8px 24px rgba(13,45,36,.05)}.user-chip span{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--soft);color:var(--primary);font-weight:900}.user-chip strong{display:block;font-size:12px}.user-chip small{display:block;color:var(--muted);font-size:11px}.content{padding:18px 20px 28px}
.welcome-card{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-radius:14px;padding:22px;display:flex;justify-content:space-between;gap:20px;align-items:center;box-shadow:var(--shadow);margin-bottom:16px}.welcome-card h2{margin:8px 0 6px;font-size:28px;letter-spacing:-.03em}.welcome-card p{margin:0;color:rgba(255,255,255,.78);max-width:850px}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;background:var(--soft);color:var(--primary);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.welcome-card .badge{background:rgba(255,255,255,.14);color:#fff0b6}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:4px;min-height:34px;padding:0 13px;background:var(--primary);color:#fff;font-weight:900;cursor:pointer;white-space:nowrap;box-shadow:0 6px 14px rgba(15,122,79,.12);transition:transform .15s ease,background .15s ease,box-shadow .15s ease}.btn.small{min-height:29px;padding:0 10px;font-size:12px}.btn:hover{background:var(--primary-dark);transform:translateY(-1px)}.btn.outline{background:#fff;color:var(--primary);border:1px solid var(--border);box-shadow:none}.btn.ghost{background:transparent;color:var(--primary);box-shadow:none}.btn.light{background:#fff;color:var(--primary)}
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.stat-card,.panel,.empty-state{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}.stat-card{padding:17px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;right:-22px;top:-22px;width:70px;height:70px;border-radius:50%;background:var(--soft)}.stat-card span{color:var(--muted);font-weight:800;font-size:12px}.stat-card strong{display:block;font-size:36px;line-height:1;margin:10px 0;color:var(--primary)}.stat-card p{margin:0;font-weight:900}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{padding:18px;margin-bottom:16px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.panel-head h2,.empty-state h2{margin:8px 0 4px;font-size:22px;letter-spacing:-.02em}.panel-head p{margin:0;color:var(--muted)}.step-list{padding-left:20px;color:var(--muted)}.step-list li{margin:8px 0}.quick-grid,.cms-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.quick-grid a,.cms-card{display:block;background:#f8fbf9;border:1px solid var(--border);border-radius:10px;padding:13px;color:var(--primary);font-weight:900;transition:transform .16s ease,box-shadow .16s ease}.quick-grid a:hover,.cms-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(10,45,32,.08)}.cms-card span{display:block;color:var(--muted);font-weight:700;margin-top:4px;font-size:12px}.alert{border-radius:10px;padding:12px 14px;margin-bottom:14px;font-weight:700}.alert.success{background:#e8f7ee;color:#0c6a45;border:1px solid #bfe6cf}.alert.error{background:#fff0f0;color:#ad3030;border:1px solid #ffd2d2}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-field{display:grid;gap:6px}.form-field span{font-weight:900;color:#29473d}.form-field span b{color:var(--danger)}.form-field small{color:var(--muted);font-weight:600}.form-field.wide,.form-actions{grid-column:1/-1}.form-field input,.form-field select,.form-field textarea,.toolbar input,.toolbar select,.data-table-toolbar input,.data-table-toolbar select{width:100%;border:1px solid var(--border);border-radius:5px;padding:10px 12px;background:#fbfdfb;color:var(--text);outline:none}.form-field input:focus,.form-field select:focus,.form-field textarea:focus,.toolbar input:focus,.toolbar select:focus,.data-table-toolbar input:focus,.data-table-toolbar select:focus{border-color:rgba(15,122,79,.45);box-shadow:0 0 0 3px rgba(15,122,79,.08)}.form-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:2px}.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:12px}.toolbar input{max-width:320px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:6px;background:#fff}.table-wrap table{width:100%;border-collapse:collapse;background:#fff;min-width:880px}.table-wrap th,.table-wrap td{padding:10px 12px;border-bottom:1px solid #edf2ef;text-align:left;vertical-align:middle}.table-wrap th{font-size:11px;color:#53615b;text-transform:uppercase;letter-spacing:.04em;background:#f6faf7;white-space:nowrap}.table-wrap td{font-size:13px}.table-wrap td small{color:var(--muted)}.table-wrap tbody tr:nth-child(even){background:#fbfdfc}.table-wrap tbody tr:hover{background:#f1f8f4}.table-wrap tr:last-child td{border-bottom:0}.data-table-toolbar,.table-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0;color:var(--muted);font-size:12px}.data-table-toolbar label{display:flex;align-items:center;gap:7px;font-weight:700}.data-table-toolbar select{width:auto;min-width:70px;padding:7px 9px}.data-table-search{max-width:260px}.table-foot{margin-top:12px}.table-pages{display:flex;gap:4px}.table-pages button{border:1px solid var(--border);background:#fff;color:var(--primary);border-radius:4px;padding:6px 9px;font-weight:800;cursor:pointer}.table-pages button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.action-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.action-row form,.inline-form{display:inline}.link{border:0;background:#e9f7ef;color:var(--primary);font-weight:900;cursor:pointer;padding:6px 9px;border-radius:4px;display:inline-flex}.link:hover{background:var(--primary);color:#fff}.danger-text{color:var(--danger);background:#fff0f0}.danger-text:hover{background:var(--danger);color:#fff}.empty-cell{text-align:center;color:var(--muted);padding:30px}.empty-state{text-align:center;padding:44px 24px}.empty-state p{color:var(--muted);max-width:640px;margin:0 auto 18px}.status{display:inline-flex;border-radius:999px;padding:4px 9px;font-weight:900;font-size:11px;background:#eef2f0;color:#58645f}.status.active,.status.aktif,.status.publish,.status.selesai,.status.disetujui,.status.lulus{background:#e8f7ee;color:#0c6a45}.status.inactive,.status.nonaktif,.status.draft,.status.ditolak,.status.tidak_lulus{background:#fff0f0;color:#ad3030}.status.proses{background:#fff8e6;color:#9b6f00}.diagnostic-list{display:grid;gap:8px}.diagnostic-list div{display:flex;justify-content:space-between;gap:14px;border:1px solid var(--border);background:#fbfdfb;border-radius:10px;padding:11px}.diagnostic-list span{color:var(--muted);font-weight:800}.diagnostic-list strong{text-align:right}.note,.muted{color:var(--muted);font-size:12px}code{background:#eef2f0;border-radius:5px;padding:2px 5px}.thumb{width:90px;height:58px;object-fit:cover;border-radius:8px;border:1px solid var(--border);background:#f1f4f2}.image-preview{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px dashed var(--border);background:#f8fbf9;border-radius:10px;padding:10px}.image-preview img{width:170px;height:104px;object-fit:cover;border-radius:9px}.check-inline{display:flex!important;align-items:center;gap:7px;font-weight:800;color:var(--muted)}.check-inline input{width:auto!important}.form-field input[type=file]{padding:9px;background:#fff}.tag-list{display:flex;gap:8px;flex-wrap:wrap}.tag-list span{background:var(--soft);color:var(--primary);padding:7px 10px;border-radius:999px;font-weight:800;font-size:12px}.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.permission-grid fieldset{border:1px solid var(--border);border-radius:10px;padding:12px;background:#fbfdfb}.permission-grid legend{font-weight:900;color:var(--primary);padding:0 5px}.permission-grid label{display:flex;align-items:center;gap:8px;margin:7px 0;color:#344940;font-weight:700}.permission-grid input{width:auto!important}.tab-nav{display:flex;gap:7px;flex-wrap:wrap;margin:4px 0 14px;border-bottom:1px solid var(--border)}.tab-nav button{border:0;background:transparent;color:var(--muted);font-weight:900;padding:10px 12px;border-radius:6px 6px 0 0;cursor:pointer}.tab-nav button.active{background:var(--primary);color:#fff}.tab-panel{display:none}.tab-panel.active{display:block;animation:fadeIn .2s ease}@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 15%,rgba(216,162,41,.22),transparent 28%),linear-gradient(135deg,var(--primary),var(--sidebar));padding:24px}.login-card{width:min(760px,100%);background:#fff;border-radius:18px;padding:28px;box-shadow:0 24px 80px rgba(0,0,0,.2)}.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:22px}.login-brand strong{display:block;font-size:18px}.login-brand small{display:block;color:var(--muted)}.login-card h1{margin:0 0 8px;font-size:30px;letter-spacing:-.04em}.login-card p{color:var(--muted);margin:0 0 18px}.login-card .form-grid{grid-template-columns:1fr}.login-footer{margin-top:16px;text-align:center;color:var(--muted);font-size:13px}.login-footer a{color:var(--primary);font-weight:900}
@media(max-width:1080px){.stat-grid{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}.sidebar{transform:translateX(-105%)}.sidebar.open{transform:translateX(0);box-shadow:0 20px 80px rgba(0,0,0,.25)}.main-area{margin-left:0}.sidebar-toggle{display:inline-flex}.topbar{padding:10px 14px}.content{padding:14px}.user-chip div{display:none}.topbar-actions .btn{display:none}.permission-grid{grid-template-columns:1fr}}
@media(max-width:680px){.topbar-title h1{font-size:18px}.topbar-title p{display:none}.welcome-card{flex-direction:column;align-items:flex-start}.welcome-card h2{font-size:23px}.stat-grid,.form-grid,.quick-grid,.cms-grid{grid-template-columns:1fr}.panel-head{flex-direction:column}.toolbar{flex-direction:column;align-items:stretch}.toolbar input{max-width:none}.content{padding:12px}.panel,.welcome-card{border-radius:12px;padding:15px}.sidebar{width:min(310px,86vw)}.login-card{border-radius:16px;padding:20px}.data-table-toolbar{align-items:stretch}.data-table-toolbar label,.data-table-search{width:100%;max-width:none}.table-foot{align-items:flex-start}}
@media print{.sidebar,.topbar,.btn,.toolbar,.data-table-toolbar,.table-foot,.tab-nav{display:none!important}.main-area{margin:0}.content{padding:0}.panel{box-shadow:none;border:0}.tab-panel{display:block!important}.table-wrap{overflow:visible;border:1px solid #ccc}.table-wrap table{min-width:0;font-size:11px}}

/* === Video/AdminLTE style update: header, sidebar, menu, table, and smooth movement === */
:root{
  --admin-blue:#3c8dbc;
  --admin-blue-dark:#367fa9;
  --admin-sidebar:#222d32;
  --admin-sidebar-dark:#1a2226;
  --admin-sidebar-hover:#1e282c;
  --admin-green:#00a65a;
  --admin-content:#ecf0f5;
  --admin-border:#d2d6de;
  --admin-text:#333;
}
body{background:var(--admin-content);color:var(--admin-text);font-family:"Source Sans Pro","Helvetica Neue",Arial,sans-serif;font-size:14px;line-height:1.42857143;overflow-x:hidden}
.admin-shell{background:var(--admin-content);display:block;min-height:100vh}
.sidebar{width:230px;background:var(--admin-sidebar);border-right:0;box-shadow:none;transition:transform .28s ease,width .28s ease;overflow-x:hidden}
.sidebar-brand{height:50px;min-height:50px;padding:0;background:var(--admin-blue-dark);border-bottom:0;display:flex;align-items:center;gap:0;color:#fff}
.sidebar-brand img{width:50px;height:50px;border-radius:0;padding:8px;background:rgba(0,0,0,.08);object-fit:contain;flex:0 0 50px}
.sidebar-brand strong{display:block;flex:1;text-align:center;font-size:20px;font-weight:700;letter-spacing:.02em;line-height:50px;text-transform:uppercase}
.sidebar-user{height:59px;margin:0;padding:10px;background:var(--admin-sidebar-dark);border:0;border-radius:0;color:#fff;gap:10px}
.sidebar-user .avatar-img{width:45px;height:45px;flex:0 0 45px}
.avatar-img{border-radius:4px;object-fit:cover;background:#d2d6de;vertical-align:middle}.avatar-img.small{width:28px;height:28px;border-radius:50%;margin-right:7px}
.sidebar-user-meta strong{font-size:14px;font-weight:700;color:#fff;line-height:1.2}.sidebar-user-meta small{display:flex;align-items:center;gap:5px;color:#fff;font-size:11px;margin-top:6px}.online-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#3cba54;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.sidebar-menu{padding:0 0 18px;gap:0}.menu-link,.submenu-title{border-radius:0;min-height:40px;padding:12px 12px 12px 15px;color:#b8c7ce;font-size:13px;font-weight:500;background:transparent;border-left:3px solid transparent;gap:10px;transform:none;transition:background .2s ease,color .2s ease,border-color .2s ease,padding-left .2s ease}.menu-link .menu-icon{width:18px;height:18px;border-radius:0;background:transparent;color:inherit;font-size:14px;line-height:18px;display:inline-grid;place-items:center;letter-spacing:0;font-weight:400;flex:0 0 18px}.menu-link:hover,.submenu-title:hover,.menu-link.active,.submenu-title.active{background:var(--admin-sidebar-hover);color:#fff;border-left-color:var(--admin-green);padding-left:18px}.menu-link.active:before,.submenu-link.active:before{display:none}.menu-link.danger{margin-top:0;color:#dd4b39}.menu-link.danger:hover{color:#fff;background:#dd4b39;border-left-color:#dd4b39}.menu-group>.menu-link:after,.submenu-title:after{width:6px;height:6px;opacity:.75;transform:rotate(-45deg);border-width:1.5px}.menu-group[open]>.menu-link:after,.menu-group[open]>.submenu-title:after{transform:rotate(45deg)}
.submenu{margin:0;padding-left:0;border-left:0;background:#2c3b41;animation:menuDrop .22s ease}.submenu.level-1{margin-left:0;background:#31444d}.submenu-link{display:block;border-radius:0;padding:8px 8px 8px 36px;color:#8aa4af;font-size:13px;font-weight:500;transition:background .18s ease,color .18s ease,padding-left .18s ease}.submenu-link:hover,.submenu-link.active{background:rgba(0,0,0,.12);color:#fff;padding-left:42px}.submenu-title{min-height:34px;padding:9px 12px 9px 33px;color:#b8c7ce;font-size:13px;background:transparent;border-left:3px solid transparent}.submenu-title:hover,.submenu-title.active{padding-left:36px}.submenu .submenu-link{padding-left:45px}.submenu .submenu-link:hover,.submenu .submenu-link.active{padding-left:51px}@keyframes menuDrop{from{opacity:.4;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.main-area{margin-left:230px;min-height:100vh;background:var(--admin-content);transition:margin-left .28s ease}.topbar{height:50px;min-height:50px;background:var(--admin-blue);border-bottom:0;box-shadow:none;padding:0 15px;position:fixed;top:0;left:230px;right:0;z-index:50;color:#fff;backdrop-filter:none;transition:left .28s ease;display:flex;align-items:center;justify-content:space-between}.topbar-left{display:flex;align-items:center;gap:16px;min-width:0}.topbar-school{display:grid;color:#fff;line-height:1.1;min-width:0}.topbar-school strong{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-school small{font-size:10px;font-weight:600;color:#fff;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-toggle{display:inline-flex;border:0;background:transparent;border-radius:0;padding:0;width:18px;height:18px;flex-direction:column;gap:3px;align-items:stretch;justify-content:center;cursor:pointer;box-shadow:none}.sidebar-toggle span{height:2px;background:#fff;border-radius:2px;display:block}.sidebar-toggle:hover{background:transparent;transform:none}.topbar-actions{gap:18px;color:#fff}.notify-btn{border:0;background:transparent;color:#fff;width:20px;height:20px;display:grid;place-items:center;cursor:pointer;position:relative;padding:0}.notify-btn:before{content:"";width:13px;height:13px;border-radius:8px 8px 6px 6px;background:#fff;display:block;clip-path:polygon(50% 0,76% 16%,83% 58%,100% 72%,0 72%,17% 58%,24% 16%)}.notify-btn:after{content:"";position:absolute;bottom:1px;left:8px;width:5px;height:4px;border-radius:50%;background:#fff}.bell-icon{display:none}.notify-btn:hover{opacity:.84}.top-user{display:flex;align-items:center;color:#fff;font-size:14px}.top-user strong{font-weight:500;color:#fff}.user-chip{display:none}.content{padding:68px 15px 24px;animation:pageIn .25s ease;min-height:100vh}.content-titlebar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}.content-titlebar h1{margin:0;font-size:24px;font-weight:400;color:#333;line-height:1.1}.content-titlebar h1 small{font-size:15px;color:#777;font-weight:300;margin-left:6px}.breadcrumb{font-size:12px;color:#777;background:transparent;display:flex;align-items:center;gap:7px;white-space:nowrap}.breadcrumb-home{color:#111}.green-line{height:3px;background:var(--admin-green);margin:-1px 0 12px}.panel,.stat-card,.empty-state{border:1px solid var(--admin-border);border-radius:0;box-shadow:none;background:#fff}.panel{padding:0;margin-bottom:15px;border-top:3px solid var(--admin-green)}.panel-head{padding:10px 12px;border-bottom:1px solid #f4f4f4;margin-bottom:0;align-items:center}.panel-head h2{font-size:18px;font-weight:400;margin:3px 0;color:#333}.panel-head p{font-size:13px;color:#777}.badge{border-radius:3px;padding:4px 7px;background:var(--admin-blue);color:#fff;font-size:11px;letter-spacing:0}.form-grid,.toolbar,.table-wrap,.permission-grid,.tab-nav,.note,.muted,.alert,.two-col,.stat-grid,.quick-grid,.cms-grid,.diagnostic-list,.empty-state p{margin-left:12px;margin-right:12px}.form-grid{padding-bottom:12px}.toolbar{padding-top:12px}.btn{border-radius:3px;min-height:30px;padding:5px 10px;background:var(--admin-blue);box-shadow:none;font-weight:600}.btn:hover{background:var(--admin-blue-dark);transform:none}.btn.outline{color:#444;background:#f4f4f4;border:1px solid #ddd}.btn.outline:hover{background:#e7e7e7}.btn.light{color:var(--admin-blue)}.form-field input,.form-field select,.form-field textarea,.toolbar input,.toolbar select,.data-table-toolbar input,.data-table-toolbar select{border-radius:0;border:1px solid #d2d6de;background:#fff;box-shadow:none;padding:6px 10px;min-height:34px}.form-field input:focus,.form-field select:focus,.form-field textarea:focus,.toolbar input:focus,.toolbar select:focus,.data-table-toolbar input:focus,.data-table-toolbar select:focus{border-color:#3c8dbc;box-shadow:none}.table-wrap{border:0;border-radius:0;background:#fff;padding:0 0 12px;overflow:auto}.table-wrap table{border-collapse:collapse;width:100%;min-width:880px}.table-wrap th,.table-wrap td{border:1px solid #ddd;padding:8px;vertical-align:middle}.table-wrap th{background:#f9fafc;color:#333;text-transform:none;letter-spacing:0;font-size:13px;font-weight:700}.table-wrap td{font-size:13px}.table-wrap tbody tr:nth-child(odd){background:#dff3df}.table-wrap tbody tr:nth-child(even){background:#f3fbf3}.table-wrap tbody tr:hover{background:#caebca}.data-table-toolbar{margin:12px;display:flex;justify-content:space-between;align-items:center;gap:12px}.data-table-toolbar label{display:flex;align-items:center;gap:6px;color:#333;font-weight:400}.data-table-search{max-width:220px}.table-foot{margin:0 12px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px}.table-pages button{border:1px solid #ddd;background:#fafafa;color:#333;padding:5px 9px;cursor:pointer}.table-pages button.active{background:var(--admin-blue);border-color:var(--admin-blue);color:#fff}.action-row .link{color:#3c8dbc}.danger-text{color:#dd4b39}.tab-nav{border-bottom:1px solid #ddd;margin-top:12px}.tab-nav button{border-radius:0;font-weight:600;color:#444;background:#f7f7f7;border:1px solid #ddd;border-bottom:0}.tab-nav button.active{background:var(--admin-blue);color:#fff;border-color:var(--admin-blue)}.tab-panel.active{animation:fadeIn .22s ease}.attendance-title{font-size:18px;font-weight:600;margin:0 12px 12px;color:#333}.attendance-filter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 12px 12px}.attendance-filter .form-field{display:grid}.attendance-actions{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.teacher-info{margin:0 12px 12px;padding:10px;border-left:3px solid var(--admin-blue);background:#f7fbff;color:#333}.attendance-status-select{min-width:135px}.summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 12px 12px}.summary-box{background:#fff;border:1px solid #ddd;border-top:3px solid var(--admin-blue);padding:10px}.summary-box strong{display:block;font-size:24px;color:#333}.summary-box span{font-size:12px;color:#777}@keyframes pageIn{from{opacity:.65;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1080px){.sidebar{transform:translateX(-105%);width:230px}.sidebar.open{transform:translateX(0)}.main-area{margin-left:0}.topbar{left:0}.content{padding-top:64px}.topbar-actions{gap:10px}.topbar-school strong{font-size:13px}.topbar-school small{max-width:50vw}.attendance-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.content-titlebar{align-items:flex-start;flex-direction:column}.breadcrumb{white-space:normal}.top-user strong{display:none}.topbar-school small{display:none}.attendance-filter{grid-template-columns:1fr}.summary-grid{grid-template-columns:1fr}.data-table-toolbar,.table-foot{align-items:stretch;flex-direction:column}.data-table-search{max-width:none;width:100%}.content{padding-left:10px;padding-right:10px}}
@media print{.topbar{display:none!important}.content{padding:0}.green-line{display:none}.panel{border:0}.sidebar{display:none!important}.main-area{margin-left:0}}

/* === Update 2026-05-16: green header, professional menu, profile dropdown, permit workflow === */
:root{
  --admin-blue:#00a65a;
  --admin-blue-dark:#008d4c;
  --admin-green:#00a65a;
  --admin-green-dark:#008d4c;
}
.sidebar-brand{background:var(--admin-green-dark)!important}.topbar{background:var(--admin-green)!important}.badge,.btn{background:var(--admin-green)!important}.btn:hover{background:var(--admin-green-dark)!important}.btn.outline{background:#f4f4f4!important;color:#444!important}.btn.outline:hover{background:#e7e7e7!important}.btn.ghost{background:transparent!important;color:var(--admin-green)!important}.table-pages button.active,.tab-nav button.active{background:var(--admin-green)!important;border-color:var(--admin-green)!important}.teacher-info,.summary-box{border-top-color:var(--admin-green)!important}.form-field input:focus,.form-field select:focus,.form-field textarea:focus,.toolbar input:focus,.toolbar select:focus,.data-table-toolbar input:focus,.data-table-toolbar select:focus{border-color:var(--admin-green)!important}
.sidebar-brand strong{font-size:20px!important;letter-spacing:.02em}.menu-link,.submenu-title{font-size:14px!important;font-weight:600!important}.submenu-link{font-size:13.5px!important}.menu-link .menu-icon{width:20px!important;height:20px!important;flex:0 0 20px!important}.menu-icon svg{width:16px;height:16px;display:block;fill:currentColor}.menu-link:hover .menu-icon,.menu-link.active .menu-icon{color:#fff}.submenu-link:before{content:"";display:inline-block;width:8px;height:8px;border:2px solid currentColor;border-radius:50%;margin-right:9px;opacity:.86;vertical-align:middle}.submenu-link.active:before{background:#fff;border-color:#fff;opacity:1}
.top-user-menu{position:relative;display:flex;align-items:center}.top-user-trigger{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#fff;height:50px;padding:0 8px;cursor:pointer}.top-user-trigger:hover{background:rgba(0,0,0,.08)}.top-user-trigger strong{font-size:14px;font-weight:600;color:#fff}.avatar-img.large{width:88px;height:88px;border-radius:50%;border:3px solid rgba(255,255,255,.45);object-fit:cover}.top-user-dropdown{display:none;position:absolute;right:0;top:50px;width:292px;background:#fff;color:#333;border:1px solid rgba(0,0,0,.12);box-shadow:0 10px 28px rgba(0,0,0,.18);z-index:90}.top-user-menu.open .top-user-dropdown{display:block;animation:dropdownIn .16s ease}.top-user-card{background:var(--admin-green);color:#fff;text-align:center;padding:13px 12px 15px}.top-user-card strong{display:block;font-size:18px;font-weight:400;margin-top:8px}.top-user-card span,.top-user-card small{display:block;color:#f1fff8;font-size:12px;line-height:1.5}.top-user-menu-actions{display:flex;justify-content:space-between;gap:10px;background:#f9f9f9;padding:10px}.top-user-menu-actions .btn{box-shadow:none!important;background:#fff!important;color:#444!important;border:1px solid #ddd!important}@keyframes dropdownIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.profile-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px}.profile-side,.profile-detail{margin-left:0!important;margin-right:0!important}.profile-card-main{text-align:center;padding:26px 18px}.profile-avatar{width:118px;height:118px;border-radius:50%;border:5px solid #d2d6de;margin-bottom:12px}.profile-card-main h2{margin:0;font-weight:400}.profile-card-main p{margin:4px 0 20px;color:#777;text-transform:uppercase}.profile-line{display:flex;justify-content:space-between;border-top:1px solid #eee;padding:9px 0;text-align:left}.profile-line strong{font-weight:600}.profile-line span{color:#3c8dbc}.profile-section-title{grid-column:1/-1;border-top:1px solid #eee;padding-top:14px;margin-top:4px;font-size:16px;font-weight:600;color:#333}.profile-form{padding-bottom:14px}
.permit-filter{display:grid;grid-template-columns:220px minmax(220px,1fr) auto auto;gap:12px;align-items:end;margin:12px}.permit-filter label{display:grid;gap:5px;font-weight:600}.permit-filter label span{font-weight:700;color:#333}.student-info-grid{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:20px;margin:12px}.student-info-table{display:grid;gap:0}.student-info-table div{display:grid;grid-template-columns:190px 18px minmax(0,1fr);min-height:36px;align-items:center;background:#f7f7f7;border-bottom:1px solid #eee}.student-info-table div:nth-child(even){background:#fbfbfb}.student-info-table span{padding:0 12px}.student-info-table b{font-weight:700}.student-info-table div:after{content:":";grid-column:2;grid-row:1}.student-photo-box{display:flex;justify-content:center;align-items:flex-start}.student-photo{width:168px;height:168px;border-radius:3px;border:3px solid #ddd;background:#eee}.permit-tabs .tab-panel{padding:12px 0}.permit-tabs .note{margin:12px;color:#777}.permit-form{margin-top:12px}.status.proses{background:#f39c12;color:#fff}.status.disetujui,.status.selesai{background:#00a65a;color:#fff}.status.ditolak{background:#dd4b39;color:#fff}.student-modal{display:none;position:fixed;inset:0;z-index:300}.student-modal.open{display:block}.student-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6)}.student-modal-dialog{position:relative;width:min(900px,92vw);max-height:calc(100vh - 80px);overflow:auto;background:#fff;margin:40px auto;box-shadow:0 15px 45px rgba(0,0,0,.35)}.student-modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #e5e5e5}.student-modal-head h2{margin:0;font-size:18px;font-weight:400}.student-modal-head button{border:0;background:transparent;font-size:28px;color:#aaa;cursor:pointer;line-height:1}.student-modal-foot{padding:14px 18px;border-top:1px solid #eee;text-align:right}.modal-table-wrap{margin:18px!important;max-height:56vh;overflow:auto}.modal-table-wrap table{min-width:760px!important}
@media(max-width:900px){.profile-layout{grid-template-columns:1fr}.permit-filter{grid-template-columns:1fr 1fr}.student-info-grid{grid-template-columns:1fr}.student-photo-box{justify-content:flex-start}}
@media(max-width:680px){.permit-filter{grid-template-columns:1fr}.top-user-dropdown{right:-10px;width:270px}.student-info-table div{grid-template-columns:130px 16px minmax(0,1fr)}}

/* === Fix 2026-05-16d: kunci ukuran header, menu, ikon, modal izin === */
:root{
  --admin-green:#00a65a;
  --admin-green-dark:#008d4c;
  --admin-sidebar:#172c32;
  --admin-sidebar-dark:#13252a;
  --admin-content:#ecf0f5;
}
body{font-size:14px!important;background:var(--admin-content)!important;overflow-x:hidden!important}.admin-shell{background:var(--admin-content)!important}.sidebar{width:230px!important;background:var(--admin-sidebar)!important}.main-area{margin-left:230px!important;background:var(--admin-content)!important}.sidebar-brand{height:50px!important;min-height:50px!important;max-height:50px!important;padding:0 12px!important;background:var(--admin-green)!important;border:0!important;border-bottom:1px solid rgba(0,0,0,.12)!important;display:flex!important;align-items:center!important;gap:12px!important;overflow:hidden!important}.sidebar-brand img{width:34px!important;height:34px!important;border-radius:0!important;background:transparent!important;padding:0!important;flex:0 0 34px!important}.sidebar-brand strong{font-size:18px!important;line-height:1!important;font-weight:700!important;letter-spacing:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.sidebar-user{height:66px!important;margin:0!important;padding:9px 12px!important;border-radius:0!important;background:var(--admin-sidebar-dark)!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.06)!important}.sidebar-user .avatar-img{width:45px!important;height:45px!important;border-radius:3px!important;object-fit:cover!important}.sidebar-user strong{font-size:15px!important;line-height:1.15!important}.sidebar-user small{font-size:12px!important;color:#fff!important}.online-dot{display:inline-block!important;width:9px!important;height:9px!important;border-radius:50%!important;background:#3cbd43!important;margin-right:5px!important}.sidebar-menu{padding:8px 0 18px!important;gap:0!important}.menu-link,.submenu-title{border-radius:0!important;min-height:44px!important;padding:11px 13px!important;color:#d7e4e7!important;font-size:15.5px!important;font-weight:600!important;gap:11px!important;background:transparent!important}.menu-link:hover,.submenu-title:hover,.menu-link.active,.submenu-title.active{background:#20383f!important;color:#fff!important}.menu-link.active:before,.submenu-link.active:before{background:var(--admin-green)!important}.menu-icon{width:22px!important;height:22px!important;flex:0 0 22px!important;display:grid!important;place-items:center!important;color:#e8eef0!important;background:transparent!important}.menu-icon svg{width:17px!important;height:17px!important;display:block!important;fill:currentColor!important}.menu-link:hover .menu-icon,.menu-link.active .menu-icon{color:#fff!important}.submenu{margin:0!important;padding:0 0 0 36px!important;border-left:0!important;background:rgba(0,0,0,.10)!important}.submenu-link{min-height:36px!important;padding:9px 10px!important;border-radius:0!important;font-size:14.5px!important;font-weight:500!important;color:#b7cbd0!important}.submenu-link:hover,.submenu-link.active{background:#223c43!important;color:#fff!important;padding-left:14px!important}.submenu-link:before{border-color:#b7cbd0!important;width:7px!important;height:7px!important;margin-right:8px!important}.submenu-link.active:before{background:#fff!important;border-color:#fff!important}.menu-link.danger{color:#ffb9b0!important}.topbar{position:fixed!important;top:0!important;left:230px!important;right:0!important;width:auto!important;height:50px!important;min-height:50px!important;max-height:50px!important;padding:0 14px!important;background:var(--admin-green)!important;color:#fff!important;border:0!important;box-shadow:none!important;z-index:80!important;display:flex!important;align-items:center!important;justify-content:space-between!important;overflow:visible!important}.topbar-left{height:50px!important;display:flex!important;align-items:center!important;gap:14px!important;min-width:0!important}.sidebar-toggle{width:18px!important;height:18px!important;display:inline-flex!important;border:0!important;background:transparent!important;padding:0!important;box-shadow:none!important;flex-direction:column!important;gap:3px!important;align-items:stretch!important;justify-content:center!important}.sidebar-toggle span{height:2px!important;background:#fff!important;border-radius:2px!important}.topbar-school{display:grid!important;line-height:1.05!important;min-width:0!important;color:#fff!important}.topbar-school strong{font-size:14px!important;font-weight:700!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.topbar-school small{font-size:10px!important;font-weight:600!important;color:#fff!important;margin-top:6px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:560px!important}.topbar-actions{height:50px!important;display:flex!important;align-items:center!important;gap:18px!important;color:#fff!important}.notify-btn{width:20px!important;height:20px!important;color:#fff!important;background:transparent!important;border:0!important;padding:0!important;display:grid!important;place-items:center!important}.top-user-menu{height:50px!important;position:relative!important;display:flex!important;align-items:center!important}.top-user-trigger{height:50px!important;max-height:50px!important;padding:0 8px!important;display:flex!important;align-items:center!important;gap:8px!important;background:transparent!important;border:0!important;color:#fff!important;cursor:pointer!important}.top-user-trigger .avatar-img.small{width:28px!important;height:28px!important;border-radius:50%!important;object-fit:cover!important}.top-user-trigger strong{font-size:14px!important;font-weight:600!important;color:#fff!important;white-space:nowrap!important}.top-user-dropdown{display:none!important;position:fixed!important;top:50px!important;right:10px!important;width:285px!important;background:#fff!important;color:#333!important;border:1px solid rgba(0,0,0,.12)!important;box-shadow:0 10px 28px rgba(0,0,0,.2)!important;z-index:9999!important}.top-user-menu.open .top-user-dropdown{display:block!important}.top-user-card{background:var(--admin-green)!important;color:#fff!important;text-align:center!important;padding:13px 12px 14px!important}.top-user-card .avatar-img.large{width:82px!important;height:82px!important;margin:0 auto!important;display:block!important;border-radius:50%!important;object-fit:cover!important;border:3px solid rgba(255,255,255,.55)!important}.top-user-card strong{display:block!important;font-size:17px!important;font-weight:400!important;margin-top:7px!important;color:#fff!important}.top-user-card span,.top-user-card small{display:block!important;color:#eefaf3!important;font-size:12px!important}.top-user-menu-actions{display:flex!important;justify-content:space-between!important;gap:8px!important;background:#f9f9f9!important;padding:10px!important}.top-user-menu-actions .btn{background:#fff!important;color:#444!important;border:1px solid #ddd!important;box-shadow:none!important}.content{padding:68px 15px 24px!important;min-height:100vh!important}.content-titlebar{margin:0 0 12px!important;display:flex!important;align-items:center!important;justify-content:space-between!important}.content-titlebar h1{font-size:24px!important;font-weight:400!important;margin:0!important}.green-line{height:3px!important;background:var(--admin-green)!important;margin:-1px 0 12px!important}.panel{border-radius:0!important;box-shadow:none!important;border:1px solid #d2d6de!important;border-top:3px solid var(--admin-green)!important;background:#fff!important;margin-bottom:15px!important;padding:0!important}.panel-head{padding:10px 12px!important;border-bottom:1px solid #f4f4f4!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important}.panel-head h2{font-size:18px!important;font-weight:400!important;margin:3px 0!important}.panel-head p{font-size:13px!important;color:#777!important}.badge,.btn{background:var(--admin-green)!important}.btn:hover{background:var(--admin-green-dark)!important}.btn.outline{background:#f4f4f4!important;color:#444!important;border:1px solid #ddd!important}.form-grid,.toolbar,.table-wrap,.permission-grid,.tab-nav,.note,.muted,.alert,.two-col,.stat-grid,.quick-grid,.cms-grid,.diagnostic-list,.empty-state p{margin-left:12px!important;margin-right:12px!important}.tab-panel{display:none!important}.tab-panel.active{display:block!important}.student-modal{display:none!important}.student-modal.open{display:block!important;position:fixed!important;inset:0!important;z-index:9998!important}.student-modal-backdrop{position:absolute!important;inset:0!important;background:rgba(0,0,0,.58)!important}.student-modal-dialog{position:relative!important;width:min(900px,92vw)!important;max-height:calc(100vh - 80px)!important;overflow:auto!important;background:#fff!important;margin:40px auto!important;box-shadow:0 15px 45px rgba(0,0,0,.35)!important}.student-modal-head{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:14px 18px!important;border-bottom:1px solid #e5e5e5!important}.student-modal-head h2{margin:0!important;font-size:18px!important;font-weight:400!important}.student-modal-foot{padding:14px 18px!important;border-top:1px solid #eee!important;text-align:right!important}.permit-filter{display:grid!important;grid-template-columns:220px minmax(220px,1fr) auto auto!important;gap:12px!important;align-items:end!important;margin:12px!important}.permit-filter label{display:grid!important;gap:5px!important;font-weight:600!important}.student-info-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 210px!important;gap:20px!important;margin:12px!important}.student-info-table{display:grid!important;gap:0!important}.student-info-table div{display:grid!important;grid-template-columns:190px 18px minmax(0,1fr)!important;min-height:36px!important;align-items:center!important;background:#f7f7f7!important;border-bottom:1px solid #eee!important}.student-info-table div:after{content:":"!important;grid-column:2!important;grid-row:1!important}.student-info-table span{padding:0 12px!important}.student-photo{width:168px!important;height:168px!important;border-radius:3px!important;border:3px solid #ddd!important;background:#eee!important}.permit-tabs .tab-panel{padding:12px 0!important}.permit-tabs .note{margin:12px!important}.modal-table-wrap{margin:18px!important;max-height:56vh!important;overflow:auto!important}.table-wrap table{width:100%!important;border-collapse:collapse!important}.table-wrap th,.table-wrap td{border:1px solid #ddd!important;padding:8px!important;vertical-align:middle!important}.table-wrap th{background:#f9fafc!important;color:#333!important;font-size:13px!important;font-weight:700!important;text-transform:none!important;letter-spacing:0!important}.table-wrap tbody tr:nth-child(odd){background:#dff3df!important}.table-wrap tbody tr:nth-child(even){background:#f3fbf3!important}.table-wrap tbody tr:hover{background:#caebca!important}
@media(max-width:1080px){.sidebar{transform:translateX(-105%)!important}.sidebar.open{transform:translateX(0)!important}.main-area{margin-left:0!important}.topbar{left:0!important}.topbar-school small{max-width:50vw!important}.content{padding-top:68px!important}}
@media(max-width:680px){.permit-filter{grid-template-columns:1fr!important}.student-info-grid{grid-template-columns:1fr!important}.content-titlebar{align-items:flex-start!important;flex-direction:column!important}.top-user-trigger strong{display:none!important}.top-user-dropdown{right:6px!important;width:270px!important}.topbar-school small{display:none!important}}


/* === Update 2026-05-16e: rapikan header/menu/dashboard/izin === */
:root{
  --admin-green:#00a65a;
  --admin-green-dark:#008d4c;
  --admin-sidebar:#172d33;
  --admin-sidebar-dark:#13262b;
  --sidebar-width:260px;
}
body{font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important;font-size:14px!important;background:#ecf0f5!important;color:#222!important}
.sidebar{width:var(--sidebar-width)!important;background:var(--admin-sidebar)!important;overflow-x:hidden!important}
.sidebar-brand{height:50px!important;min-height:50px!important;background:var(--admin-green-dark)!important;color:#fff!important;display:flex!important;align-items:center!important}
.sidebar-brand img{width:50px!important;height:50px!important;flex:0 0 50px!important;padding:7px!important;background:rgba(0,0,0,.1)!important;border-radius:0!important}
.sidebar-brand strong{font-family:"Source Sans 3","Source Sans Pro",Arial,sans-serif!important;font-size:20px!important;line-height:50px!important;font-weight:700!important;letter-spacing:.01em!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;padding:0 8px!important}
.sidebar-user{height:66px!important;background:var(--admin-sidebar-dark)!important;padding:10px 12px!important;border-bottom:1px solid rgba(255,255,255,.05)!important}
.sidebar-user .avatar-img{width:46px!important;height:46px!important;flex:0 0 46px!important;border-radius:3px!important}
.sidebar-user-meta strong{font-size:15.5px!important;line-height:1.2!important}.sidebar-user-meta small{font-size:12.5px!important}.online-dot{width:9px!important;height:9px!important}
.sidebar-menu{padding:8px 0 24px!important;font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important}
.menu-link,.submenu-title{min-height:43px!important;padding:11px 15px!important;gap:12px!important;color:#d9e4e7!important;font-size:16px!important;font-weight:700!important;line-height:1.2!important;border-left:3px solid transparent!important}
.menu-link:hover,.submenu-title:hover,.menu-link.active,.submenu-title.active{background:#203a42!important;color:#fff!important;border-left-color:var(--admin-green)!important}
.menu-icon{width:23px!important;height:23px!important;flex:0 0 23px!important;color:#e7eef0!important;opacity:1!important;display:grid!important;place-items:center!important;background:transparent!important}
.menu-icon svg{width:17px!important;height:17px!important;fill:currentColor!important;display:block!important}.menu-link:hover .menu-icon,.menu-link.active .menu-icon{color:#fff!important}
.submenu{background:#263c43!important;padding:4px 0 7px 42px!important;margin:0!important;border-left:0!important}.submenu.level-1{padding-left:32px!important;background:#2d454e!important}
.submenu-link{min-height:33px!important;padding:8px 10px!important;color:#c4d2d6!important;font-size:15px!important;font-weight:500!important;line-height:1.15!important;border-left:0!important;display:flex!important;align-items:center!important;gap:7px!important}
.submenu-link:before{content:""!important;display:inline-block!important;width:8px!important;height:8px!important;border:1.5px solid #c6d5d9!important;border-radius:50%!important;flex:0 0 8px!important;background:transparent!important;margin-right:4px!important}
.submenu-link:hover,.submenu-link.active{background:#203a42!important;color:#fff!important}.submenu-link.active:before{background:#fff!important;border-color:#fff!important}.menu-link.danger{color:#ffbdb5!important}
.main-area{margin-left:var(--sidebar-width)!important;background:#ecf0f5!important;min-height:100vh!important}.topbar{position:fixed!important;top:0!important;left:var(--sidebar-width)!important;right:0!important;height:50px!important;min-height:50px!important;max-height:50px!important;padding:0 14px!important;background:var(--admin-green)!important;border:0!important;color:#fff!important;z-index:90!important;display:flex!important;align-items:center!important;justify-content:space-between!important;overflow:visible!important}
.topbar-left,.topbar-actions,.top-user-menu,.top-user-trigger{height:50px!important;max-height:50px!important;display:flex!important;align-items:center!important}.topbar-left{gap:14px!important;min-width:0!important}.topbar-actions{gap:18px!important;flex:0 0 auto!important}.topbar-school{height:50px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;line-height:1!important;min-width:0!important;color:#fff!important}
.topbar-school strong{font-size:15px!important;font-weight:700!important;line-height:1.1!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.topbar-school small{font-size:11px!important;font-weight:600!important;line-height:1.1!important;margin-top:5px!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:680px!important}
.sidebar-toggle{width:20px!important;height:22px!important;display:flex!important;flex-direction:column!important;gap:3px!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}.sidebar-toggle span{height:2px!important;background:#fff!important;border-radius:2px!important}
.notify-btn{width:22px!important;height:22px!important;border:0!important;background:transparent!important;color:#fff!important;padding:0!important;display:grid!important;place-items:center!important}.bell-icon{font-size:0!important}.bell-icon:before{content:"\1F514";font-size:14px!important;line-height:1!important;color:#fff!important}
.top-user-trigger{padding:0 8px!important;gap:8px!important;background:transparent!important;border:0!important;color:#fff!important}.top-user-trigger .avatar-img.small{width:28px!important;height:28px!important;border-radius:50%!important;margin:0!important}.top-user-trigger strong{font-size:15px!important;color:#fff!important;font-weight:700!important;white-space:nowrap!important}
.top-user-dropdown{display:none!important;position:fixed!important;right:10px!important;top:50px!important;width:275px!important;background:#fff!important;border:1px solid rgba(0,0,0,.16)!important;box-shadow:0 12px 28px rgba(0,0,0,.22)!important;z-index:10000!important}.top-user-menu.open .top-user-dropdown{display:block!important}.top-user-card{padding:14px 12px!important;background:var(--admin-green)!important;color:#fff!important;text-align:center!important}.top-user-card .avatar-img.large{width:82px!important;height:82px!important;border-radius:50%!important;margin:0 auto!important;display:block!important;border:3px solid rgba(255,255,255,.55)!important}.top-user-card strong{display:block!important;font-size:17px!important;font-weight:400!important;margin-top:7px!important}.top-user-card span,.top-user-card small{display:block!important;color:#effff5!important;font-size:12px!important}.top-user-menu-actions{display:flex!important;justify-content:space-between!important;gap:8px!important;background:#f7f7f7!important;padding:10px!important}
.content{padding:65px 15px 24px!important}.content-titlebar{margin:0 0 10px!important}.green-line{height:3px!important;background:var(--admin-green)!important;margin:-1px 0 12px!important}
.welcome-card{border-radius:12px!important;margin:0 12px 16px!important;min-height:155px!important}.stat-grid{margin:0 12px 16px!important;gap:16px!important}.two-col{margin:0 12px 18px!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:16px!important;align-items:stretch!important}.two-col>.panel{height:100%!important;min-height:210px!important}.two-col .quick-grid{margin:0!important;align-content:start!important}.panel h3{margin:14px 14px 12px!important}.step-list{padding-left:30px!important;margin-right:14px!important}.quick-grid a{border-radius:8px!important;padding:14px 16px!important}
.panel{border-radius:0!important;border:1px solid #d2d6de!important;border-top:3px solid var(--admin-green)!important;box-shadow:none!important;background:#fff!important}.panel-head{padding:10px 12px!important;border-bottom:1px solid #f4f4f4!important;margin:0!important;min-height:58px!important}.panel-head h2{font-size:19px!important;font-weight:400!important;margin:3px 0!important}.panel-head p{font-size:13px!important;color:#666!important}.badge{border-radius:3px!important;background:var(--admin-green)!important;color:#fff!important;padding:4px 9px!important;font-size:11px!important;font-weight:800!important}
.permit-filter{display:grid!important;grid-template-columns:220px minmax(360px,1fr) auto auto!important;gap:12px!important;align-items:end!important;margin:12px!important}.permit-filter label{display:grid!important;gap:5px!important;font-weight:700!important}.permit-filter input,.permit-filter select,.permit-filter button{height:34px!important;min-height:34px!important;padding-top:5px!important;padding-bottom:5px!important;border-radius:2px!important}.permit-filter input,.permit-filter select{border:1px solid #bfc5c8!important;background:#fff!important;color:#222!important}.permit-table-wrap table{min-width:1120px!important}.permit-table th,.permit-table td{font-size:13px!important;padding:8px 9px!important}.permit-table th{white-space:nowrap!important;background:#f9fafc!important;color:#222!important}.permit-home-table th:nth-child(7),.permit-home-table td:nth-child(7){min-width:190px!important}.permit-home-table th:nth-child(8),.permit-home-table td:nth-child(8){min-width:150px!important}.permit-exit-table th:nth-child(7),.permit-exit-table td:nth-child(7),.permit-exit-table th:nth-child(8),.permit-exit-table td:nth-child(8){min-width:145px!important}.form-grid.permit-form{margin:12px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.permit-form .form-field input,.permit-form .form-field select,.permit-form .form-field textarea{border-radius:2px!important;background:#fff!important}.student-info-grid{margin:12px!important}.student-modal[hidden]{display:none!important}.student-modal.open{display:block!important;position:fixed!important;inset:0!important;z-index:10020!important}.student-modal-dialog{width:min(960px,92vw)!important;margin:48px auto!important;background:#fff!important;box-shadow:0 16px 50px rgba(0,0,0,.35)!important}.modal-table-wrap{margin:18px!important}.student-modal-head button{border:0!important;background:transparent!important;font-size:22px!important;color:#aaa!important;cursor:pointer!important}
@media(max-width:1080px){.sidebar{transform:translateX(-105%)!important}.sidebar.open{transform:translateX(0)!important}.main-area{margin-left:0!important}.topbar{left:0!important}.content{padding-top:65px!important}}
@media(max-width:760px){.permit-filter{grid-template-columns:1fr!important}.two-col{grid-template-columns:1fr!important}.topbar-school small{display:none!important}.top-user-trigger strong{display:none!important}}

/* Update 2026-05-17: penyesuaian header, login, menu, izin, dan proses massal */
:root{--sidebar-width:315px!important;--admin-green:#00a65a!important;--admin-green-dark:#00733e!important;--admin-sidebar:#10282f!important;--admin-sidebar-dark:#0b1f25!important}
body{font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important;font-size:15px!important}
.login-body{min-height:100vh!important;display:grid!important;place-items:center!important;background:radial-gradient(circle at 23% 18%,rgba(95,168,103,.38),transparent 32%),linear-gradient(135deg,#2b7740 0%,#0d5739 42%,#053b2b 100%)!important;padding:24px!important}
.login-card{width:min(760px,calc(100vw - 48px))!important;border-radius:26px!important;padding:30px!important;background:#fff!important;box-shadow:none!important}.login-brand img{width:52px!important;height:52px!important}.login-brand strong{font-size:20px!important;color:#051f18!important}.login-card h1{font-size:31px!important;color:#09251d!important}.login-card .form-field input{height:50px!important;border-radius:14px!important;background:#edf5ff!important;border-color:#d1dce8!important}.login-card .btn{height:42px!important;border-radius:999px!important;background:#108753!important}.login-footer a{color:#008749!important}
.sidebar{width:var(--sidebar-width)!important}.main-area{margin-left:var(--sidebar-width)!important}.topbar{left:var(--sidebar-width)!important;background:var(--admin-green)!important}.topbar-school strong{font-size:15px!important;letter-spacing:.01em!important;max-width:760px!important}.topbar-school small{font-size:11px!important;max-width:760px!important}
.sidebar-brand{background:#2d8d60!important}.sidebar-brand strong{font-size:18px!important}.sidebar-menu{font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important}.menu-link,.submenu-title{font-size:17px!important;min-height:45px!important;padding:12px 17px!important}.submenu-link{font-size:16px!important;min-height:35px!important}.menu-icon,.menu-icon svg{color:#edf4f6!important;fill:#edf4f6!important}.submenu{padding-left:52px!important}.menu-group>.menu-link:after,.submenu-title:after{color:#d9e7eb!important}
.content{padding-left:20px!important;padding-right:20px!important}.welcome-card,.stat-grid,.two-col{margin-left:0!important;margin-right:0!important}.two-col{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:18px!important}.two-col>.panel{min-height:255px!important;background:#fff!important}.quick-grid{padding:0 12px 16px!important}.step-list{padding-bottom:32px!important}.panel{background:#fff!important}.panel-head{background:#fff!important}
.permit-filter{grid-template-columns:240px minmax(420px,1fr) auto auto!important}.permit-filter label{align-self:end!important}.permit-filter input,.permit-filter select,.permit-filter .btn{height:36px!important}.permit-table-wrap table{min-width:1260px!important}.permit-home-table th:last-child,.permit-home-table td:last-child{min-width:235px!important}.permit-exit-table th:last-child,.permit-exit-table td:last-child{min-width:145px!important}.permit-actions{display:flex!important;align-items:center!important;gap:6px!important;white-space:nowrap!important;flex-wrap:nowrap!important}.permit-actions form{display:inline-flex!important;margin:0!important}.permit-actions .link{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:28px!important;padding:0 10px!important;border-radius:4px!important;background:#f4f7fb!important;border:1px solid #dbe4ea!important;color:#2473a6!important;font-weight:800!important}.permit-actions .success-text{color:#067d48!important;background:#e9f8ee!important;border-color:#bfe8ce!important}.permit-actions .danger-text{color:#c6372c!important;background:#fff1f0!important;border-color:#ffd1cd!important}.form-grid.permit-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}.permit-form .alert.wide{grid-column:1/-1!important}.bulk-filter{align-items:end!important;margin:12px!important}.bulk-filter .form-field{min-width:280px!important}.bulk-action-grid{margin:12px!important}.bulk-table-wrap{margin:12px!important}.bulk-table-wrap table{min-width:980px!important}.bulk-form .form-actions{margin:12px!important}.check-inline{display:inline-flex!important;gap:6px!important;align-items:center!important;white-space:nowrap!important}.success-text{color:#078848!important}.danger-text{color:#c0392b!important}
@media(max-width:1080px){.topbar{left:0!important}.main-area{margin-left:0!important}.sidebar{width:min(315px,88vw)!important}}
@media(max-width:760px){.permit-filter{grid-template-columns:1fr!important}.form-grid.permit-form,.bulk-action-grid{grid-template-columns:1fr!important}.login-card{width:min(100%,760px)!important;border-radius:20px!important}}

/* Compact professional action buttons for permit tables */
.permit-home-table th:last-child,
.permit-home-table td:last-child{width:156px!important;min-width:156px!important;max-width:156px!important;white-space:nowrap!important}
.permit-exit-table th:last-child,
.permit-exit-table td:last-child{width:94px!important;min-width:94px!important;max-width:94px!important;white-space:nowrap!important}
.permit-actions{gap:4px!important;flex-wrap:nowrap!important;justify-content:flex-start!important;white-space:nowrap!important}
.permit-actions form{display:inline-flex!important;margin:0!important;padding:0!important}
.permit-actions .link{height:24px!important;min-height:24px!important;line-height:22px!important;padding:0 7px!important;border-radius:3px!important;font-size:11px!important;font-weight:700!important;letter-spacing:0!important;box-shadow:none!important;text-decoration:none!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:1px solid #cfd8dc!important;background:#f8fafb!important;color:#2d6f9f!important}
.permit-actions .success-text{background:#eaf7ef!important;border-color:#b9dfc8!important;color:#087a43!important}
.permit-actions .danger-text{background:#fff1f1!important;border-color:#f1c4c4!important;color:#bf302b!important}
.permit-actions .link:hover{filter:brightness(.96)!important;transform:none!important}
.permit-actions .success-text:hover{background:#dff2e7!important;color:#066b3a!important}
.permit-actions .danger-text:hover{background:#ffe5e5!important;color:#a51f1a!important}

/* Update siswa 2026-05-18 */
:root{--sidebar-width:285px!important}
.sidebar{width:var(--sidebar-width)!important}.main-area{margin-left:var(--sidebar-width)!important}.topbar{left:var(--sidebar-width)!important}.sidebar-brand strong{font-size:17px!important}.menu-link,.submenu-title{font-size:16.5px!important;min-height:43px!important;padding:11px 15px!important}.submenu{padding-left:42px!important}.submenu-link{font-size:15.5px!important;min-height:34px!important}.menu-icon,.menu-icon svg{color:#eef5f6!important;fill:#eef5f6!important}.sidebar-user strong{font-size:15px!important}.student-list-panel{padding:0!important}.student-top-actions{display:flex!important;gap:5px!important;flex-wrap:wrap!important;padding:12px 14px 8px!important}.btn.cyan{background:#00acd6!important;color:#fff!important}.btn.blue{background:#3c8dbc!important;color:#fff!important}.btn.red{background:#dd4b39!important;color:#fff!important}.btn.green-soft{background:#00a65a!important;color:#fff!important}.btn.full{width:100%!important;margin-top:10px!important}.student-filter-row{display:grid!important;grid-template-columns:240px 240px 240px minmax(260px,1fr) auto!important;gap:8px!important;align-items:center!important;padding:0 14px 12px!important}.student-filter-row select,.student-filter-row input{height:38px!important;border:1px solid #d2d6de!important;border-radius:0!important;background:#fff!important;padding:7px 10px!important}.student-table-wrap{margin:0 14px 16px!important;border:0!important;border-radius:0!important}.student-data-table{min-width:1120px!important}.student-data-table th,.student-data-table td{font-size:14px!important;padding:8px 10px!important}.student-data-table th{text-transform:none!important;font-size:14px!important;color:#333!important;background:#fff!important;border-bottom:1px solid #111!important}.student-action-th{width:150px!important}.student-action-icons{display:flex!important;align-items:center!important;gap:4px!important;white-space:nowrap!important}.student-icon-btn{width:24px!important;height:24px!important;min-width:24px!important;border:0!important;border-radius:3px!important;display:inline-grid!important;place-items:center!important;color:#fff!important;font-size:12px!important;line-height:1!important;text-decoration:none!important;cursor:pointer!important;padding:0!important}.student-icon-btn.lock{background:#dd4b39!important}.student-icon-btn.view{background:#00c0ef!important}.student-icon-btn.edit{background:#f39c12!important}.student-icon-btn.print{background:#00a65a!important}.status-pill{display:inline-flex!important;border-radius:3px!important;padding:3px 7px!important;font-size:12px!important;font-weight:700!important;color:#fff!important;background:#777!important}.status-pill.active{background:#00a65a!important}.status-pill.neutral{background:#777!important}.student-form-layout{display:grid!important;grid-template-columns:minmax(0,1fr) 330px!important;gap:28px!important;margin:0!important}.student-form-main,.student-form-side{margin:0!important}.student-form-main{padding:0!important}.student-form-side{padding:14px!important}.student-tabs{margin:0!important;border-bottom:1px solid #f4f4f4!important;padding-left:12px!important}.student-tabs button,.sub-tabs button{background:#fff!important;border:1px solid transparent!important;border-top:3px solid transparent!important;padding:12px 18px!important;color:#333!important;cursor:pointer!important}.student-tabs button.active,.sub-tabs button.active{border-top-color:#3c8dbc!important;border-left-color:#eee!important;border-right-color:#eee!important;color:#111!important}.student-form-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;padding:14px!important}.student-form-grid .wide{grid-column:1/-1!important}.radio-inline{display:flex!important;gap:14px!important;align-items:center!important;min-height:36px!important}.student-required-note{padding:0 14px 18px!important;color:#777!important}.status-radio-list{display:grid!important;gap:8px!important;margin:8px 0 18px!important}.student-photo-preview{border:1px solid #d2d6de!important;border-radius:3px!important;background:#f7f7f7!important;display:grid!important;place-items:center!important;margin-bottom:12px!important;min-height:300px!important}.student-photo-preview img{max-width:240px!important;max-height:290px!important;object-fit:cover!important}.student-form-side input[type=file]{width:100%!important;margin:8px 0 10px!important}.student-upload-panel{padding:14px!important}.student-upload-panel h2{font-size:20px!important;font-weight:400!important;margin:0 0 14px!important}.student-upload-panel hr{border:0!important;border-top:1px solid #eee!important;margin:22px 0!important}.student-upload-form{display:grid!important;gap:14px!important;max-width:580px!important}.student-upload-form input[type=file]{display:block!important;margin-top:8px!important}.student-detail-panel{padding:0!important}.student-detail-grid{display:grid!important;grid-template-columns:280px minmax(0,1fr)!important;gap:32px!important;padding:18px 24px!important}.student-detail-photo{width:240px!important;height:240px!important;object-fit:cover!important;background:#ddd!important}.student-detail-table{display:grid!important;gap:0!important}.student-detail-table div{display:grid!important;grid-template-columns:260px 22px minmax(0,1fr)!important;min-height:38px!important;align-items:center!important;border-bottom:1px solid #eee!important}.student-detail-table span{font-size:15px!important}.student-detail-table b{font-style:normal!important}.student-detail-table em{font-style:normal!important}.student-detail-actions{display:flex!important;align-items:center!important;gap:6px!important;padding:0 24px 16px!important}.student-detail-actions form{display:inline-flex!important;margin:0!important}.sub-tabs{margin:10px 18px!important;border-bottom:1px solid #f4f4f4!important}.student-sub-table{min-width:1050px!important}.student-sub-table th{background:#d9edf7!important;color:#333!important;text-transform:none!important;font-size:14px!important;border-bottom:1px solid #111!important}.student-total-row td{font-weight:700!important;background:#fff!important}.student-card-print{padding:20px!important}.student-card-box{width:340px!important;border:1px solid #333!important;border-radius:12px!important;padding:18px!important;background:#fff!important;display:grid!important;gap:8px!important}.student-card-box img:first-child{width:45px!important}.student-card-box strong{display:block!important;font-size:18px!important}.student-card-box span{display:block!important;font-size:12px!important}.student-card-photo{width:100px!important;height:120px!important;object-fit:cover!important;justify-self:center!important}.student-card-box p{margin:2px 0!important}.empty-cell{background:#dff5df!important;color:#456!important}.form-field input,.form-field select,.form-field textarea{border-radius:0!important;background:#fff!important;border:1px solid #d2d6de!important}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#3c8dbc!important;box-shadow:none!important}@media(max-width:1080px){:root{--sidebar-width:285px!important}.topbar{left:0!important}.main-area{margin-left:0!important}.sidebar{width:min(285px,88vw)!important}.student-form-layout{grid-template-columns:1fr!important}.student-filter-row{grid-template-columns:1fr 1fr!important}.student-detail-grid{grid-template-columns:1fr!important}}@media(max-width:760px){.student-filter-row{grid-template-columns:1fr!important}.student-form-grid{grid-template-columns:1fr!important}.student-detail-table div{grid-template-columns:1fr!important;gap:3px!important}.student-detail-table b{display:none!important}}

/* === Mobile app menu modern 2026-05-19 === */
.mobile-app-menu[hidden],.mobile-bottom-nav{display:none!important}
.mobile-app-menu{font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important}
.mobile-app-menu svg,.mobile-bottom-nav svg{width:22px;height:22px;fill:currentColor;display:block}
@media(max-width:760px){
  body{padding-bottom:82px!important;background:#f3f7f4!important}
  body.mobile-menu-open{overflow:hidden!important}
  .sidebar{display:none!important}
  .main-area{margin-left:0!important;width:100%!important}
  .topbar{left:0!important;height:54px!important;min-height:54px!important;padding:0 12px!important;background:linear-gradient(135deg,#00a65a,#087c48)!important;box-shadow:0 6px 18px rgba(0,0,0,.12)!important}
  .topbar-left{gap:10px!important;height:54px!important;min-width:0!important}
  .sidebar-toggle{width:36px!important;height:36px!important;border-radius:14px!important;background:rgba(255,255,255,.16)!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:9px!important;gap:4px!important;flex:0 0 36px!important}
  .sidebar-toggle span{height:2px!important;background:#fff!important}
  .topbar-school{height:54px!important;min-width:0!important;max-width:calc(100vw - 145px)!important}
  .topbar-school strong{font-size:12.5px!important;line-height:1.15!important;max-width:100%!important;white-space:nowrap!important;text-overflow:ellipsis!important;overflow:hidden!important}
  .topbar-school small{display:none!important}
  .topbar-actions{height:54px!important;gap:8px!important;flex:0 0 auto!important}
  .notify-btn{width:34px!important;height:34px!important;border-radius:14px!important;background:rgba(255,255,255,.14)!important}
  .top-user-trigger{height:36px!important;padding:0!important;background:rgba(255,255,255,.14)!important;border-radius:18px!important;width:36px!important;display:grid!important;place-items:center!important}
  .top-user-trigger .avatar-img.small{width:30px!important;height:30px!important;border:2px solid rgba(255,255,255,.6)!important}
  .top-user-trigger strong{display:none!important}
  .top-user-dropdown{right:8px!important;top:58px!important;width:min(290px,calc(100vw - 16px))!important;border-radius:18px!important;overflow:hidden!important}
  .content{padding:12px 10px 92px!important;min-height:calc(100vh - 54px)!important}
  .content-titlebar{margin:0 0 10px!important;padding:0 2px!important;display:flex!important;align-items:flex-start!important;gap:4px!important;flex-direction:column!important}
  .content-titlebar h1{font-size:21px!important;font-weight:700!important;color:#1e352b!important;line-height:1.15!important}
  .content-titlebar h1 small{display:block!important;margin:2px 0 0!important;font-size:12px!important;color:#718078!important}
  .breadcrumb{display:none!important}
  .green-line{height:3px!important;border-radius:999px!important;margin:0 2px 12px!important;background:linear-gradient(90deg,#00a65a,#63d471)!important}
  .panel{border-radius:18px!important;overflow:hidden!important;border:1px solid rgba(11,75,45,.08)!important;box-shadow:0 10px 28px rgba(14,74,45,.08)!important;border-top:0!important;margin-bottom:14px!important}
  .panel-head{padding:12px 14px!important;background:#fff!important}
  .panel-head h2{font-size:18px!important;font-weight:700!important;color:#1d3329!important}
  .table-wrap{border-radius:14px!important;margin-left:8px!important;margin-right:8px!important;padding-bottom:8px!important}
  .data-table-toolbar,.table-foot,.toolbar,.tab-nav,.form-grid{margin-left:8px!important;margin-right:8px!important}
  .mobile-bottom-nav{position:fixed!important;left:10px!important;right:10px!important;bottom:10px!important;z-index:9000!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;gap:4px!important;min-height:66px!important;padding:7px!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(18px)!important;border:1px solid rgba(0,0,0,.08)!important;border-radius:24px!important;box-shadow:0 18px 40px rgba(0,0,0,.18)!important;font-family:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif!important}
  .mobile-bottom-nav a,.mobile-bottom-nav button{border:0!important;background:transparent!important;color:#6b7b73!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;min-width:0!important;border-radius:17px!important;font-size:10.5px!important;font-weight:800!important;padding:5px 2px!important;line-height:1!important;cursor:pointer!important}
  .mobile-bottom-nav a.active,.mobile-bottom-nav button:focus,.mobile-bottom-nav button:hover{background:#e8f7ee!important;color:#007f48!important}
  .mobile-bottom-nav svg{width:20px!important;height:20px!important}
  .mobile-bottom-nav span{display:block!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .mobile-app-menu{position:fixed!important;inset:0!important;z-index:12000!important;display:block!important;pointer-events:none!important}
  .mobile-app-menu.open{pointer-events:auto!important}
  .mobile-menu-backdrop{position:absolute!important;inset:0!important;background:rgba(6,18,13,.48)!important;opacity:0!important;transition:opacity .2s ease!important}
  .mobile-app-menu.open .mobile-menu-backdrop{opacity:1!important}
  .mobile-menu-sheet{position:absolute!important;left:0!important;right:0!important;bottom:0!important;max-height:90vh!important;min-height:72vh!important;background:linear-gradient(180deg,#f7fbf8 0%,#eef7f1 100%)!important;border-radius:30px 30px 0 0!important;box-shadow:0 -24px 70px rgba(0,0,0,.26)!important;transform:translateY(105%)!important;transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;overflow:hidden!important;color:#17382b!important}
  .mobile-app-menu.open .mobile-menu-sheet{transform:translateY(0)!important}
  .mobile-sheet-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:16px 18px 10px!important;background:linear-gradient(135deg,#00a65a,#087b48)!important;color:#fff!important}
  .mobile-user-mini{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important}
  .mobile-user-mini .avatar-img{width:44px!important;height:44px!important;border-radius:16px!important;border:2px solid rgba(255,255,255,.42)!important;background:#fff!important;object-fit:cover!important}
  .mobile-user-mini small{display:block!important;font-size:10.5px!important;letter-spacing:.07em!important;color:#d8ffeb!important;font-weight:900!important;line-height:1.1!important}
  .mobile-user-mini strong{display:block!important;font-size:16px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:220px!important;line-height:1.2!important;color:#fff!important}
  .mobile-close-btn{width:38px!important;height:38px!important;border:0!important;border-radius:14px!important;background:rgba(255,255,255,.17)!important;color:#fff!important;font-size:28px!important;line-height:1!important;display:grid!important;place-items:center!important;cursor:pointer!important}
  .mobile-menu-title{display:grid!important;gap:2px!important;padding:14px 18px 4px!important;color:#244739!important}
  .mobile-menu-title span{font-size:12px!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;color:#0a8d51!important}
  .mobile-menu-title strong{font-size:22px!important;letter-spacing:-.02em!important}
  .mobile-panel-stack{position:relative!important;overflow:auto!important;max-height:calc(90vh - 124px)!important;padding:0 12px 26px!important;scrollbar-width:none!important}
  .mobile-panel-stack::-webkit-scrollbar{display:none!important}
  .mobile-menu-panel{display:none!important;animation:mobilePanelIn .18s ease!important}
  .mobile-menu-panel.active{display:block!important}
  .mobile-panel-toolbar{display:flex!important;align-items:center!important;gap:10px!important;padding:8px 2px 12px!important;position:sticky!important;top:0!important;background:linear-gradient(180deg,#f7fbf8 70%,rgba(247,251,248,.8))!important;z-index:2!important}
  .mobile-back-btn{width:38px!important;height:38px!important;border:0!important;border-radius:15px!important;background:#fff!important;color:#087b48!important;font-size:31px!important;line-height:1!important;display:grid!important;place-items:center!important;box-shadow:0 8px 18px rgba(10,62,37,.08)!important;cursor:pointer!important}
  .mobile-panel-toolbar strong{display:block!important;font-size:19px!important;line-height:1.1!important;color:#17382b!important}
  .mobile-panel-toolbar small{display:block!important;font-size:12px!important;color:#73847a!important;margin-top:2px!important}
  .mobile-tile-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;padding:10px 0 20px!important}
  .mobile-app-tile{position:relative!important;min-height:112px!important;border:1px solid rgba(14,80,48,.07)!important;border-radius:24px!important;background:rgba(255,255,255,.96)!important;color:#1f3b30!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:space-between!important;padding:14px!important;text-align:left!important;box-shadow:0 12px 26px rgba(15,84,49,.08)!important;text-decoration:none!important;cursor:pointer!important;overflow:hidden!important;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important}
  .mobile-app-tile:after{content:""!important;position:absolute!important;right:-20px!important;bottom:-28px!important;width:80px!important;height:80px!important;border-radius:50%!important;background:rgba(0,166,90,.07)!important}
  .mobile-app-tile:hover,.mobile-app-tile:focus{transform:translateY(-2px)!important;box-shadow:0 16px 32px rgba(15,84,49,.14)!important;border-color:rgba(0,166,90,.25)!important;outline:none!important}
  .mobile-app-tile.active{border-color:#00a65a!important;background:linear-gradient(180deg,#fff,#eefaf2)!important}
  .mobile-app-tile.danger .mobile-app-icon{background:linear-gradient(135deg,#ff6b6b,#cf2e2e)!important;color:#fff!important}
  .mobile-app-tile strong{display:block!important;font-size:14.5px!important;font-weight:900!important;line-height:1.15!important;letter-spacing:-.01em!important;max-width:100%!important;color:#183a2c!important;z-index:1!important}
  .mobile-app-tile small{display:block!important;font-size:11px!important;font-weight:800!important;color:#74877c!important;z-index:1!important}
  .mobile-app-icon{width:48px!important;height:48px!important;border-radius:18px!important;display:grid!important;place-items:center!important;color:#fff!important;background:linear-gradient(135deg,#00a65a,#057345)!important;box-shadow:0 9px 18px rgba(0,166,90,.23)!important;z-index:1!important}
  .mobile-app-icon svg{width:25px!important;height:25px!important}
  .mobile-app-tile.group:before{content:"›"!important;position:absolute!important;right:13px!important;top:12px!important;color:#0c8a50!important;font-size:26px!important;font-weight:400!important;z-index:1!important}
  @keyframes mobilePanelIn{from{opacity:.55;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
}
@media(max-width:390px){
  .mobile-tile-grid{gap:10px!important}
  .mobile-app-tile{min-height:106px!important;padding:12px!important;border-radius:21px!important}
  .mobile-app-icon{width:44px!important;height:44px!important;border-radius:16px!important}
  .mobile-app-tile strong{font-size:13.5px!important}
  .mobile-bottom-nav{left:8px!important;right:8px!important;bottom:8px!important;padding:6px!important}
}

.permission-grid-advanced fieldset{display:grid;gap:8px}.permission-option{border:1px solid #e5eee8;border-radius:9px;background:#fff;padding:9px}.permission-option .permission-title{font-weight:900;color:#20372e;margin-bottom:6px}.permission-option label{margin:4px 0;font-size:12px}.permission-option .readonly-check{color:#0c6a45}
@media(max-width:680px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}.stat-card{padding:13px}.stat-card strong{font-size:28px}.stat-card span{font-size:10px}.stat-card p{font-size:12px}}

/* Update template kartu santri/siswa */
.student-card-template-page .panel-head{align-items:flex-start!important}.student-card-template-grid{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:18px;align-items:start}.card-size-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.card-field-table-wrap{margin-top:14px}.card-field-table{min-width:980px!important}.card-field-table th{font-size:12px!important;text-transform:none!important;color:#333!important;background:#f4faf6!important}.card-field-table td{font-size:12px!important;padding:7px!important}.card-field-table input[type=number]{width:72px!important;padding:6px!important}.card-field-table input[type=color]{width:42px!important;height:30px!important;padding:2px!important}.card-field-table select{min-width:76px!important;padding:6px!important;border:1px solid var(--border)!important}.card-preview-sticky{position:sticky;top:76px;background:#f8fbf9;border:1px solid var(--border);border-radius:12px;padding:14px}.card-preview-sticky h3{margin:4px 0 10px;font-size:15px}.card-preview-scale{width:100%;overflow:auto;background:#e9f4ee;border:1px dashed #bdd9c9;border-radius:12px;padding:14px;display:grid;place-items:center}.small-preview{margin-bottom:10px}.card-template-canvas{position:relative;background-size:cover;background-position:center;background-repeat:no-repeat;border:1px solid #d5ddd8;box-shadow:0 10px 28px rgba(18,54,39,.12);overflow:hidden;color:#111;flex:0 0 auto}.card-template-canvas.empty-template{background:linear-gradient(135deg,#e9f5ee,#ffffff)}.card-template-empty{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:#819087;font-weight:900;font-size:10pt;padding:8mm}.card-field{position:absolute;z-index:2;overflow:hidden;line-height:1.15;font-weight:800;display:flex;align-items:center;justify-content:flex-start;white-space:normal}.card-field[style*="text-align:center"]{justify-content:center}.card-field[style*="text-align:right"]{justify-content:flex-end}.card-photo-field{border:1px solid rgba(0,0,0,.15);background:#fff;display:block}.card-photo-field img{width:100%;height:100%;object-fit:cover;display:block}.student-card-print-page{background:#fff}.student-card-sheet{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;padding:10px 24px 24px}.muted-note{color:var(--muted);font-size:13px;margin:0 24px 12px}.student-card-print-page .student-detail-actions{padding:10px 24px 8px!important}
@media(max-width:1100px){.student-card-template-grid{grid-template-columns:1fr}.card-preview-sticky{position:static}.card-preview-scale{justify-content:flex-start}}
@media print{.sidebar,.topbar,.no-print,.mobile-bottom-nav,.mobile-menu-sheet,.mobile-sheet-backdrop{display:none!important}.main-area{margin:0!important}.content{padding:0!important}.panel{box-shadow:none!important;border:0!important}.student-card-print-page{padding:0!important}.student-card-sheet{gap:6mm;padding:0!important;display:flex!important;align-items:flex-start!important}.card-template-canvas{box-shadow:none!important;break-inside:avoid;page-break-inside:avoid}@page{size:A4;margin:10mm}}

/* === Update 2026-05-21: header HP, dialog cari siswa, dashboard mobile === */
.mobile-top-brand{display:none}
.student-modal-tools{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 26px 8px;color:#333;font-size:16px}
.student-modal-tools label{display:flex;align-items:center;gap:6px;font-weight:400}
.student-modal-tools select{height:34px;min-width:74px;border:1px solid #999;background:#fff;border-radius:3px;padding:3px 8px}
.student-modal-search-label{margin-left:auto}
.student-modal-search-label input{width:min(330px,42vw);height:38px;border:2px solid #444;border-radius:2px;background:#fff;padding:7px 10px;outline:none}
.student-modal-search-label input:focus{border-color:#00a65a;box-shadow:0 0 0 3px rgba(0,166,90,.12)}
.student-modal-empty{margin:8px 26px 0;padding:12px 14px;background:#fff6e8;border:1px solid #f1d4a8;border-radius:4px;color:#8a5c00;font-weight:700}
.student-modal-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
.student-modal-foot span{color:#555;font-size:14px}
.student-modal .modal-table-wrap table{min-width:720px!important}
.student-modal .modal-table-wrap th{background:#fff!important;color:#333!important;text-transform:none!important;font-size:15px!important;border-bottom:1px solid #111!important;text-align:center!important}
.student-modal .modal-table-wrap td{font-size:15px!important;text-align:center!important}
.student-modal .modal-table-wrap td:nth-child(3){text-align:left!important}
@media(max-width:760px){
  body{padding-top:0!important}
  .topbar{height:118px!important;min-height:118px!important;padding:0!important;background:linear-gradient(180deg,#0aa360 0%,#08a45c 100%)!important;display:grid!important;grid-template-columns:1fr auto!important;grid-template-rows:54px 64px!important;align-items:stretch!important;gap:0!important;box-shadow:0 4px 14px rgba(0,0,0,.18)!important}
  .mobile-top-brand{display:flex!important;grid-column:1/-1!important;grid-row:1!important;align-items:center!important;gap:12px!important;padding:7px 14px!important;background:rgba(0,0,0,.12)!important;color:#fff!important;min-width:0!important}
  .mobile-top-brand img{width:42px!important;height:42px!important;object-fit:contain!important;filter:drop-shadow(0 2px 3px rgba(0,0,0,.12))!important}
  .mobile-top-brand strong{font-size:24px!important;line-height:1!important;font-weight:900!important;letter-spacing:.015em!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .topbar-left{grid-column:1!important;grid-row:2!important;height:64px!important;display:flex!important;align-items:center!important;gap:12px!important;padding:8px 8px 8px 12px!important;min-width:0!important}
  .sidebar-toggle{width:39px!important;height:39px!important;border-radius:0!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:7px!important;flex:0 0 39px!important}
  .sidebar-toggle span{height:4px!important;border-radius:8px!important;background:#fff!important;width:100%!important}
  .topbar-school{height:auto!important;display:grid!important;gap:4px!important;min-width:0!important;max-width:calc(100vw - 150px)!important;color:#fff!important}
  .topbar-school strong{display:block!important;font-size:15px!important;line-height:1.12!important;font-weight:900!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
  .topbar-school small{display:block!important;font-size:10.5px!important;line-height:1.2!important;color:rgba(255,255,255,.92)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important;font-weight:700!important}
  .topbar-actions{grid-column:2!important;grid-row:2!important;height:64px!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:12px!important;padding:8px 12px 8px 0!important;background:transparent!important}
  .notify-btn{width:34px!important;height:34px!important;background:transparent!important;color:#fff!important;border:0!important;box-shadow:none!important}
  .notify-btn:before{font-size:19px!important;color:#fff!important}
  .top-user-trigger{width:40px!important;height:40px!important;padding:0!important;border-radius:50%!important;background:rgba(255,255,255,.18)!important;border:1px solid rgba(255,255,255,.22)!important;overflow:hidden!important;display:grid!important;place-items:center!important}
  .top-user-trigger strong{display:none!important}
  .top-user-trigger .avatar-img.small{width:36px!important;height:36px!important;margin:0!important;border-radius:50%!important}
  .top-user-dropdown{right:6px!important;top:58px!important;min-width:230px!important}
  .content{padding:12px 10px 96px!important}
  .content-titlebar{padding-top:3px!important}
  .content-titlebar h1{font-size:22px!important}
  .two-col{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .two-col .panel{width:100%!important;margin:0!important}
  .quick-grid{grid-template-columns:1fr!important}
  .student-modal-dialog{left:10px!important;right:10px!important;top:7vh!important;max-height:86vh!important;width:auto!important;overflow:auto!important}
  .student-modal-tools{padding:12px 14px 6px!important;display:grid!important;grid-template-columns:1fr!important;gap:9px!important;font-size:14px!important}
  .student-modal-search-label{margin-left:0!important;justify-content:space-between!important}
  .student-modal-search-label input{width:min(100%,260px)!important;height:36px!important}
  .student-modal .modal-table-wrap{margin:0 14px!important;overflow:auto!important}
  .student-modal .modal-table-wrap table{min-width:680px!important}
}

/* === Update 2026-05-22: notifikasi lonceng, laporan absensi offline, dan print === */
.notify-btn{position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:38px!important;height:38px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:#fff!important;cursor:pointer!important}
.notify-btn .bell-icon{font-size:0!important;width:20px!important;height:20px!important;display:block!important;position:relative!important}
.notify-btn .bell-icon:before{content:"\1F514"!important;font-size:18px!important;line-height:20px!important;color:#fff!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.14))!important}
.notify-dot{position:absolute!important;right:8px!important;top:7px!important;width:9px!important;height:9px!important;border-radius:999px!important;background:#ff4d4f!important;border:2px solid #fff!important;display:block!important}
.notify-dot[hidden]{display:none!important}
.admin-notify-toast{position:fixed!important;right:28px!important;top:82px!important;z-index:12000!important;display:flex!important;align-items:center!important;gap:14px!important;width:min(360px,calc(100vw - 28px))!important;padding:16px 42px 16px 16px!important;border-radius:3px!important;color:#fff!important;box-shadow:0 12px 35px rgba(0,0,0,.24)!important;animation:notifySlideIn .28s ease-out both!important}
.admin-notify-toast.success{background:#00c853!important;border-bottom:5px solid #ff5b4d!important}.admin-notify-toast.error{background:#e53935!important;border-bottom:5px solid #ffcc80!important}.admin-notify-icon{display:flex!important;align-items:center!important;justify-content:center!important;font-size:28px!important;font-weight:900!important;line-height:1!important;width:34px!important;height:34px!important;flex:0 0 34px!important}.admin-notify-toast strong{display:block!important;font-size:14px!important;font-weight:900!important;margin:0 0 4px!important}.admin-notify-toast p{margin:0!important;font-size:13px!important;line-height:1.35!important;color:#fff!important}.admin-notify-close{position:absolute!important;right:10px!important;top:7px!important;border:0!important;background:transparent!important;color:#fff!important;font-size:18px!important;font-weight:900!important;cursor:pointer!important}.admin-notify-toast.is-hidden{display:none!important}@keyframes notifySlideIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
.attendance-report-filter{display:grid!important;grid-template-columns:repeat(4,minmax(170px,1fr)) auto!important;gap:14px!important;align-items:end!important;margin:12px!important}.attendance-report-filter .attendance-actions{display:flex!important;gap:8px!important}.attendance-report-sheet{background:#fff!important;margin:12px!important;border:1px solid #e1e5ea!important;padding:12px!important}.attendance-report-title{text-align:center!important;border-bottom:1px solid #edf0f4!important;margin-bottom:10px!important;padding-bottom:8px!important}.attendance-report-title h3{font-size:18px!important;margin:0 0 4px!important}.attendance-report-title p{margin:0!important;color:#555!important;font-size:13px!important}.attendance-report-table-wrap{overflow:auto!important}.attendance-monthly-table{min-width:1320px!important;width:100%!important;border-collapse:collapse!important}.attendance-monthly-table th,.attendance-monthly-table td{border:1px solid #e1e5ea!important;text-align:center!important;padding:7px 6px!important;font-size:12px!important;line-height:1.2!important}.attendance-monthly-table th{background:#fff!important;font-weight:800!important;color:#222!important}.attendance-monthly-table td:nth-child(2),.attendance-monthly-table td:nth-child(3),.attendance-monthly-table th:nth-child(2),.attendance-monthly-table th:nth-child(3){text-align:left!important}.attendance-monthly-table .student-name-cell{min-width:165px!important}.attendance-report-notes{margin:10px 0 0!important;font-size:12px!important;color:#555!important}.attendance-report-signature{display:grid!important;grid-template-columns:1fr 260px!important;gap:20px!important;margin-top:22px!important}.signature-box{text-align:center!important}.signature-box p{margin:0 0 6px!important}.signature-space{height:64px!important}.signature-box strong{display:block!important;text-decoration:underline!important}.report-print-head{align-items:center!important}
@media(max-width:760px){.admin-notify-toast{right:14px!important;top:90px!important}.attendance-report-filter{grid-template-columns:1fr!important}.attendance-report-filter .attendance-actions{display:grid!important;grid-template-columns:1fr 1fr!important}.attendance-report-sheet{margin:10px 6px!important;padding:8px!important}.attendance-monthly-table{min-width:1120px!important}.attendance-monthly-table th,.attendance-monthly-table td{font-size:11px!important;padding:6px 5px!important}.attendance-report-signature{grid-template-columns:1fr!important}.signature-box{justify-self:end!important;min-width:220px!important}}
@media print{.sidebar,.topbar,.content-titlebar,.green-line,.no-print,.report-print-head .btn,.mobile-app-menu,.mobile-bottom-nav,.admin-notify-toast,.alert{display:none!important}.content{margin:0!important;padding:0!important;background:#fff!important}.content-shell,.admin-wrapper{display:block!important}.panel{border:0!important;box-shadow:none!important;margin:0!important}.attendance-report-sheet{border:0!important;margin:0!important;padding:0!important}.attendance-report-table-wrap{overflow:visible!important}.attendance-monthly-table{min-width:0!important}.attendance-monthly-table th,.attendance-monthly-table td{font-size:9px!important;padding:4px 3px!important}.attendance-report-title h3{font-size:16px!important}@page{size:landscape;margin:10mm}}


/* === FIX 2026-05-22: lonceng notifikasi aktif dan panel riwayat === */
.topbar-actions{overflow:visible!important}.notify-wrap{position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.notify-panel{position:absolute!important;right:0!important;top:calc(100% + 12px)!important;width:340px!important;max-width:calc(100vw - 24px)!important;background:#fff!important;color:#24323a!important;border:1px solid #d8e0e5!important;border-radius:8px!important;box-shadow:0 18px 45px rgba(0,0,0,.22)!important;z-index:13000!important;overflow:hidden!important;transform-origin:top right!important;opacity:0!important;transform:translateY(-6px) scale(.98)!important;transition:.18s ease!important}.notify-panel.show{opacity:1!important;transform:translateY(0) scale(1)!important}.notify-panel[hidden]{display:none!important}.notify-panel:before{content:""!important;position:absolute!important;right:16px!important;top:-7px!important;width:14px!important;height:14px!important;background:#fff!important;border-left:1px solid #d8e0e5!important;border-top:1px solid #d8e0e5!important;transform:rotate(45deg)!important}.notify-panel-head{position:relative!important;padding:12px 14px!important;background:#f7faf8!important;border-bottom:1px solid #e6eeee!important;font-weight:900!important;color:#0b6f3d!important}.notify-item{display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:10px!important;padding:12px 14px!important;border-bottom:1px solid #eef2f3!important}.notify-item:last-child{border-bottom:0!important}.notify-item-icon{display:flex!important;align-items:center!important;justify-content:center!important;width:28px!important;height:28px!important;border-radius:999px!important;color:#fff!important;font-weight:900!important;background:#00a65a!important}.notify-item.error .notify-item-icon{background:#e53935!important}.notify-item strong{display:block!important;font-size:13px!important;margin:0 0 3px!important;color:#172b36!important}.notify-item p{margin:0!important;font-size:12px!important;line-height:1.35!important;color:#344b55!important}.notify-item small{display:block!important;margin-top:4px!important;font-size:11px!important;color:#7b8c94!important}.notify-empty{padding:18px!important;text-align:center!important;color:#819098!important;font-size:13px!important}.admin-notify-toast{display:flex!important}.notify-dot:not([hidden]){display:block!important}
@media(max-width:760px){.notify-panel{right:-60px!important;top:44px!important;width:310px!important}.notify-panel:before{right:72px!important}.admin-notify-toast{top:132px!important;right:12px!important;width:calc(100vw - 24px)!important}}

/* === FINAL FIX 2026-05-22: lonceng tunggal putih, kartu PDF santri, export laporan === */
.notify-btn{background:transparent!important;color:#fff!important;border:0!important;box-shadow:none!important;width:36px!important;height:36px!important;padding:0!important;line-height:1!important}
.notify-btn .bell-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:22px!important;height:22px!important;font-size:0!important;color:#fff!important}
.notify-btn .bell-icon:before,.notify-btn .bell-icon:after{content:none!important;display:none!important}
.notify-btn .bell-icon svg{display:block!important;width:20px!important;height:20px!important;fill:currentColor!important;color:#fff!important}
.report-action-buttons{display:flex!important;gap:8px!important;align-items:center!important;flex-wrap:wrap!important}.attendance-report-filter .attendance-actions{display:flex!important;gap:8px!important;align-items:end!important;flex-wrap:wrap!important}
.card-template-canvas{background-size:100% 100%!important;background-position:center!important;background-repeat:no-repeat!important}
.card-pdf-front,.card-pdf-back{position:relative!important;overflow:hidden!important;background:#fff!important;border:1px solid #bdbdbd!important;color:#111!important;font-family:Arial,Helvetica,sans-serif!important;box-shadow:none!important}
.card-front-header{position:absolute!important;left:4mm!important;right:4mm!important;top:3mm!important;height:14.8mm!important;background:#08753d!important;color:#fff!important;display:flex!important;align-items:center!important;gap:2.6mm!important;padding:1.3mm 2mm!important;border-radius:0!important;z-index:2!important}
.card-front-header img{width:12mm!important;height:12mm!important;object-fit:contain!important;flex:0 0 12mm!important}.card-front-header strong{font-size:7.2pt!important;line-height:1.02!important;letter-spacing:.2px!important;text-align:center!important;display:block!important}.card-front-header small{display:block!important;background:#0c5f35!important;color:#fff!important;border-radius:2px!important;margin-top:.6mm!important;padding:.5mm 1mm!important;font-size:3.7pt!important;line-height:1!important;text-align:center!important;white-space:nowrap!important}
.card-watermark-text{position:absolute!important;left:3mm!important;right:3mm!important;top:20mm!important;height:30mm!important;color:rgba(230,221,47,.44)!important;font-size:5.8pt!important;line-height:1.65!important;transform:rotate(-8deg)!important;text-align:center!important;overflow:hidden!important;z-index:1!important}
.card-watermark-text:before,.card-watermark-text:after{content:attr(class)!important;display:block!important;visibility:hidden!important}
.card-front-body{position:absolute!important;left:6mm!important;right:6mm!important;top:19mm!important;z-index:2!important;text-align:left!important}.card-front-body h3{margin:0 0 1.8mm!important;text-align:center!important;color:#1f54b7!important;text-decoration:underline!important;font-size:10pt!important;line-height:1.1!important}.card-front-body p{margin:0 0 1.7mm!important;font-size:5.8pt!important;line-height:1.32!important;color:#111!important}.card-front-body strong{display:block!important;font-size:6pt!important;color:#111!important}.card-front-footer{position:absolute!important;right:4mm!important;bottom:2.3mm!important;color:#0d6b3f!important;font-size:4.8pt!important;font-weight:700!important}
.card-pdf-back{padding:4mm 5mm!important}.card-back-watermark{position:absolute!important;left:28mm!important;top:9mm!important;width:30mm!important;height:30mm!important;opacity:.13!important;object-fit:contain!important}.card-back-lines{position:absolute!important;left:6mm!important;right:6mm!important;top:4.5mm!important;z-index:2!important}.card-back-row{display:grid!important;grid-template-columns:28mm 3mm 1fr!important;gap:0!important;align-items:start!important;min-height:4.2mm!important;font-size:6.2pt!important;line-height:1.1!important}.card-back-row span{font-weight:400!important}.card-back-row b{text-align:center!important}.card-back-row strong{font-weight:700!important;word-break:break-word!important}.card-back-date{position:absolute!important;right:6mm!important;bottom:17mm!important;font-size:5.8pt!important;z-index:2!important}.card-back-sign{position:absolute!important;right:5mm!important;bottom:3mm!important;width:28mm!important;text-align:center!important;font-size:5.8pt!important;z-index:2!important}.card-back-sign span{display:block!important;margin-bottom:1mm!important}.stamp-space{height:9mm!important}.card-back-sign strong{font-size:6.3pt!important}.card-back-valid{position:absolute!important;left:6mm!important;bottom:4.2mm!important;z-index:2!important}.card-back-valid span{display:block!important;font-size:6.2pt!important;margin-bottom:1mm!important}.card-back-valid strong{display:inline-block!important;background:#007a3d!important;color:#fff!important;font-size:6.3pt!important;padding:.6mm 1.4mm!important;line-height:1!important}
.student-card-sheet{display:flex!important;gap:14px!important;align-items:flex-start!important;flex-wrap:wrap!important}.student-card-print-page .student-card-sheet{justify-content:center!important;background:#fff!important;padding:14px!important}.card-preview-scale .card-pdf-front,.card-preview-scale .card-pdf-back,.small-preview .card-pdf-front,.small-preview .card-pdf-back{transform-origin:top left!important}
@media print{.student-card-print-page{border:0!important;box-shadow:none!important}.student-card-sheet{padding:0!important;gap:6mm!important;break-inside:avoid!important}.card-pdf-front,.card-pdf-back,.card-template-canvas{print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important;box-shadow:none!important}}
@media(max-width:760px){.topbar-actions .notify-wrap+.notify-wrap{display:none!important}.report-action-buttons{justify-content:flex-start!important}.student-card-sheet{overflow-x:auto!important;justify-content:flex-start!important}.card-pdf-front,.card-pdf-back{flex:0 0 auto!important}.attendance-report-filter .attendance-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.attendance-report-filter .attendance-actions .btn{width:100%!important}}

/* Update koordinat template kartu belakang */
.card-side-pill{display:inline-flex!important;align-items:center!important;border-radius:999px!important;padding:2px 7px!important;font-size:11px!important;font-weight:900!important;background:#e8f7ee!important;color:#08733f!important;white-space:nowrap!important}.card-side-pill.back{background:#edf4ff!important;color:#1f5b96!important}.card-custom-back .card-field{font-weight:700!important;line-height:1.05!important;align-items:flex-start!important;overflow:visible!important}.card-custom-back .card-valid-field{font-weight:900!important;align-items:center!important;justify-content:center!important;line-height:1!important;letter-spacing:.01em}.card-custom-front .card-field{font-weight:800!important}.card-field-table{min-width:1100px!important}

/* === FIX: tampilkan hanya 1 ikon lonceng di topbar === */
.notify-btn:before,
.notify-btn:after{
  content:none!important;
  display:none!important;
}

/* === REVISI 2026-05-23: judul banner lebih kecil & tabel absensi mobile tanpa geser status === */
/* Header/banner admin: diperkecil agar nama lembaga dan alamat lebih mudah masuk tanpa mengubah struktur topbar. */
.topbar-school strong{
  font-size:13px!important;
  line-height:1.08!important;
  letter-spacing:.005em!important;
  max-width:min(58vw,720px)!important;
}
.topbar-school small{
  font-size:9.5px!important;
  line-height:1.15!important;
  margin-top:3px!important;
  max-width:min(60vw,760px)!important;
}

@media(max-width:760px){
  .topbar-school{
    max-width:calc(100vw - 138px)!important;
    gap:2px!important;
  }
  .topbar-school strong{
    font-size:10.6px!important;
    line-height:1.1!important;
    letter-spacing:0!important;
    white-space:normal!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    max-width:100%!important;
  }
  .topbar-school small{
    display:block!important;
    font-size:8.8px!important;
    line-height:1.08!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:100%!important;
    margin-top:1px!important;
  }
}

/* Absensi harian: hanya di modul Absensi Santri/Siswa, supaya kolom Status terlihat di HP tanpa scroll horizontal. */
@media(max-width:760px){
  .attendance-panel #attendance-daily .table-wrap{
    overflow:visible!important;
    margin-left:6px!important;
    margin-right:6px!important;
    padding-bottom:6px!important;
  }
  .attendance-panel #attendance-daily .table-wrap table{
    min-width:0!important;
    width:100%!important;
    table-layout:fixed!important;
  }
  .attendance-panel #attendance-daily .table-wrap th,
  .attendance-panel #attendance-daily .table-wrap td{
    padding:7px 5px!important;
    font-size:12px!important;
    line-height:1.25!important;
    vertical-align:middle!important;
  }
  .attendance-panel #attendance-daily .table-wrap th:first-child,
  .attendance-panel #attendance-daily .table-wrap td:first-child{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    text-align:center!important;
  }
  .attendance-panel #attendance-daily .table-wrap th:nth-child(2),
  .attendance-panel #attendance-daily .table-wrap td:nth-child(2){
    width:auto!important;
    min-width:0!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .attendance-panel #attendance-daily .table-wrap td:nth-child(2) strong{
    display:block!important;
    font-size:12px!important;
    line-height:1.18!important;
  }
  .attendance-panel #attendance-daily .table-wrap td:nth-child(2) small{
    display:block!important;
    font-size:10px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .attendance-panel #attendance-daily .table-wrap th:nth-child(3),
  .attendance-panel #attendance-daily .table-wrap td:nth-child(3){
    width:106px!important;
    min-width:106px!important;
    max-width:106px!important;
  }
  .attendance-panel #attendance-daily .attendance-status-select{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:32px!important;
    padding:5px 4px!important;
    font-size:11.5px!important;
  }
}
@media(max-width:390px){
  .attendance-panel #attendance-daily .table-wrap th:first-child,
  .attendance-panel #attendance-daily .table-wrap td:first-child{
    width:32px!important;
    min-width:32px!important;
    max-width:32px!important;
  }
  .attendance-panel #attendance-daily .table-wrap th:nth-child(3),
  .attendance-panel #attendance-daily .table-wrap td:nth-child(3){
    width:96px!important;
    min-width:96px!important;
    max-width:96px!important;
  }
  .attendance-panel #attendance-daily .attendance-status-select{
    font-size:11px!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }
}



/* === REVISI 2026-05-23: evaluasi denda & tanda tangan cetak absensi === */
.fine-type-input{
  width:170px!important;
  max-width:100%!important;
  min-height:34px!important;
  border:1px solid #d9e3e8!important;
  border-radius:8px!important;
  padding:7px 9px!important;
  font-size:12px!important;
  background:#fff!important;
  color:#172b36!important;
}
.attendance-report-signature{
  grid-template-columns:260px 260px!important;
  justify-content:space-between!important;
  align-items:start!important;
}
@media(max-width:760px){
  .fine-type-input{width:140px!important;font-size:11px!important;padding:6px 7px!important}
  .attendance-report-signature{grid-template-columns:1fr 1fr!important;gap:12px!important}
  .attendance-report-signature .signature-box{justify-self:stretch!important;min-width:0!important;font-size:11px!important}
}
@media print{
  .attendance-report-signature{grid-template-columns:260px 260px!important;justify-content:space-between!important}
}


/* === REVISI 2026-05-23: filter evaluasi sejajar & evaluasi khusus Dayah === */
.report-filter{
  align-items:flex-end!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
.report-filter .form-field{
  margin-bottom:0!important;
}
.report-filter .btn{
  align-self:flex-end!important;
  min-height:34px!important;
  margin-top:0!important;
  margin-bottom:0!important;
}
@media(max-width:680px){
  .report-filter{
    align-items:stretch!important;
  }
  .report-filter .btn{
    width:100%!important;
    align-self:stretch!important;
  }
}

/* === REVISI 2026-05-23: tinggi filter evaluasi sama & tombol sejajar === */
.report-filter{
  align-items:flex-end!important;
}
.report-filter .form-field{
  align-self:flex-end!important;
  margin-bottom:0!important;
}
.report-filter .form-field span{
  min-height:18px!important;
  line-height:18px!important;
}
.report-filter .form-field input[type="date"],
.report-filter .form-field select{
  height:38px!important;
  min-height:38px!important;
  line-height:20px!important;
  padding:7px 10px!important;
  box-sizing:border-box!important;
}
.report-filter .btn{
  height:38px!important;
  min-height:38px!important;
  line-height:20px!important;
  padding:0 14px!important;
  align-self:flex-end!important;
  margin-top:0!important;
  margin-bottom:0!important;
}
@media(max-width:680px){
  .report-filter .form-field,
  .report-filter .btn{
    align-self:stretch!important;
  }
  .report-filter .btn{
    width:100%!important;
  }
}

/* === REVISI 2026-05-24: tanda tangan manual & QR Code otomatis di kartu santri === */
.card-front-sign-qr{
  position:absolute!important;
  left:6mm!important;
  right:6mm!important;
  bottom:6.4mm!important;
  z-index:3!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:3mm!important;
}
.card-front-sign-box{
  width:39mm!important;
  min-height:13mm!important;
  text-align:center!important;
  color:#111!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
.card-front-sign-box span{
  display:block!important;
  font-size:5.8pt!important;
  line-height:1.1!important;
  font-weight:700!important;
  margin-bottom:.8mm!important;
}
.card-front-sign-line{
  height:8mm!important;
  border-bottom:.35mm solid #111!important;
}
.card-front-qr{
  width:15.5mm!important;
  height:15.5mm!important;
  background:#fff!important;
  border:.25mm solid #111!important;
  padding:.75mm!important;
  flex:0 0 15.5mm!important;
  display:grid!important;
  place-items:center!important;
}
.card-front-qr svg,
.card-qr-field svg{
  width:100%!important;
  height:100%!important;
  display:block!important;
}
.card-qr-field{
  background:#fff!important;
  border:1px solid rgba(0,0,0,.22)!important;
  padding:.65mm!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.card-signature-field{
  display:block!important;
  text-align:center!important;
  font-weight:700!important;
  line-height:1.1!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
.card-signature-field span{
  display:block!important;
  margin-bottom:.6mm!important;
}
.card-signature-field i{
  display:block!important;
  height:6.5mm!important;
  border-bottom:.35mm solid currentColor!important;
}
@media print{
  .card-front-qr,
  .card-qr-field{
    print-color-adjust:exact!important;
    -webkit-print-color-adjust:exact!important;
  }
}

/* === REVISI 2026-05-25: mobile header, statistik rekap absensi, dan galeri landscape === */
@media(max-width:760px){
  .main-area{margin-left:0!important;width:100%!important}
  .topbar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    height:118px!important;
    min-height:118px!important;
    max-height:118px!important;
    z-index:9500!important;
  }
  .content{padding-top:130px!important;padding-bottom:96px!important}
  .mobile-top-brand{height:54px!important;align-items:center!important}
  .mobile-top-brand-text{display:grid!important;gap:2px!important;min-width:0!important;line-height:1!important}
  .mobile-top-brand-text strong{display:block!important;font-size:22px!important;line-height:1!important;font-weight:900!important;letter-spacing:.015em!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:calc(100vw - 96px)!important}
  .mobile-top-brand-text small{display:block!important;font-size:11px!important;line-height:1.08!important;color:rgba(255,255,255,.92)!important;font-weight:700!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:calc(100vw - 96px)!important}
  .attendance-panel #attendance-recap .summary-grid{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:5px!important;
    margin:0 6px 10px!important;
  }
  .attendance-panel #attendance-recap .summary-box{
    min-width:0!important;
    padding:7px 4px!important;
    text-align:center!important;
    border-top-width:3px!important;
  }
  .attendance-panel #attendance-recap .summary-box span{
    display:block!important;
    font-size:9px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .attendance-panel #attendance-recap .summary-box strong{
    font-size:18px!important;
    line-height:1!important;
    margin-top:3px!important;
  }
}
@media(max-width:390px){
  .mobile-top-brand-text strong{font-size:19px!important}
  .mobile-top-brand-text small{font-size:10px!important}
  .attendance-panel #attendance-recap .summary-grid{gap:3px!important;margin-left:3px!important;margin-right:3px!important}
  .attendance-panel #attendance-recap .summary-box{padding:6px 2px!important}
  .attendance-panel #attendance-recap .summary-box span{font-size:8px!important}
  .attendance-panel #attendance-recap .summary-box strong{font-size:16px!important}
}
.gallery-card > img,
.gallery-card > .image-placeholder,
.preview-grid .gallery-card > img,
.preview-grid .gallery-card > .image-placeholder,
.thumb.gallery-thumb{
  aspect-ratio:16/9!important;
  width:100%!important;
  height:auto!important;
  object-fit:cover!important;
}


/* === REVISI 2026-05-25: foto profil pengguna === */
.profile-form input[type="file"]{height:auto!important;padding:8px!important;background:#fff!important}
.profile-form .muted-text{display:block!important;margin-top:6px!important;color:#777!important;font-size:12px!important}
.profile-photo-remove{grid-column:1/-1!important;margin:0 12px 8px!important;color:#555!important}
.profile-card-main .profile-avatar{object-fit:cover!important;background:#eef3f0!important}


/* === REVISI 2026-05-25: input tanggal format dd/mm/yyyy === */
.date-display-input{height:38px!important;min-height:38px!important;line-height:38px!important;padding:7px 10px!important;font-variant-numeric:tabular-nums!important;background:#fff!important}
.date-display-input::placeholder{color:#9aa3a7!important}


/* === REVISI 2026-05-25: kartu santri Arial regular & tanggal kartu memakai nama bulan === */
.card-template-canvas,
.card-template-canvas *:not(svg):not(path):not(rect){
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:400!important;
}
.card-template-canvas strong,
.card-template-canvas b,
.card-template-canvas h1,
.card-template-canvas h2,
.card-template-canvas h3,
.card-template-canvas h4,
.card-template-canvas .card-field,
.card-template-canvas .card-custom-back .card-field,
.card-template-canvas .card-custom-front .card-field,
.card-template-canvas .card-valid-field,
.card-template-canvas .card-signature-field,
.card-template-canvas .card-signature-field span,
.card-template-canvas .card-front-sign-box span{
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:400!important;
}

/* === REVISI 2026-05-26: tanggal bisa dipilih dan jam perizinan 24 jam === */
.date-picker-input,
input[type="date"].date-picker-input,
input[type="datetime-local"][data-time-24]{
  height:38px!important;
  min-height:38px!important;
  line-height:38px!important;
  padding:7px 10px!important;
  font-variant-numeric:tabular-nums!important;
  background:#fff!important;
  width:100%!important;
}
input[type="datetime-local"][data-time-24]{
  font-family:Arial,Helvetica,sans-serif!important;
}

/* Revisi rekap absensi semua jam pelajaran */
.attendance-recap-note{
  margin: 10px 0 14px;
  padding: 10px 12px;
  border: 1px solid #cfe9d8;
  background: #f2fbf5;
  color: #175c31;
  border-radius: 8px;
  font-size: 13px;
}

/* Revisi absensi multi jam khusus SMP/SMK */
.lesson-multi-field{min-width:0!important}.lesson-checkbox-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px 10px!important;min-height:34px!important;border:1px solid #d2d6de!important;background:#fff!important;padding:7px 10px!important}.lesson-checkbox-item{display:flex!important;align-items:center!important;gap:7px!important;margin:0!important;font-weight:600!important;color:#333!important;line-height:1.2!important}.lesson-checkbox-item input{width:auto!important;height:auto!important;min-height:0!important;margin:0!important}.lesson-checkbox-item span{font-weight:600!important;color:#333!important;font-size:13px!important}.lesson-multi-field .muted{margin:0!important}.teacher-info .muted{display:inline-block!important;margin-top:3px!important}@media(max-width:680px){.lesson-checkbox-grid{grid-template-columns:1fr!important}}


/* === UPDATE 2026-05-28: report spacing refinement === */
.report-print-area{padding:24px!important}
.report-heading{padding:0 2px 6px!important}
.report-heading h2{margin:10px 0 6px!important}
.report-heading p{margin:0!important;color:var(--muted)!important}
.report-print-area .table-wrap{margin-top:14px!important}
@media(max-width:760px){
  .report-print-area{padding:16px 12px!important}
  .report-heading{padding:0 2px 4px!important}
}

/* === REVISI 2026-05-28: sejajarkan judul rekap dengan tabel === */
.report-print-area > .report-heading{
  padding-left:14px!important;
  padding-right:14px!important;
  margin-left:0!important;
  margin-right:0!important;
}
.report-print-area > .table-wrap{
  margin-left:14px!important;
  margin-right:14px!important;
  width:calc(100% - 28px)!important;
}
@media(max-width:760px){
  .report-print-area > .report-heading{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .report-print-area > .table-wrap{
    margin-left:8px!important;
    margin-right:8px!important;
    width:calc(100% - 16px)!important;
  }
}

/* === UPDATE 2026-05-28: aksi siswa reset password + hapus === */
.student-action-th{width:180px!important}
.student-action-icons{gap:5px!important}
.student-action-icons form{display:inline-grid!important;margin:0!important;padding:0!important}
.student-icon-btn.reset{background:#605ca8!important}
.student-icon-btn.delete{background:#dd4b39!important}
.student-icon-btn.lock{background:#605ca8!important}

/* === REVISI: Penilaian Ujian dan Leger Nilai === */
.grade-filter-form{align-items:flex-end!important;flex-wrap:wrap!important}
.grade-filter-form .form-field{min-width:155px!important;flex:1 1 155px!important}
.grade-filter-form .form-actions{grid-column:auto!important;align-self:flex-end!important;margin-top:0!important}
.grade-score-input{width:100%!important;max-width:110px!important;text-align:center!important;font-weight:800!important}
.grade-table-wrap table{min-width:780px!important}
.grade-ledger-wrap table{min-width:980px!important}
.grade-ledger-wrap th,.grade-ledger-wrap td{text-align:center!important;white-space:nowrap!important}
.grade-ledger-wrap th:nth-child(3),.grade-ledger-wrap td:nth-child(3){text-align:left!important;min-width:190px!important}
.grade-ledger-print .signature-row{display:flex;justify-content:space-between;gap:60px;margin:28px 18px 0;text-align:center}
.print-only{display:none!important}
@media print{.print-only{display:flex!important}.grade-panel{box-shadow:none!important;border:0!important}.grade-ledger-wrap table{font-size:11px!important;min-width:0!important}.grade-ledger-print .report-heading{padding-left:14px!important}}
@media(max-width:760px){.grade-filter-form .form-field{flex:1 1 100%!important}.grade-filter-form .form-actions{width:100%!important}.grade-score-input{max-width:100%!important}}

/* === REVISI 2026-06-02: Hak akses menu manajemen pengguna dibuat lebih ringkas === */
.permission-help{display:block!important;margin:2px 0 8px!important;line-height:1.35!important}
.compact-permissions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;align-items:start!important;margin-top:8px!important}
.compact-permissions fieldset{padding:9px!important;border-radius:8px!important;background:#fbfdfb!important;min-width:0!important}
.compact-permissions legend{font-size:12px!important;padding:0 6px!important;margin-bottom:2px!important;line-height:1.1!important}
.compact-permissions .permission-option{display:grid!important;grid-template-columns:minmax(100px,1fr) auto auto!important;align-items:center!important;gap:5px!important;padding:5px 6px!important;margin:0 0 4px!important;border-radius:6px!important;background:#fff!important;border:1px solid #e6eee9!important;min-height:34px!important}
.compact-permissions .permission-title{font-size:12px!important;font-weight:800!important;color:#243a31!important;margin:0!important;line-height:1.15!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important}
.compact-permissions label{margin:0!important;font-size:11px!important;font-weight:800!important;line-height:1!important;gap:3px!important;white-space:nowrap!important;color:#42564d!important}
.compact-permissions input[type=checkbox]{width:13px!important;height:13px!important;margin:0!important;flex:0 0 auto!important}
.compact-permissions .readonly-check{color:#0c6a45!important}
.compact-permissions .permission-na{display:inline-flex!important;align-items:center!important;justify-content:center!important;color:#a3aaa7!important;font-size:11px!important;width:34px!important}
@media(max-width:1180px){.compact-permissions{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.compact-permissions{grid-template-columns:1fr!important}.compact-permissions .permission-option{grid-template-columns:minmax(110px,1fr) auto auto!important}}

/* === UPDATE: modal detail rekap evaluasi santri/siswa === */
.link-button{border:0;background:transparent;padding:0;margin:0;color:var(--primary);font:inherit;cursor:pointer;text-align:left;text-decoration:none}
.link-button:hover{text-decoration:underline}
.eval-name-button strong{color:var(--primary)}
.eval-detail-modal[hidden]{display:none!important}
.eval-detail-modal{position:fixed;inset:0;z-index:15000;display:grid;place-items:center;padding:18px}
.eval-detail-backdrop{position:absolute;inset:0;background:rgba(4,18,12,.55);backdrop-filter:blur(3px)}
.eval-detail-dialog{position:relative;width:min(920px,96vw);max-height:88vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.28);padding:18px;border:1px solid var(--border)}
.eval-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.eval-detail-head h3{margin:8px 0 2px;font-size:22px;line-height:1.1}
.eval-detail-head p{margin:0;color:var(--muted)}
.eval-detail-close{width:36px;height:36px;border:0;border-radius:999px;background:#f1f5f2;color:#234437;font-size:26px;line-height:1;cursor:pointer}
.eval-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.eval-detail-box{border:1px solid var(--border);border-radius:14px;background:#fbfdfb;padding:13px;min-height:145px}
.eval-detail-box h4{margin:0 0 9px;font-size:14px;color:#17382b}
.eval-detail-list{margin:0;padding-left:20px;max-height:260px;overflow:auto}
.eval-detail-list li{margin:4px 0;font-size:13px}
@media(max-width:760px){
  .eval-detail-dialog{width:calc(100vw - 18px);padding:14px;border-radius:16px}
  .eval-detail-grid{grid-template-columns:1fr}
}


/* === FIX FINAL 2026-06-06: Mobile Penilaian Ujian benar-benar 2 baris + tabel nilai tanpa geser === */
@media (max-width: 900px){
  .grade-panel{padding:10px 8px 96px!important;overflow:visible!important}
  .grade-panel .tab-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;margin:8px 8px 10px!important;gap:0!important;overflow:visible!important}
  .grade-panel .tab-nav button{width:100%!important;min-height:42px!important;padding:8px 6px!important;font-size:14px!important}

  .grade-panel .grade-filter-form,
  .grade-panel form.grade-filter-form.toolbar,
  .grade-panel form.grade-filter-form.academic-report-filter{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    align-items:end!important;
    width:100%!important;
    margin:8px 0 12px!important;
    padding:0!important;
  }
  .grade-panel .grade-filter-form .form-field{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:3px!important;
    min-width:0!important;
    width:100%!important;
    flex:0 0 auto!important;
    margin:0!important;
  }
  .grade-panel .grade-filter-form .form-field span{
    display:block!important;
    font-size:10.5px!important;
    line-height:1.05!important;
    font-weight:900!important;
    color:#29473d!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .grade-panel .grade-filter-form select,
  .grade-panel .grade-filter-form input{
    height:35px!important;
    min-height:35px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:4px 5px!important;
    border-radius:3px!important;
    font-size:11px!important;
    line-height:1.1!important;
    background:#fff!important;
  }
  .grade-panel .grade-filter-form .form-actions{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    margin:2px 0 0!important;
    align-self:stretch!important;
  }
  .grade-panel .grade-filter-form .form-actions .btn{
    width:100%!important;
    min-height:36px!important;
    font-size:13px!important;
    padding:0 8px!important;
  }

  .grade-panel form[action*="exam-grades"] > .toolbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:6px!important;
    margin:8px 0!important;
  }
  .grade-panel form[action*="exam-grades"] > .toolbar .btn{width:100%!important;min-height:38px!important}
  .grade-panel form[action*="exam-grades"] > .toolbar .muted{font-size:11px!important;line-height:1.25!important;text-align:center!important}

  .grade-panel .grade-table-wrap{
    overflow:visible!important;
    margin:8px 0 14px!important;
    padding:0!important;
    border-radius:10px!important;
    border:1px solid #e3ece7!important;
  }
  .grade-panel .grade-table-wrap table{
    width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
    border-collapse:collapse!important;
  }
  .grade-panel .grade-table-wrap th,
  .grade-panel .grade-table-wrap td{
    padding:7px 5px!important;
    font-size:12px!important;
    line-height:1.15!important;
    vertical-align:middle!important;
  }
  .grade-panel .grade-table-wrap th:nth-child(1),
  .grade-panel .grade-table-wrap td:nth-child(1){width:34px!important;text-align:center!important}
  .grade-panel .grade-table-wrap th:nth-child(2),
  .grade-panel .grade-table-wrap td:nth-child(2){display:none!important}
  .grade-panel .grade-table-wrap th:nth-child(3),
  .grade-panel .grade-table-wrap td:nth-child(3){width:auto!important;min-width:0!important;overflow:hidden!important}
  .grade-panel .grade-table-wrap td:nth-child(3) strong{
    display:block!important;
    font-size:12px!important;
    line-height:1.15!important;
    white-space:normal!important;
    word-break:break-word!important;
  }
  .grade-panel .grade-table-wrap td:nth-child(3) small{font-size:10px!important;color:#6b7871!important}
  .grade-panel .grade-table-wrap th:nth-child(4),
  .grade-panel .grade-table-wrap td:nth-child(4){width:72px!important;text-align:center!important}
  .grade-panel .grade-table-wrap th:nth-child(5),
  .grade-panel .grade-table-wrap td:nth-child(5){display:none!important}
  .grade-panel .grade-score-input{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:34px!important;
    padding:4px 3px!important;
    font-size:14px!important;
    text-align:center!important;
    border-radius:4px!important;
  }
}

@media (max-width: 380px){
  .grade-panel .grade-filter-form select,
  .grade-panel .grade-filter-form input{font-size:10px!important;padding-left:3px!important;padding-right:3px!important}
  .grade-panel .grade-filter-form .form-field span{font-size:9.5px!important}
  .grade-panel .grade-table-wrap th:nth-child(4),
  .grade-panel .grade-table-wrap td:nth-child(4){width:64px!important}
}

/* Absensi Jama'ah - mobile friendly cards */
.jamaah-attendance-filter{align-items:end!important;flex-wrap:wrap!important}
.jamaah-attendance-filter .form-field{min-width:170px!important;flex:1 1 170px!important}
.jamaah-attendance-filter .btn{align-self:end!important}
.jamaah-attendance-actions{justify-content:flex-start!important;flex-wrap:wrap!important}
.jamaah-attendance-wrap table.jamaah-attendance-table{min-width:760px!important}
.jamaah-attendance-table .jamaah-status-input,.jamaah-attendance-table .jamaah-note-input{width:100%!important;min-width:130px!important}
@media(max-width:760px){
  .jamaah-attendance-filter{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin:10px 10px 14px!important;padding:0!important;align-items:end!important}
  .jamaah-attendance-filter .form-field{min-width:0!important;width:100%!important;margin:0!important;gap:4px!important}
  .jamaah-attendance-filter .form-field span{font-size:11px!important;line-height:1.1!important;font-weight:800!important;color:#29473d!important}
  .jamaah-attendance-filter .form-field input,.jamaah-attendance-filter .form-field select{height:36px!important;min-height:36px!important;font-size:12px!important;padding:5px 7px!important;width:100%!important;max-width:100%!important}
  .jamaah-attendance-filter .form-field small{font-size:10px!important;line-height:1.15!important}
  .jamaah-attendance-filter .btn{grid-column:1 / -1!important;width:100%!important;min-height:38px!important;margin:0!important}
  .jamaah-attendance-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin:8px 10px 12px!important;padding:0!important}
  .jamaah-attendance-actions .btn{width:100%!important;min-height:38px!important;margin:0!important}
  .jamaah-attendance-wrap{overflow:visible!important;border:0!important;background:transparent!important;margin:0 10px 12px!important;padding:0!important}
  .jamaah-attendance-wrap table.jamaah-attendance-table{display:block!important;width:100%!important;min-width:0!important;border-collapse:separate!important;background:transparent!important}
  .jamaah-attendance-table thead{display:none!important}
  .jamaah-attendance-table tbody{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%!important}
  .jamaah-attendance-table tr{display:grid!important;grid-template-columns:1fr!important;gap:0!important;width:100%!important;background:#fff!important;border:1px solid #dfe8e3!important;border-radius:12px!important;box-shadow:0 6px 16px rgba(15,55,35,.07)!important;overflow:hidden!important}
  .jamaah-attendance-table td{display:grid!important;grid-template-columns:96px minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%!important;box-sizing:border-box!important;border:0!important;border-bottom:1px solid #edf2ef!important;padding:8px 10px!important;font-size:12.5px!important;line-height:1.25!important;background:transparent!important;word-break:break-word!important}
  .jamaah-attendance-table tr td:last-child{border-bottom:0!important}
  .jamaah-attendance-table td::before{content:attr(data-label);font-size:10.5px!important;font-weight:900!important;line-height:1.1!important;text-transform:uppercase!important;letter-spacing:.03em!important;color:#66756e!important}
  .jamaah-attendance-table td[data-label="Nama"]{grid-template-columns:1fr!important;background:#f8fbf9!important;padding:10px!important}
  .jamaah-attendance-table td[data-label="Nama"]::before{content:"";display:none!important}
  .jamaah-attendance-table td[data-label="Nama"] strong{font-size:14px!important;line-height:1.2!important;color:#1f332b!important}
  .jamaah-attendance-table td[data-label="No"],.jamaah-attendance-table td[data-label="Jenis Kelamin"]{display:none!important}
  .jamaah-attendance-table .jamaah-status-input,.jamaah-attendance-table .jamaah-note-input{width:100%!important;min-width:0!important;max-width:100%!important;height:38px!important;min-height:38px!important;border-radius:6px!important;font-size:13px!important;padding:6px 8px!important;background:#fff!important}
  .jamaah-attendance-table .jamaah-note-input{height:40px!important}
  .jamaah-attendance-submit{display:grid!important;grid-template-columns:1fr!important;margin:10px!important;padding:0!important}
  .jamaah-attendance-submit .btn{width:100%!important;min-height:42px!important;font-size:14px!important}
  .jamaah-empty-row{display:block!important;border:0!important;box-shadow:none!important;background:transparent!important}
  .jamaah-empty-row .empty-cell{display:block!important;text-align:center!important;border:1px dashed #dfe8e3!important;border-radius:12px!important;background:#fff!important;padding:22px 12px!important}
  .jamaah-empty-row .empty-cell::before{display:none!important;content:""!important}
}
@media(max-width:390px){
  .jamaah-attendance-filter{grid-template-columns:1fr!important}
  .jamaah-attendance-actions{grid-template-columns:1fr!important}
  .jamaah-attendance-table td{grid-template-columns:84px minmax(0,1fr)!important;padding:8px!important}
}

/* === Revisi Absensi Ketertiban & Rekap Evaluasi 2026-07-10 === */
.discipline-attendance-filter{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:end!important;
}
.discipline-attendance-filter .attendance-actions{
  grid-column:1 / -1;
  justify-content:flex-start;
}
.discipline-attendance-actions{
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
}
.discipline-attendance-table{
  min-width:720px!important;
}
.discipline-attendance-table .jamaah-status-input,
.discipline-attendance-table .jamaah-note-input{
  width:100%!important;
  min-width:0!important;
}
.monthly-evaluation-table .compact-alpa-col{
  width:78px!important;
  min-width:66px!important;
  max-width:84px!important;
  padding-left:4px!important;
  padding-right:4px!important;
  text-align:center!important;
  white-space:normal!important;
  line-height:1.15!important;
}
.monthly-evaluation-table .compact-violation-col{
  width:92px!important;
  min-width:76px!important;
  max-width:100px!important;
  padding-left:5px!important;
  padding-right:5px!important;
  text-align:center!important;
  white-space:normal!important;
  line-height:1.15!important;
}

@media(max-width:1080px){
  .discipline-attendance-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Tampilan HP mengikuti pola tabel ringkas Absensi Santri/Siswa, bukan kartu per santri. */
@media(max-width:760px){
  .discipline-attendance-filter{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin:0 6px 12px!important;
  }
  .discipline-attendance-filter .form-field{
    min-width:0!important;
    width:100%!important;
    gap:4px!important;
  }
  .discipline-attendance-filter .form-field span{font-size:10.5px!important;line-height:1.1!important}
  .discipline-attendance-filter .form-field input,
  .discipline-attendance-filter .form-field select{
    width:100%!important;
    min-width:0!important;
    min-height:34px!important;
    height:34px!important;
    padding:4px 6px!important;
    font-size:11px!important;
  }
  .discipline-attendance-filter .form-field small{font-size:9px!important;line-height:1.1!important}
  .discipline-attendance-filter .attendance-actions{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  .discipline-attendance-filter .attendance-actions .btn{width:100%!important;margin:0!important}
  .discipline-attendance-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin:8px 6px 10px!important;
  }
  .discipline-attendance-actions .btn{width:100%!important;margin:0!important}
  .discipline-attendance-wrap{
    overflow:visible!important;
    margin-left:6px!important;
    margin-right:6px!important;
    padding-bottom:6px!important;
  }
  .discipline-attendance-wrap .discipline-attendance-table{
    min-width:0!important;
    width:100%!important;
    table-layout:fixed!important;
  }
  .discipline-attendance-table th,
  .discipline-attendance-table td{
    padding:6px 4px!important;
    font-size:11px!important;
    line-height:1.2!important;
    vertical-align:middle!important;
  }
  .discipline-attendance-table th:nth-child(1),
  .discipline-attendance-table td:nth-child(1){
    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    text-align:center!important;
  }
  .discipline-attendance-table th:nth-child(2),
  .discipline-attendance-table td:nth-child(2){
    width:auto!important;
    min-width:0!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .discipline-attendance-table td:nth-child(2) strong{display:block!important;font-size:11.5px!important;line-height:1.15!important}
  .discipline-attendance-table td:nth-child(2) small{display:block!important;font-size:8.8px!important;line-height:1.1!important;white-space:normal!important}
  .discipline-attendance-table th:nth-child(3),
  .discipline-attendance-table td:nth-child(3){
    width:88px!important;
    min-width:88px!important;
    max-width:88px!important;
  }
  .discipline-attendance-table th:nth-child(4),
  .discipline-attendance-table td:nth-child(4){
    width:94px!important;
    min-width:94px!important;
    max-width:94px!important;
  }
  .discipline-attendance-table .jamaah-status-input,
  .discipline-attendance-table .jamaah-note-input{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:32px!important;
    min-height:32px!important;
    padding:4px 3px!important;
    font-size:10.5px!important;
    border-radius:3px!important;
  }
  .discipline-attendance-submit{margin:8px 6px 12px!important;padding:0!important}
  .discipline-attendance-submit .btn{width:100%!important;min-height:38px!important}

  .monthly-evaluation-wrap{margin-left:4px!important;margin-right:4px!important}
  .monthly-evaluation-table th,
  .monthly-evaluation-table td{padding:5px 3px!important;font-size:10px!important;line-height:1.1!important}
  .monthly-evaluation-table .compact-alpa-col{
    width:54px!important;
    min-width:54px!important;
    max-width:54px!important;
    padding-left:2px!important;
    padding-right:2px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .monthly-evaluation-table .compact-violation-col{
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    padding-left:2px!important;
    padding-right:2px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

@media(max-width:390px){
  .discipline-attendance-filter{grid-template-columns:1fr!important}
  .discipline-attendance-filter .attendance-actions{grid-template-columns:1fr 1fr!important}
  .discipline-attendance-table th:nth-child(1),
  .discipline-attendance-table td:nth-child(1){width:27px!important;min-width:27px!important;max-width:27px!important}
  .discipline-attendance-table th:nth-child(3),
  .discipline-attendance-table td:nth-child(3){width:80px!important;min-width:80px!important;max-width:80px!important}
  .discipline-attendance-table th:nth-child(4),
  .discipline-attendance-table td:nth-child(4){width:82px!important;min-width:82px!important;max-width:82px!important}
  .discipline-attendance-table .jamaah-status-input,
  .discipline-attendance-table .jamaah-note-input{font-size:9.5px!important;padding-left:2px!important;padding-right:2px!important}
}


/* Mobile bottom toolbar: force a single horizontal row */
@media(max-width:760px){
  .mobile-bottom-nav{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    justify-content:space-between!important;
    min-height:62px!important;
    overflow:hidden!important;
  }
  .mobile-bottom-nav>a,.mobile-bottom-nav>button{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:5px 1px!important;
  }
  .mobile-bottom-nav span{font-size:9.5px!important;}
}

/* Mobile bottom toolbar: larger icons and menu labels */
@media(max-width:760px){
  body{padding-bottom:90px!important}
  .content{padding-bottom:100px!important}
  .mobile-bottom-nav{
    left:6px!important;
    right:6px!important;
    bottom:7px!important;
    min-height:72px!important;
    height:72px!important;
    padding:5px!important;
    gap:2px!important;
    border-radius:22px!important;
  }
  .mobile-bottom-nav>a,
  .mobile-bottom-nav>button{
    gap:4px!important;
    min-height:62px!important;
    padding:5px 1px!important;
    border-radius:16px!important;
    font-size:11.5px!important;
    font-weight:900!important;
    line-height:1.05!important;
  }
  .mobile-bottom-nav svg{
    width:25px!important;
    height:25px!important;
    flex:0 0 25px!important;
  }
  .mobile-bottom-nav span{
    font-size:11.5px!important;
    line-height:1.05!important;
    letter-spacing:-.15px!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}

@media(max-width:360px){
  .mobile-bottom-nav>a,
  .mobile-bottom-nav>button,
  .mobile-bottom-nav span{font-size:10.8px!important}
  .mobile-bottom-nav svg{width:24px!important;height:24px!important;flex-basis:24px!important}
}

/* Portal wali murid */
.guardian-admin-student-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-top:10px}.guardian-admin-student{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--border,#dce4e0);border-radius:12px;background:#fbfdfc}.guardian-admin-student>span:first-child{display:flex;align-items:flex-start;gap:8px}.guardian-admin-student b,.guardian-admin-student small{display:block}.guardian-admin-student small{color:#6b7770;font-size:11px;margin-top:3px}.guardian-admin-student>span:last-child{white-space:nowrap;font-size:12px}.guardian-admin-student input[type=checkbox],.guardian-admin-student input[type=radio]{width:17px;height:17px;accent-color:#0b6b4b}@media(max-width:600px){.guardian-admin-student-grid{grid-template-columns:1fr}.guardian-admin-student{padding:10px}}


/* Portal Wali: tabel pemilihan santri/siswa pada form akun wali */
.guardian-student-picker{display:grid;gap:14px}
.guardian-student-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.guardian-student-picker-head>div>span{font-weight:700}
.guardian-student-picker-head>strong{flex:0 0 auto;padding:7px 10px;border-radius:999px;background:#eaf5f0;color:#0b6b4b;font-size:12px}
.guardian-student-filterbar{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(260px,1.3fr);gap:12px;padding:12px;border:1px solid var(--border,#dce4e0);border-radius:14px;background:#f8fbf9}
.guardian-student-filterbar label{display:grid;gap:5px}
.guardian-student-filterbar label>span{font-size:12px;font-weight:700;color:#4e5d55}
.guardian-student-filterbar input,.guardian-student-filterbar select{width:100%;min-height:42px;border:1px solid var(--border,#dce4e0);border-radius:10px;background:#fff;padding:9px 11px;color:inherit;outline:none}
.guardian-student-filterbar input:focus,.guardian-student-filterbar select:focus{border-color:#0b6b4b;box-shadow:0 0 0 3px rgba(11,107,75,.1)}
.guardian-student-table-wrap{border:1px solid var(--border,#dce4e0);border-radius:14px;overflow:auto;background:#fff}
.guardian-student-table{width:100%;min-width:920px;border-collapse:collapse}
.guardian-student-table th{white-space:nowrap;background:#f2f7f4;font-size:12px;color:#4d5e55}
.guardian-student-table th,.guardian-student-table td{padding:11px 10px;vertical-align:middle;border-bottom:1px solid var(--border,#e5ece8)}
.guardian-student-table tbody tr{transition:background-color .15s,border-color .15s}
.guardian-student-table tbody tr:hover{background:#f8fbf9}
.guardian-student-table tbody tr.is-selected{background:#edf8f3}
.guardian-student-table tbody tr[hidden]{display:none}
.guardian-student-table strong,.guardian-student-table small{display:block}
.guardian-student-table small{margin-top:3px;color:#6b7770;font-size:11px}
.guardian-select-column,.guardian-primary-column,.guardian-select-cell,.guardian-primary-cell{text-align:center;width:72px}
.guardian-select-cell input,.guardian-primary-cell input{width:18px;height:18px;accent-color:#0b6b4b}
.guardian-primary-cell label{display:inline-flex;align-items:center;gap:5px;font-size:11px;white-space:nowrap}
.guardian-use-phone{border:0;background:#eaf5f0;color:#075b40;border-radius:9px;padding:7px 9px;font-weight:800;font-size:12px;cursor:pointer;white-space:nowrap}
.guardian-use-phone:hover{background:#d9efe5}
.guardian-wa-empty{display:inline-block;border-radius:9px;padding:6px 8px;background:#fff3e8;color:#9a4e00;font-size:11px;font-weight:700;white-space:nowrap}
.guardian-student-empty{padding:24px;text-align:center;color:#6b7770;background:#fff}
.guardian-picker-note{color:#6b7770}
.guardian-mobile-label{display:none}

@media(max-width:760px){
  .guardian-student-picker-head{align-items:center}
  .guardian-student-filterbar{grid-template-columns:1fr}
  .guardian-student-table-wrap{overflow:visible;border:0;background:transparent}
  .guardian-student-table{display:block;min-width:0}
  .guardian-student-table thead{display:none}
  .guardian-student-table tbody{display:grid;gap:10px}
  .guardian-student-table tr{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:8px 10px;padding:12px;border:1px solid var(--border,#dce4e0);border-radius:13px;background:#fff}
  .guardian-student-table td{padding:0;border:0;text-align:left;width:auto}
  .guardian-select-cell{grid-column:1;grid-row:1;align-self:center;text-align:center!important}
  .guardian-name-cell{grid-column:2;grid-row:1}
  .guardian-primary-cell{grid-column:3;grid-row:1;align-self:center;text-align:right!important}
  .guardian-nis-cell{display:none}
  .guardian-class-cell,.guardian-parent-cell,.guardian-phone-cell{grid-column:2/4;display:grid;grid-template-columns:92px minmax(0,1fr);align-items:start;gap:6px;font-size:12px}
  .guardian-class-cell{grid-row:2}
  .guardian-parent-cell{grid-row:3}
  .guardian-phone-cell{grid-row:4}
  .guardian-mobile-label{display:block;color:#6b7770;font-size:11px;font-weight:700}
  .guardian-use-phone{justify-self:start}
}

@media(max-width:420px){
  .guardian-student-picker-head{align-items:flex-start;flex-direction:column;gap:8px}
  .guardian-student-table tr{grid-template-columns:30px minmax(0,1fr)}
  .guardian-primary-cell{grid-column:2;grid-row:2;text-align:left!important}
  .guardian-class-cell{grid-row:3}
  .guardian-parent-cell{grid-row:4}
  .guardian-phone-cell{grid-row:5}
  .guardian-class-cell,.guardian-parent-cell,.guardian-phone-cell{grid-column:2;grid-template-columns:84px minmax(0,1fr)}
}

/* PWA SISFO DAYAH untuk guru dan pengurus */
[data-pwa-install][hidden]{display:none!important}
.pwa-user-install{cursor:pointer;font:inherit}
.mobile-app-tile.pwa-mobile-install{width:100%;border:0;text-align:left;font:inherit;cursor:pointer}
.login-install-btn{display:block;width:100%;margin-top:12px;padding:11px 14px;border:1px solid #0b6b4b;border-radius:8px;background:#eaf5f0;color:#07523a;font-weight:800;cursor:pointer}
.login-install-btn:hover,.pwa-user-install:hover{filter:brightness(.97)}

/* Modul Penilaian Harian */
.alert.warning{background:#fff8e5;color:#8a5a00;border:1px solid #f2d58b}
.form-grid .form-span-2{grid-column:span 2}
.daily-grade-tabs{display:flex;gap:0;align-items:stretch;margin-top:12px}
.daily-grade-tabs a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 14px;border:1px solid #ddd;border-bottom:0;background:#f7f7f7;color:#444;font-weight:600;text-decoration:none}
.daily-grade-tabs a.active{background:var(--admin-green);border-color:var(--admin-green);color:#fff}
.daily-grade-tab-content{padding-bottom:12px}
.daily-task-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px}
.daily-task-summary>div{border:1px solid #ddd;border-top:3px solid var(--admin-green);background:#fff;padding:10px;min-width:0}
.daily-task-summary span{display:block;color:#777;font-size:11px;margin-bottom:4px}
.daily-task-summary strong{display:block;color:#333;font-size:13px;overflow-wrap:anywhere}
.daily-grade-summary-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.daily-grade-input-table select,.daily-grade-input-table input{min-height:32px;border:1px solid #cfd5d2;padding:5px 7px;background:#fff}
.daily-grade-input-table .daily-submission-status{min-width:155px}
.daily-grade-input-table input[type="text"]{min-width:170px}
.daily-grade-remedial-row{background:#fff0f0!important}
.daily-grade-remedial-row:hover{background:#ffe3e3!important}
.daily-grade-remedial-row .daily-predicate-cell{color:#b42318;font-weight:800}
.daily-grade-recap-table table{min-width:1100px}
.daily-grade-recap-table th{white-space:nowrap}
.daily-status-draft{background:#6c757d!important}
.daily-status-aktif{background:#0b6b4b!important}
.daily-status-selesai{background:#3c8dbc!important}
.daily-status-dikunci{background:#8a2d2d!important}
.inline-form .link{border:0;background:transparent;padding:0;min-height:0;cursor:pointer;font:inherit}
@media(max-width:900px){
  .daily-task-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .daily-grade-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:680px){
  .form-grid .form-span-2{grid-column:span 1}
  .daily-grade-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-left:8px!important;margin-right:8px!important}
  .daily-grade-tabs a{padding:7px 5px;font-size:12px;text-align:center}
  .daily-task-summary{grid-template-columns:1fr;margin:8px}
  .daily-grade-summary-grid{grid-template-columns:1fr 1fr!important;margin-left:8px!important;margin-right:8px!important}
  .daily-grade-input-table{margin-left:8px!important;margin-right:8px!important}
}
