/* styles/sales-live.css  —  real-time sales tracker dashboard (hero visual)
   Load AFTER sales-tracker.css. All classes start with "lt-". */
.lt{
  --lt-bg:#0a111c; --lt-line:rgba(255,255,255,.09); --lt-text:#e8eef8; --lt-mute:#8fa3bf; --lt-up:#3ddc97;
  --lt-r0:#19d3c5; --lt-r1:#ffb547; --lt-r2:#8b7bff;
  position:relative;width:100%;background:var(--lt-bg);color:var(--lt-text);
  border:1px solid var(--lt-line);border-radius:18px;overflow:hidden;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8),0 0 0 1px rgba(25,211,197,.06);
  font-family:Inter,system-ui,sans-serif;
}
.lt .rep-0{--c:var(--lt-r0)}.lt .rep-1{--c:var(--lt-r1)}.lt .rep-2{--c:var(--lt-r2)}
.lt ul{list-style:none;margin:0;padding:0}

/* top bar */
.lt-bar{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--lt-line);font-size:12px;background:rgba(255,255,255,.02)}
.lt-bar b{font:600 12.5px Manrope,Inter,sans-serif;letter-spacing:.01em}
.lt-bar time{margin-left:auto;color:var(--lt-mute);font-size:11.5px}
.lt-live{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:99px;background:rgba(61,220,151,.12);color:var(--lt-up);font:500 10px "DM Mono",monospace;letter-spacing:.1em}
.lt-live i{width:6px;height:6px;border-radius:50%;background:var(--lt-up);box-shadow:0 0 0 0 rgba(61,220,151,.7);animation:lt-blink 1.6s infinite}

/* map */
.lt-map{position:relative;aspect-ratio:500/280}
.lt-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.lt-minor path{fill:none;stroke:#16253d;stroke-width:1.4}
.lt-major path{fill:none;stroke:#1d2f4c;stroke-width:4.5;stroke-linecap:round}
.lt-water{fill:rgba(60,120,220,.12)}
.lt-park{fill:rgba(40,170,115,.09)}
.lt-area{font:500 7.5px "DM Mono",monospace;letter-spacing:.18em;fill:rgba(143,163,191,.45)}
.lt-ghost{fill:none;stroke:var(--c);stroke-opacity:.3;stroke-width:2;stroke-dasharray:2 6;stroke-linecap:round}
.lt-trail{fill:none;stroke:var(--c);stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 4px var(--c));transition:opacity .6s}
.lt-trail.is-fading{opacity:0}
.lt-stop{fill:var(--lt-bg);stroke:var(--c);stroke-width:1.6}
.lt-stop.is-done{fill:var(--c)}
.lt-ping{fill:none;stroke:var(--c);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
.lt-ping.go{animation:lt-ping 1.4s ease-out}

/* salesperson markers */
.lt-rep{position:absolute;left:0;top:0;width:0;height:0;z-index:2;transition:opacity .6s}
.lt-rep.is-fading{opacity:0}
.lt-dot{position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;background:var(--c);border:2px solid #fff;box-shadow:0 0 14px var(--c)}
.lt-halo{position:absolute;left:-15px;top:-15px;width:30px;height:30px;border-radius:50%;background:var(--c);opacity:.25;animation:lt-halo 2s ease-out infinite}
.lt-tag{position:absolute;left:12px;top:-32px;display:flex;gap:6px;align-items:baseline;white-space:nowrap;padding:4px 9px;border-radius:9px;
  background:rgba(8,13,22,.92);border:1px solid var(--c);font-size:11px;backdrop-filter:blur(6px)}
.lt-tag b{font:700 11px Manrope,Inter,sans-serif}
.lt-tag small{font:400 10px "DM Mono",monospace;color:var(--lt-mute)}
.lt-rep.flip .lt-tag{left:auto;right:12px}

/* glass overlays */
.lt-kpi,.lt-reps{position:absolute;z-index:3;background:rgba(8,13,22,.74);border:1px solid var(--lt-line);backdrop-filter:blur(10px);border-radius:12px}
.lt-kpi{left:12px;top:12px;padding:10px 14px;display:grid;gap:3px}
.lt-kpi span{font-size:9.5px;letter-spacing:.14em;color:var(--lt-mute)}
.lt-kpi strong{font:800 24px/1.1 Manrope,Inter,sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lt-kpi small{font-size:10.5px;color:var(--lt-mute)}
.lt-kpi em{font-style:normal;color:var(--lt-up);font-weight:600}
.lt-reps{right:12px;bottom:12px;padding:6px;display:grid;gap:2px;min-width:196px}
.lt-reps li{display:grid;grid-template-columns:8px auto 1fr auto;gap:8px;align-items:center;padding:5px 8px;border-radius:8px;font-size:11px}
.lt-reps i{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
.lt-reps b{font:600 11.5px Manrope,Inter,sans-serif}
.lt-reps span{color:var(--lt-mute);font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lt-reps em{font:500 10.5px "DM Mono",monospace;font-style:normal;color:var(--lt-text)}

/* live activity feed */
.lt-feed{border-top:1px solid var(--lt-line);padding:10px 14px 12px}
.lt-feed p{margin:0 0 6px;font-size:9.5px;letter-spacing:.14em;color:var(--lt-mute)}
.lt-feed ul{display:grid;gap:2px;min-height:96px;align-content:start}
.lt-feed li{display:grid;grid-template-columns:42px 8px 1fr auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.06);font-size:11.5px}
.lt-feed li:last-child{border-bottom:0}
.lt-feed time{color:var(--lt-mute);font-size:10.5px}
.lt-feed i{width:7px;height:7px;border-radius:50%;background:var(--c)}
.lt-feed span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c9d6ea}
.lt-feed span b{color:#fff;font-weight:600}
.lt-feed strong{font:600 11.5px "DM Mono",monospace;color:var(--lt-up)}
.lt-feed li.is-new{animation:lt-in .5s ease-out}

@keyframes lt-blink{70%{box-shadow:0 0 0 7px rgba(61,220,151,0)}100%{box-shadow:0 0 0 0 rgba(61,220,151,0)}}
@keyframes lt-halo{from{transform:scale(.5);opacity:.4}to{transform:scale(1.6);opacity:0}}
@keyframes lt-ping{from{transform:scale(1);opacity:.9}to{transform:scale(4.5);opacity:0}}
@keyframes lt-in{from{opacity:0;transform:translateY(-8px);background:rgba(61,220,151,.12)}to{opacity:1;transform:none;background:transparent}}

@media (max-width:560px){
  .lt-reps{display:none}
  .lt-kpi strong{font-size:20px}
  .lt-kpi small span:nth-of-type(n+2){display:none}
}
@media (prefers-reduced-motion:reduce){.lt *{animation:none!important;transition:none!important}}