/* ──────────────────────────────────────────────
   Pakistan Property Tax Calculator — FY 2025-26
   Clean Light Theme
   ────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display&display=swap');

:root{
  --primary:#16A34A;
  --primary2:#15803D;
  --primary-light:#DCFCE7;
  --primary-bg:#F0FDF4;
  --gold:#CA8A04;
  --green:#16A34A;
  --red:#DC2626;
  --amber:#D97706;
  --white:#FFFFFF;
  --off:#F8FAFC;
  --bg:#F9FAFB;
  --border:#E5E7EB;
  --border2:#D1D5DB;
  --text:#111827;
  --text2:#374151;
  --muted:#6B7280;
  --radius:12px;
  --shadow:0 2px 12px rgba(0,0,0,.08);
}

.ptc-wrap{
  font-family:'DM Sans',sans-serif;
  max-width:820px;
  margin:0 auto 48px;
  color:var(--text);
}

/* ── HEADER ─────────────────────────────────── */
.ptc-header{
  background:linear-gradient(135deg,#16A34A 0%,#15803D 100%);
  border-radius:var(--radius) var(--radius) 0 0;
  padding:36px 40px 24px;
  position:relative;
  overflow:hidden;
  border:1px solid #15803D;
}
.ptc-header::before{
  content:'';
  position:absolute;
  top:-60px;right:-60px;
  width:220px;height:220px;
  background:radial-gradient(circle,rgba(255,255,255,.12) 0%,transparent 70%);
  border-radius:50%;
}
.ptc-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.2);
  border:1px solid rgba(255,255,255,.35);
  color:#fff;
  font-size:12px;font-weight:600;letter-spacing:.5px;
  padding:5px 12px;border-radius:20px;
  margin-bottom:14px;
}
.ptc-title{
  font-family:'DM Serif Display',serif;
  font-size:clamp(22px,4vw,30px);
  color:#fff;
  margin:0 0 8px;
  font-weight:400;
}
.ptc-sub{
  color:rgba(255,255,255,.8);
  font-size:14px;
  margin:0 0 24px;
}

/* Main mode tabs */
.ptc-tabs-main{ display:flex;gap:8px;flex-wrap:wrap; }
.ptc-tab-main{
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.3);
  color:rgba(255,255,255,.9);
  padding:9px 22px;
  border-radius:8px;
  font-size:14px;font-weight:500;
  cursor:pointer;transition:.2s;
  font-family:'DM Sans',sans-serif;
}
.ptc-tab-main:hover{ background:rgba(255,255,255,.28); }
.ptc-tab-main.active{
  background:#fff;
  color:#15803D;
  border-color:#fff;
  font-weight:700;
}

/* ── FORM ────────────────────────────────────── */
.ptc-form-wrap{
  background:#fff;
  border:1px solid var(--border);
  border-top:none;
  padding:28px 36px;
}
.ptc-field-group{ margin-bottom:22px; }
.ptc-label{
  display:block;
  font-size:12px;font-weight:700;
  color:var(--muted);
  text-transform:uppercase;letter-spacing:.6px;
  margin-bottom:10px;
}
.ptc-hint{
  font-weight:400;text-transform:none;letter-spacing:0;
  color:#9CA3AF;font-size:11px;
}

/* Province buttons */
.ptc-prov-grid{ display:flex;flex-wrap:wrap;gap:8px; }
.ptc-prov{
  background:#fff;
  border:1.5px solid var(--border2);
  color:var(--text2);
  padding:9px 18px;border-radius:8px;
  font-size:13px;font-weight:500;
  cursor:pointer;transition:.2s;
  font-family:'DM Sans',sans-serif;
}
.ptc-prov:hover{ border-color:var(--primary);color:var(--primary); }
.ptc-prov.active{
  background:var(--primary-light);
  border-color:var(--primary);
  color:var(--primary2);font-weight:700;
}

