@font-face{font-family:'SolaimanLipi';src:url('SolaimanLipi.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
*{box-sizing:border-box}html,body,button,input,select,textarea,table{font-family:'SolaimanLipi','Solaiman Lipi','Noto Sans Bengali',Arial,sans-serif!important}body{margin:0;background:#f3f7fb;color:#183b60}a{text-decoration:none;color:inherit}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;appearance:textfield}
.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:linear-gradient(180deg,#06386d,#0a4b8e);color:#fff;overflow:auto}.brand{text-align:center;padding:20px 12px;border-bottom:1px solid #ffffff25}.logo{height:72px;width:72px;border-radius:50%;background:#fff;display:grid;place-items:center;margin:auto;overflow:hidden}.logo img{width:100%;height:100%;object-fit:cover;display:block}.brand h2{font-size:20px;line-height:1.35;margin:9px 0 3px}.brand p{font-size:12px;color:#dceaf8}.nav{padding:10px}.nav a{display:block;padding:10px 12px;border-radius:8px;margin:2px 0}.nav a:hover,.nav a.active{background:#1674d4}.main{margin-left:250px;min-height:100vh}.topbar{height:72px;background:#fff;border-bottom:1px solid #dce6ef;display:flex;align-items:center;justify-content:space-between;padding:0 22px}.top-title{font-size:21px;font-weight:700}.user{font-size:14px}.content{padding:25px}.head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.head h1{margin:0;font-size:27px}.actions{display:flex;gap:8px;flex-wrap:wrap}.btn{border:0;color:#fff;padding:9px 15px;border-radius:8px;font-weight:600;display:inline-block}.blue{background:#1769aa}.green{background:#079b68}.red{background:#e94a4a}.gray{background:#7b8b9b}.cardgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.card{background:#fff;border:1px solid #dce6ef;border-radius:12px;padding:18px;box-shadow:0 3px 14px #173b6009}.card small{color:#71849a}.card h2{margin:6px 0 0;font-size:26px}.panel{background:#fff;border:1px solid #dce6ef;border-radius:11px;overflow:hidden}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px 12px;border-bottom:1px solid #edf1f5;text-align:left}.table th{background:#f7f9fc}.empty{text-align:center!important;color:#8798aa;padding:45px!important}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{margin-bottom:11px}.field label{display:block;font-size:14px;margin-bottom:4px}.field input,.field select,.field textarea{width:100%;border:1px solid #cbd8e4;border-radius:7px;padding:9px}.field textarea{min-height:90px}.modal{display:none;position:fixed;inset:0;background:#0008;align-items:center;justify-content:center;z-index:50}.modal.show{display:flex}.modalbox{background:#fff;border-radius:12px;width:min(650px,94vw);max-height:90vh;overflow:auto;padding:20px}.modalhead{display:flex;justify-content:space-between}.x{border:0;background:#eef2f6;border-radius:50%;width:32px;height:32px}.modalfoot{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.alert{background:#ffe3e3;color:#b22;padding:9px;border-radius:7px;margin:10px 0}.login{display:grid;place-items:center;min-height:100vh}.loginbox{background:#fff;width:min(400px,92vw);padding:28px;border-radius:14px;text-align:center;box-shadow:0 10px 35px #173b6020}.loginbox .logo{height:65px;width:65px}.loginbox input{width:100%;padding:11px;margin:6px 0 12px;border:1px solid #ccd8e4;border-radius:7px}.wide{width:100%;margin-top:8px}footer{text-align:center;color:#7d8fa2;padding:25px}
@media(max-width:950px){.cardgrid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;z-index:20}.sidebar.open{transform:none}.main{margin-left:0}.content{padding:14px}.cardgrid,.formgrid{grid-template-columns:1fr}.topbar{padding:0 12px}.user{display:none}}
@media print{.sidebar,.topbar,.actions,footer{display:none}.main{margin:0}.content{padding:0}}
.accordion-nav .nav-group{margin:3px 0}.nav-group-title{width:100%;border:0;background:transparent;color:#fff;padding:11px 10px;border-radius:8px;display:flex;align-items:center;justify-content:space-between;text-align:left;font:inherit;font-weight:700;cursor:pointer}.nav-group-title:hover,.nav-group.open>.nav-group-title{background:#ffffff18}.nav-group-title b{font-size:16px;transition:transform .2s}.nav-group.open>.nav-group-title b{transform:rotate(180deg)}.nav-group-items{display:none;padding:2px 0 5px 12px;border-left:1px solid #ffffff35;margin-left:10px}.nav-group.open>.nav-group-items{display:block}.accordion-nav .nav-group-items a{font-size:13px;padding:8px 10px}.logout-link{margin-top:8px!important;border-top:1px solid #ffffff30;border-radius:0!important}

/* Ummul Qura — balanced Islamic green, white and light-blue theme */
:root{--uq-green:#087b57;--uq-green-dark:#075d45;--uq-green-soft:#e9f7f1;--uq-blue:#1769aa;--uq-blue-soft:#eef7ff;--uq-ink:#173b56;--uq-muted:#6d8192;--uq-line:#dbe8f1;--uq-white:#fff;--uq-danger:#c93d4b;--uq-gold:#d4a72c;--uq-shadow:0 5px 18px rgba(26,71,101,.07)}
body{background:linear-gradient(135deg,#f7fbfe 0%,#eef7ff 100%);color:var(--uq-ink)}
.sidebar{background:linear-gradient(180deg,var(--uq-green-dark) 0%,var(--uq-green) 56%,#0d6d5f 100%);box-shadow:5px 0 22px rgba(7,70,55,.13)}
.brand{padding:18px 12px;background:rgba(255,255,255,.045);border-bottom-color:rgba(255,255,255,.16)}
.brand .logo{border:3px solid rgba(255,255,255,.9);box-shadow:0 5px 18px rgba(0,0,0,.16)}
.brand h2{font-size:19px}.brand p{color:#d9f3ea}
.nav-group-title:hover,.nav-group.open>.nav-group-title{background:rgba(255,255,255,.13)}
.nav-group.open>.nav-group-title{box-shadow:inset 3px 0 0 var(--uq-gold)}
.accordion-nav .nav-group-items a:hover,.accordion-nav .nav-group-items a.active{background:#fff;color:var(--uq-green-dark);box-shadow:0 3px 10px rgba(0,0,0,.09)}
.topbar{background:rgba(255,255,255,.96);border-bottom:1px solid var(--uq-line);box-shadow:0 2px 12px rgba(27,76,108,.06);position:sticky;top:0;z-index:12}
.top-title{color:var(--uq-green-dark)}.topbar .user{background:var(--uq-green-soft);color:var(--uq-green-dark);padding:7px 11px;border-radius:999px;font-weight:600}
.content{max-width:1600px;margin:0 auto}.head{border-bottom:1px solid var(--uq-line);padding-bottom:12px}.head h1{color:var(--uq-ink);font-size:25px}
.panel,.card{background:rgba(255,255,255,.98);border-color:var(--uq-line);box-shadow:var(--uq-shadow)}
.panel{border-radius:13px}.card{border-radius:14px}.card:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(26,71,101,.1)}
.btn{border-radius:9px;box-shadow:0 3px 8px rgba(26,71,101,.1);transition:transform .15s,box-shadow .15s,filter .15s;cursor:pointer}.btn:hover{transform:translateY(-1px);box-shadow:0 5px 12px rgba(26,71,101,.15);filter:brightness(1.03)}.btn:active{transform:none}.btn.blue,.blue{background:var(--uq-blue)}.btn.green,.green{background:var(--uq-green)}.btn.red,.red{background:var(--uq-danger)}.btn.gray,.gray{background:#708696}
.table{background:#fff}.table th{background:linear-gradient(180deg,#f4faff,#edf6fc);color:#31546b;font-size:13px;border-bottom:1px solid #cfdfeb}.table td{border-bottom-color:#e9f0f5}.table tbody tr:hover td{background:#f7fbfe}.table tbody tr:last-child td{border-bottom:0}
.field label{color:#385a70;font-weight:600}.field input,.field select,.field textarea{background:#fff;border-color:#cbdce8;color:var(--uq-ink);transition:border-color .15s,box-shadow .15s}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--uq-blue);box-shadow:0 0 0 3px rgba(23,105,170,.11)}.field small{color:var(--uq-muted)}
.alert{border:1px solid #f1b9bf;background:#fff1f2;color:#9f2633;padding:11px 13px}.alert.success{border-color:#a9ddc8;background:#edf9f4;color:#086547}
.badge{border-radius:999px;padding:4px 9px;font-weight:700;font-size:12px}.badge.present{background:#dff6eb;color:#08704f}.badge.absent{background:#ffe4e7;color:#a72e3a}.badge.late{background:#fff4cf;color:#886500}
footer{color:#71889a}.modalbox{border:1px solid var(--uq-line);box-shadow:0 20px 55px rgba(20,60,85,.2)}
@media(max-width:650px){.topbar{height:62px}.top-title{font-size:16px}.top-title .btn{padding:8px 11px}.head{align-items:flex-start;flex-direction:column}.head h1{font-size:22px}.panel{border-radius:10px}.table th,.table td{padding:9px 8px}.sidebar{box-shadow:8px 0 28px rgba(0,0,0,.24)}}
@media print{body{background:#fff}.panel,.card{box-shadow:none}.topbar{position:static}}