:root{--ink:#1b2a35;--muted:#5c7385;--brand:#d81f2a;--brand-dark:#b0121b;--bg:#e8edf1;--line:#d7dee4;--ivory:#fcfbf9}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:var(--bg);color:var(--ink)}header{background:#fff;border-bottom:1px solid var(--line);padding:16px 26px;display:flex;justify-content:space-between;align-items:center}header strong{font-size:22px}.subtitle{margin-left:12px;color:var(--muted);font-size:13px}.user{font-size:13px;color:var(--muted)}nav{background:#fff;border-bottom:1px solid var(--line);padding:0 22px;display:flex;gap:6px;overflow:auto}nav a{padding:12px 10px;color:#344054;text-decoration:none;white-space:nowrap}nav a:hover{color:var(--brand)}main{max-width:1200px;margin:24px auto;padding:0 20px}.pagehead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}h1{font-size:26px;margin:0 0 6px}h2{font-size:18px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:24px}.card,.form-card,.login-card,section{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px}.card span{color:var(--muted);font-size:13px}.card b{display:block;font-size:28px;margin-top:8px}.btn{display:inline-block;background:var(--brand);color:#fff;border:0;border-radius:8px;padding:10px 14px;text-decoration:none;cursor:pointer}.danger{background:#b42318}table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line)}th,td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}th{background:#f9fafb;color:#475467}.form-card,.login-card{max-width:760px}.login-card{max-width:420px;margin:70px auto}.form-control{width:100%;padding:9px 10px;border:1px solid #d0d5dd;border-radius:7px}.form-check-input{margin-right:8px}.alert{background:#ecfdf3;border:1px solid #abefc6;padding:10px 12px;border-radius:8px;margin-bottom:16px}.inline{display:inline}.linkbtn{border:0;background:none;color:var(--brand);cursor:pointer}@media(max-width:700px){header{align-items:flex-start;gap:10px;flex-direction:column}.subtitle{display:block;margin:4px 0 0}.pagehead{align-items:flex-start;gap:12px;flex-direction:column}table{display:block;overflow-x:auto}}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}.filters input,.filters select{padding:10px;border:1px solid #ccd3dc;border-radius:7px;min-width:190px}.muted{color:#64748b;font-size:13px}.tablewrap{overflow:auto}.secondary{background:#475569}
.actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.errorbox{background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;padding:12px 14px;border-radius:8px;margin-bottom:16px}.errorbox ul{margin:8px 0 0 20px;max-height:320px;overflow:auto}.form-card label{display:block;margin-top:4px}@media(max-width:900px){.actions{justify-content:flex-start}}
.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;margin-bottom:24px}.formgrid>div{min-width:0}.formgrid label{display:block;font-weight:600;margin-bottom:6px}.formgrid small{display:block;color:#667085;margin-top:4px}@media(max-width:800px){.formgrid{grid-template-columns:1fr}}
.rule-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0}.rule-grid .card{padding:14px}.big{font-size:26px;font-weight:700;margin-top:6px}.note{margin-top:16px;padding:12px 14px;border:1px solid #d9dde3;border-radius:8px;background:#fff}.secondary{background:#fff!important;color:#222!important;border:1px solid #bbb!important}
.table-wrap{overflow-x:auto}.compact{font-size:12px;white-space:nowrap}.compact th,.compact td{padding:7px}.salary-slip{max-width:1000px;margin:20px auto}.slip-title{display:flex;justify-content:space-between;align-items:center}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:25px}.net-pay{text-align:right;border-top:2px solid #222;padding-top:12px}.print-only{display:none}.small{font-size:12px}@media print{header,nav,.no-print{display:none!important}.print-only{display:block}.container{max-width:none;margin:0;padding:0}.card{box-shadow:none;border:0}.salary-slip{max-width:none}.two-col{grid-template-columns:1fr 1fr}body{font-size:11px}.compact{font-size:9px}}
/* v1.10 salary slip print layouts */
.salary-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.salary-slip-box{background:#fff;border:1.6px solid #222;padding:14px 18px;color:#111;break-inside:avoid;page-break-inside:avoid}.firm-header{text-align:center}.firm-name{font-family:Georgia,serif;font-size:22px;font-weight:700}.firm-address{font-size:12px;margin-top:3px}.salary-title{font-size:15px;font-weight:700;margin-top:8px}.workplace{font-size:12px;font-style:italic;margin-top:3px}.slip-rule{border-top:2px solid #222;margin:9px 0 10px}.employee-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 26px;font-size:12px;margin-bottom:9px}.slip-pay-table{border:1.3px solid #222}.slip-pay-table th,.slip-pay-table td{border:1px solid #222;padding:5px 7px;font-size:12px}.slip-pay-table th{background:#fff;color:#111}.slip-pay-table .money{text-align:right}.slip-pay-table .total-row th{font-weight:700}.net-earning{text-align:right;font-weight:700;font-size:15px;border-top:2px solid #222;margin-top:7px;padding-top:7px}.single-slip-print{max-width:900px;margin:0 auto}.bulk-slips{display:grid;gap:12px}.bulk-slips.layout-2{grid-template-columns:1fr}.bulk-slips.layout-4{grid-template-columns:1fr 1fr}.bulk-slip-item{break-inside:avoid;page-break-inside:avoid}
@media print{@page{size:A4 portrait;margin:7mm}body{background:#fff}.single-slip-print{max-width:none}.bulk-slips{gap:5mm}.bulk-slips.layout-2{display:grid;grid-template-columns:1fr}.bulk-slips.layout-2 .bulk-slip-item{height:136mm;display:flex;align-items:flex-start}.bulk-slips.layout-2 .salary-slip-box{width:100%;font-size:10px}.bulk-slips.layout-4{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:136mm;gap:4mm}.bulk-slips.layout-4 .salary-slip-box{height:100%;padding:7px 8px}.bulk-slips.layout-4 .firm-name{font-size:15px}.bulk-slips.layout-4 .firm-address,.bulk-slips.layout-4 .salary-title,.bulk-slips.layout-4 .workplace{font-size:9px}.bulk-slips.layout-4 .employee-grid{font-size:8px;gap:2px 8px}.bulk-slips.layout-4 .slip-pay-table th,.bulk-slips.layout-4 .slip-pay-table td{font-size:8px;padding:2px 3px}.bulk-slips.layout-4 .net-earning{font-size:10px;margin-top:3px;padding-top:3px}}

/* v1.10.1 reference-slip refinement */
.reference-slip{max-width:900px;margin:0 auto;padding:18px 22px}.reference-slip .firm-name{font-size:22px}.reference-slip .firm-address{font-size:13px}.reference-slip .salary-title{font-size:16px}.reference-slip .workplace{font-size:12px}.reference-slip .sample-grid{grid-template-columns:1fr 1fr;row-gap:4px;font-size:12px}.reference-slip .slip-pay-table th,.reference-slip .slip-pay-table td{padding:5px 8px}.reference-slip .net-earning{font-size:15px}
@media print{.reference-slip{padding:10px 14px}.layout-4 .reference-slip{padding:6px 7px}.layout-4 .reference-slip .sample-grid{font-size:8px}.layout-4 .reference-slip .firm-name{font-size:15px}}

/* v1.10.2 original-reference salary slip layout */
.reference-slip{max-width:880px;margin:0 auto;border:1px solid #222;padding:16px 22px;font-family:Arial,sans-serif;background:#fff}
.reference-slip .firm-header{text-align:center;line-height:1.25}
.reference-slip .firm-name{font-family:Georgia,serif;font-size:21px;font-weight:700}
.reference-slip .firm-address{font-size:12px;margin-top:2px}
.reference-slip .salary-title{font-size:15px;font-weight:700;margin-top:7px}
.reference-slip .workplace{font-size:12px;font-style:italic;margin-top:2px}
.reference-slip .slip-rule{border-top:2px solid #222;margin:8px 0 10px}
.reference-slip .sample-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:42px;row-gap:4px;font-size:12px;line-height:1.2;margin-bottom:10px}
.reference-slip .slip-pay-table{width:100%;table-layout:fixed;border:1.4px solid #222}
.reference-slip .slip-pay-table th,.reference-slip .slip-pay-table td{border:1px solid #222;padding:5px 7px;font-size:12px}
.reference-slip .slip-pay-table th:nth-child(1),.reference-slip .slip-pay-table td:nth-child(1){width:29%}
.reference-slip .slip-pay-table th:nth-child(2),.reference-slip .slip-pay-table td:nth-child(2){width:21%}
.reference-slip .slip-pay-table th:nth-child(3),.reference-slip .slip-pay-table td:nth-child(3){width:32%}
.reference-slip .slip-pay-table th:nth-child(4),.reference-slip .slip-pay-table td:nth-child(4){width:18%}
.reference-slip .net-earning{text-align:right;font-weight:700;font-size:15px;border-top:2px solid #222;margin-top:7px;padding-top:7px}
@media print{header,nav,.no-print,.salary-actions{display:none!important}main{max-width:none!important;margin:0!important;padding:0!important}.reference-slip{width:100%;max-width:none;border:1px solid #222;padding:10px 14px}.single-slip-print{width:100%;max-width:none}.bulk-slips.layout-2 .bulk-slip-item{height:136mm}.bulk-slips.layout-4 .bulk-slip-item{height:136mm}.bulk-slips.layout-4 .reference-slip{padding:5px 6px}.bulk-slips.layout-4 .reference-slip .firm-name{font-size:14px}.bulk-slips.layout-4 .reference-slip .firm-address,.bulk-slips.layout-4 .reference-slip .salary-title,.bulk-slips.layout-4 .reference-slip .workplace{font-size:8px}.bulk-slips.layout-4 .reference-slip .sample-grid{font-size:7.5px;column-gap:7px;row-gap:1px}.bulk-slips.layout-4 .reference-slip .slip-pay-table th,.bulk-slips.layout-4 .reference-slip .slip-pay-table td{font-size:7.5px;padding:2px 3px}.bulk-slips.layout-4 .reference-slip .net-earning{font-size:9px}}

/* ===== Red / White / Blue-grey theme (Sentinels palette from gun) ===== */
:root{--brand:#e4002b;--brand-dark:#b4111f;--bg:#f1ebdc;
  --hdr1:#e4002b;--hdr2:#b4111f;--hdr-line:#9c0f1a;
  --strip1:#f7b500;--strip2:#f36f21;--strip3:#ffd089;
  --nav1:#173a6b;--nav2:#0e2547;--nav-line:#0c2140;--nav-active:#f7b500}
body[data-theme="blue"]{--brand:#0a6ebd;--brand-dark:#075a9e;--bg:#eef3f7;
  --hdr1:#0a6ebd;--hdr2:#064a82;--hdr-line:#053b68;
  --strip1:#4dc3ff;--strip2:#1f8fd6;--strip3:#bfe6ff;
  --nav1:#0f2c4d;--nav2:#08192e;--nav-line:#061424;--nav-active:#4dc3ff}
body[data-theme="green"]{--brand:#1b7a43;--brand-dark:#0f5a30;--bg:#eef4ee;
  --hdr1:#1b7a43;--hdr2:#0f5a30;--hdr-line:#0b4425;
  --strip1:#a7e05a;--strip2:#5fb62f;--strip3:#d6f0b0;
  --nav1:#13351f;--nav2:#0a2114;--nav-line:#07180e;--nav-active:#a7e05a}
body[data-theme="slate"]{--brand:#c0392b;--brand-dark:#96281b;--bg:#f1f5f9;
  --hdr1:#334155;--hdr2:#1e293b;--hdr-line:#0f172a;
  --strip1:#f59e0b;--strip2:#d97706;--strip3:#fcd34d;
  --nav1:#1e293b;--nav2:#0f172a;--nav-line:#020617;--nav-active:#f59e0b}
body{background:var(--bg);min-height:100vh}
header{background:linear-gradient(135deg,var(--hdr1) 0%,var(--hdr2) 100%);border-bottom:1px solid var(--hdr-line);position:relative}
header::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--strip1) 0%,var(--strip2) 55%,var(--strip3) 100%)}
header strong{color:#fff;letter-spacing:.3px;text-shadow:0 1px 2px rgba(0,0,0,.22)}
header .subtitle{color:rgba(255,255,255,.82)}
header .user{color:rgba(255,255,255,.9)}
header .user a{color:#fff;text-decoration:underline}
header .user .linkbtn{color:#fff;font-weight:700}
header .user button{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.42);color:#fff}
nav{background:linear-gradient(135deg,var(--nav1) 0%,var(--nav2) 100%);border-bottom:1px solid var(--nav-line)}
nav a{color:#dbe6f2!important;border-bottom:3px solid transparent}
nav a.active,nav a:hover{color:#fff!important;border-bottom-color:var(--nav-active)}
.btn:hover{background:var(--brand-dark)}
.lc-new{background:#fdeaea!important;color:var(--brand)!important}
.card,.form-card,.login-card,section{border-top:1px solid var(--line);box-shadow:0 1px 3px rgba(20,30,40,.05)}
.card b,.big{color:var(--brand)}
.pagehead h1,h1,h2{color:var(--ink)}
.gate-card,.login-card{border-top:4px solid var(--brand)}
.lc-owner{font-size:12.5px;color:rgba(255,255,255,.82);margin-top:5px;letter-spacing:.2px}
.lc-owner b{color:#fff;font-weight:700}
@media print{tfoot{display:table-row-group}tfoot tr{break-inside:avoid;page-break-inside:avoid}}
