body{background:#f5f7fb;color:#17253b;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#12233e;color:white;overflow-y:auto;z-index:10}.brand{font-weight:800;font-size:21px;padding:25px 20px}.sidebar nav a{display:block;margin:3px 12px;padding:10px 15px;color:#c7d5e6;text-decoration:none;border-radius:9px;font-size:14px}.sidebar nav a:hover,.sidebar nav a.active{background:#28517e;color:#fff}.side-bottom{padding:20px;border-top:1px solid #33465f;font-size:14px}.side-bottom a{color:#9ed2ff}.main{margin-left:248px}.top{height:76px;background:white;border-bottom:1px solid #e6eaf1;display:flex;justify-content:space-between;align-items:center;padding:0 32px;font-weight:700}.content{padding:30px;max-width:1500px;margin:auto}.stat,.panel,.form-card{background:white;border:1px solid #e6eaf1;border-radius:14px;padding:23px;box-shadow:0 4px 16px #102b4710}.stat small{color:#687b91}.stat strong{display:block;font-size:25px;margin-top:10px}.form-card{max-width:650px}.table-responsive{background:white;border-radius:12px;padding:15px;border:1px solid #e7eaf0}.table thead th{color:#60758c;font-size:13px}.btn-primary{background:#175fa9;border-color:#175fa9}@media(max-width:991px){.sidebar{transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:none}.main{margin-left:0}.content{padding:16px}.top{padding:0 15px}}
:root{--school-green:#087c42} .school-logo{height:43px;width:43px;object-fit:contain;background:white;border-radius:50%;vertical-align:middle;margin-right:8px}.statement-logo{height:92px;object-fit:contain}.sidebar{background:#083e2c!important}.btn-primary{background:#087c42;border-color:#087c42}.btn-primary:hover{background:#065e33;border-color:#065e33}@media print{.sidebar,.top,.d-print-none{display:none!important}.main{margin:0!important}.content{padding:0!important}.panel{box-shadow:none!important}}
/* Classic-modern SchoolERP dashboard */
.sidebar{width:270px!important;background:#102b29!important;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;padding:20px 16px 17px;border-bottom:1px solid #ffffff1a}.brand .school-logo{width:52px;height:52px;flex:none;margin:0}.brand-words{min-width:0}.brand-words strong{display:block;font-size:14px;line-height:1.25}.brand-words small{display:block;font-size:11px;color:#a9c5b9;margin-top:5px}.nav-caption{padding:20px 22px 4px;color:#819f96;font-size:10px;font-weight:800;letter-spacing:1.6px}.sidebar nav{padding-bottom:12px}.sidebar nav a{display:flex;align-items:center;gap:13px;padding:10px 14px;margin:2px 10px;color:#b9d2cb;font-weight:550;font-size:13px;border-radius:10px;transition:background .15s}.sidebar nav a svg{width:18px;height:18px;stroke-width:1.8;flex:none}.sidebar nav a.active{background:#168154;color:#fff;box-shadow:0 4px 12px #0002}.sidebar nav a:hover{background:#245448;color:white}.side-bottom{margin-top:auto;display:flex;gap:11px;align-items:center;padding:15px;border-top:1px solid #ffffff20}.side-bottom strong,.side-bottom small,.side-bottom a{display:block;font-size:12px}.side-bottom small{color:#a6c2b8}.side-bottom a{color:#8de0b3;text-decoration:none;margin-top:3px}.profile-circle{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#27845d;font-weight:800}.main{margin-left:270px}.top{height:72px;padding:0 28px}.top-title,.top-right{display:flex;align-items:center;gap:12px}.top-title svg{width:20px;color:#118354}.top-right{font-size:12px}.date-chip{display:flex;align-items:center;gap:7px;color:#687887;font-weight:500}.date-chip svg{width:15px}.top-user{background:#eaf6ef;padding:8px 12px;border-radius:20px;color:#167348}.content{max-width:1600px;padding:25px 28px}.dash-intro{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:22px}.eyebrow{color:#159266;font-size:10px;letter-spacing:1.7px;font-weight:850}.dash-intro h2{font-size:23px;font-weight:800;margin:5px 0}.dash-intro p,.workflow-title p{color:#74818c;font-size:13px;margin:0}.dash-action{background:#118353;color:white;padding:11px 16px;border-radius:10px;text-decoration:none;display:flex;gap:8px;align-items:center;font-size:13px;font-weight:700}.dash-action svg{width:17px}.dash-action:hover{background:#09633d;color:white}.dash-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.dash-card{background:white;border:1px solid #e5ece9;border-radius:14px;padding:17px;box-shadow:0 4px 18px #1d47380b}.dash-card-head{display:flex;align-items:center;justify-content:space-between;gap:7px;color:#68798a;font-size:12px;font-weight:650}.metric-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center}.metric-icon svg{width:19px}.metric-icon.green{background:#e5f7ec;color:#128554}.metric-icon.blue{background:#e8f2ff;color:#2b70c9}.metric-icon.orange{background:#fff3e3;color:#d48822}.metric-icon.purple{background:#f1ecff;color:#7853c4}.dash-card strong{display:block;font-size:22px;margin-top:12px;letter-spacing:-.7px}.dash-card small{color:#93a0aa;font-size:11px}.workflow-title{margin:28px 0 14px}.workflow-title h3,.section-heading h3,.balance-panel h3{font-size:17px;font-weight:800;margin:5px 0}.workflow-panel{background:#fff;border:1px solid #e3eae6;border-radius:15px;padding:25px 20px;box-shadow:0 4px 20px #1d47380b}.workflow-grid{display:grid;grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr);align-items:center;gap:4px}.flow-node{min-height:148px;border:1px solid #e2ebe5;border-radius:12px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#193d32;text-decoration:none;background:#fbfdfb}.flow-node:hover{border-color:#20a46b;background:#f1fcf6;color:#125b3d}.flow-node-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:#e3f5eb;color:#118353}.flow-node-icon svg{width:27px;height:27px}.flow-node strong{font-size:13px}.flow-node small{font-size:11px;color:#7c8b85}.flow-arrow{color:#86b8a0;text-align:center}.flow-arrow svg{width:28px}.workflow-lower{display:grid;grid-template-columns:repeat(6,1fr);gap:11px;border-top:1px dashed #dce8df;margin-top:23px;padding-top:23px}.flow-small{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:10px;text-align:center;text-decoration:none;color:#3d6152;font-size:12px;font-weight:650;padding:15px 5px;border-radius:11px;background:#f5faf7}.flow-small:hover{background:#e7f7ed;color:#118353}.flow-small svg{width:24px;height:24px;color:#168d5d}.dash-bottom{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-top:19px}.dash-table,.balance-panel{background:white;border:1px solid #e3eae6;border-radius:14px;padding:20px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-heading a,.balance-panel a{font-size:12px;text-decoration:none;color:#118353;font-weight:700}.balance-panel{display:flex;flex-direction:column}.balance-symbol{background:#eaf7ef;border-radius:15px;width:58px;height:58px;display:grid;place-items:center;color:#108253;margin:16px 0}.balance-symbol svg{width:30px;height:30px}.balance-panel small{color:#75877f}.balance-panel strong{font-size:25px;margin:6px 0 17px}.balance-panel a svg{width:14px}.mobile-backdrop{display:none}@media(max-width:1199px){.dash-cards{grid-template-columns:repeat(2,1fr)}.workflow-lower{grid-template-columns:repeat(3,1fr)}}@media(max-width:991px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:none}.main{margin-left:0}.content{padding:17px}.top{padding:0 17px}.sidebar.open~.mobile-backdrop{display:block;position:fixed;inset:0;background:#0007;z-index:9}}@media(max-width:700px){.dash-intro{align-items:flex-start;flex-direction:column}.dash-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.dash-card{padding:13px}.dash-card strong{font-size:17px}.workflow-grid{grid-template-columns:1fr;gap:8px}.flow-arrow{transform:rotate(90deg);height:25px}.flow-node{min-height:110px}.workflow-lower{grid-template-columns:repeat(2,1fr)}.dash-bottom{grid-template-columns:1fr}.top-user{display:none}}@media print{.workflow-panel,.dash-action{display:none}}
