/* Shared additions for the archived DormDash pages running in demo mode. */
.dd-archive-bar{background:#1a0f0c;border-bottom:1px solid rgba(253,45,0,.35);color:#f5c9bd;font:500 13px/1.4 Inter,system-ui,sans-serif;text-align:center;padding:9px 16px;position:relative;z-index:10000}
.dd-archive-bar a{color:#fff;font-weight:700;text-decoration:underline}

/* Map tiles, recoloured to the original black-and-grey dark map. */
.dd-raster{filter:grayscale(1) invert(1) brightness(.74) contrast(1.32)}
.leaflet-container{background:#0b0b0c}
#map{filter:none!important}

/* Zoom buttons: dark, bottom-left of the uncovered map; phones pinch instead. */
.leaflet-control-zoom{display:block!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:12px!important;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.5)!important;margin:0 0 24px 20px!important}
.leaflet-control-zoom a{background:rgba(17,17,17,.92)!important;color:#f4f4f5!important;border-bottom:1px solid rgba(255,255,255,.1)!important;width:38px!important;height:38px!important;line-height:36px!important;font:600 20px/36px Inter,system-ui,sans-serif!important}
.leaflet-control-zoom a:hover{background:#1f1f22!important;color:#fff!important}
.leaflet-control-zoom a.leaflet-disabled{color:#555!important}
@media (max-width:899px){.leaflet-control-zoom{display:none!important}}

/* Wide screens: the sheet becomes a full-height panel on the right and the map
   stays visible behind every step. */
@media (min-width:900px){
  .bottom-sheet,.bottom-sheet.fullscreen{
    top:var(--dd-bar-h,0px)!important;bottom:0!important;right:0!important;left:auto!important;
    width:440px!important;max-width:440px!important;height:auto!important;
    max-height:none!important;border-radius:0!important;transform:none!important;margin:0!important;
    box-shadow:-12px 0 40px rgba(0,0,0,.55)!important;border-left:1px solid rgba(255,255,255,.06)
  }
  .bottom-sheet .sheet-handle{display:none!important}
  .top-bar,.header{right:440px!important}
  .leaflet-top.leaflet-right{right:440px!important}
}

/* Phones: form steps leave a strip of map showing the route. */
@media (max-width:899px){
  .bottom-sheet.fullscreen{
    top:calc(var(--dd-bar-h,0px) + 168px)!important;
    height:calc(100vh - var(--dd-bar-h,0px) - 168px)!important;
    max-height:calc(100vh - var(--dd-bar-h,0px) - 168px)!important;
    border-radius:22px 22px 0 0!important;padding-top:0!important
  }
}
#map-bg.hidden{opacity:1!important;pointer-events:auto!important}


/* Map data attribution: small and dark. */
.leaflet-control-attribution.leaflet-control{display:block!important;background:rgba(10,10,12,.62)!important;color:#8b8b94!important;font:500 10px/1.5 Inter,system-ui,sans-serif!important;padding:1px 7px!important;border-radius:0 0 0 6px;margin:0!important}
.leaflet-control-attribution a{color:#c4c4cc!important;text-decoration:none}
.leaflet-control-attribution svg{display:none!important}
.leaflet-control-attribution a[href*="leafletjs"],.leaflet-control-attribution a[href*="leafletjs"] + span{display:none}

/* Live map card on the tracking pages */
.dd-live{position:relative;margin:0 0 18px;border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0b0b0c;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.dd-live-map{height:300px;width:100%}
@media (max-width:600px){.dd-live-map{height:240px}}
.dd-live-chip{position:absolute;left:12px;top:12px;z-index:500;display:flex;align-items:center;gap:8px;padding:8px 12px 8px 10px;border-radius:99px;background:rgba(12,12,14,.88);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);font:600 13px Inter,system-ui,sans-serif;color:#f5f5f7;box-shadow:0 6px 20px rgba(0,0,0,.45)}
.dd-live-chip b{font-weight:650}
.dd-live-chip #ddLiveEta{color:#a1a1aa;font-weight:600}
.dd-live-chip #ddLiveEta:not(:empty)::before{content:'\00b7';margin-right:6px;color:#6b6b73}
.dd-live-dot{width:8px;height:8px;border-radius:50%;background:#FD2D00;box-shadow:0 0 0 0 rgba(253,45,0,.6);animation:ddPulse 1.6s ease-out infinite}
.dd-live.is-ride .dd-live-dot{background:#7c6cf6;box-shadow:0 0 0 0 rgba(124,108,246,.6)}
.dd-live.is-done .dd-live-dot{background:#10b981;animation:none}
@keyframes ddPulse{0%{box-shadow:0 0 0 0 rgba(253,45,0,.55)}100%{box-shadow:0 0 0 10px rgba(253,45,0,0)}}
.dd-live-pin{border-radius:50%;border:3px solid #fff}
.dd-live-car{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:18px;color:#0b0b0c;background:#fff;box-shadow:0 0 0 5px rgba(253,45,0,.45),0 6px 16px rgba(0,0,0,.6)}
.dd-live.is-ride .dd-live-car{box-shadow:0 0 0 5px rgba(124,108,246,.5),0 6px 16px rgba(0,0,0,.6)}
.dd-live .leaflet-control-zoom{display:block!important;margin:12px 12px 0 0!important}
.dd-live .leaflet-top.leaflet-right{top:0!important;right:0!important}
@media (prefers-reduced-motion:reduce){.dd-live-dot{animation:none}}