/* =========================================================================
   VA CALCULATORS — SCOPED STYLES
   Scoped to .va-calc-wrap / .va-calc-intro; no global overrides.
   ========================================================================= */

.va-calc-intro {
  max-width: 1100px; margin: 0 auto 32px; padding: 0 4px;
}
.va-calc-intro-title {
  font-family: 'Montserrat', sans-serif; font-size: 1.75rem; font-weight: 700;
  color: var(--color-cream, #F5F1E9); margin: 0 0 12px; line-height: 1.25;
}
.va-calc-intro-desc {
  font-family: 'Montserrat', sans-serif; font-size: 0.95rem;
  color: var(--color-body, #D9D6CF); margin: 0; line-height: 1.65; max-width: 820px;
}

/* WRAP — variable token mapping */
.va-calc-wrap {
  --bg:          var(--color-bg, #121212);
  --surface:     var(--color-surface, #1a1a1a);
  --surface-alt: var(--color-surface-dark, #0a0a0a);
  --ink:         var(--color-cream, #F5F1E9);
  --ink-soft:    var(--color-body, #D9D6CF);
  --ink-mute:    var(--color-muted, #b0a898);
  --rule:        var(--color-border, #2a2a2a);
  --accent:      var(--color-gold, #967b45);
  --gold:        var(--color-gold, #967b45);
  --pass:        #1D6B3A;
  --warn:        #7a5c00;
  --fail:        #9B2335;
  --radius:      10px;
  --shadow-sm:   0 1px 3px rgba(0,0,0,0.3);
  --font-body:   'Montserrat', sans-serif;
  max-width: 1100px; margin: 0 auto;
}

/* SECTION */
.va-calc-section {
  background: var(--surface); border: 1px solid var(--rule);
  border-radius: var(--radius); padding: 28px 32px 32px; margin-bottom: 16px;
}
.va-calc-section-title {
  font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-mute); margin-bottom: 18px; padding-bottom: 10px;
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 600px) { .va-calc-section { padding: 18px 16px 22px; } }

/* INPUT ROWS — 2-column grid (label + control) */
.va-input-row {
  display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: center;
  padding: 8px 0; border-bottom: 1px solid rgba(42,42,42,0.5);
}
.va-input-row:last-child { border-bottom: none; }
@media (max-width: 600px) { .va-input-row { grid-template-columns: 1fr; gap: 6px; } }

/* FIELD ROWS — full width, for toggle groups */
.va-field {
  padding: 12px 0; border-bottom: 1px solid rgba(42,42,42,0.5);
}
.va-field:last-child { border-bottom: none; }
.va-field-label {
  font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 10px;
}
.va-field-label small { display: block; font-size: 11px; font-weight: 400; color: var(--ink-mute); margin-top: 2px; font-style: italic; }

/* LABEL */
.va-label { font-size: 13px; font-weight: 600; color: var(--ink); }
.va-label small { display: block; font-size: 11px; font-weight: 400; color: var(--ink-mute); margin-top: 2px; font-style: italic; }

/* INPUTS */
.va-input {
  width: 100%; font-family: var(--font-body); font-size: 14px; font-weight: 600;
  color: var(--ink); background: var(--surface-alt);
  border: 1px solid var(--rule); border-radius: var(--radius);
  padding: 10px 12px; transition: border-color 140ms ease, background 140ms ease;
  -moz-appearance: textfield;
}
.va-input::-webkit-outer-spin-button,
.va-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.va-input:focus { outline: none; border-color: var(--accent); background: var(--surface); }

/* SELECT */
.va-select {
  width: 100%; font-family: var(--font-body); font-size: 14px; font-weight: 600;
  color: var(--ink); background: var(--surface-alt);
  border: 1px solid var(--rule); border-radius: var(--radius);
  padding: 10px 32px 10px 12px; cursor: pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23b0a898' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
  transition: border-color 140ms ease;
}
.va-select:focus { outline: none; border-color: var(--accent); }
.va-select option { background: #1a1a1a; color: #F5F1E9; }

/* TOGGLE GROUP */
.va-toggle-group { display: flex; gap: 8px; flex-wrap: wrap; }
.va-toggle-opt {
  display: flex; align-items: center; gap: 8px; padding: 9px 18px;
  background: var(--surface-alt); border: 1px solid var(--rule); border-radius: var(--radius);
  cursor: pointer; font-family: var(--font-body); font-size: 13px; font-weight: 600;
  color: var(--ink-soft); transition: border-color 140ms ease, background 140ms ease, color 140ms ease;
  user-select: none;
}
.va-toggle-opt input[type="radio"] { display: none; }
.va-toggle-opt.is-selected { background: var(--accent); border-color: var(--accent); color: #fff; }

/* CHECKBOX ROW */
.va-check-row {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 0 14px; border-bottom: 1px solid rgba(42,42,42,0.5); margin-bottom: 4px;
}
.va-check-row input[type="checkbox"] {
  width: 16px; height: 16px; accent-color: var(--accent);
  cursor: pointer; flex-shrink: 0; margin-top: 2px;
}
.va-check-label { font-size: 13px; font-weight: 600; color: var(--ink); cursor: pointer; line-height: 1.4; }
.va-check-label small { display: block; font-size: 11px; font-weight: 400; color: var(--ink-mute); margin-top: 4px; font-style: italic; line-height: 1.5; }

/* EXEMPT STATE — dims inputs when exempt */
#vaff-inputs.is-exempt { opacity: 0.35; pointer-events: none; }

/* EXEMPT / FULL NOTICE */
.va-exempt-notice {
  padding: 14px 18px; margin-bottom: 8px;
  background: rgba(29,107,58,0.12); border-left: 3px solid #1D6B3A;
  border-radius: 6px; font-size: 13px; color: var(--ink-soft); line-height: 1.55;
}
.va-exempt-notice strong { color: #6ecf8e; }

/* INFO / FULL ENTITLEMENT NOTICE */
.va-notice {
  padding: 14px 18px; border-radius: 6px; font-size: 13px;
  color: var(--ink-soft); line-height: 1.6; margin-top: 8px;
}
.va-notice.is-info {
  background: rgba(150,123,69,0.10); border-left: 3px solid var(--accent);
}
.va-notice.is-info strong { color: var(--accent); display: block; margin-bottom: 4px; font-size: 14px; }

/* RESULTS */
.va-results {
  background: var(--surface-alt); border: 1px solid var(--rule);
  border-radius: var(--radius); padding: 28px 32px; margin-top: 16px;
}
.va-results-title {
  font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-mute); margin-bottom: 18px; padding-bottom: 10px;
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 600px) { .va-results { padding: 18px 16px; } }

.va-result-row {
  display: grid; grid-template-columns: 1fr auto; gap: 8px 24px; align-items: center;
  padding: 10px 0; border-bottom: 1px solid rgba(42,42,42,0.5);
}
.va-result-row:last-child { border-bottom: none; }
.va-result-label  { font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.va-result-amount { font-size: 15px; font-weight: 700; color: var(--ink); white-space: nowrap; text-align: right; }
.va-result-total .va-result-amount { font-size: 22px; color: var(--gold); }
@media (max-width: 600px) {
  .va-result-row { grid-template-columns: 1fr; gap: 4px; }
  .va-result-amount { text-align: left; }
}

/* RESIDUAL INCOME STATUS BADGES */
.va-ri-status {
  margin-top: 16px; padding: 14px 18px; border-radius: 8px;
  font-size: 13px; line-height: 1.6; color: var(--ink-soft);
}
.va-ri-status strong { display: block; font-size: 14px; margin-bottom: 4px; }
.va-ri-pass { background: rgba(29,107,58,0.12); border-left: 3px solid #1D6B3A; }
.va-ri-pass strong { color: #6ecf8e; }
.va-ri-warn { background: rgba(122,92,0,0.15); border-left: 3px solid #c8970a; }
.va-ri-warn strong { color: #f0bc3c; }
.va-ri-fail { background: rgba(155,35,53,0.12); border-left: 3px solid var(--fail); }
.va-ri-fail strong { color: #f5a5b0; }

/* GROUP LABEL — sub-section header within a calculator */
.va-group-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--accent); padding: 18px 0 6px; border-bottom: 1px solid var(--rule);
  margin-bottom: 2px;
}

/* DISCLAIMER */
.va-calc-disclaimer {
  margin-top: 4px; padding: 16px 20px;
  background: var(--surface); border: 1px solid var(--rule); border-radius: var(--radius);
  font-size: 11px; line-height: 1.65; color: var(--ink-mute);
}