*{box-sizing:border-box}
body{margin:0;background:#f3f5f7;color:#243447;font-family:Segoe UI,Arial,sans-serif}
.site-header{background:#fff;border-bottom:1px solid #e4e8ed}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}
.brand img{width:92px;height:auto;display:block}
.brand-name{font-size:1.55rem;font-weight:700;color:#123a63}
.brand-tagline{font-size:.92rem;color:#66717f}
.contact-info{text-align:right;color:#173f6d;font-weight:600}
.site-nav{background:#173f6d}
.site-nav .container{display:flex;gap:26px;padding-top:13px;padding-bottom:13px}
.site-nav a{color:#fff;text-decoration:none;font-weight:600}
.site-nav a:hover{text-decoration:underline}
.tool-heading{text-align:center;padding:24px 10px 10px}
.tool-heading h1{color:#173f6d;font-weight:750;margin-bottom:8px}
.tool-heading p{color:#66717f}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;font-weight:700;color:#2d8b3c!important;margin-bottom:6px}
.form-card{background:#fff;border:1px solid #dfe5eb;border-radius:14px;box-shadow:0 5px 18px rgba(23,63,109,.07);padding:24px;margin:20px 0}
.form-card h2{font-size:1.15rem;color:#173f6d;border-bottom:2px solid #e8edf2;padding-bottom:11px;margin-bottom:18px}
.form-label{font-weight:650;color:#33465a}
.action-bar{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 32px}
.action-bar .btn{min-width:160px;font-weight:650}
.receipt-preview{background:#fff;border:1px solid #cfd7df;border-radius:10px;box-shadow:0 6px 22px rgba(0,0,0,.08);padding:42px 48px;margin:32px auto;max-width:850px;color:#111}
.receipt-header{display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid #2d8b3c;padding-bottom:18px;margin-bottom:26px}
.receipt-header img{width:95px;height:auto}
.receipt-title h1{margin:0;color:#173f6d;font-size:1.75rem}
.receipt-title p{margin:4px 0 0;color:#666}
.receipt-label{font-weight:700;color:#33465a}
.receipt-number{font-size:1.05rem}
.receipt-table{width:100%;border-collapse:collapse;margin:22px 0}
.receipt-table th,.receipt-table td{border:1px solid #cfd7df;padding:12px 14px;text-align:left}
.receipt-table th{width:34%;background:#f4f7f9;color:#173f6d}
.amount-paid{font-size:1.65rem;font-weight:800;color:#2d8b3c}
.notes-box{border:1px solid #cfd7df;border-radius:7px;padding:14px;min-height:68px;white-space:pre-wrap}
.signature-area{margin-top:58px;width:280px}
.signature-line{border-top:1px solid #111;padding-top:7px}
.receipt-footer{text-align:center;color:#666;font-size:.9rem;margin-top:40px}
.site-footer{background:#173f6d;color:#fff;text-align:center;padding:14px;margin-top:48px}
@media(max-width:768px){
  .contact-info{display:none}
  .brand img{width:72px}
  .brand-name{font-size:1.25rem}
  .site-nav .container{gap:16px;overflow-x:auto}
  .receipt-preview{padding:28px 20px}
  .receipt-header{align-items:flex-start}
  .receipt-header img{width:72px}
}
@media print{
  @page{size:letter;margin:.65in}
  body{background:#fff}
  .site-header,.site-nav,.tool-heading,#receiptForm,.site-footer{display:none!important}
  .container{max-width:none!important;padding:0!important;margin:0!important}
  #receiptPreview{display:block!important;border:none!important;box-shadow:none!important;margin:0!important;padding:0!important;max-width:none!important}
}
