@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/inter-400-normal-latin.woff2") format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/inter-600-normal-latin.woff2") format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/inter-700-normal-latin.woff2") format('woff2');}

:root{
  --ink:#17211B; --body:#49544D; --faint:#75817A;
  --paper:#FDFDFB; --mist:#F4F6F0; --line:#E4E8DE;
  --deep:#0E3B39; --green-text:#2E7D46; --lime:#A6CE39; --green:#8DC63F;
  --warn-bg:#FEF6E7; --warn-line:#E9D9A6; --warn-ink:#7A5A00;
  --info-bg:#E7F1EC; --info-line:#BFE0CE;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-md:14px; --r-sm:10px;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
     font-size:15px;line-height:1.5;padding:18px;}
.wrap{max-width:680px;margin:0 auto;}

h1{font-size:22px;font-weight:700;margin:0 0 4px;color:var(--deep);letter-spacing:.2px;}
.sub{color:var(--faint);font-size:13.5px;margin:0 0 16px;}
.info{background:var(--info-bg);border:1px solid var(--info-line);color:var(--green-text);
      border-radius:var(--r-sm);padding:11px 14px;font-size:13.5px;margin:0 0 20px;}

h2.section{font-size:14px;font-weight:700;color:var(--deep);text-transform:uppercase;
      letter-spacing:.8px;margin:26px 2px 12px;padding-bottom:6px;border-bottom:2px solid var(--lime);}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
      margin-bottom:20px;box-shadow:0 1px 2px rgba(23,33,27,.05),0 8px 24px rgba(23,33,27,.06);}
.card > h2{margin:0;background:var(--deep);color:#fff;font-size:16px;font-weight:700;padding:13px 18px;}
.card > h2 .tag{float:right;font-size:10.5px;font-weight:600;background:rgba(166,206,57,.25);color:#DCEBB6;
      border:1px solid rgba(166,206,57,.5);border-radius:999px;padding:2px 9px;margin-top:1px;letter-spacing:.3px;}
.card .inner{padding:6px 18px 16px;}

table{width:100%;border-collapse:collapse;font-size:14px;}
td,th{padding:10px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--faint);font-weight:700;}
td.val,th.val{text-align:right;white-space:nowrap;}
td.val{font-weight:600;font-variant-numeric:tabular-nums;}
tr.result td{font-weight:700;color:var(--deep);border-bottom:none;border-top:2px solid var(--deep);
             font-size:15.5px;padding-top:12px;}
tr.result td.val{color:var(--green-text);}
td .sub2{display:block;font-weight:400;color:var(--faint);font-size:11.5px;}

.input-wrap{position:relative;display:inline-block;width:170px;}
.input-wrap .rs{position:absolute;left:11px;top:50%;transform:translateY(-50%);
                color:var(--faint);font-weight:600;pointer-events:none;font-size:14px;}
input[type=number]{width:100%;padding:9px 11px 9px 26px;font-size:15px;font-family:inherit;text-align:right;
      border:1px solid var(--line);border-radius:var(--r-sm);background:var(--mist);color:var(--ink);}
input.noprefix{padding-left:11px;}
input[type=number]:focus{outline:none;border-color:var(--green);
      box-shadow:0 0 0 3px rgba(141,198,63,.25);background:#fff;}

/* EPF option toggles */
.checks{display:flex;flex-direction:column;gap:8px;margin:12px 6px 6px;}
.chk{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--body);cursor:pointer;}
.chk input{margin-top:2px;accent-color:var(--green-text);width:16px;height:16px;flex:none;}
/* dynamic breakdown group header (EPF) */
tr.grp td{background:var(--mist);font-weight:700;color:var(--deep);font-size:11.5px;
          text-transform:uppercase;letter-spacing:.4px;border-bottom:none;padding-top:13px;}
td.empty{color:var(--faint);font-weight:400;}
/* select (leave-encashment days basis) */
select.sel{width:170px;padding:9px 11px;font-size:15px;font-family:inherit;text-align:right;
      border:1px solid var(--line);border-radius:var(--r-sm);background:var(--mist);color:var(--ink);cursor:pointer;}
select.sel:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(141,198,63,.25);background:#fff;}

/* date + month pickers (EPS pension / ECR) */
input.dt{width:170px;padding:8px 10px;font-size:14px;font-family:inherit;border:1px solid var(--line);
      border-radius:var(--r-sm);background:var(--mist);color:var(--ink);}
input.dt:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(141,198,63,.25);background:#fff;}

/* footnote inside cards */
p.note{margin:12px 6px 2px;font-size:11.5px;color:var(--faint);line-height:1.5;}

/* ECR challan table */
.scrollx{overflow-x:auto;margin:14px 0 4px;border:1px solid var(--line);border-radius:var(--r-sm);}
table.ecr{border-collapse:collapse;width:100%;min-width:1080px;font-size:12.5px;}
table.ecr th{background:var(--mist);font-size:10.5px;padding:8px 6px;white-space:nowrap;}
table.ecr td{padding:5px 4px;border-bottom:1px solid var(--line);}
table.ecr td.idx{color:var(--faint);text-align:center;width:26px;}
table.ecr td.mid{text-align:center;}
table.ecr td.calc{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;
      background:#FAFBF7;}
table.ecr input[type=text]{width:130px;padding:6px 8px;font-size:12.5px;font-family:inherit;
      border:1px solid var(--line);border-radius:7px;background:var(--mist);color:var(--ink);}
table.ecr input.c-uan{width:118px;}
table.ecr input.amt{width:88px;padding:6px 8px;font-size:12.5px;text-align:right;font-family:inherit;
      border:1px solid var(--line);border-radius:7px;background:var(--mist);color:var(--ink);}
table.ecr input.amt.sm{width:52px;}
table.ecr input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 2px rgba(141,198,63,.25);background:#fff;}
table.ecr input[type=checkbox]{accent-color:var(--green-text);width:15px;height:15px;}
table.ecr .del{border:none;background:none;color:#B4443B;font-size:16px;font-weight:700;cursor:pointer;
      padding:2px 6px;border-radius:6px;line-height:1;}
table.ecr .del:hover{background:#FBEAE8;}

.btnrow{display:flex;gap:10px;margin:10px 0 6px;flex-wrap:wrap;}
.btn2{font-family:inherit;font-size:13px;font-weight:600;padding:8px 14px;border-radius:var(--r-sm);
      border:1px solid var(--line);background:var(--mist);color:var(--deep);cursor:pointer;}
.btn2:hover{border-color:var(--green);}
.btn2.primary{background:var(--deep);border-color:var(--deep);color:#fff;}
.btn2.primary:hover{background:#12504D;}

.msg{margin:12px 6px 2px;font-size:12.5px;border-radius:var(--r-sm);padding:9px 12px;line-height:1.45;}
.msg.warn{background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink);}
.msg.ok{background:var(--info-bg);border:1px solid var(--info-line);color:var(--green-text);}
.msg.hidden{display:none;}

.ref table td{font-size:13.5px;}
.ref td:first-child{font-weight:600;color:var(--ink);width:34%;}
.ref td:last-child{color:var(--body);font-variant-numeric:tabular-nums;}
.foot{font-size:11px;color:var(--faint);text-align:center;margin:18px 0 0;line-height:1.5;}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;
     background:var(--mist);padding:1px 5px;border-radius:5px;color:var(--deep);}
