/* Responsive layout for maps page */
.map-layout {
  align-items: stretch;
}

#sidebar-controls {
  min-width: 280px;
  max-width: 360px;
  order: 1;
}

.map-panel {
  min-width: 0;
  order: 2;
}

.map-container {
  height: 650px;
}

@media (max-width: 1100px) {
  .map-layout {
    flex-direction: column;
  }

  #sidebar-controls {
    max-width: 100%;
    order: 2;
  }

  .map-panel {
    order: 1;
  }

  .map-container {
    height: 65vh;
    min-height: 400px;
  }
}

@media (max-width: 640px) {
  .map-layout {
    padding: 8px;
  }

  #sidebar-controls {
    order: 2;
    margin-top: 12px;
  }

  .map-panel {
    order: 1;
  }

  .map-container {
    height: 70vh;
    min-height: 350px;
  }
}