/* ============================================================
   SchoolFeed Pro — App CSS (no external font dependencies)
   ============================================================ */
:root{
  --green:#059669;--green-d:#047857;--green-l:#d1fae5;--green-xl:#ecfdf5;
  --amber:#d97706;--amber-l:#fef3c7;--red:#dc2626;--red-l:#fee2e2;
  --blue:#2563eb;--blue-l:#dbeafe;--purple:#7c3aed;--purple-l:#ede9fe;
  --sky:#0ea5e9;--sky-l:#e0f2fe;--pink:#db2777;--pink-l:#fce7f3;
  --sb-w:252px;--tb-h:60px;--sb-bg:#0c1424;
  --bg:#f0f4f8;--card:#fff;--border:#e2e8f0;
  --text:#0f172a;--text2:#475569;--muted:#94a3b8;
  --r:10px;--rl:14px;--rxl:20px;
  --sh0:0 1px 4px rgba(0,0,0,.08);--sh1:0 4px 16px rgba(0,0,0,.10);--sh2:0 8px 32px rgba(0,0,0,.14);
  --font:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'Courier New',Courier,monospace;
}
*,*::before,*::after{box-sizing:border-box;}
body{font-family:var(--font);background:var(--bg);color:var(--text);display:flex;min-height:100vh;margin:0;font-size:14px;}

