/* ============================================================
   dispo-mobile.css  ·  v1.317.0  (AW-14 „Plantafel")
   Mobiles Layout der Disposition. Reines Styling – KEINE Logik.

   Behebt zwei Probleme auf schmalen Screens (Handy):
     1) Die Plantafel/Zeitleiste war mobil komplett ausgeblendet. Sie wird
        jetzt (per Umschalter in app.js) in einem horizontal scrollbaren
        Container gezeigt – .pt-mobile-scroll / .pt-mobile-inner.
     2) Das Spalten-Board (Aufträge-Board & Ticketübersicht) quetschte alle
        Spalten in die Bildschirmbreite → Karten überlagerten sich. Auf dem
        Handy werden die Spalten daher horizontal scrollbar mit fester
        Mindestbreite dargestellt – .cab-board-grid.

   Breakpoint 1023px = knapp unter Tailwinds `lg` (1024px). Bis dahin greift
   die mobile Darstellung, ab `lg` bleibt das bisherige Desktop-Layout.
   ============================================================ */

/* ---- Plantafel: horizontal scrollbarer Innenraum (nur mobil sichtbar) ---- */
.pt-mobile-scroll{
  -webkit-overflow-scrolling: touch;   /* weiches Kinetik-Scrollen auf iOS */
  overscroll-behavior-x: contain;      /* kein versehentliches Zurück-Wischen */
}
.pt-mobile-inner{
  /* Feste Mindestbreite, damit Spurbeschriftung (160px) + Zeitleiste nicht
     gequetscht werden und die absolut positionierten Balken nicht überlappen. */
  min-width: 720px;
}

/* ============================================================
   Board-/Ticket-Spalten auf dem Handy horizontal scrollbar
   ============================================================ */
@media (max-width: 1023px){
  .cab-board-grid{
    /* Inline-Style setzt grid-template-columns:repeat(n,…) – hier bewusst
       mit !important überschreiben und auf Spalten-Fluss umstellen. */
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: minmax(240px, 82vw);
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    padding-bottom: 10px;               /* Platz für die Scrollleiste */
  }
  .cab-board-grid > .kcol{
    scroll-snap-align: start;
  }
}

/* Auf sehr schmalen Geräten die Plantafel-Balken nicht zu winzig werden lassen. */
@media (max-width: 640px){
  .pt-mobile-inner{ min-width: 640px; }
}