.transport-recommendation-card,
.transport-line-card { border: 1px solid #e0e8f2; border-radius: 16px; background: #fff; overflow: hidden; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.transport-recommendation-card + .transport-recommendation-card { margin-top: 9px; }
.transport-recommendation-card:hover,
.transport-line-card:hover { border-color: #c8d9ec; box-shadow: 0 12px 28px rgba(11,37,75,.08); transform: translateY(-1px); }
.transport-recommendation-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 13px 8px; }
.transport-recommendation-label { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 999px; background: #edf6ff; color: #0c78ff; font-size: .65rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.transport-recommendation-card[data-category="deja_mas_cerca"] .transport-recommendation-label { background: #fff1f3; color: #d73f57; }
.transport-recommendation-card[data-category="otra_opcion"] .transport-recommendation-label { background: #f1f4f7; color: #6a7b8f; }
.transport-route-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.transport-route-color { width: 11px; height: 11px; flex: 0 0 auto; border-radius: 50%; background: var(--route-color, #0c78ff); }
.transport-route-name strong { overflow: hidden; color: #071b38; font-size: .94rem; text-overflow: ellipsis; white-space: nowrap; }
.transport-recommendation-metrics { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 7px; padding: 4px 13px 11px; }
.transport-recommendation-metrics div { min-width: 0; }
.transport-recommendation-metrics small { display: block; color: #8795a6; font-size: .63rem; font-weight: 800; }
.transport-recommendation-metrics strong { color: #243a56; font-size: .83rem; }
.transport-recommendation-metrics span { color: #b1bcc9; }
.transport-recommendation-actions { display: flex; border-top: 1px solid #eef2f7; }
.transport-recommendation-actions button { width: 100%; min-height: 40px; border: 0; background: #fbfdff; color: #0c78ff; font: inherit; font-size: .76rem; font-weight: 900; cursor: pointer; }
.transport-recommendation-actions button:hover { background: #eef6ff; }
.transport-line-card { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 11px 12px; }
.transport-line-card .transport-route-color { width: 13px; height: 13px; }
.transport-line-card div { min-width: 0; }
.transport-line-card strong { display: block; overflow: hidden; color: #071b38; font-size: .88rem; text-overflow: ellipsis; white-space: nowrap; }
.transport-line-card small { display: block; margin-top: 2px; overflow: hidden; color: #7b8a9d; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.transport-line-card button { border: 0; border-radius: 10px; background: #edf6ff; color: #0c78ff; padding: 8px 10px; font: inherit; font-size: .7rem; font-weight: 900; cursor: pointer; }
.transport-empty-result { padding: 20px 12px; color: #718198; text-align: center; font-size: .8rem; line-height: 1.5; }