/* Shared Refined FI calculator UI. Calculator-specific visuals remain local. */
.rfi-calculator {
  --rfi-navy: #0a1838;
  --rfi-navy-hover: #122046;
  --rfi-gold: #b8860b;
  --rfi-gold-bright: #d4a017;
  --rfi-green: #17613d;
  --rfi-red: #a51f1a;
  --rfi-page: #eef3f8;
  --rfi-card: #ffffff;
  --rfi-field: #f8fafc;
  --rfi-border: #d8e1eb;
  --rfi-text: #111827;
  --rfi-muted: #526174;
  background: var(--rfi-page) !important;
  color: var(--rfi-text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 1.0625rem;
  line-height: 1.55;
}

.rfi-calculator :is(h1, h2, h3, h4, button, input, select, textarea) {
  font-family: inherit !important;
}

.rfi-calculator :is(.rn-head, .pagehead, .wf-page-head, .st-head) {
  max-width: 760px;
  margin: 0 auto 26px !important;
  padding: 26px 24px 0 !important;
  text-align: center !important;
}

.rfi-calculator :is(.rn-head, .pagehead, .wf-page-head, .st-head) h1 {
  color: var(--rfi-text) !important;
  font-size: clamp(1.65rem, 3vw, 2.15rem) !important;
  font-weight: 750 !important;
  letter-spacing: -.02em;
  line-height: 1.14 !important;
}

.rfi-calculator :is(.rn-head, .pagehead, .wf-page-head, .st-head) p {
  max-width: 700px !important;
  margin: 8px auto 0 !important;
  color: var(--rfi-muted) !important;
  font-size: 1rem !important;
  line-height: 1.55;
}

.rfi-calculator :is(.rn-page, .page, .main, .st-main) {
  width: 100%;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.rfi-calculator :is(.rn-card, .card, .calc-card, .st-card, .wf-account-card, .wf-person-card) {
  border-color: var(--rfi-border) !important;
  border-radius: 16px !important;
  background-color: var(--rfi-card);
  box-shadow: 0 8px 28px rgba(10, 24, 56, .045);
}

.rfi-calculator :is(input[type="text"], input[type="number"], input[type="email"], select, textarea) {
  min-height: 46px;
  border-color: var(--rfi-border) !important;
  border-radius: 9px;
  background-color: var(--rfi-field) !important;
  color: var(--rfi-text) !important;
}

.rfi-calculator :is(input, select, textarea):focus {
  border-color: var(--rfi-gold-bright) !important;
  box-shadow: 0 0 0 3px rgba(212, 160, 23, .14) !important;
  outline: none !important;
}

.rfi-calculator :is(.rn-section-title, .card-section-title, .form-section-title, .st-section-title) {
  color: var(--rfi-gold) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

.rfi-calculator :is(.rn-segment, .mode-toggle, .toggle-row, .st-toggle-row) {
  border-color: var(--rfi-border) !important;
  border-radius: 10px !important;
}

.rfi-calculator :is(.rn-segment button.active, .mode-button.active, .toggle-btn.active, .st-toggle-btn.active) {
  background: #e8eef6 !important;
  color: var(--rfi-navy) !important;
  box-shadow: inset 0 0 0 1px #b8c7d9 !important;
  font-weight: 700 !important;
}

.rfi-calculator :is(.rn-btn, .btn-calculate, .btn-calc, .wf-btn.primary, .wf-nav-btn.primary, .st-btn-calc) {
  min-height: 48px;
  border: 1px solid var(--rfi-navy) !important;
  border-radius: 10px !important;
  background: var(--rfi-navy) !important;
  color: #fff !important;
  font-weight: 750 !important;
  box-shadow: 0 4px 12px rgba(10, 24, 56, .14) !important;
}

.rfi-calculator :is(.rn-btn, .btn-calculate, .btn-calc, .wf-btn.primary, .wf-nav-btn.primary, .st-btn-calc):hover {
  background: var(--rfi-navy-hover) !important;
  transform: translateY(-1px);
}

.rfi-calculator :is(.validation-message, .wf-step-error, .st-validation) {
  border: 1px solid #efb4b4;
  border-radius: 10px;
  background: #fff5f5;
  color: #8f1d1d !important;
  padding: 12px 14px;
  text-align: left;
}

.rfi-calculator :is(.wf-step-intro, .wf-step) {
  scroll-margin-top: 24px;
}

/* A consistent frame around calculator-specific answers. */
.rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) {
  border: 1px solid rgba(212, 160, 23, .62) !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, #0a1838, #122752) !important;
  color: #fff !important;
  box-shadow: 0 16px 38px rgba(10, 24, 56, .16) !important;
}

.rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) :is(h2, h3, strong) {
  color: #fff !important;
}

.rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) :is(.rn-label, .answer-label, .wf-result-label, .rfi-result-label) {
  color: #e9c96d !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase;
}

.rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) :is(p, .rn-sub, .rn-progress-meta, .rn-gap-detail, .answer-sub, .answer-burn-rate, .st-results-subline) {
  color: #dce5f0 !important;
}

.rfi-calculator .hero-answer .answer-big {
  background: none !important;
  color: #f1d278 !important;
  -webkit-text-fill-color: currentColor !important;
}

.rfi-calculator .hero-answer .answer-big.good { color: #8bd5ab !important; }
.rfi-calculator .hero-answer .answer-big.bad { color: #ffaaa5 !important; }

.rfi-calculator :is(.rn-edit-btn, .result-btn, .wf-result-btn, .wf-result-hero .wf-btn, .rfi-result-btn) {
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #fff !important;
  font-weight: 750 !important;
}

.rfi-calculator :is(.rn-edit-btn, .result-btn, .wf-result-btn, .wf-result-hero .wf-btn, .rfi-result-btn):hover {
  background: rgba(255, 255, 255, .1) !important;
}

.rfi-hero-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
}

.rfi-result-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
  margin: 0 !important;
}

.rfi-calculator .rn-answer-card .rn-number { color: #f1d278 !important; }
.rfi-calculator .rn-answer-card .rn-progress-track { background: rgba(255, 255, 255, .18) !important; }
.rfi-calculator .hero .assumptions-strip { border-color: rgba(255, 255, 255, .2) !important; }
.rfi-calculator .hero :is(.assumptions-strip summary, .assumptions-label, .assumptions-detail, .assumptions-compact) { color: #dce5f0 !important; }
.rfi-calculator .wf-tax-insight > .wf-result-label { flex-basis: 100%; color: var(--rfi-gold) !important; }
.rfi-calculator .st-summary-card .st-value { font-family: inherit !important; font-weight: 750 !important; }

.rfi-next-card {
  border: 1px solid #d9c57f !important;
  border-left: 4px solid var(--rfi-gold-bright) !important;
  border-radius: 14px !important;
  background: #fffdf6 !important;
  padding: 22px 24px !important;
  box-shadow: none !important;
}

.rfi-next-card .rfi-result-label,
.rfi-next-card > .wf-result-label,
.rfi-next-card .rn-label {
  color: var(--rfi-gold) !important;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.rfi-next-card h2,
.rfi-next-card h3 {
  margin: 5px 0 7px !important;
  color: var(--rfi-navy) !important;
  font-size: 1.18rem !important;
}

.rfi-meaning-card {
  border: 1px solid var(--rfi-border);
  border-radius: 14px;
  background: #fff;
  padding: 22px 24px;
}

.rfi-meaning-card h2,
.rfi-meaning-card h3 { margin: 0 0 7px; color: var(--rfi-navy); font-size: 1.18rem; }
.rfi-meaning-card p,
.rfi-next-card p { margin: 0; color: var(--rfi-muted); line-height: 1.55; }

@media (max-width: 680px) {
  .rfi-calculator :is(.rn-head, .pagehead, .wf-page-head, .st-head) {
    padding: 20px 18px 0 !important;
    margin-bottom: 20px !important;
  }

  .rfi-calculator :is(.rn-card, .card, .calc-card, .st-card) {
    padding: 22px 18px !important;
  }

  .rfi-hero-top,
  .rfi-calculator :is(.rn-answer-top, .wf-result-hero-top) {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .rfi-result-actions,
  .rfi-calculator :is(.rn-answer-actions, .wf-result-actions) {
    justify-content: flex-start !important;
  }

  .rfi-result-actions > *,
  .rfi-calculator :is(.rn-answer-actions, .wf-result-actions) > * {
    flex: 1;
  }

  .rfi-next-card,
  .rfi-meaning-card { padding: 19px 17px !important; }
}

@media (min-width: 681px) {
  .rfi-calculator .wf-result-actions {
    flex: 0 0 auto;
    flex-wrap: nowrap !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rfi-calculator *, .rfi-calculator *::before, .rfi-calculator *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media print {
  .rfi-calculator { background: #fff !important; color: #111827 !important; }
  .rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) {
    background: #fff !important;
    color: #111827 !important;
    border-color: #b8c7d9 !important;
    box-shadow: none !important;
  }
  .rfi-calculator :is(.rn-answer-card, .hero, .wf-result-hero, .st-results-header) :is(h2, h3, strong, p, .rn-sub, .rn-progress-meta, .rn-gap-detail, .answer-sub, .answer-burn-rate, .st-results-subline) {
    color: #111827 !important;
  }
  .rfi-calculator :is(.rn-answer-actions, .result-toolbar, .wf-result-actions, .rfi-result-actions) { display: none !important; }
  .rfi-next-card { background: #fff !important; box-shadow: none !important; }
}
