/* RailOps Leaflet operational UX — markers, layers, intelligent follow */
.railopsLocoMarkerModern{background:transparent!important;border:0!important}
.railopsLocoPin{--marker-state:#71d49c;position:relative;width:112px;height:58px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.24))}
.railopsLocoPin.is-stale{--marker-state:#f3bd62}.railopsLocoPin.is-offline{--marker-state:#ff7d86}
.railopsLocoPulse{position:absolute;left:8px;top:13px;width:32px;height:32px;border-radius:50%;background:var(--marker-state);opacity:.18;transform:scale(.85)}
.railopsLocoPin.is-moving .railopsLocoPulse{animation:railopsLocoPulse 1.75s ease-out infinite}
.railopsLocoDirection{position:absolute;left:18px;top:0;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:20px solid var(--marker-state);transform:rotate(var(--railops-course));transform-origin:50% 29px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35));z-index:1}
.railopsLocoPin.is-stopped .railopsLocoDirection{display:none}
.railopsLocoCore{position:absolute;left:8px;top:13px;width:32px;height:32px;display:grid;place-items:center;border:4px solid #fff;border-radius:50%;background:var(--marker-state);box-shadow:0 5px 15px rgba(0,0,0,.32);z-index:3}
.railopsLocoCore i{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.2)}
.railopsLocoBadge{position:absolute;left:37px;top:7px;min-width:73px;height:44px;display:grid;align-content:center;padding:5px 10px;border:1px solid rgba(151,177,201,.26);border-left:3px solid var(--marker-state);border-radius:5px 12px 12px 5px;background:rgba(5,16,28,.92);color:#f4f8fb;box-shadow:0 8px 20px rgba(0,0,0,.24);backdrop-filter:blur(10px);z-index:2;white-space:nowrap}
.railopsLocoBadge b{font:800 12px/1.1 Inter,Arial,sans-serif;letter-spacing:-.02em}.railopsLocoBadge small{margin-top:3px;color:#a9bdcd;font:700 9px/1 Inter,Arial,sans-serif}
@keyframes railopsLocoPulse{0%{transform:scale(.72);opacity:.32}75%,100%{transform:scale(1.65);opacity:0}}

.railopsOperationalLayers{position:absolute;top:60px;right:12px;z-index:1001;width:164px;display:grid;gap:5px;padding:9px;border:1px solid rgba(151,177,201,.24);border-radius:15px 15px 5px 15px;background:rgba(5,16,28,.9);box-shadow:0 16px 38px rgba(0,0,0,.25);backdrop-filter:blur(14px)}
.railopsOperationalLayersTitle{padding:1px 4px 5px;color:#91a8bb;font:800 9px/1 Inter,Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em}
.railopsOperationalLayers button{width:100%;min-height:32px;display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:7px;padding:5px 7px;border:1px solid transparent;border-radius:9px;background:transparent;color:#aabccc;font:750 10px/1 Inter,Arial,sans-serif;text-align:left;cursor:pointer;transition:.15s ease}
.railopsOperationalLayers button:hover{color:#fff;border-color:rgba(151,177,201,.18);background:rgba(255,255,255,.05)}
.railopsOperationalLayers button.active{color:#eaf7f7;border-color:rgba(87,216,208,.18);background:rgba(87,216,208,.1)}
.railopsOperationalLayers button i{width:7px;height:7px;border-radius:50%;background:#52697d;box-shadow:0 0 0 3px rgba(82,105,125,.12)}
.railopsOperationalLayers button.active i{background:#57d8d0;box-shadow:0 0 0 3px rgba(87,216,208,.14)}
.railopsOperationalLayers button.layer-route.active i{background:#ff646d}.railopsOperationalLayers button.layer-stops.active i{background:#57d8d0}.railopsOperationalLayers button.layer-events.active i{background:#f3bd62}
.railopsOperationalLayers button small{min-width:20px;padding:3px 5px;border-radius:999px;background:rgba(255,255,255,.06);color:#8298aa;font:800 8px/1 Inter,Arial,sans-serif;text-align:center}

.railopsMapRecenterBtn{top:auto!important;right:14px!important;bottom:14px!important;width:auto!important;min-width:42px!important;height:38px!important;min-height:38px!important;display:flex!important;gap:7px!important;padding:0 12px!important;border:1px solid rgba(87,216,208,.35)!important;border-radius:12px 12px 4px 12px!important;background:rgba(5,16,28,.9)!important;color:#dceaf2!important;font-size:0!important;box-shadow:0 12px 28px rgba(0,0,0,.27)!important;backdrop-filter:blur(12px)}
.railopsMapRecenterBtn::before{content:"⌖";font-size:19px;line-height:1;color:#57d8d0}
.railopsMapRecenterBtn::after{content:"Vissza a mozdonyhoz"!important;position:static!important;width:auto!important;height:auto!important;border:0!important;border-radius:0!important;background:transparent!important;color:inherit;font:800 10px/1 Inter,Arial,sans-serif;white-space:nowrap}
.railopsMapRecenterBtn.is-following:not(.is-paused){border-color:rgba(113,212,156,.32)!important}.railopsMapRecenterBtn.is-following:not(.is-paused)::before{color:#71d49c}.railopsMapRecenterBtn.is-following:not(.is-paused)::after{content:"Követés aktív"!important}
.railopsMapRecenterBtn.is-paused{border-color:rgba(243,189,98,.42)!important;background:rgba(45,31,9,.92)!important;color:#f7d89e!important}.railopsMapRecenterBtn.is-paused::before{color:#f3bd62}.railopsMapRecenterBtn.is-paused::after{content:"Vissza a mozdonyhoz"!important}

.dashboardMapReal .leaflet-control-layers{overflow:hidden;border:1px solid rgba(151,177,201,.24)!important;border-radius:12px 12px 4px 12px!important;background:rgba(5,16,28,.9)!important;color:#dceaf2!important;box-shadow:0 12px 30px rgba(0,0,0,.24)!important;backdrop-filter:blur(12px)}
.dashboardMapReal .leaflet-control-layers-toggle{filter:invert(1) saturate(.25) brightness(1.8)}
.dashboardMapReal .leaflet-control-layers-expanded{padding:10px 12px!important}.dashboardMapReal .leaflet-control-layers-separator{border-color:rgba(151,177,201,.2)!important}.dashboardMapReal .leaflet-control-layers label{color:#dceaf2!important;font-size:11px!important}
.railopsCompactPopup .leaflet-popup-content-wrapper{border:1px solid rgba(151,177,201,.24);border-radius:16px 16px 5px 16px;background:#0b1d2e;color:#eaf2f7;box-shadow:0 18px 45px rgba(0,0,0,.32)}
.railopsCompactPopup .leaflet-popup-tip{background:#0b1d2e}.railopsCompactPopup .leaflet-popup-content{margin:16px!important}.railopsCompactPopup .leaflet-popup-content>div>div:nth-child(2){background:rgba(151,177,201,.17)!important}.railopsCompactPopup .leaflet-popup-close-button{color:#9fb3c4!important}

html[data-ro-theme="light"] .railopsLocoBadge{border-color:rgba(57,84,110,.18);background:rgba(255,255,255,.94);color:#102034;box-shadow:0 8px 20px rgba(33,57,79,.17)}
html[data-ro-theme="light"] .railopsLocoBadge small{color:#61758a}
html[data-ro-theme="light"] .railopsOperationalLayers{border-color:rgba(57,84,110,.16);background:rgba(255,255,255,.93);box-shadow:0 14px 34px rgba(33,57,79,.14)}
html[data-ro-theme="light"] .railopsOperationalLayersTitle{color:#61758a}
html[data-ro-theme="light"] .railopsOperationalLayers button{color:#526a7f}
html[data-ro-theme="light"] .railopsOperationalLayers button:hover{color:#102034;border-color:rgba(57,84,110,.14);background:rgba(14,146,151,.04)}
html[data-ro-theme="light"] .railopsOperationalLayers button.active{color:#087f86;border-color:rgba(14,146,151,.18);background:rgba(14,146,151,.08)}
html[data-ro-theme="light"] .railopsOperationalLayers button small{color:#61758a;background:#eef3f7}
html[data-ro-theme="light"] .railopsMapRecenterBtn{border-color:rgba(14,146,151,.3)!important;background:rgba(255,255,255,.94)!important;color:#294157!important;box-shadow:0 10px 24px rgba(33,57,79,.15)!important}
html[data-ro-theme="light"] .railopsMapRecenterBtn.is-paused{border-color:rgba(167,103,8,.3)!important;background:#fffaf0!important;color:#8b570a!important}
html[data-ro-theme="light"] .dashboardMapReal .leaflet-control-layers{border-color:rgba(57,84,110,.16)!important;background:rgba(255,255,255,.94)!important;color:#294157!important;box-shadow:0 10px 24px rgba(33,57,79,.14)!important}
html[data-ro-theme="light"] .dashboardMapReal .leaflet-control-layers-toggle{filter:none}html[data-ro-theme="light"] .dashboardMapReal .leaflet-control-layers label{color:#294157!important}
html[data-ro-theme="light"] .railopsCompactPopup .leaflet-popup-content-wrapper{border-color:rgba(57,84,110,.16);background:#fff;color:#102034;box-shadow:0 16px 40px rgba(33,57,79,.2)}html[data-ro-theme="light"] .railopsCompactPopup .leaflet-popup-tip{background:#fff}

@media(max-width:700px){
  .railopsOperationalLayers{top:auto;right:8px;bottom:8px;left:8px;width:auto;grid-template-columns:auto repeat(4,minmax(62px,1fr));align-items:center;gap:4px;padding:7px;border-radius:12px}
  .railopsOperationalLayersTitle{display:none}.railopsOperationalLayers button{grid-template-columns:7px 1fr;gap:5px;min-width:0;padding:5px}.railopsOperationalLayers button small{display:none}
  .railopsMapRecenterBtn{right:10px!important;bottom:58px!important;height:34px!important;min-height:34px!important;padding:0 10px!important}.railopsMapRecenterBtn::after{font-size:9px!important}
  .railopsLocoBadge{display:none}.railopsLocoMarkerModern{width:48px!important}.railopsLocoPin{width:48px}.railopsLocoPulse,.railopsLocoCore{left:8px}
}
@media(prefers-reduced-motion:reduce){.railopsLocoPin.is-moving .railopsLocoPulse{animation:none}}
