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

.tvj [hidden] { display: none !important; }
.tvj-etiqueta { display: block; margin: 0 0 6px; color: var(--texto-suave); font-size: 13px; font-weight: 600; }

/* ---------- Opciones en botones (destino, motivo, uno o varios viajes) ---------- */
.tvj-opciones .tsr-chips { flex-wrap: nowrap; }
.tvj-opciones .tsr-chip { flex: 1; }
.tvj-opciones .tsr-chip span {
	min-width: 0;
	min-height: 48px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 6px 12px;
	line-height: 1.2;
	font-size: 14.5px;
}
.tvj-opciones .tsr-chip small { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 500; opacity: .8; }
.tvj-opciones.con-error .tsr-chip span { border-color: var(--rojo); }

.tvj-fila { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px 20px; margin-top: 18px; align-items: start; }
.tvj-fila-fechas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Fechas con el calendario del navegador: el mismo aspecto que los demas campos (salud-reducido.css) */
.tsr input[type="date"] {
	display: block;
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid var(--linea-fuerte);
	border-radius: 10px;
	background: #fff;
	color: var(--texto);
	font: inherit;
	font-size: 16px;
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s;
}
.tsr input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .6; }
/* Dias del viaje, debajo de la fecha de vuelta */
.tsr .tvj-dias { position: static; transform: none; display: inline-block; margin: 6px 0 0; }
.tsr .tvj-dias:empty { display: none; }

/* ---------- Viajeros: − 1 + ---------- */
.tvj-contador { display: flex; align-items: stretch; height: 48px; border: 1px solid var(--linea-fuerte); border-radius: 12px; background: #fff; overflow: hidden; }
.tvj-contador button { flex: none; width: 48px; border: 0; background: var(--azul-suave); color: var(--azul); font-size: 22px; font-weight: 700; cursor: pointer; }
.tvj-contador button:hover { background: var(--azul); color: #fff; }
.tsr .tvj-contador input { flex: 1; min-width: 0; height: auto; border: 0; border-radius: 0; text-align: center; font-size: 17px; font-weight: 700; -moz-appearance: textfield; }
.tvj-contador input::-webkit-outer-spin-button, .tvj-contador input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.con-error .tvj-contador { border-color: var(--rojo); }

.tsr .tvj-ayuda { margin: 14px 0 0; font-size: 13px; }

@container (max-width: 820px) {
	.tvj-fila { grid-template-columns: 1fr; }
	.tvj-fila-fechas { grid-template-columns: 1fr 1fr; }
	.tvj-fila-fechas .tsr-campo:last-child { grid-column: 1 / -1; }
}
@container (max-width: 600px) {
	.tvj-opciones .tsr-chips { flex-wrap: wrap; }
	.tvj-opciones .tsr-chip { flex: 1 1 30%; }
}
