/* Tarificador de vida reducido: lo propio de vida encima de salud-reducido.css (mismo aspecto que el de salud). */

/* ---------- Capital ---------- */
.tvr-capitales { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tvr-capital { position: relative; margin: 0; cursor: pointer; }
.tvr-capital input { position: absolute; opacity: 0; pointer-events: none; }
.tvr-capital span {
	display: grid;
	place-items: center;
	height: 56px;
	padding: 0 10px;
	border: 1px solid var(--linea-fuerte);
	border-radius: 12px;
	background: #fff;
	color: var(--texto);
	font-size: 17px;
	font-weight: 700;
	white-space: nowrap;
	transition: border-color .15s, background-color .15s, box-shadow .15s;
}
.tvr-capital-otro span { font-size: 15px; font-weight: 600; color: var(--azul); }
.tvr-capital:hover span { border-color: var(--azul); }
.tvr-capital input:checked + span { border-color: var(--azul); background: var(--azul); color: #fff; box-shadow: 0 4px 12px rgba(29, 74, 139, .25); }
.tvr-capital input:focus-visible + span { box-shadow: 0 0 0 4px rgba(29, 74, 139, .2); }

.tvr-otro { max-width: 280px; margin-top: 14px; }
.tvr-con-euro { position: relative; }
.tsr .tvr-con-euro input { padding-right: 36px; font-weight: 600; }
.tvr-con-euro span { position: absolute; top: 50%; right: 14px; transform: translateY(-50%); color: var(--texto-suave); font-weight: 600; pointer-events: none; }

/* ---------- Para que y cuando ---------- */
.tvr-fila-objetivo { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px 20px; margin-top: 18px; align-items: start; }
.tvr-etiqueta { display: block; margin: 0 0 6px; color: var(--texto-suave); font-size: 13px; font-weight: 600; }
.tvr-objetivo .tsr-chips { flex-wrap: nowrap; }
.tvr-objetivo .tsr-chip { flex: 1; }
.tvr-objetivo .tsr-chip span { min-width: 0; height: 48px; display: grid; place-items: center; padding: 0 12px; text-align: center; line-height: 1.2; font-size: 14px; }
.tvr-objetivo.con-error .tsr-chip span { border-color: var(--rojo); }

/* Aviso suave junto a la fecha (mas de 64 años: precio por telefono) */
.tsr .tvr-nota { margin: 6px 0 0; color: var(--texto-suave); font-size: 13px; }

@container (max-width: 600px) {
	.tvr-capitales { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tvr-otro { max-width: none; }
	.tvr-fila-objetivo { grid-template-columns: 1fr; }
	.tvr-objetivo .tsr-chips { flex-wrap: wrap; }
	.tvr-objetivo .tsr-chip { flex: 1 1 100%; }
}