/* ==========================================================================
   MOBILE CUSTOMER-VIEW FIX (minimal)
   --------------------------------------------------------------------------
   Datum:   2026-05-07 (Chat B — Mobile/Customers, Iteration 2)
   Scope:   AUSSCHLIESSLICH `.customer-table-scroll` (Customer-Liste).

   Iteration 1 hat die Tabelle in Cards umgewandelt — auf Wunsch von
   Christoph zurueckgenommen. Tabelle bleibt Tabelle (uebersichtlich,
   scan-bar). Wir loesen NUR die zwei echten Probleme:

   PROBLEM 1: Doppel-Scroll-Container.
   Der Wrapper hat `max-height: calc(100vh - 240px)` + `overflow-y: auto`.
   Auf Mobile fragt sich iOS: scrollt der Wrapper oder der Body? Die
   Touch-Events landen oft im inneren Container, der Body verhungert,
   die Seite "klemmt".
   FIX: `overflow-y: visible` + `max-height: none` → Body scrollt
   natuerlich. Innerer Container scrollt NUR horizontal.

   PROBLEM 2: Achs-Lock auf Mobile.
   Bei `overflow-x: auto + overflow-y: auto` aktiviert ein diagonaler
   Wisch BEIDE Achsen → Bild driftet schraeg. iOS bietet automatischen
   Achs-Lock NUR wenn pro Container exakt EINE Scroll-Achse aktiv ist.
   FIX: Wrapper bekommt `overflow-y: visible` (Body uebernimmt),
   `overflow-x: auto` bleibt — iOS lockt auf X-Achse wenn der User
   horizontal anfaengt, sonst scrollt der Body vertikal.

   Tabelle, Spalten, Sortierung, Sticky-Header — alles BLEIBT wie auf
   Desktop. Kein Card-Layout, keine Spalten-Labels, keine Markup-Logik
   im CSS verstreut.

   Konflikt-Schutz Parallel-Chat (Sipgate / Click-to-Call / Transkript):
   - Eigene CSS-Datei, KEINE Edits in `portal.css`.
   - Selektor ausschliesslich `.customer-table-scroll`.
   - Kein touch-action (das war der Fehler in Iteration 1 — `pan-y`
     haette horizontalen Scroll geblockt). iOS macht Achs-Lock selbst.
   - Click-to-Call/Phone-Autolinks unberuehrt.

   Reversibilitaet: Diese Datei aus index.html entfernen → Fix weg,
   keine Side-Effects.
   ========================================================================== */

@media (max-width: 768px) {
    .customer-table-scroll {
        /* Doppel-Scroll aufloesen — Body scrollt vertikal */
        max-height: none !important;
        overflow-y: visible !important;
        /* Horizontale Scroll-Faehigkeit erhalten — Tabelle ist 1080px breit,
           das ist gewollt fuer Spalten-Lesbarkeit. iOS lockt Achse selbst. */
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        /* Body-Bounce am rechten Rand zaehmen, damit horizontaler Scroll
           nicht ungewollt die ganze Seite verschiebt */
        overscroll-behavior-x: contain;
    }
}