/* SIDEBAR */
.sidebar{width:var(--sb-w);background:var(--sb-bg);position:fixed;top:0;left:0;height:100vh;display:flex;flex-direction:column;z-index:1050;transition:transform .25s ease;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#1e293b transparent;}
.sb-brand{display:flex;align-items:center;gap:11px;padding:18px 16px 14px;border-bottom:1px solid rgba(255,255,255,.07);flex-shrink:0;}
.sb-logo{width:38px;height:38px;background:var(--green);border-radius:9px;display:grid;place-items:center;font-size:18px;flex-shrink:0;}
.sb-app{font-size:14px;font-weight:800;color:#fff;letter-spacing:-.2px;}
.sb-school{font-size:10px;color:rgba(255,255,255,.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:158px;margin-top:1px;}
.sb-nav{flex:1;padding:8px 10px;}
.sb-sec{font-size:9px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;color:rgba(255,255,255,.22);padding:14px 8px 5px;}
.sb-link{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:7px;color:rgba(255,255,255,.5);text-decoration:none;font-size:13px;font-weight:500;transition:all .15s;margin-bottom:1px;}
.sb-link i,.sb-link .sbi{font-size:15px;width:17px;text-align:center;flex-shrink:0;}
.sb-link:hover{background:rgba(255,255,255,.07);color:#fff;}
.sb-link.active{background:var(--green);color:#fff;}
.sb-badge{background:var(--red);color:#fff;font-size:9px;font-weight:700;padding:1px 6px;border-radius:10px;margin-left:auto;min-width:18px;text-align:center;}
.sb-foot{padding:12px 10px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:7px;flex-shrink:0;}
.sb-ava{width:32px;height:32px;background:var(--green);border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0;overflow:hidden;}
.sb-ava img{width:100%;height:100%;object-fit:cover;}
.sb-uinfo{flex:1;min-width:0;}
.sb-uname{font-size:12px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-urole{font-size:10px;color:rgba(255,255,255,.3);}
.sb-act{width:28px;height:28px;display:grid;place-items:center;color:rgba(255,255,255,.35);border-radius:6px;transition:all .15s;text-decoration:none;font-size:14px;}
.sb-act:hover{background:rgba(255,255,255,.09);color:#fff;}
.sb-logout:hover{background:rgba(220,38,38,.2)!important;color:#f87171!important;}

/* MAIN */
.main-wrap{margin-left:var(--sb-w);flex:1;display:flex;flex-direction:column;min-height:100vh;transition:margin .25s ease;}

/* TOPBAR */
.topbar{height:var(--tb-h);background:var(--card);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;padding:0 22px;position:sticky;top:0;z-index:100;box-shadow:var(--sh0);}
.tb-toggle{display:none;background:none;border:none;cursor:pointer;font-size:22px;color:var(--text2);padding:4px 6px;border-radius:6px;line-height:1;}
.tb-toggle:hover{color:var(--green);}
.tb-title{font-size:16px;font-weight:800;flex:1;color:var(--text);}
.tb-right{display:flex;align-items:center;gap:10px;}
.tb-clock{font-family:var(--mono);font-size:11px;color:var(--muted);background:var(--bg);padding:4px 8px;border-radius:6px;}

/* PAGE */
.page-content{padding:22px;flex:1;}
.page-hdr{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:22px;}
.page-hdr h1{font-size:21px;font-weight:800;margin:0;display:flex;align-items:center;gap:8px;}

/* CARDS */
.sf-card{background:var(--card);border:1px solid var(--border);border-radius:var(--rl);box-shadow:var(--sh0);overflow:hidden;}
.sf-card-hdr{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.sf-card-hdr h5{margin:0;font-size:14px;font-weight:700;}
.sf-card-body{padding:18px;}

/* STAT CARDS */
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--rl);padding:16px 18px;display:flex;align-items:center;gap:14px;box-shadow:var(--sh0);transition:transform .18s,box-shadow .18s;}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--sh1);}
.st-ic{width:48px;height:48px;border-radius:var(--r);display:grid;place-items:center;font-size:20px;flex-shrink:0;}
.ic-g{background:var(--green-l);color:var(--green);}.ic-a{background:var(--amber-l);color:var(--amber);}
.ic-r{background:var(--red-l);color:var(--red);}.ic-b{background:var(--blue-l);color:var(--blue);}
.ic-p{background:var(--purple-l);color:var(--purple);}.ic-s{background:var(--sky-l);color:var(--sky);}
.ic-pk{background:var(--pink-l);color:var(--pink);}
.st-val{font-size:24px;font-weight:800;line-height:1;font-family:var(--mono);}
.st-lbl{font-size:10px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-top:3px;}

/* TABLE */
.table{font-size:13px;width:100%;border-collapse:collapse;}
.table th{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);background:var(--bg);border-bottom:2px solid var(--border);padding:9px 13px;text-align:left;}
.table td{padding:10px 13px;vertical-align:middle;border-bottom:1px solid var(--border);}
.table-hover tbody tr:hover{background:#f8fafc;}

/* FORMS */
.form-label{font-size:12px;font-weight:600;color:var(--text2);margin-bottom:5px;display:block;}
.form-control,.form-select{border:1.5px solid var(--border);border-radius:var(--r);font-size:13.5px;font-family:var(--font);padding:9px 12px;transition:all .18s;width:100%;background:#fff;color:var(--text);}
.form-control:focus,.form-select:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(5,150,105,.12);outline:none;}
.form-control-lg{padding:11px 14px;font-size:15px;}
.input-group{display:flex;}
.input-group .form-control{border-radius:0;border-right:none;}
.input-group .form-control:first-child{border-radius:var(--r) 0 0 var(--r);}
.input-group-text{border:1.5px solid var(--border);background:var(--bg);font-size:13px;padding:0 12px;display:flex;align-items:center;color:var(--text2);}
.input-group-text:first-child{border-right:none;border-radius:var(--r) 0 0 var(--r);}
.input-group .btn{border-radius:0 var(--r) var(--r) 0;}
.form-check-input{width:16px;height:16px;cursor:pointer;}
.form-check-label{margin-left:6px;cursor:pointer;}

/* BUTTONS */
.btn{font-family:var(--font);font-size:13px;font-weight:600;border-radius:var(--r);padding:8px 16px;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;text-decoration:none;transition:all .18s;line-height:1.4;}
.btn-sm{padding:5px 11px;font-size:12px;}
.btn-lg{padding:12px 22px;font-size:15px;}
.btn-primary{background:var(--green);border:1.5px solid var(--green);color:#fff;}
.btn-primary:hover{background:var(--green-d);border-color:var(--green-d);color:#fff;}
.btn-success{background:#16a34a;border:1.5px solid #16a34a;color:#fff;}
.btn-success:hover{background:#15803d;border-color:#15803d;color:#fff;}
.btn-warning{background:var(--amber);border:1.5px solid var(--amber);color:#fff;}
.btn-warning:hover{background:#b45309;border-color:#b45309;color:#fff;}
.btn-danger{background:var(--red);border:1.5px solid var(--red);color:#fff;}
.btn-danger:hover{background:#b91c1c;border-color:#b91c1c;color:#fff;}
.btn-info{background:var(--sky);border:1.5px solid var(--sky);color:#fff;}
.btn-secondary{background:#64748b;border:1.5px solid #64748b;color:#fff;}
.btn-outline-primary{background:transparent;border:1.5px solid var(--green);color:var(--green);}
.btn-outline-primary:hover{background:var(--green);color:#fff;}
.btn-outline-secondary{background:transparent;border:1.5px solid #cbd5e1;color:var(--text2);}
.btn-outline-secondary:hover{background:var(--bg);color:var(--text);}
.btn-outline-success{background:transparent;border:1.5px solid #16a34a;color:#16a34a;}
.btn-outline-success:hover{background:#16a34a;color:#fff;}
.btn-outline-warning{background:transparent;border:1.5px solid var(--amber);color:var(--amber);}
.btn-outline-warning:hover{background:var(--amber);color:#fff;}
.btn-outline-danger{background:transparent;border:1.5px solid var(--red);color:var(--red);}
.btn-outline-danger:hover{background:var(--red);color:#fff;}
.btn-outline-info{background:transparent;border:1.5px solid var(--sky);color:var(--sky);}
.btn-outline-info:hover{background:var(--sky);color:#fff;}
.btn-icon{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;padding:0;font-size:13px;border-radius:7px;}
.btn-close{background:none;border:none;font-size:18px;cursor:pointer;opacity:.5;padding:4px;}
.btn-close:hover{opacity:1;}

/* BADGES */
.badge{font-size:10px;font-weight:700;border-radius:5px;padding:3px 8px;display:inline-block;}
.bg-success{background:#dcfce7;color:#166534;}
.bg-danger{background:#fee2e2;color:#991b1b;}
.bg-warning{background:#fef3c7;color:#92400e;}
.bg-primary{background:#dbeafe;color:#1e40af;}
.bg-info{background:#e0f2fe;color:#075985;}
.bg-secondary{background:#f1f5f9;color:#475569;}
.text-dark{color:#0f172a!important;}
.text-white{color:#fff!important;}
.bg-light{background:#f8fafc;}

/* BALANCE CHIPS */
.bal-chip{font-family:var(--mono);font-size:12px;font-weight:700;padding:3px 10px;border-radius:20px;white-space:nowrap;display:inline-block;}
.bal-ok{background:var(--green-l);color:var(--green-d);}
.bal-low{background:var(--amber-l);color:#92400e;}
.bal-zero{background:var(--red-l);color:var(--red);}

/* ALERTS / FLASH */
.alert{border-radius:var(--r);padding:12px 16px;margin-bottom:16px;display:flex;align-items:flex-start;gap:8px;font-size:13px;}
.alert-success{background:#dcfce7;border:1px solid #86efac;color:#166534;}
.alert-danger{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b;}
.alert-warning{background:#fef3c7;border:1px solid #fcd34d;color:#92400e;}
.alert-info{background:#e0f2fe;border:1px solid #7dd3fc;color:#075985;}
.alert-dismissible{position:relative;}
.sf-flash{box-shadow:var(--sh0);}

/* SCAN */
.scan-box{border-radius:var(--rl);padding:28px;text-align:center;transition:all .3s;border:2px solid transparent;}
.scan-success{background:var(--green-l);border-color:var(--green);}
.scan-declined{background:var(--red-l);border-color:var(--red);}
.scan-unknown{background:var(--sky-l);border-color:var(--sky);}
.scan-icon{font-size:56px;margin-bottom:10px;display:block;}
.scan-title{font-size:22px;font-weight:800;}

/* PAYMENT METHOD CARDS */
.pm-card{border:2px solid var(--border);border-radius:var(--rl);padding:18px 12px;cursor:pointer;transition:all .2s;text-align:center;background:var(--card);}
.pm-card:hover{border-color:var(--green);box-shadow:var(--sh1);transform:translateY(-2px);}
.pm-card.selected{border-color:var(--green);background:var(--green-xl);box-shadow:0 0 0 3px rgba(5,150,105,.15);}
.pm-card .pm-icon{font-size:30px;margin-bottom:8px;}
.pm-card .pm-label{font-size:13px;font-weight:700;}
.pm-card .pm-sub{font-size:11px;color:var(--muted);}

/* PORTAL — login */
.portal-bg{min-height:100vh;background:linear-gradient(135deg,#0c1424,#1a3050,#0c2040);display:flex;align-items:center;justify-content:center;padding:20px;font-family:var(--font);}
.portal-card{background:#1e293b;border:1px solid rgba(255,255,255,.08);border-radius:var(--rxl);width:100%;max-width:430px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.4);}
.portal-head{background:linear-gradient(135deg,#059669,#047857);padding:28px;text-align:center;color:#fff;}
.portal-head-icon{font-size:42px;margin-bottom:10px;}
.portal-head-title{font-size:21px;font-weight:800;}
.portal-head-sub{font-size:13px;opacity:.8;margin-top:3px;}
.portal-body{padding:28px;}
.portal-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.5);margin-bottom:5px;display:block;text-transform:uppercase;letter-spacing:.3px;}
.portal-input{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);color:#fff;border-radius:9px;padding:11px 13px;font-size:14px;font-family:var(--font);width:100%;transition:all .18s;outline:none;}
.portal-input::placeholder{color:rgba(255,255,255,.2);}
.portal-input:focus{background:rgba(255,255,255,.09);border-color:var(--green);box-shadow:0 0 0 3px rgba(5,150,105,.18);}
.portal-btn{background:linear-gradient(135deg,#059669,#047857);border:none;color:#fff;font-weight:700;font-size:14px;padding:13px;border-radius:9px;width:100%;cursor:pointer;transition:all .18s;font-family:var(--font);}
.portal-btn:hover{background:linear-gradient(135deg,#047857,#065f46);transform:translateY(-1px);}
.portal-err{background:rgba(220,38,38,.14);border:1px solid rgba(220,38,38,.28);color:#f87171;border-radius:8px;padding:10px 13px;font-size:13px;margin-bottom:14px;}
.portal-ok{background:rgba(5,150,105,.14);border:1px solid rgba(5,150,105,.28);color:#6ee7b7;border-radius:8px;padding:10px 13px;font-size:13px;margin-bottom:14px;}
.portal-link{color:rgba(255,255,255,.38);font-size:12px;text-decoration:none;}
.portal-link:hover{color:var(--green);}

/* PORTAL DASHBOARD */
.portal-page{background:var(--bg);min-height:100vh;font-family:var(--font);}
.portal-topbar{background:var(--sb-bg);padding:14px 22px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.3);}
.portal-topbar-left{display:flex;align-items:center;gap:10px;}
.portal-topbar-logo{width:34px;height:34px;background:var(--green);border-radius:8px;display:grid;place-items:center;font-size:17px;}
.portal-topbar-name{font-size:14px;font-weight:700;color:#fff;}
.portal-topbar-role{font-size:10px;color:rgba(255,255,255,.4);}
.portal-content{padding:20px;max-width:900px;margin:0 auto;}
.portal-balance-card{background:linear-gradient(135deg,#059669,#047857);color:#fff;border-radius:var(--rl);padding:26px;margin-bottom:20px;box-shadow:var(--sh2);}
.portal-bal-label{font-size:12px;opacity:.8;margin-bottom:4px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;}
.portal-bal-amount{font-size:40px;font-weight:800;font-family:var(--mono);line-height:1;}
.portal-bal-sub{font-size:12px;opacity:.7;margin-top:6px;}
.portal-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;}
.portal-nav-btn{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r);padding:9px 15px;text-decoration:none;color:var(--text2);font-size:13px;font-weight:600;display:flex;align-items:center;gap:6px;transition:all .18s;}
.portal-nav-btn:hover,.portal-nav-btn.active{background:var(--green);border-color:var(--green);color:#fff;}
.portal-pm-card{border:2px solid var(--border);border-radius:var(--rl);padding:18px;cursor:pointer;transition:all .2s;background:var(--card);text-align:center;}
.portal-pm-card:hover{border-color:var(--green);box-shadow:var(--sh1);transform:translateY(-2px);}
.portal-pm-card.selected{border-color:var(--green);background:var(--green-xl);}
.portal-pm-icon{font-size:28px;margin-bottom:8px;}
.portal-pm-label{font-size:13px;font-weight:700;}
.portal-pm-sub{font-size:11px;color:var(--muted);}

/* AUTH PAGES */
.auth-bg{min-height:100vh;background:var(--sb-bg);display:flex;align-items:center;justify-content:center;padding:20px;background-image:radial-gradient(ellipse at 20% 50%,rgba(5,150,105,.12) 0%,transparent 60%);}
.auth-card{background:#1e293b;border:1px solid rgba(255,255,255,.07);border-radius:var(--rxl);padding:38px 34px;width:100%;max-width:420px;box-shadow:0 24px 64px rgba(0,0,0,.4);}
.auth-logo{width:54px;height:54px;background:var(--green);border-radius:14px;display:grid;place-items:center;font-size:26px;margin:0 auto 16px;}
.auth-title{font-size:22px;font-weight:800;color:#fff;text-align:center;}
.auth-sub{font-size:12px;color:rgba(255,255,255,.38);text-align:center;margin-bottom:24px;margin-top:3px;}
.auth-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.5);margin-bottom:5px;display:block;text-transform:uppercase;letter-spacing:.3px;}
.auth-input{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);color:#fff;border-radius:9px;padding:11px 13px;font-size:13.5px;font-family:var(--font);width:100%;transition:all .18s;outline:none;}
.auth-input::placeholder{color:rgba(255,255,255,.18);}
.auth-input:focus{background:rgba(255,255,255,.09);border-color:var(--green);box-shadow:0 0 0 3px rgba(5,150,105,.18);}
.auth-igt{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);border-right:none;color:rgba(255,255,255,.35);padding:0 12px;display:flex;align-items:center;border-radius:9px 0 0 9px;font-size:15px;}
.auth-input.with-eye{border-radius:0;border-right:none;}
.auth-eye{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);border-left:none;color:rgba(255,255,255,.35);padding:0 12px;cursor:pointer;border-radius:0 9px 9px 0;display:flex;align-items:center;font-size:15px;}
.auth-eye:hover{color:rgba(255,255,255,.7);}
.auth-btn{background:linear-gradient(135deg,#059669,#047857);border:none;color:#fff;font-weight:700;font-size:14px;padding:12px;border-radius:9px;width:100%;cursor:pointer;transition:all .18s;font-family:var(--font);}
.auth-btn:hover{background:linear-gradient(135deg,#047857,#065f46);transform:translateY(-1px);}
.auth-err{background:rgba(220,38,38,.14);border:1px solid rgba(220,38,38,.28);color:#f87171;border-radius:8px;padding:10px 13px;font-size:13px;margin-bottom:16px;}
.auth-ok{background:rgba(5,150,105,.14);border:1px solid rgba(5,150,105,.28);color:#6ee7b7;border-radius:8px;padding:10px 13px;font-size:13px;margin-bottom:16px;}
.auth-link{color:rgba(255,255,255,.38);font-size:12px;text-decoration:none;}
.auth-link:hover{color:var(--green);}

/* ID CARD */
.id-card{width:338px;border-radius:14px;overflow:hidden;box-shadow:var(--sh2);font-family:var(--font);}
.id-card-front{background:linear-gradient(155deg,#0c1424 0%,#1a3050 60%,#0d2540 100%);color:#fff;}
.card-stripe{height:5px;background:linear-gradient(90deg,var(--green),var(--blue),var(--amber));}
.card-head{background:var(--green);padding:10px 15px;text-align:center;}
.card-school{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;}
.card-type{font-size:9px;opacity:.75;letter-spacing:.8px;}
.card-body-inner{padding:14px 15px;}
.card-photo{width:74px;height:74px;border-radius:9px;border:2.5px solid var(--green);background:#1e3050;display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;overflow:hidden;}
.card-photo img{width:100%;height:100%;object-fit:cover;border-radius:7px;}
.card-name{font-size:16px;font-weight:800;line-height:1.2;}
.card-class{font-size:11px;color:rgba(255,255,255,.6);margin-top:3px;}
.card-id-text{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.38);margin-top:5px;}
.card-barcode{background:#fff;border-radius:7px;padding:7px 8px 5px;margin:11px 0 0;text-align:center;}
.card-foot{background:rgba(255,255,255,.05);padding:6px 15px;display:flex;justify-content:space-between;font-size:10px;opacity:.45;}
.id-card-back{background:#f8fafc;}
.back-head{background:var(--sb-bg);color:#fff;padding:9px 15px;text-align:center;font-size:12px;font-weight:700;}
.back-stripe{height:38px;background:repeating-linear-gradient(0deg,#1a1a1a,#1a1a1a 6px,#333 6px,#333 8px);}
.back-body{padding:14px;}
.back-row{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;}
.back-key{color:var(--muted);font-weight:600;}
.back-val{font-weight:700;font-family:var(--mono);font-size:11px;}
.back-note{background:var(--amber-l);border:1px solid #fcd34d;border-radius:6px;padding:7px 10px;font-size:11px;color:#92400e;margin-top:10px;}
.back-bc{text-align:center;margin-top:10px;}
.back-foot{background:var(--sb-bg);color:rgba(255,255,255,.4);padding:7px 14px;font-size:9px;text-align:center;}

/* PHOTO UPLOAD */
.photo-preview-wrap{position:relative;width:100px;height:100px;}
.photo-preview{width:100px;height:100px;border-radius:10px;border:2px dashed var(--border);display:flex;align-items:center;justify-content:center;font-size:30px;background:var(--bg);cursor:pointer;overflow:hidden;transition:border-color .2s;position:relative;}
.photo-preview:hover{border-color:var(--green);}
.photo-preview img{width:100%;height:100%;object-fit:cover;}
.photo-preview-label{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.6);color:#fff;font-size:9px;text-align:center;padding:3px;font-weight:600;}

/* LIST GROUP */
.list-group{list-style:none;padding:0;margin:0;}
.list-group-flush .list-group-item:last-child{border-bottom:none;}
.list-group-item{padding:12px 18px;border-bottom:1px solid var(--border);background:var(--card);}
.list-group-item-action{text-decoration:none;color:var(--text);display:block;transition:background .15s;}
.list-group-item-action:hover{background:var(--bg);}

/* PAGINATION */
.pagination{display:flex;gap:4px;list-style:none;padding:0;margin:0;}
.page-item .page-link{display:block;padding:5px 10px;border:1.5px solid var(--border);border-radius:7px;color:var(--text2);text-decoration:none;font-size:12px;font-weight:600;background:var(--card);transition:all .15s;}
.page-item.active .page-link{background:var(--green);border-color:var(--green);color:#fff;}
.page-item .page-link:hover{border-color:var(--green);color:var(--green);}

/* OVERLAY */
.sb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1040;}

/* UTILITIES */
.d-flex{display:flex;}.d-grid{display:grid;}.d-none{display:none!important;}.d-block{display:block!important;}.d-inline-block{display:inline-block;}
.align-items-center{align-items:center;}.align-items-start{align-items:flex-start;}
.justify-content-between{justify-content:space-between;}.justify-content-center{justify-content:center;}.justify-content-end{justify-content:flex-end;}
.flex-fill{flex:1;}.flex-wrap{flex-wrap:wrap;}.flex-column{flex-direction:column;}
.gap-1{gap:4px;}.gap-2{gap:8px;}.gap-3{gap:12px;}.gap-4{gap:16px;}
.w-100{width:100%;}.text-center{text-align:center;}.text-end{text-align:right;}.text-muted{color:var(--muted)!important;}
.fw-bold{font-weight:700;}.fw-600{font-weight:600;}.text-green{color:var(--green)!important;}
.mt-1{margin-top:4px;}.mt-2{margin-top:8px;}.mt-3{margin-top:12px;}.mt-4{margin-top:16px;}
.mb-0{margin-bottom:0;}.mb-1{margin-bottom:4px;}.mb-2{margin-bottom:8px;}.mb-3{margin-bottom:12px;}.mb-4{margin-bottom:16px;}
.me-1{margin-right:4px;}.me-2{margin-right:8px;}.ms-1{margin-left:4px;}.ms-auto{margin-left:auto;}
.p-3{padding:12px;}.p-4{padding:16px;}.px-3{padding-left:12px;padding-right:12px;}.px-4{padding-left:16px;padding-right:16px;}.py-2{padding-top:8px;padding-bottom:8px;}.py-3{padding-top:12px;padding-bottom:12px;}.py-4{padding-top:16px;padding-bottom:16px;}.py-5{padding-top:24px;padding-bottom:24px;}
.border-bottom{border-bottom:1px solid var(--border)!important;}.border-top{border-top:1px solid var(--border)!important;}
.rounded-circle{border-radius:50%!important;}.overflow-hidden{overflow:hidden;}
.mono{font-family:var(--mono)!important;}.small{font-size:11px;}.cursor-pointer{cursor:pointer;}
.text-success{color:#16a34a!important;}.text-danger{color:var(--red)!important;}.text-warning{color:var(--amber)!important;}.text-primary{color:var(--blue)!important;}

/* GRID */
.row{display:flex;flex-wrap:wrap;margin:-8px;}
.row.g-2{margin:-4px;}.row.g-2>[class*=col-]{padding:4px;}
.row.g-3{margin:-6px;}.row.g-3>[class*=col-]{padding:6px;}
.row.g-4{margin:-8px;}.row.g-4>[class*=col-]{padding:8px;}
[class*=col-]{padding:8px;width:100%;}
.col-auto{width:auto;flex:0 0 auto;}
.col-1{width:8.333%;}.col-2{width:16.666%;}.col-3{width:25%;}.col-4{width:33.333%;}.col-5{width:41.666%;}.col-6{width:50%;}.col-7{width:58.333%;}.col-8{width:66.666%;}.col-9{width:75%;}.col-10{width:83.333%;}.col-11{width:91.666%;}.col-12{width:100%;}
@media(min-width:576px){.col-sm-6{width:50%;}.col-sm-12{width:100%;}}
@media(min-width:768px){.col-md-2{width:16.666%;}.col-md-3{width:25%;}.col-md-4{width:33.333%;}.col-md-5{width:41.666%;}.col-md-6{width:50%;}.col-md-7{width:58.333%;}.col-md-8{width:66.666%;}.col-md-9{width:75%;}.col-md-12{width:100%;}.d-md-flex{display:flex!important;}}
@media(min-width:992px){.col-lg-4{width:33.333%;}.col-lg-5{width:41.666%;}.col-lg-7{width:58.333%;}.col-lg-8{width:66.666%;}}

/* TABLE RESPONSIVE */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* RESPONSIVE */
@media(max-width:991px){
  .sidebar{transform:translateX(-100%);}.sidebar.open{transform:translateX(0);}
  .sb-overlay.show{display:block;}.main-wrap{margin-left:0;}.tb-toggle{display:block;}
  .page-content{padding:14px;}
}
@media(max-width:767px){.d-md-flex{display:none!important;}}
@media(max-width:576px){.st-val{font-size:18px;}.auth-card{padding:24px 18px;}.id-card{width:100%;max-width:338px;}.col-6{width:100%;}}

/* PRINT */
@media print{
  .sidebar,.topbar,.no-print{display:none!important;}
  .main-wrap{margin-left:0!important;}
  .page-content{padding:0!important;}
  body{background:#fff;}
}