/* ============================================================
   VERBINDLICHE MOBILE-REGELN — jede neue Netzwerk-Seite hält sich daran.
   Wird auf ALLEN Netzwerk-Seiten NACH netzwerk.css geladen. Korrigiert
   systematisch; ersetzt keine Seiten-Styles. Referenz-Datei.
   ============================================================ */

/* 1. Kein horizontales Scrollen — nie. */
html, body { overflow-x: hidden; max-width: 100vw; }
*, *::before, *::after { box-sizing: border-box; }
img, video, canvas, svg { max-width: 100%; }
/* Container sprengen nie den Viewport. */
.wrap, .section, .panel, .card, .net-container, .auth-card, main, nav, footer {
  max-width: 100%;
}
/* Lange Wörter/URLs/Mails brechen um statt zu überlaufen. */
.panel, .card, .net-container, .lead, .muted, p, td, li { overflow-wrap: anywhere; }
/* Absichtlich breite Inhalte (Tabellen) scrollen in sich selbst, nicht die Seite. */
.scroll-x { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* 5. Ein Container-System. */
.net-container { width: 100%; max-width: 640px; margin-inline: auto; padding-inline: 16px; }

/* 4. Badges kürzen NIE ab. */
.badge { white-space: nowrap; max-width: 100%; }

/* ── Mobile (< 640px) ─────────────────────────────────────────────────── */
@media (max-width: 640px) {
  /* 3. Mindest-Tap-Fläche 44x44 für alle interaktiven Elemente. */
  .btn, button, a.btn, [role="button"], .chip, .nz-kebab, .sun-tap {
    min-height: 44px;
  }
  .btn-icon, .nz-kebab { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

  /* 2. Aktions-Gruppen brechen um / stapeln. */
  .nz-actions, .actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .nz-actions--stack, .actions--stack { flex-direction: column; align-items: stretch; }
  .nz-actions--stack > .btn, .actions--stack > .btn { width: 100%; }

  /* Nav bricht um statt zu überlaufen; kompaktere Abstände. */
  .nz-nav { flex-wrap: wrap; gap: 10px 14px; padding: 14px 16px; }
  .nz-navlinks { gap: 14px; flex-wrap: wrap; margin-left: auto; }
  .nz-navlinks a { font-size: 13px; }

  /* Grids einspaltig. */
  .grid-3, .grid-2 { grid-template-columns: 1fr !important; }

  /* Seitliches Standard-Padding vereinheitlichen. */
  .wrap, .section { padding-left: 16px; padding-right: 16px; }

  /* Bewertungs-/Formular-Panels: volle Breite. */
  .panel { padding-left: 16px; padding-right: 16px; }
}

/* 6. Sticky-Bottom-CTA für Formular-/Aktionsseiten. Der Haupt-CTA klebt unten,
      immer erreichbar. Auf Desktop neutralisiert. */
.nz-sticky-cta {
  position: sticky; bottom: 0; z-index: 60;
  background: linear-gradient(to top, var(--et-color-paper) 72%, rgba(245,243,238,0));
  padding: 12px 0 14px;
}
.nz-sticky-cta > .btn, .nz-sticky-cta > .btn-block { width: 100%; }
@media (min-width: 641px) {
  .nz-sticky-cta { position: static; background: none; padding: 0; }
  .nz-sticky-cta > .btn { width: auto; }
}

/* ── Team-Zeile mit ⋯-Aktionsmenü (meine.html) ─────────────────────────── */
.team-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--et-color-rule); }
.team-main { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1 1 auto; }
.team-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-badge { flex: none; }
.team-actions { position: relative; flex: none; }
.nz-kebab { background: none; border: 1px solid var(--et-color-rule); border-radius: 10px; font-size: 18px; line-height: 1; cursor: pointer; color: var(--et-color-ink); padding: 6px 10px; }
.nz-kebab:hover { background: var(--et-color-paper-deep); }
.team-menu { position: absolute; right: 0; top: calc(100% + 4px); background: var(--et-color-card, #fff); border: 1px solid var(--et-color-rule); border-radius: 12px; box-shadow: 0 12px 30px rgba(14,23,20,.16); z-index: 40; min-width: 190px; padding: 6px; display: flex; flex-direction: column; }
.team-menu.hidden { display: none; }
.team-menu-item { text-align: left; background: none; border: none; padding: 12px 12px; border-radius: 8px; cursor: pointer; font: inherit; color: var(--et-color-ink); min-height: 44px; }
.team-menu-item:hover { background: var(--et-color-paper-deep); }
.team-menu-item.danger { color: var(--et-color-danger); }
