/* AU Mortgage Calculator Styles */
:root{
  --au-bg:#ffffff;
  --au-border:#e8e8ef;
  --au-muted:#6b7280;
  --au-text:#0f172a;
  --au-accent:#0b5fff;
  --au-shadow:0 10px 30px rgba(2,6,23,.08);
  --au-radius:1.25rem;
}

#au-mortgage, .au-mortgage-card{ font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:var(--au-text); }

.au-mortgage-card{
  background:var(--au-bg);
  border:1px solid var(--au-border);
  border-radius:var(--au-radius);
  box-shadow:var(--au-shadow);
  padding:1.6rem;
  max-width:1060px;
  margin:1rem auto;
}

.au-grid{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap:1rem;
  align-items:end;
}

.au-field{ grid-column: span 6 / span 6; display:flex; flex-direction:column; }
.au-field label{ font-size:.95rem; font-weight:600; margin-bottom:.25rem; }
.au-field input,.au-field select{
  border:1px solid var(--au-border);
  border-radius:.9rem; padding:.75rem 1rem; outline:none; font-size:1rem; background:#fff;
}
.au-field input:focus,.au-field select:focus{ border-color:var(--au-accent); box-shadow:0 0 0 4px rgba(11,95,255,.12); }

.au-actions{ grid-column: span 12 / span 12; display:flex; flex-wrap:wrap; gap:.6rem; }
.au-btn{ background:var(--au-accent); color:#fff; border:none; border-radius:.9rem; padding:.8rem 1.1rem; font-weight:600; cursor:pointer; box-shadow:0 6px 18px rgba(11,95,255,.2); }
.au-btn:hover{ transform:translateY(-1px); }
.au-btn.ghost{ background:#f4f6ff; color:#1f2937; box-shadow:none; border:1px solid var(--au-border); }

.au-results{ margin-top:1rem; display:grid; gap:.9rem; }
.result-card{ border:1px solid var(--au-border); background:#fafbff; border-radius:1rem; padding:1rem 1.1rem;}
.result-row{ display:flex; justify-content:space-between; margin:.25rem 0; }
.result-row .label{ color:var(--au-muted); } .result-row .value{ font-weight:600; }

.au-charts{ margin-top:1rem; display:grid; gap:1rem; grid-template-columns:repeat(12,1fr); }
.chart-card{ grid-column:span 6 / span 6; border:1px solid var(--au-border); border-radius:1rem; padding:1rem; background:#fff; }
.chart-card h4{ margin:0 0 .5rem 0; }

.au-table{ margin-top:1rem; }
.table-scroll{ max-height:420px; overflow:auto; border:1px solid var(--au-border); border-radius:1rem; background:#fff; }
.amort-table{ width:100%; border-collapse:separate; border-spacing:0; }
.amort-table th, .amort-table td{ padding:.6rem .8rem; border-bottom:1px solid #eef; text-align:right; }
.amort-table th:first-child, .amort-table td:first-child{ text-align:center; }
.amort-table thead th{ position:sticky; top:0; background:#f8f9ff; text-align:right; }
.amort-table tr:last-child td{ border-bottom:none; }
.muted{ color:var(--au-muted); } .small{ font-size:.85rem; }

@media (max-width: 720px){
  .au-field{ grid-column: span 12 / span 12; }
  .chart-card{ grid-column:span 12 / span 12; }
}