/**
 * Estilos propios de la Calculadora de Renta. Los tokens de color vienen de
 * blocks/shared/cin-core.css y los componentes base (cards, segmentados,
 * inputs, candados, tooltip) de la hoja compartida de la TIR — este archivo
 * solo agrega lo específico de renta.
 */
.cin-renta .cin-paso {
	font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
	color: var(--cin-muted); margin: 22px 0 8px;
}
/* HU-7: campo calculado, solo lectura, verde como el modelo original. */
.cin-renta .cin-ro {
	background: var(--cin-ro-bg) !important;
	border-color: var(--cin-ro-border) !important;
	font-weight: 600;
}
.cin-renta .cin-res { display: flex; flex-direction: column; }
.cin-renta .cin-rrow {
	display: grid; grid-template-columns: 1fr 110px; gap: 8px; align-items: center;
	padding: 9px 2px; border-bottom: 1px solid var(--cin-border);
}
.cin-renta .cin-rrow.cin-dual { grid-template-columns: 1fr 110px 110px; }
.cin-renta .cin-rlabel { font-size: 13px; color: var(--cin-text2); display: flex; align-items: center; gap: 6px; }
.cin-renta .cin-rval { font-size: 14px; font-weight: 600; text-align: right; }
.cin-renta .cin-rsub { font-size: 11px; color: var(--cin-muted); font-weight: 400; display: block; }
.cin-renta .cin-rhead { font-size: 11px; color: var(--cin-muted); text-align: right; align-self: end; padding-bottom: 2px; }
/* HU-9: TEA destacada, ámbar. */
.cin-renta .cin-tea {
	background: var(--cin-hl-bg); border: 1px solid var(--cin-hl-border);
	border-radius: var(--cin-radius); margin: 10px -8px; padding: 10px 10px;
}
.cin-renta .cin-total {
	background: var(--cin-bg-accent); border: 1px solid var(--cin-accent);
	border-radius: 10px; padding: 14px 16px; margin-top: 14px;
	display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px;
}
.cin-renta .cin-total b { font-size: 20px; }
.cin-renta .cin-neg { color: var(--cin-danger); }
.cin-renta .cin-btn {
	font-family: inherit; font-size: 13px; border: 1px solid var(--cin-border-strong);
	background: var(--cin-s2); color: var(--cin-text); border-radius: var(--cin-radius);
	padding: 8px 14px; cursor: pointer;
}
.cin-renta .cin-btn:hover { border-color: var(--cin-accent); color: var(--cin-link); }
.cin-renta .cin-premium-nota {
	font-size: 12.5px; color: var(--cin-text2); background: var(--cin-s1);
	border-radius: var(--cin-radius); padding: 8px 12px; margin: 0 0 12px;
}
/* Placa (i) de información — misma geometría que el candado compartido. */
.cin-renta .cin-info {
	width: 18px; height: 18px; min-width: 18px; border-radius: 50%; position: relative;
	display: inline-flex; align-items: center; justify-content: center; cursor: help;
	background: var(--cin-bg-accent); color: var(--cin-link);
	font-size: 11px; font-weight: 700; font-style: normal;
}
/* El texto del tooltip vive oculto en el span; lo muestra el tooltip global
   de cin-core al pasar el mouse. La hoja de la TIR solo cubre .cin-lock,
   así que la placa (i) necesita su propia regla (bug corregido 2026-08-05:
   el texto se renderizaba encima de las etiquetas). */
.cin-renta .cin-info .cin-tip { display: none; }
/* Crédito deshabilitado cuando no hay dinero financiado (2026-08-05). */
.cin-renta .cin-credito-off { opacity: .5; }
.cin-renta .cin-credito-off input[disabled],
.cin-renta .cin-credito-off button[disabled] { cursor: not-allowed; }
.cin-renta .cin-sin-credito {
	background: var(--cin-s1); border-left: 3px solid var(--cin-accent);
	border-radius: var(--cin-radius); padding: 8px 12px; margin: 0 0 12px;
}
.cin-renta .cin-casc { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.cin-renta .cin-casc-row { display: grid; grid-template-columns: 150px 1fr 110px; gap: 10px; align-items: center; font-size: 12.5px; }
.cin-renta .cin-casc-bar { height: 14px; border-radius: 4px; min-width: 2px; }
@media (max-width: 560px) {
	.cin-renta .cin-rrow, .cin-renta .cin-rrow.cin-dual { grid-template-columns: 1fr auto auto; }
	.cin-renta .cin-casc-row { grid-template-columns: 110px 1fr 90px; }
}