:root{--ink:#143b33;--green:#126a56;--soft:#e7f4ee;--bg:#f5f7f5;--line:#dce5df;--muted:#63776f;--bs-primary:#126a56}*{box-sizing:border-box}body{margin:0;background:var(--bg);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Arial;color:#23382f}a{color:var(--green)}button,input,select,textarea{font:inherit}a,button,input,select,textarea{touch-action:manipulation}:focus-visible{outline:3px solid #dbac50;outline-offset:3px}.shell{display:flex;min-height:100vh}.side{width:252px;background:#103f35;color:#eaf7f2;padding:24px 14px;position:sticky;top:0;height:100vh;flex-shrink:0}.brand{display:flex;align-items:center;gap:11px;padding:5px 10px 24px;border-bottom:1px solid #ffffff28;color:white;text-decoration:none}.brandmark,.login-brand{width:40px;height:40px;background:#dff5e6;color:var(--green);border-radius:13px;display:grid;place-items:center;font-size:25px}.brand b{font-size:21px;letter-spacing:-.6px}.brand small{display:block;font-size:9px;letter-spacing:1.3px;color:#b2d6c9}.nav-label{font-size:10px;letter-spacing:1.7px;color:#a5cec0;margin:28px 12px 10px}.nav-item{display:flex;gap:11px;align-items:center;padding:12px 13px;margin:3px 0;border-radius:10px;color:#d8ebe5;text-decoration:none;font-weight:550;font-size:14px}.nav-item:hover,.nav-item.active{background:#ffffff19;color:white}.nav-item span{width:20px;font-size:20px}.sidefoot{position:absolute;bottom:25px;left:26px;color:#b2d6c9;font-size:12px;line-height:1.9}.status-dot{display:inline-block;width:7px;height:7px;background:#9cdbb4;border-radius:50%;margin-right:5px}.main{min-width:0;flex:1}.top{display:flex;justify-content:space-between;align-items:center;padding:17px 30px;background:white;border-bottom:1px solid var(--line);gap:12px}.top-context,.top-actions{display:flex;gap:12px;align-items:center}.top strong{display:block;color:var(--ink)}.top small{font-size:12px;color:var(--muted)}.pill{display:inline-flex;border:1px solid #c9ddd0;padding:6px 11px;border-radius:20px;font-size:12px;color:#35614c}.content{padding:30px;max-width:1500px;margin:auto}.head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:25px}.head h1{font-size:29px;margin:5px 0;letter-spacing:-.8px;color:var(--ink);font-weight:750}.head p{margin:0}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:2px;color:var(--green);font-weight:800}.muted{color:var(--muted)}.mini{font-size:12px}.btn{border-radius:9px;font-weight:650;padding:10px 15px}.btn-primary{background:#126a56;border-color:#126a56}.btn-primary:hover,.btn-primary:focus{background:#0d5545;border-color:#0d5545}.btn-light{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn-sm{font-size:12px;padding:7px 10px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.stat-card,.panel,.product{background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:0 4px 20px #113a2a05}.stat-card{padding:21px}.statcap{color:var(--muted);font-size:13px}.stat{font-size:32px;color:var(--ink);font-weight:800;letter-spacing:-1px;margin-top:8px}.statnote{font-size:11px;color:var(--green);margin-top:7px}.panel{padding:23px;margin-bottom:20px;min-width:0}.panel h2,.product h2{font-size:17px;margin:0 0 15px;color:var(--ink);font-weight:700}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.panel-head h2{margin:0}.two{display:grid;grid-template-columns:1.3fr 1fr;gap:20px}.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.record-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:15px 0;border-bottom:1px solid #e8eeea}.record-row:last-child{border:0}.record-row>div:last-child{text-align:right}.tag{display:inline-flex;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:750;background:#e8f4ed;color:#247352}.tag.warn{background:#fff3d8;color:#946b16}.notice{border:1px solid #f0dfb3;background:#fff7e3;padding:13px 15px;border-radius:10px;color:#735c2b;font-size:13px;margin:15px 0 20px}.quick-actions a{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:14px}.tablewrap{overflow-x:auto}.table{width:100%;vertical-align:middle;margin-bottom:8px}.table th,.table td{padding:14px 12px;border-color:#e8eeea;font-size:13px}.table th{color:#6b7d74;font-size:10px;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}.table td a{text-decoration:none}.table tr:last-child td{border:0}.empty{text-align:center;padding:35px!important;color:var(--muted)}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;min-width:0}.field label{font-weight:650;font-size:12px;color:#3d554b}.field input,.field select,.field textarea{padding:11px 12px;width:100%;border:1px solid #d5e2da;border-radius:9px;background:#fff;color:#223c32}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);outline:3px solid #12805d16}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.actions,.checks{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.checks{gap:20px}.checks label{font-size:13px}.filter{display:flex;gap:15px;align-items:flex-end;margin-bottom:17px}.filter .field{flex:1;margin:0}.filter .btn{margin-bottom:0}.product{padding:23px}.symbol{width:43px;height:43px;border-radius:12px;background:var(--soft);display:grid;place-items:center;font-size:26px;color:var(--green);margin-bottom:12px}.product h2{margin:12px 0 6px}.product p{font-size:13px}.price{font-size:25px;font-weight:750;color:var(--ink);margin-top:22px}.section-title{margin-top:25px!important}.review{border-top:1px solid var(--line);padding:15px 0}.review p{margin:8px 0}.hamb{display:none;border:0;background:transparent;color:var(--ink);font-size:25px}.scrim{display:none}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:25px;background:radial-gradient(ellipse at 20% 10%,#d9eee3,transparent 65%)}.login-card{width:100%;max-width:440px;background:white;border:1px solid var(--line);border-radius:20px;padding:36px;box-shadow:0 20px 70px #103f3510}.login-brand{margin-bottom:25px;width:55px;height:55px;font-size:34px}.login-card h1{font-size:28px;color:var(--ink);margin:10px 0}.login-card form{margin-top:25px}.login-note{text-align:center;margin:25px 0 0}.alert{border-radius:10px;font-size:14px}
@media(max-width:1100px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.three{grid-template-columns:repeat(2,minmax(0,1fr))}.side{width:230px}.content{padding:24px}}
@media(max-width:800px){.side{position:fixed;z-index:30;transform:translateX(-100%);transition:transform .2s;width:252px;overflow-y:auto}.side.open{transform:translateX(0)}.scrim.show{display:block;position:fixed;inset:0;background:#00180e88;z-index:29}.hamb{display:block}.top{padding:13px 16px}.content{padding:22px 16px}.two{grid-template-columns:1fr}.top small{display:none}.head h1{font-size:26px}.sidefoot{position:static;margin:35px 12px 0}}
@media(max-width:520px){.cards,.three,.formgrid{grid-template-columns:1fr}.head{align-items:flex-start;flex-direction:column}.head>.btn{width:100%}.top-actions .pill{display:none}.panel,.product{padding:17px}.stat-card{padding:18px}.filter{flex-direction:column;align-items:stretch}.login-card{padding:26px}.actions .btn{flex:1}.table th,.table td{padding:12px 9px}.top strong{font-size:14px}}
.surau-logo{width:100%;height:100%;object-fit:contain;border-radius:10px}
.alkhariah-login-logo{width:190px;height:190px;margin:-22px auto -12px}.alkhariah-tagline{text-align:center;color:var(--muted);font-size:13px;margin:0 0 22px}.brandmark{background:white;flex-shrink:0}.brand small{font-size:8px;letter-spacing:.7px}.organisation-logo{width:40px;height:40px;object-fit:contain;flex-shrink:0}.login-organisation{display:flex;align-items:center;gap:12px;margin-bottom:12px}.login-organisation h1{font-size:23px;margin:0}.login-card .alkhariah-login-logo .surau-logo{border-radius:0}
.login-surau-name{text-align:center;font-size:24px!important}.powered-by{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:16px;color:#63776f;font-size:12px;background:#fff;border-top:1px solid #dce5df}.powered-by img{width:70px;height:48px;object-fit:cover;object-position:center}.powered-by.signed-in{margin-left:252px}.login-wrap{min-height:calc(100vh - 82px)}.brand b{font-size:17px}.brandmark{width:44px;height:44px}.alkhariah-login-logo{width:190px;height:190px;margin:-22px auto -12px}@media(max-width:1100px){.powered-by.signed-in{margin-left:230px}}@media(max-width:800px){.powered-by.signed-in{margin-left:0}}
.login-card .alkhariah-login-logo{width:190px;max-width:100%;height:104px;margin:0 auto 16px}.login-card .alkhariah-tagline{margin:0 0 20px}.login-card .alkhariah-login-logo .surau-logo{display:block;width:100%;height:100%;object-fit:contain}