/* calculadora-actualizacion-alquiler: herramienta tools/calculadora-renta.php. Solo tokens. */

.fx-calc {
  background: var(--fx-surface);
  border: 1px solid var(--fx-border);
  border-radius: var(--fx-radius-lg);
  box-shadow: var(--fx-shadow-lg);
  padding: var(--fx-space-8) var(--fx-space-6);
  color: var(--fx-text);
}
.fx-calc__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--fx-space-6);
}
.fx-calc__when { border: 0; margin: 0; padding: 0; min-width: 0; }
.fx-calc__when legend { padding: 0; margin-bottom: var(--fx-space-2); }
.fx-calc__pair { display: grid; grid-template-columns: 3fr 2fr; gap: var(--fx-space-3); }
.fx-calc__sr {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

.fx-calc__out {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--fx-space-3);
  margin-top: var(--fx-space-8);
}
.fx-calc__res {
  display: flex; flex-direction: column; gap: var(--fx-space-1);
  padding: var(--fx-space-4);
  border: 1px solid var(--fx-border);
  border-radius: var(--fx-radius-md);
  background: var(--fx-bg-alt);
}
.fx-calc__res--main { background: var(--fx-grad-cta); border-color: transparent; }
.fx-calc__lbl { font-size: var(--fx-text-xs); font-weight: var(--fx-weight-semi); color: var(--fx-text-muted); letter-spacing: var(--fx-tracking-wide); text-transform: uppercase; }
.fx-calc__num { font-family: var(--fx-font-display); font-size: var(--fx-text-xl); font-weight: var(--fx-weight-bold); letter-spacing: var(--fx-tracking-snug); color: var(--fx-text); font-variant-numeric: tabular-nums; }
.fx-calc__res--main .fx-calc__lbl { color: var(--fx-on-dark-muted); }
.fx-calc__res--main .fx-calc__num { color: var(--fx-on-dark-text); }

.fx-calc__notes { grid-column: 1 / -1; margin: 0; padding-left: var(--fx-space-6); font-size: var(--fx-text-sm); line-height: var(--fx-leading-body); color: var(--fx-text-muted); }
.fx-calc__notes:empty { display: none; }
.fx-calc__notes li { margin-bottom: var(--fx-space-1); }

.fx-calc__letter { margin-top: var(--fx-space-8); }
.fx-calc__letter textarea { font-family: var(--fx-font-body); font-size: var(--fx-text-sm); line-height: var(--fx-leading-body); resize: vertical; }
.fx-calc__actions { display: flex; align-items: center; gap: var(--fx-space-3); flex-wrap: wrap; margin: var(--fx-space-2) 0 0; }
.fx-calc > .fx-field__hint { display: block; margin: var(--fx-space-6) 0 0; }

@media (max-width: 780px) {
  .fx-calc { padding: var(--fx-space-6) var(--fx-space-4); }
  .fx-calc__grid { grid-template-columns: minmax(0, 1fr); }
  .fx-calc__out { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fx-calc__res--main { grid-column: 1 / -1; }
}