/* Drupal 7: reutiliza la hoja completa de seguimiento/assets/realtime.css o copia sus reglas aquí. */
.cevesa-realtime .route-picker { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.cevesa-realtime .route-picker button { border:1px solid #d9ded8; background:#fffefa; color:#1f6b54; cursor:pointer; padding:10px 14px; font:11px monospace; }
.cevesa-realtime .route-picker button[aria-selected="true"], .cevesa-realtime .route-picker button:hover { background:#1f6b54; color:#fff; }
.cevesa-realtime .live-route:not(.is-selected) { display:none; }
.cevesa-realtime .vehicle-state, .cevesa-realtime .live-route footer { display:none; }
.cevesa-realtime .live-route header { padding-bottom:12px; }
.cevesa-realtime .realtime-route-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:24px; }
.cevesa-realtime .realtime-route-card { border:1px solid #d9ded8; background:#fffefa; color:#17231f; cursor:pointer; padding:20px; text-align:left; font:600 17px Arial,sans-serif; }
.cevesa-realtime .realtime-route-card.is-selected { border-color:#1f6b54; box-shadow:0 0 0 2px #1f6b54; }
.cevesa-realtime .realtime-map-shell { position:relative; }
.cevesa-realtime .realtime-map { width:100%; height:560px; background:#dfe5dc; }
.cevesa-realtime .realtime-loading { position:absolute; z-index:1000; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(255,254,250,.82); color:#1f6b54; font:13px monospace; }
.cevesa-realtime .realtime-loading[hidden] { display:none; }
.cevesa-realtime .realtime-map .leaflet-routing-container { display:none; }
.cevesa-realtime .vehicle-dot { display:block; width:16px; height:16px; border:3px solid #fffefa; border-radius:50%; background:#e25c3d; box-shadow:0 2px 8px #17231f66; }
@media (max-width:700px) { .cevesa-realtime .realtime-route-grid { grid-template-columns:1fr; } .cevesa-realtime .realtime-map { height:430px; } }
.cevesa-realtime { max-width:1360px; margin:0 auto; padding:30px 20px; color:#17231f; font-family:Arial,sans-serif; } .cevesa-realtime .live-header { display:flex; justify-content:space-between; align-items:end; gap:25px; padding-bottom:25px; border-bottom:1px solid #d9ded8; } .cevesa-realtime .eyebrow { color:#1f6b54; font:11px monospace; letter-spacing:.1em; text-transform:uppercase; } .cevesa-realtime h1 { font-size:42px; letter-spacing:-.05em; margin:0 0 12px; } .cevesa-realtime .intro,.cevesa-realtime .network-state,.cevesa-realtime .live-note { color:#69756f; font-size:13px; } .cevesa-realtime .route-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; padding-top:25px; } .cevesa-realtime .live-route { border:1px solid #d9ded8; background:#fffefa; overflow:hidden; } .cevesa-realtime .live-route header,.cevesa-realtime .live-route footer { display:flex; justify-content:space-between; align-items:center; padding:15px; gap:10px; } .cevesa-realtime .live-route h2 { display:inline; font-size:16px; margin-left:8px; } .cevesa-realtime .line-badge { background:#1f6b54; color:#b9d85a; padding:5px; font:11px monospace; } .cevesa-realtime .vehicle-state,.cevesa-realtime .route-detail,.cevesa-realtime .route-status { font:11px monospace; } .cevesa-realtime .vehicle-state { color:#69756f; } .cevesa-realtime .vehicle-state strong { color:#1f6b54; } .cevesa-realtime .live-map { height:350px; background:#dfe5dc; } .cevesa-realtime .live-route footer { border-top:1px solid #d9ded8; color:#69756f; } .cevesa-realtime .live-note { border-top:1px solid #d9ded8; padding-top:18px; margin-top:25px; } .cevesa-realtime #network-dot { display:inline-block; width:9px; height:9px; border-radius:50%; background:#e4a938; margin-right:7px; } .cevesa-realtime #network-dot.online { background:#4eaa72; } .cevesa-realtime #network-dot.offline { background:#e25c3d; } .vehicle-marker-wrap,.stop-marker-wrap { background:transparent; border:0; } .vehicle-marker { width:34px; height:34px; border-radius:50%; border:3px solid #fff; background:#e25c3d; color:#fff; display:flex; align-items:center; justify-content:center; font:10px monospace; } .vehicle-dot { display:block; width:14px; height:14px; border:3px solid #fff; border-radius:50%; background:#e25c3d; } .stop-marker { display:block; width:24px; height:24px; border:2px solid #fff; border-radius:50%; background:#1f6b54; color:#fff; text-align:center; padding-top:4px; font:9px monospace; } @media(max-width:750px) { .cevesa-realtime .live-header,.cevesa-realtime .route-grid { display:block; } .cevesa-realtime .network-state { margin-top:20px; } .cevesa-realtime .live-route { margin-top:15px; } }