/*
 * Estilo de la calculadora. Se encola solo en las páginas que usan la
 * plantilla «Herramienta», nunca en el resto del sitio.
 */
.aim-calc{
  --c-blue:#046BD2;--c-navy:#263886;--c-ink:#0F172A;--c-body:#334155;--c-muted:#5E6B7D;
  --c-line:#E4E8EF;--c-soft:#F5F7FA;--c-red:#B02F26;--c-red-bg:#FBE9E7;--c-green:#0B7A52;
  border:1px solid var(--c-line);border-radius:16px;padding:24px;margin:0 0 32px;
  background:#fff;box-shadow:0 1px 2px rgba(16,21,40,.05),0 10px 30px -18px rgba(16,21,40,.28);
  font-family:Inter,-apple-system,sans-serif;color:var(--c-body);
}
.aim-calc__grid{display:grid;gap:18px;min-width:0}
.aim-calc__f{display:block;min-width:0}
.aim-calc__f > span{display:block;font-size:13px;font-weight:650;color:var(--c-ink);margin-bottom:7px}
.aim-calc__f small{display:block;font-size:12.5px;color:var(--c-muted);margin-top:6px;line-height:1.45}
.aim-calc__in{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.aim-calc__in input,.aim-calc__in select{
  font-family:inherit;font-size:17px;color:var(--c-ink);background:#fff;
  border:1px solid var(--c-line);border-radius:10px;padding:12px 14px;min-height:52px;
  -webkit-appearance:none;appearance:none;box-sizing:border-box;
}
/* ⚠️ `width` explícito en los dos. El tema pone `select{width:100%}` a todo el
   sitio, y con eso el desplegable se comía la fila entera y dejaba el campo de
   texto en dos píxeles: literalmente no se podía escribir la cifra. */
.aim-calc__in input{flex:1 1 140px;width:auto;min-width:0;font-variant-numeric:tabular-nums;font-weight:600}
.aim-calc__in select{
  flex:0 1 auto;width:auto;max-width:100%;min-width:0;text-overflow:ellipsis;
  background-color:var(--c-soft);font-size:14px;font-weight:600;color:var(--c-muted);
  padding-right:32px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%235E6B7D' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-size:10px;
}
.aim-calc__in select#c-cur{flex:0 0 96px;width:96px}
/* La unidad de la tasa va en su propia línea: «efectiva anual (E.A.)» no cabe
   al lado del campo en un teléfono sin aplastarlo. */
.aim-calc__in select#c-unit{flex:1 1 100%;width:100%;margin-top:2px}
.aim-calc__in input:focus,.aim-calc__in select:focus{outline:2px solid var(--c-blue);outline-offset:1px;border-color:var(--c-blue)}
.aim-calc__pct{
  display:flex;align-items:center;flex:0 0 auto;
  font-size:17px;font-weight:700;color:var(--c-muted);
}

.aim-calc__out{display:block;margin-top:22px}
.aim-calc__head{
  border-radius:14px;padding:20px 22px;margin-bottom:14px;
  background:linear-gradient(135deg,var(--c-navy) 0%,var(--c-blue) 100%);color:#fff;
}
.aim-calc__head.is-never{background:linear-gradient(135deg,#7F1D1D 0%,#B02F26 100%)}
.aim-calc__head b{
  display:block;font-family:Manrope,Inter,sans-serif;font-size:34px;font-weight:800;
  letter-spacing:-1px;line-height:1.05;font-variant-numeric:tabular-nums;margin-bottom:5px;
}
.aim-calc__head span{display:block;font-size:14.5px;color:#CBDBF3;line-height:1.5}
.aim-calc__head.is-never span{color:#F3D2CE}
.aim-calc__rows{display:grid;gap:1px;background:var(--c-line);border:1px solid var(--c-line);border-radius:12px;overflow:hidden}
.aim-calc__row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;background:#fff;padding:13px 16px}
.aim-calc__row i{font-style:normal;font-size:14px;color:var(--c-muted)}
.aim-calc__row b{font-size:16.5px;font-weight:700;color:var(--c-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.aim-calc__row b.neg{color:var(--c-red)}
.aim-calc__tip{
  margin-top:14px;border:1px solid #CFE1F7;background:#F4F9FF;border-radius:12px;
  padding:14px 16px;font-size:14.5px;line-height:1.55;color:#1E293B;
}
.aim-calc__tip b{color:var(--c-green)}
.aim-calc__note{margin:16px 0 0;font-size:12.5px;color:var(--c-muted);line-height:1.5}

@media (min-width:680px){
  /* ⚠️ minmax(0,1fr) y no 1fr: una pista `1fr` NO baja de su contenido mínimo,
     y un desplegable ancho como «efectiva anual (E.A.)» empujaba la columna
     fuera de la tarjeta. Con minmax(0,…) la pista sí puede encoger. */
  .aim-calc__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .aim-calc__f:first-child{grid-column:1 / -1}
  .aim-calc__in select#c-unit{flex:1 1 auto;width:auto;min-width:0;margin-top:0}
}
@media (max-width:520px){
  .aim-calc{padding:18px 16px;border-radius:14px}
  .aim-calc__head b{font-size:29px}
  .aim-calc__in select{font-size:13px}
}

/* ---------------------------------------------------------------------------
   Aviso mientras faltan datos.
   Ocupa el sitio del resultado para que la tarjeta no dé un salto al aparecer
   la primera cifra, y deja claro que la herramienta está esperando, no rota.
   --------------------------------------------------------------------------- */
.aim-calc__wait{
  margin:0;border:1px dashed var(--c-line);border-radius:12px;
  padding:20px 18px;text-align:center;
  font-size:14.5px;color:var(--c-muted);line-height:1.5;
}
