body.traccar-replay-direct-street-view .muiltr-ybrq04-root .draggable-header,
body.traccar-replay-direct-street-view .muiltr-ybrq04-root .traccar-status-table,
body.traccar-replay-direct-street-view .muiltr-ybrq04-root .traccar-status-card-actions,
body.traccar-replay-direct-street-view .muiltr-ybrq04-root .MuiCardContent-root {
  display: none !important;
}

body.traccar-replay-direct-street-view .muiltr-ybrq04-root {
  z-index: 99 !important;
  width: min(100%, 600px) !important;
  bottom: 64px !important;
  animation: traccar-replay-street-view-in 300ms ease-out both;
}

body.traccar-replay-direct-street-view .muiltr-ybrq04-root > div,
body.traccar-replay-direct-street-view
  .muiltr-ybrq04-root
  .traccar-status-card {
  width: 100% !important;
  max-width: 100% !important;
}

body.traccar-replay-direct-street-view
  .muiltr-ybrq04-root
  .traccar-street-view {
  height: 320px !important;
}

.muiltr-5zmqwg-bottomControls,
.traccar-replay-bottom-controls {
  z-index: 9 !important;
}

body:has(.traccar-replay-bottom-controls) .muiltr-2lfbj4-menu {
  display: none !important;
}

.traccar-replay-street-view-close {
  display: none;
}

body.traccar-replay-direct-street-view.traccar-replay-street-view-closing
  .muiltr-ybrq04-root {
  pointer-events: none;
  animation: traccar-replay-street-view-out 280ms ease-in both;
}

@keyframes traccar-replay-street-view-in {
  from {
    transform: translate(-50%, calc(100% + 64px));
  }
}

@keyframes traccar-replay-street-view-out {
  to {
    transform: translate(-50%, calc(100% + 64px));
  }
}

@media (max-width: 899.95px) {
  body.traccar-replay-direct-street-view
    .muiltr-ybrq04-root.traccar-status-card-root {
    left: 50% !important;
    bottom: 0 !important;
  }

  body.traccar-replay-direct-street-view
    .muiltr-ybrq04-root
    .traccar-street-view {
    height: 300px !important;
  }

  .traccar-replay-street-view-close {
    position: absolute;
    z-index: 30;
    top: 6px;
    right: 6px;
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    color: #fff;
    font: 25px/1 Arial, sans-serif;
    cursor: pointer;
    background: rgba(20, 28, 32, 0.78);
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 50%;
  }

  .traccar-replay-street-view-close:active {
    background: rgba(183, 28, 28, 0.92);
  }

  @keyframes traccar-replay-street-view-in {
    from {
      transform: translate(-50%, 100%);
    }
  }

  @keyframes traccar-replay-street-view-out {
    to {
      transform: translate(-50%, 100%);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  body.traccar-replay-direct-street-view .muiltr-ybrq04-root,
  body.traccar-replay-direct-street-view.traccar-replay-street-view-closing
    .muiltr-ybrq04-root {
    animation-duration: 1ms;
  }
}