/* Property type + filer cards */
.ptc-type-grid{ display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.ptc-acq-grid{ max-width:500px; }
.ptc-type{
  background:#fff;
  border:1.5px solid var(--border2);
  color:var(--text2);
  padding:14px;border-radius:10px;
  font-size:18px;cursor:pointer;transition:.2s;
  text-align:center;
  font-family:'DM Sans',sans-serif;
}
.ptc-type span{ display:block;font-size:13px;font-weight:600;color:var(--text);margin-top:6px; }
.ptc-type small{ display:block;font-size:11px;color:var(--muted);margin-top:2px; }
.ptc-type:hover{ border-color:var(--primary); }
.ptc-type.active{ background:var(--primary-light);border-color:var(--primary); }

.ptc-filer-grid{ display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }
.ptc-filer{
  background:#fff;
  border:1.5px solid var(--border2);
  color:var(--text2);
  padding:12px;border-radius:10px;
  font-size:20px;cursor:pointer;transition:.2s;
  text-align:center;
  font-family:'DM Sans',sans-serif;
}
.ptc-filer strong{ display:block;font-size:12px;color:var(--text);margin-top:6px; }
.ptc-filer small{ display:block;font-size:10px;color:var(--muted); }
.ptc-filer[data-val="filer"].active{ background:#DCFCE7;border-color:var(--green); }
.ptc-filer[data-val="late"].active{ background:#FEF3C7;border-color:var(--amber); }
.ptc-filer[data-val="nonfiler"].active{ background:#FEE2E2;border-color:var(--red); }

/* Input */
.ptc-input-wrap{
  display:flex;align-items:center;
  background:var(--off);
  border:1.5px solid var(--border2);
  border-radius:8px;overflow:hidden;
}
.ptc-input-wrap:focus-within{ border-color:var(--primary); }
.ptc-prefix,.ptc-suffix{
  padding:0 14px;
  font-size:13px;font-weight:700;
  color:var(--primary);
  white-space:nowrap;
}
.ptc-suffix{ color:var(--muted);font-size:12px; }
.ptc-input{
  flex:1;background:transparent;border:none;
  color:var(--text);font-family:'DM Sans',sans-serif;
  font-size:16px;font-weight:600;
  padding:12px 10px;outline:none;
}
.ptc-input::placeholder{ color:#D1D5DB;font-weight:400;font-size:14px; }

.ptc-two-col{ display:grid;grid-template-columns:1fr 1fr;gap:16px; }
@media(max-width:540px){ .ptc-two-col{grid-template-columns:1fr;} }

/* Calculate button */
.ptc-calc-btn{
  width:100%;
  background:linear-gradient(135deg,#16A34A 0%,#15803D 100%);
  color:#fff;
  border:none;
  padding:16px;border-radius:10px;
  font-family:'DM Sans',sans-serif;
  font-size:16px;font-weight:700;
  cursor:pointer;transition:.2s;
  margin-top:8px;
  box-shadow:0 4px 14px rgba(22,163,74,.25);
}
.ptc-calc-btn:hover{ transform:translateY(-1px);box-shadow:0 8px 20px rgba(22,163,74,.35); }
.ptc-calc-btn:disabled{ opacity:.6;cursor:not-allowed;transform:none; }

/* ── RESULTS ─────────────────────────────────── */
.ptc-results{
  background:#fff;
  border:1px solid var(--border);
  border-top:2px solid var(--primary);
  padding:28px 36px;
  border-radius:0 0 var(--radius) var(--radius);
}
.ptc-results-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:20px;
}
.ptc-results-header h3{ color:var(--text);font-size:18px;margin:0; }
#ptcResultsMeta{ font-size:12px;color:var(--muted); }

/* Tax rows */
.ptc-tax-row{
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:12px 0;
  border-bottom:1px solid var(--border);
  gap:16px;
}
.ptc-tax-row:last-child{ border-bottom:none; }
.ptc-tax-name{ flex:1; }
.ptc-tax-name strong{ display:block;font-size:14px;color:var(--text); }
.ptc-tax-name small{ display:block;font-size:11px;color:var(--muted);margin-top:2px;line-height:1.5; }
.ptc-tax-badge{
  font-size:10px;font-weight:600;padding:2px 8px;border-radius:10px;
  margin-top:4px;display:inline-block;
}
.ptc-badge-adj{ background:#DCFCE7;color:#15803D; }
.ptc-badge-nonadj{ background:#FEE2E2;color:#DC2626; }
.ptc-badge-annual{ background:#FEF9C3;color:#A16207; }
.ptc-tax-amount{ font-size:16px;font-weight:700;color:var(--text);white-space:nowrap; }
.ptc-tax-rate{ font-size:11px;color:var(--muted);text-align:right; }

/* Total row */
.ptc-total-row{
  display:flex;justify-content:space-between;align-items:center;
  background:var(--primary-bg);
  border:2px solid var(--primary);
  border-radius:10px;
  padding:16px 20px;
  margin-top:16px;
  font-size:15px;color:var(--text2);font-weight:600;
}
.ptc-total-row strong{ font-size:22px;color:var(--primary2);font-weight:700; }

/* Notes */
.ptc-notes{ margin-top:16px; }
.ptc-note-item{
  font-size:12px;color:var(--text2);
  padding:6px 0 6px 14px;
  border-left:3px solid var(--primary-light);
  margin-bottom:6px;
  line-height:1.5;
}

/* Savings box */
.ptc-savings-box{
  background:#F0FDF4;
  border:1px solid #BBF7D0;
  border-radius:10px;
  padding:16px 20px;
  margin-top:20px;
}
.ptc-savings-title{ font-size:13px;font-weight:700;color:var(--green);margin-bottom:12px; }
.ptc-savings-row{ display:flex;justify-content:space-between;font-size:13px;color:var(--text2);padding:4px 0; }
.ptc-savings-diff{ color:var(--green);font-weight:700; }

/* Disclaimer */
.ptc-disclaimer{
  font-size:11px;color:var(--muted);
  margin-top:20px;padding:12px;
  background:var(--off);
  border:1px solid var(--border);
  border-radius:8px;line-height:1.6;
}

/* Responsive */
@media(max-width:600px){
  .ptc-header{ padding:24px 20px 18px; }
  .ptc-form-wrap,.ptc-results{ padding:20px; }
  .ptc-filer-grid{ grid-template-columns:1fr; }
  .ptc-type-grid{ grid-template-columns:1fr 1fr; }
}
