/* Scholars Aid CRM — soft red, white icon sidebar, card UI (dashboard.jpg style) */
:root{
  --ink:#2b2730; --paper:#f4f5f9; --card:#ffffff; --line:#ece9f0;
  --red:#e23744; --red-d:#b21f2d; --red-soft:#fdecec; --accent:#e23744;
  --gold:#d99a2b; --green:#1f9d57; --muted:#8a8594; --ok:#1f9d57;
  --shadow:0 6px 20px rgba(40,30,50,.06); --shadow-h:0 10px 28px rgba(226,55,68,.18);
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,"Noto Sans Bengali",sans-serif;background:var(--paper);color:var(--ink);font-size:15px}
a{color:var(--red)}

/* ---------- Top bar (taller, white card-like) ---------- */
.topbar{position:fixed;top:0;left:0;right:0;height:74px;background:#fff;color:var(--ink);
  display:flex;align-items:center;gap:14px;padding:0 24px;z-index:30;box-shadow:0 2px 14px rgba(40,30,50,.05)}
.topbar .brand-wrap{display:flex;align-items:center;gap:10px}
.topbar img.logo{height:42px;width:auto}
.brand{font-weight:800;letter-spacing:.3px;font-size:19px;color:var(--ink)}.brand span{color:var(--red)}
.userbox{margin-left:auto;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:12px}
.userbox .uname{font-weight:700;color:var(--ink)}
.userbox a{color:#fff;background:var(--red);padding:7px 14px;border-radius:99px;text-decoration:none;font-weight:600;font-size:12.5px;transition:background .3s ease}
.userbox a:hover{background:var(--red-d)}
.menu-btn{display:none;background:none;border:0;color:var(--red);font-size:24px;cursor:pointer}
/* notifications */
.notifwrap{position:relative}
.notifbell{background:none;border:0;color:#6b6675;cursor:pointer;padding:6px;position:relative;display:flex;align-items:center;border-radius:10px;transition:background .3s}
.notifbell:hover{background:var(--red-soft);color:var(--red)}
.notifdot{position:absolute;top:0;right:0;background:var(--red);color:#fff;font-size:10px;font-weight:800;min-width:16px;height:16px;border-radius:99px;display:flex;align-items:center;justify-content:center;padding:0 3px}
.notifpanel{position:absolute;top:46px;right:0;width:320px;max-width:90vw;background:#fff;border-radius:14px;box-shadow:0 12px 40px rgba(40,30,50,.18);opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .25s ease;z-index:50;overflow:hidden}
.notifpanel.open{opacity:1;visibility:visible;transform:none}
.notifhead{padding:12px 16px;font-weight:800;font-size:13px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.notifhead a{font-size:11.5px;font-weight:600}
#notifList{max-height:360px;overflow-y:auto}
.notifitem{display:block;padding:11px 16px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .2s}
.notifitem:hover{background:var(--red-soft)}
.ni-msg{font-size:13px;line-height:1.4}
.ni-time{font-size:11px;color:var(--muted);margin-top:2px}
.notifempty{padding:24px 16px;text-align:center;color:var(--muted);font-size:13px}

/* ---------- Sidebar (white, icons, big buttons) ---------- */
.sidenav{position:fixed;top:74px;left:0;bottom:0;width:236px;background:#fff;padding:16px 14px;overflow-y:auto;z-index:25;
  box-shadow:2px 0 14px rgba(40,30,50,.04)}
.sidenav a, .navgroup .navparent{display:flex;align-items:center;gap:12px;color:#6b6675;text-decoration:none;
  padding:12px 16px;font-size:14.5px;font-weight:600;border-radius:14px;margin-bottom:4px;
  transition:background .35s ease,color .35s ease,box-shadow .35s ease,transform .25s ease}
.sidenav a .ic, .navgroup .navparent .ic{width:20px;height:20px;flex:0 0 20px;opacity:.7;transition:opacity .35s ease}
.sidenav a.on, .navgroup .navparent.on{background:var(--red);color:#fff;box-shadow:var(--shadow-h)}
.sidenav a.on .ic{opacity:1;filter:brightness(0) invert(1)}
.sidenav a:hover, .navgroup .navparent:hover{background:var(--red-soft);color:var(--red);transform:translateX(3px)}
.sidenav a.on:hover{background:var(--red);color:#fff;transform:none}

/* sub-menu */
.navgroup{position:relative}
.navchildren{max-height:0;overflow:hidden;transition:max-height .35s ease}
.navgroup.open .navchildren{max-height:400px}
.navchildren a{padding:9px 16px 9px 44px;font-size:13.5px;font-weight:600;color:#8a8594;border-radius:12px}
.navchildren a:hover{background:var(--red-soft);color:var(--red)}
/* caret toggle for sub-menus (click, not hover) */
.navcaret{position:absolute;top:6px;right:8px;width:30px;height:30px;border:0;background:transparent;color:#9a94a2;cursor:pointer;border-radius:9px;display:flex;align-items:center;justify-content:center;transition:transform .3s ease,background .2s}
.navcaret:hover{background:var(--red-soft);color:var(--red)}
.navgroup.open .navcaret{transform:rotate(180deg)}
.navgroup .navparent.on ~ .navcaret{color:#fff}

.content{margin:74px 0 0 236px;padding:26px;min-height:calc(100vh - 74px)}
h1{font-size:22px;margin:0 0 4px;font-weight:800}h2{font-size:16px;margin:18px 0 10px;font-weight:700}
.sub{color:var(--muted);font-size:13px;margin-bottom:18px}

/* ---------- Cards (rounded, soft shadow) ---------- */
.card{background:var(--card);border:0;border-radius:20px;padding:20px;margin-bottom:18px;box-shadow:var(--shadow)}
.grid{display:grid;gap:16px}.grid.c2{grid-template-columns:1fr 1fr}.grid.c3{grid-template-columns:repeat(3,1fr)}.grid.c4{grid-template-columns:repeat(4,1fr)}
.stat{background:var(--card);border-radius:18px;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-h)}
.stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--red);border-radius:18px 0 0 18px}
.stat.pos::before{background:var(--green)}.stat.neg::before{background:var(--red-d)}
.stat .v{font-size:24px;font-weight:800}.stat .l{font-size:12px;color:var(--muted);margin-top:2px}

table{width:100%;border-collapse:collapse;background:var(--card)}
th,td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:13.5px;vertical-align:top}
th{background:transparent;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700}
tr:hover td{background:#faf8fb}
.badge{display:inline-block;padding:3px 11px;border-radius:99px;font-size:11.5px;font-weight:700}
.b-new{background:#e9eefb;color:#3257c4}.b-int{background:#fef3d7;color:#9a6c0e}.b-not{background:#f0eef2;color:#777}
.b-file{background:#fde8d8;color:#b45712}.b-conf{background:#def5e6;color:#15824a}
.b-pend{background:#fef3d7;color:#9a6c0e}.b-appr{background:#def5e6;color:#15824a}.b-rej{background:#fde0de;color:#b6271d}
.b-inc{background:#def5e6;color:#15824a}.b-exp{background:#fde0de;color:#b6271d}.b-ref{background:#e9eefb;color:#3257c4}

form .row{margin-bottom:13px}
label{display:block;font-size:12.5px;font-weight:700;color:#5f5a68;margin-bottom:5px}
input[type=text],input[type=number],input[type=date],input[type=month],input[type=email],input[type=password],input[type=time],select,textarea{
  width:100%;padding:11px 13px;border:1.5px solid #e6e2ec;border-radius:12px;font-size:15px;background:#fbfafc;transition:border-color .3s ease,box-shadow .3s ease}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft);background:#fff}
textarea{min-height:72px}
.btn{display:inline-block;background:var(--red);color:#fff;border:0;border-radius:12px;padding:11px 20px;font-size:14.5px;font-weight:700;cursor:pointer;text-decoration:none;transition:background .3s ease,transform .25s ease,box-shadow .3s ease}
.btn:hover{background:var(--red-d);transform:translateY(-2px);box-shadow:var(--shadow-h)}
.btn.gold{background:var(--gold)} .btn.gold:hover{background:#bd831f}
.btn.red{background:#8b1a1a} .btn.ghost{background:#fff;color:var(--red);border:1.5px solid var(--red)}
.btn.ghost:hover{background:var(--red-soft)}
.btn.sm{padding:7px 13px;font-size:12.5px;border-radius:10px}
.flash{background:#fef3d7;border:1px solid var(--gold);padding:12px 16px;border-radius:12px;margin-bottom:16px;font-weight:600;color:#7a5708}
.filterbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;align-items:end;background:#fff;padding:16px;border-radius:16px;box-shadow:var(--shadow)}
.filterbar .f{min-width:140px}
.right{text-align:right}.muted{color:var(--muted);font-size:12.5px}
.amount-in{color:var(--ok);font-weight:700}.amount-out{color:var(--red);font-weight:700}

/* ---------- Login (gradient) ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,#e23744 0%,#b21f2d 55%,#7d1420 100%)}
.login-card{background:#fff;border-radius:22px;padding:34px;width:100%;max-width:390px;margin:16px;box-shadow:0 20px 60px rgba(0,0,0,.28)}
.login-card .brand{color:var(--ink);font-size:24px;margin-bottom:2px}
.checks{display:flex;gap:16px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:7px;font-weight:600}
.nav-overlay{display:none}
.tablewrap{overflow-x:auto;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:6px 10px}
.tablewrap table{background:transparent}
.portal-footer{background:#fff;border-radius:16px;padding:18px 20px;margin-top:24px;text-align:center;font-size:13px;box-shadow:var(--shadow)}
.portal-footer a{margin:0 12px;color:var(--red);font-weight:700}
.remember{display:flex;align-items:center;gap:7px;font-size:13px;margin:12px 0}
.remember input{width:auto}

@media (max-width: 860px){
  .menu-btn{display:block}
  .topbar{height:62px;padding:0 16px}
  .sidenav{top:62px;transform:translateX(-100%);transition:transform .3s;width:250px}
  body.nav-open .sidenav{transform:none}
  body.nav-open .nav-overlay{display:block;position:fixed;inset:62px 0 0 0;background:rgba(0,0,0,.4);z-index:20}
  .content{margin-left:0;margin-top:62px;padding:16px}
  .grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr 1fr}
  .grid.c2{grid-template-columns:1fr}
  table.cards thead{display:none}
  table.cards, table.cards tbody, table.cards tr, table.cards td{display:block;width:100%}
  table.cards tr{border:1px solid var(--line);border-radius:14px;margin-bottom:10px;background:#fff;padding:6px 0}
  table.cards td{border:0;padding:6px 14px}
  table.cards td[data-l]::before{content:attr(data-l)": ";font-weight:700;color:#5f5a68;font-size:12px}
  .lineitem{grid-template-columns:1fr 1fr !important}
  .lineitem > div:nth-child(1){grid-column:1 / -1}
}
@media print{.topbar,.sidenav,.filterbar,.btn{display:none}.content{margin:0}}

/* ---- Bulk select toolbar (Facebook Ads Manager style) ---- */
.bulkbar{display:none;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);
  border-radius:12px;padding:12px 16px;margin-bottom:14px;box-shadow:var(--shadow);position:sticky;top:80px;z-index:15}
.bulkbar.show{display:flex}
.bulkbar .cnt{font-weight:800;color:var(--red)}
.bulkbar .btn{margin-left:auto}
td.selcol,th.selcol{width:38px;text-align:center;padding-left:14px}
td.selcol input,th.selcol input{width:17px;height:17px;cursor:pointer}
tr.rowsel td{background:#fff5f5 !important}
@media (max-width:860px){
  .bulkbar{position:static;top:auto}
  table.cards td.selcol{display:flex;align-items:center;gap:8px}
  table.cards td.selcol::before{content:"Select";font-weight:700;color:#5f5a68;font-size:12px}
}

/* prevent wrapping in tight columns (date, amount, receipt) */
td.nowrap, th.nowrap { white-space: nowrap; }

/* ---- Searchable select ---- */
.ss-wrap{position:relative}
.ss-box{display:flex;align-items:center;gap:8px;justify-content:space-between;
  border:1.5px solid #e6e2ec;border-radius:10px;padding:10px 12px;background:#fff;cursor:pointer;font-size:14px;min-height:20px}
.ss-box:focus{outline:none;border-color:var(--red)}
.ss-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-label.ss-ph{color:#9a94a3}
.ss-caret{color:#9a94a3;font-size:12px}
.ss-pop{position:absolute;z-index:60;left:0;right:0;top:calc(100% + 4px);background:#fff;
  border:1px solid #e6e2ec;border-radius:12px;box-shadow:0 12px 34px rgba(0,0,0,.14);padding:8px;max-height:320px;display:flex;flex-direction:column}
.ss-search{width:100%;box-sizing:border-box;padding:9px 11px;border:1.5px solid #e6e2ec;border-radius:8px;font-size:14px;margin-bottom:6px}
.ss-search:focus{outline:none;border-color:var(--red)}
.ss-list{overflow-y:auto;max-height:250px}
.ss-item{padding:9px 11px;border-radius:8px;cursor:pointer;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-item:hover{background:#fbeaec}
.ss-item.on{background:#fbeaec;font-weight:700}
.ss-none{padding:10px 11px;color:#9a94a3;font-size:13px}

/* ---- Stage tabs (Student pipeline) ---- */
.foldertabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}
.foldertabs a{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1.5px solid var(--line);
  border-radius:99px;background:#fff;color:#4a4551;font-weight:600;font-size:13.5px;text-decoration:none;transition:.2s}
.foldertabs a:hover{border-color:var(--red);color:var(--red)}
.foldertabs a.on{background:var(--red);border-color:var(--red);color:#fff}
.foldertabs a .cnt{background:rgba(0,0,0,.08);border-radius:99px;padding:1px 9px;font-size:12px;font-weight:700}
.foldertabs a.on .cnt{background:rgba(255,255,255,.25)}

/* ---- Student application stage progress line ---- */
.stageline{display:flex;align-items:flex-start;margin-top:14px}
.stagept{display:flex;flex-direction:column;align-items:center;min-width:78px;text-align:center}
.stagept .dot{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;
  border:2.5px solid #d9d4e0;background:#fff;color:#fff;font-weight:800;font-size:14px;text-decoration:none;transition:.2s}
.stagept .lbl{font-size:11.5px;color:#8a8594;margin-top:7px;font-weight:600;line-height:1.25}
.stagept.done .dot{background:var(--red);border-color:var(--red)}
.stagept.cur .dot{border-color:var(--red);box-shadow:0 0 0 4px rgba(226,55,68,.15)}
.stagept.cur .lbl{color:var(--red)}
.stagebar{flex:1;height:2.5px;background:#d9d4e0;margin-top:14px;min-width:20px}
.stagebar.done{background:var(--red)}
@media (max-width:700px){ .stagept{min-width:58px} .stagept .lbl{font-size:10px} }

/* ---- Shared modal popup (announcements + client welcome) ---- */
.ann-overlay{position:fixed;inset:0;background:rgba(20,16,26,.55);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
.ann-box{background:#fff;border-radius:18px;max-width:520px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3);overflow:hidden;animation:annPop .25s ease}
@keyframes annPop{from{transform:scale(.94);opacity:0}to{transform:scale(1);opacity:1}}
.ann-head{background:linear-gradient(135deg,#e23744,#b21f2d);color:#fff;padding:20px 26px}
.ann-badge{font-size:11px;letter-spacing:.6px;text-transform:uppercase;background:rgba(255,255,255,.2);padding:3px 10px;border-radius:99px;font-weight:700}
.ann-head h2{margin:10px 0 0;font-size:20px}
.ann-body{padding:22px 26px;font-size:14.5px;line-height:1.7;color:#2b2730;max-height:46vh;overflow:auto}
.ann-check{display:flex;gap:9px;align-items:flex-start;padding:0 26px 6px;font-size:13.5px;color:#4a4550;cursor:pointer}
.ann-check input{margin-top:3px}

/* ---- Accounts type tabs ---- */
.typetabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.typetab{padding:10px 22px;border-radius:99px;border:1.5px solid #e6e2ec;background:#fff;color:#5f5a68;font-weight:700;font-size:14px;cursor:pointer;transition:.15s}
.typetab:hover{border-color:var(--red);color:var(--red)}
.typetab.on{background:var(--red);border-color:var(--red);color:#fff}
.typetab.t-income.on{background:#15824a;border-color:#15824a}
.typetab.t-income:hover{border-color:#15824a;color:#15824a}
.typetab.t-refund.on{background:#8a6d1a;border-color:#8a6d1a}
.typetab.t-adjustment.on{background:#5a4b8a;border-color:#5a4b8a}
/* entry card tint by selected type */
.entry-income{background:rgba(21,130,74,.08);border:1px solid rgba(21,130,74,.25)}
.entry-expense{background:rgba(226,55,68,.07);border:1px solid rgba(226,55,68,.25)}
.entry-refund{background:rgba(138,109,26,.08);border:1px solid rgba(138,109,26,.25)}
.entry-adjustment{background:rgba(90,75,138,.08);border:1px solid rgba(90,75,138,.25)}

/* ---- Student stage progress line ---- */
.stageline{display:flex;align-items:flex-start;margin-top:14px}
.stagept{display:flex;flex-direction:column;align-items:center;min-width:78px;text-align:center}
.stagept .dot{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:2.5px solid #d9d4e0;background:#fff;color:#fff;font-weight:800;font-size:14px;text-decoration:none}
.stagept .lbl{font-size:11.5px;color:#8a8594;margin-top:7px;font-weight:600;line-height:1.25}
.stagept.done .dot{background:var(--red);border-color:var(--red)}
.stagept.cur .dot{border-color:var(--red);box-shadow:0 0 0 4px rgba(226,55,68,.15)}
.stagept.cur .lbl{color:var(--red)}
.stagebar{flex:1;height:2.5px;background:#d9d4e0;margin-top:14px;min-width:16px}
.stagebar.done{background:var(--red)}
@media (max-width:700px){.stagept{min-width:56px}.stagept .lbl{font-size:10px}}