/* Operian OS — Tablet-Fix: Konten-Auswahl auf dem Lock-Screen horizontal wischbar.
 *
 * Bug: .desktop-bg.justify-center .flex.gap-8 (Konten-Reihe) bekommt wischbares
 * horizontales Scrollen nur von mobile-shell.css (dort strikt auf <768px begrenzt,
 * siehe Dateikopf dort). Auf Tablets/iPad (≥768px, Touch) bleibt die Reihe fix und
 * nicht erreichbare Konten sind blockiert. Fix hier ist bewusst über pointer:coarse
 * an Touch-Geräte gebunden, damit Desktop/Maus (fine pointer) unangetastet bleibt.
 */
@media (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  /* Ohne Breitenbegrenzung wächst nicht nur die Konten-Reihe, sondern auch ihr
     Eltern-Wrapper (.desktop-bg.justify-center > div) shrink-to-fit auf die
     Inhaltsbreite — width:100% auf der Reihe allein greift dann ins Leere, weil
     ihr containing block selbst schon so breit ist. Beide müssen auf die
     verfügbare Breite gezwungen werden, erst dann greift overflow-x wirklich. */
  .desktop-bg.justify-center > div {
    width: 100%;
  }
  .desktop-bg.justify-center .flex.gap-8 {
    flex-wrap: nowrap;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .desktop-bg.justify-center .flex.gap-8::-webkit-scrollbar {
    display: none;
  }
  .desktop-bg.justify-center .flex.gap-8 > button {
    flex: 0 0 auto;
  }
}

/* ── Tablet-Fix 2: Topleiste bleibt lesbar und bedienbar ─────────────────────
 *
 * Befund (gemessen, iPad-Portrait 810px): der Leisten-Root bleibt zwar 36px hoch
 * und nichts ragt über die rechte Kante — aber die Inhalte BRECHEN INNERHALB um.
 * Gemessen verteilten sich die Texte auf vier Zeilenpositionen (-6/0/6/12px) in
 * einer 36px-Leiste: „Team Control" zweizeilig, das Datum dreizeilig, beides
 * dadurch oben und unten angeschnitten. Der Auslöser ist derselbe wie auf dem
 * Telefon: der Desktop-Menücluster (Ablage · Bearbeiten · Darstellung · Fenster ·
 * Hilfe) beansprucht Breite, die auf einem Tablet nicht da ist.
 *
 * Behandlung deshalb identisch zu M1.1 in mobile-shell.css — aber BEWUSST als
 * eigene, tablet-eigene Regel und nicht durch Verbreitern des Mobile-Layers:
 * dessen übrige Regeln (Ampel-Umbau, Numpad, Namens-Zentrierung, Dock-Ausblendung)
 * sind Telefon-Präsentation und haben auf einem iPad nichts zu suchen.
 *
 * Verborgen wird ausschliesslich der nachrangige Menücluster. Alles, was die
 * Priorität verlangt, bleibt: App-Identität, aktiver Nutzer, Zeiterfassungs-Uhr,
 * Datum/Uhrzeit, Abmelden — und der primäre „vilo"-Trigger, über den die
 * Menüfunktionen weiterhin erreichbar sind. Gebunden an den geteilten
 * App-Shell-Anker (Touch), damit Desktop/Maus die Leiste unverändert behält;
 * unterhalb 768px besorgt es weiterhin mobile-shell.css.
 */
html[data-vilo-appshell] div[class*="z-[9999]"] > div:first-child > div.flex.items-center.gap-0.ml-1 {
  display: none;
}

/* Die frühere „Tablet-Fix 3"-Korrektur (Klassen-Override der beiden Geometrie-
   Variablen) ist entfallen: app-shell-geometry.css bedingt seine compact-
   spezifischen Reserven jetzt selbst über html[data-vilo-class="compact"] statt
   über eine rohe Breitenabfrage. `medium` erbt damit automatisch wieder die
   Tablet-Werte aus deren Basisblock — hier ist nichts mehr nachzuziehen.
   tablet-shell.css setzt seither an KEINER Stelle mehr Fenstergeometrie oder
   die geteilten --vilo-*-Variablen; das bleibt allein app-shell-geometry.css
   vorbehalten (siehe Eigentumsvertrag dort). */