/* Tus viajes. Hereda la piel de landing.css y solo agrega lo suyo. */

.tripsTitle{font-size:28px;font-weight:800;color:#eaf2ff;letter-spacing:-.02em;margin:18px 0 14px}
.tripsCard{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.tripsLede{margin:0;font-size:15px;color:#a8bdd4;line-height:1.5}
.tripsError{margin:16px 0;font-size:14px;color:#ffb45f;line-height:1.5}
.tripsError.hidden,.tripsCard.hidden,.tripGroup.hidden,#content.hidden{display:none}

.tripGroup{margin-bottom:26px}
.tripGroupTitle{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:#7d90a6;margin:0 0 10px}
.tripGroupTitle.live{color:#67f1b4}

.trip{background:#0f1723;border:1px solid #1e2b3d;border-radius:16px;padding:16px 18px;
  margin-bottom:10px;display:flex;flex-direction:column;gap:7px}
/* El viaje en curso se distingue sin gritar: un borde, no un banner. */
.trip.live{border-color:#2c5f4a;background:#0b1c17}

.tripState{margin:0;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:#7d90a6}
.trip.live .tripState{color:#67f1b4}
.tripRoute{margin:0;font-size:15px;color:#eaf2ff;line-height:1.4;display:flex;flex-wrap:wrap;
  gap:6px;align-items:baseline}
.tripArrow{color:#7d90a6;flex:none}
.tripWhen{margin:0;font-size:13px;color:#a8bdd4;line-height:1.4;text-transform:capitalize}
.tripFacts{margin:0;display:flex;gap:10px;align-items:baseline;font-size:13px;color:#8fa4bb}
.tripFacts b{font-size:17px;color:#67f1b4;font-variant-numeric:tabular-nums}

.tripLive{display:inline-block;margin-top:6px;background:#67f1b4;color:#04121c;
  border-radius:11px;padding:11px 16px;font-size:12px;font-weight:800;letter-spacing:.05em;
  text-decoration:none;text-align:center}
.tripRebook{display:inline-block;margin-top:4px;color:#67f1b4;font-size:13px;text-decoration:underline}

.cta.small{padding:9px 16px;font-size:12px}

/* La marca y el CTA de la cabecera median 34 y 36px. "Mis viajes" es la puerta por la que
   vuelve quien cerro el navegador en la pantalla de pago, asi que se toca con prisa y a
   menudo de pie. Se sube el area a 44px sin tocar el relleno visual. */
.brand,.cta.small{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;
}