.atlas-location-inline-actions {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px;
}

.atlas-location-inline-actions .btn {
  min-height:36px;
  padding:7px 11px;
  font-size:.86rem;
}

.atlas-location-confirmed {
  font-size:.82rem;
  opacity:.88;
}

.atlas-location-confirmed.ok {
  color:#8ed6a7;
}

.atlas-location-modal {
  position:fixed;
  inset:0;
  z-index:12000;
  display:flex;
  align-items:center;
  justify-content:center;

  /* Fallback clásico + safe areas para iPhone/iPad. */
  padding:
    max(20px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));

  background:rgba(0,0,0,.76);

  /* Evita rebotes/scroll del fondo en navegadores móviles modernos. */
  overscroll-behavior:contain;
}

.atlas-location-modal.hidden { display:none; }
body.atlas-location-open { overflow:hidden; }

.atlas-location-dialog {
  width:min(760px, 100%);

  /* 92vh queda como respaldo para navegadores antiguos. */
  max-height:92vh;
  max-height:92dvh;

  overflow:auto;
  -webkit-overflow-scrolling:touch;

  padding:22px;
  border-radius:18px;
  border:1px solid rgba(212,175,55,.45);
  background:#102a3a;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  color:#eef4f8;

  box-sizing:border-box;
  overscroll-behavior:contain;
}

.atlas-location-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
}

.atlas-location-header h2 {
  margin:4px 0 0;
  color:#fff;
}

.atlas-location-eyebrow {
  margin:0;
  color:#f0c84b;
  font-weight:800;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.atlas-location-close {
  border:0;
  background:transparent;
  color:#fff;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}

.atlas-location-help {
  margin:14px 0;
  line-height:1.5;
  opacity:.9;
}

.atlas-location-search-row {
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
}

.atlas-location-search-row input {
  width:100%;
  min-height:44px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:#081923;
  color:#fff;
  padding:10px 12px;
  box-sizing:border-box;

  /* 16px evita el zoom automático de Safari al enfocar el input. */
  font-size:16px;
}

.atlas-location-toolbar {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:12px 0;
}

.atlas-location-status {
  flex:1;
  min-width:220px;
  font-size:.87rem;
  opacity:.9;
}

.atlas-location-results {
  display:grid;
  gap:7px;
  margin:10px 0 12px;
}

.atlas-location-results.hidden { display:none; }

.atlas-location-result {
  display:block;
  width:100%;
  text-align:left;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(212,175,55,.28);
  background:rgba(212,175,55,.06);
  color:inherit;
  cursor:pointer;
}

.atlas-location-result strong,
.atlas-location-result span {
  display:block;
}

.atlas-location-result span {
  margin-top:3px;
  font-size:.8rem;
  opacity:.74;
}

.atlas-location-map {
  height:360px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
}

.atlas-location-selected {
  display:grid;
  gap:4px;
  margin-top:12px;
  padding:10px 12px;
  border-left:3px solid #d4af37;
  background:rgba(212,175,55,.07);
}

.atlas-location-selected span {
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.8rem;
  opacity:.82;
}

.atlas-location-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:16px;
  flex-wrap:wrap;
}

.atlas-location-stop-actions {
  display:flex;
  gap:6px;
  align-items:center;
}

@media (max-width:700px) {
  .atlas-location-modal {
    /* En móviles conviene empezar desde arriba y no centrar verticalmente. */
    align-items:flex-start;

    padding:
      max(8px, env(safe-area-inset-top))
      max(8px, env(safe-area-inset-right))
      max(8px, env(safe-area-inset-bottom))
      max(8px, env(safe-area-inset-left));
  }

  .atlas-location-dialog {
    width:100%;
    padding:14px;

    /* Fallback + viewport dinámico para Safari/Chrome móviles. */
    max-height:calc(100vh - 16px);
    max-height:calc(100dvh - 16px);

    border-radius:14px;
  }

  .atlas-location-header {
    gap:12px;
  }

  .atlas-location-header h2 {
    font-size:1.35rem;
    line-height:1.2;
  }

  .atlas-location-help {
    margin:10px 0 12px;
    font-size:.92rem;
    line-height:1.42;
  }

  .atlas-location-search-row {
    grid-template-columns:1fr;
  }

  .atlas-location-search-row input {
    min-height:46px;
    font-size:16px;
  }

  .atlas-location-toolbar {
    gap:8px;
    margin:10px 0;
  }

  .atlas-location-status {
    min-width:0;
    width:100%;
    flex-basis:100%;
  }

  .atlas-location-map {
    /*
     * Altura flexible: suficientemente grande para mover el pin,
     * sin consumir casi toda la pantalla en iPhone pequeños.
     */
    height:clamp(220px, 38dvh, 310px);
    min-height:220px;
  }

  .atlas-location-selected {
    margin-top:10px;
  }

  .atlas-location-actions {
    gap:8px;
    margin-top:12px;
  }

  .atlas-location-actions .btn {
    flex:1 1 140px;
    min-height:44px;
  }
}

/* Respaldo para navegadores que aún no entienden dvh. */
@supports not (height: 1dvh) {
  @media (max-width:700px) {
    .atlas-location-map {
      height:clamp(220px, 38vh, 310px);
    }
  }
}

/* Ajuste de las paradas dinámicas cuando incorporan botón de ubicación. */
.stop-row {
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
}

.stop-location-status {
  grid-column:2 / -1;
}

@media (max-width:700px) {
  .stop-row {
    grid-template-columns:auto minmax(0,1fr);
  }

  .atlas-location-stop-actions {
    grid-column:2;
    justify-content:flex-start;
    flex-wrap:wrap;
  }

  .stop-location-status {
    grid-column:2;
  }
}