/**
 * Board view — non-desktop (≤1400px).
 * Phone layout: stacked columns,
no horizontal scroll.
 * Requires html.is-compact-layout (app.js).
 */

@media (max-width: 1400px) {
  html.is-compact-layout .roadmaps-view--board {
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-rows: auto !important;
    align-items: stretch !important;
    gap: 0.4rem !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
    margin-top: 0.35rem !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board-column {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 180px !important;
    margin: 0 !important;
    scroll-snap-align: none !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board-column-header {
    position: static !important;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board-column-cards {
    flex: 1 1 auto !important;
    min-height: 72px !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board-card {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  html.is-compact-layout .roadmaps-view--board .scrum-board-card-title {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.is-compact-layout .roadmaps-view--board .scrum-board {
    scroll-behavior: auto;
  }
}