/* Défilement interne des outils : sur ordinateur la coque reste fixe et
   chaque colonne longue gère son propre scroll. */
@media (min-width: 861px) {
  #stop-pane .tool-layout,
  #line-pane .tool-layout {
    height: calc(100vh - 161px);
    min-height: 560px;
    overflow: hidden;
  }

  #stop-pane .tool-sidebar,
  #line-pane .tool-sidebar {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  #stop-pane .tool-content {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  #line-pane .line-content {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  #line-pane .line-map-wrap,
  #line-pane .line-map {
    height: 100%;
    min-height: 0;
  }

  #line-pane #linePlan {
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  #line-pane #linePlan:has(.empty-state) {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #line-pane #linePlan .empty-state {
    width: 100%;
  }
}

/* Sur tablette et mobile, les blocs reviennent dans le flux naturel afin de
   ne pas enfermer le contenu dans de petites zones de défilement. */
@media (max-width: 860px) {
  #stop-pane .tool-layout,
  #line-pane .tool-layout,
  #stop-pane .tool-sidebar,
  #line-pane .tool-sidebar,
  #stop-pane .tool-content,
  #line-pane .line-content,
  #line-pane #linePlan {
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  #line-pane .line-map-wrap,
  #line-pane .line-map {
    height: 320px;
    min-height: 320px;
  }
}
