/* ==========================================================================
   GCloudy-Website: eigene Regeln, die es im Design-System nicht gibt, und Übergänge, bis es sie hat.
   Nur Tokens (var(--…)), keine eigenen Werte. Übergänge stehen in AUFGABEN.md unter „Design-System“ und fliegen
   raus, sobald es sie dort gibt (npm run design). Stand: Design-System v11, alle früheren Übergänge sind dort.
   ========================================================================== */

/* Benutzerverwaltung und Papierkorb: Hinweis „Kein Eintrag passt zur Suche.“ unter der Tabelle; offene Einladung mit
   Briefsymbol statt Initialen im Kreis */
.users-empty { padding: var(--space-lg) 0; text-align: center; }
.table__person .avatar .i { width: var(--icon-size-md); height: var(--icon-size-md); }

/* Formular im Hintergrund außerhalb eines Fensters (z. B. Wiederherstellen im Papierkorb): wie die Formulare im Fenster
   ein Raster; als Knopfreihe (.icon-actions) nebeneinander */
form[data-ajax]:not(.icon-actions, .modal__actions) { display: grid; gap: var(--space-sm); }

/* Bestätigen ohne JavaScript (Seite /bestaetigen): Karte so breit wie ein Fenster. Mit JavaScript ist es ein Fenster. */
.confirm-card { max-width: var(--modal-width); gap: var(--space-lg); }

/* Darstellung › Seitenleiste: Breite ziehen gibt es nur, wenn die Seitenleiste neben dem Inhalt steht (ab 1068 px, wie im
   Design-System); am Handy und Tablet fährt sie herein, die Einstellung hätte keine Wirkung (Gürkan, 08.11.2026). */
@media (max-width: 1067px) { .settings__section[data-fold="seitenleiste"] { display: none; } }

/* Nur mit Maus sinnvoll (z. B. Tooltips, Gürkan 08.11.2026): an Geräten ohne Darüberfahren (Handy, Tablet) ausblenden;
   [data-only-touch] ist der Hinweis dafür. Die Befehlspalette nimmt solche Einträge in app.js heraus. */
@media (hover: none) { [data-only-hover] { display: none; } }
@media (hover: hover) { [data-only-touch] { display: none; } }