#userDataModal {
    .femanager_fieldset.femanager_submit.form-group {
        right: 40px;
    }
}

/* Suchfeld ueber der Mitglieder-Karte (ods_osm) */
#osm-search-form {
  margin-bottom: 0.75rem;
}

.osm-search-row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.osm-search-row .form-control {
  flex: 1;
  min-width: 120px;
}

.osm-search-count {
  margin-top: 0.35rem;
  font-size: 0.85rem;
  color: #888;
}

/* Der Anmelde-Dialog 15% breiter als der Bootstrap-Standard (500px in main.css,
   Zeile ~5420). Nur innerhalb derselben Media Query, unterhalb 576px laeuft der
   Dialog ohnehin ueber die volle Breite. */
@media (min-width: 576px) {
  #afterEventRegistrationModal.modal .modal-dialog {
    max-width: 575px;
  }
}

/* Der Punktekranz des urspruenglichen Spinners entfaellt - die Kette traegt die
   Animation allein. Die <span>-Elemente bleiben im Fluid-Partial stehen (das
   gehoert zur gemeinsamen Basis-Extension), sie werden hier nur ausgeblendet. */
.luftwaffe-loader span {
  display: none;
}

/* Die Kreisbahn waechst um dieselben 15% mit: 120px * 1,15 = 138px. */
.luftwaffe-loader {
  width: 138px;
  height: 138px;
}

/* Umlaufdauer: main.css setzt 2s, das war auf einen einzelnen Flieger als
   Spinner gemuenzt. Als Kette wirkt das hektisch, daher 9s. Aendert man das
   hier, muss CYCLE in override.js mitgezogen werden - daraus wird der
   Versatz der einzelnen Maschinen auf der Bahn berechnet.

   Der Versatz kommt als Custom Property --flug-delay vom JS und nicht als
   inline animation-delay, weil ihn das ::before mitbekommen muss: die Welle
   weiter unten laeuft als zweite Animation auf dem Pseudo-Element und muss
   phasengleich zur Drehung des Elternelements sein. Custom Properties erben
   auf Pseudo-Elemente, inline gesetzte Eigenschaften nicht. */
.plane {
  animation-duration: 9s;
  animation-delay: var(--flug-delay, -4.5s);
}

/* Lade-Animation der Event-Registrierung: Flugzeug statt Unicode-Zeichen.
   main.css setzt .plane::before mit content "\1F6E6", position, top/left und
   der Rotation - das bleibt bestehen, hier wird nur das Motiv ersetzt.

   Seit der Kette fliegen sechs Maschinen gleichzeitig auf derselben Bahn
   (siehe override.js). Der Abstand zweier Nachbarn entspricht bei sechs
   Maschinen genau dem Bahnradius - die Kantenlaenge muss also deutlich
   darunter bleiben, sonst beruehren sie sich.

   Alles hier ist der 15% vergroesserte Stand: main.css legt den Mittelpunkt
   des ::before-Kastens auf (115|110) bei 120px Bahn, mal 1,15 sind das
   (132,25|126,5) bei 138px Bahn. Daraus folgen top = 126,5 - 64/2 und
   left = 132,25 - 64/2. Bahnradius damit 85,5px statt 74,3px. */
.plane::before {
  content: "";
  width: 64px;
  height: 64px;
  top: 94.5px;
  left: 100.25px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  /* Fallback, falls das JS kein Muster zulost */
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/eurofighter.png");
  /* Die Welle im Norden - phasengleich zur Drehung des Elternelements */
  animation-name: kette-welle;
  animation-duration: 9s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-delay: var(--flug-delay, -4.5s);
}

/* Welle im Norden: jede Maschine steigt beim Passieren des hoechsten Punktes
   kurz aus der Kreisbahn nach aussen aus und faellt wieder ein.

   Die Verschiebung laeuft radial nach aussen. Weil das Elternelement .plane die
   Drehung uebernimmt, liegt die Radiusrichtung im lokalen Koordinatensystem
   fest: vom Bahnmittelpunkt (69|69) zum Mittelpunkt des ::before-Kastens
   (132,25|126,5), also (63,25|57,5), normiert (0,7404|0,6731). Ein translate
   entlang dieses Vektors zeigt bei jeder Drehlage nach aussen - und im Norden
   ist aussen genau oben.

   Der Scheitel liegt bei 60,48% der Umlaufzeit: die Drehung laeuft von 10deg
   bis 370deg, der Kasten sitzt von Haus aus 42,28deg hinter der Nulllage,
   Norden ist also bei 270 - 42,28 = 227,72deg erreicht, das sind
   (227,72 - 10) / 360 des Umlaufs. Das Fenster ist +/-40deg breit, der Verlauf
   darin eine angehobene Kosinuskurve.

   Amplitude 25px. Zum Aendern alle translate-Werte neu rechnen als
   A * Amplitude * (0,7404|0,6731) mit A = 0 / 0,1464 / 0,5 / 0,8536 / 1. */
@keyframes kette-welle {
  0%, 49.37% {
    transform: translate(0, 0) rotate(220deg) scale(1.0);
  }
  52.15% {
    transform: translate(2.71px, 2.46px) rotate(220deg) scale(1.044);
  }
  54.93% {
    transform: translate(9.25px, 8.41px) rotate(220deg) scale(1.15);
  }
  57.7% {
    transform: translate(15.79px, 14.35px) rotate(220deg) scale(1.256);
  }
  60.48% {
    transform: translate(18.5px, 16.82px) rotate(220deg) scale(1.3);
  }
  63.26% {
    transform: translate(15.79px, 14.35px) rotate(220deg) scale(1.256);
  }
  66.04% {
    transform: translate(9.25px, 8.41px) rotate(220deg) scale(1.15);
  }
  68.81% {
    transform: translate(2.71px, 2.46px) rotate(220deg) scale(1.044);
  }
  71.59%, 100% {
    transform: translate(0, 0) rotate(220deg) scale(1.0);
  }
}

.plane--sabre::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/sabre.png");
}

.plane--starfighter::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/starfighter.png");
}

.plane--phantom::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/phantom.png");
}

.plane--eurofighter::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/eurofighter.png");
}

/* Die beiden Maschinen der Jagdstaffel 11 bzw. des JG 1 - Draufsichten, damit
   sie sich wie die Jets korrekt in die Kreisbahn legen. */
.plane--fokker::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/fokker_dr1.png");
}

.plane--albatros::before {
  background-image: url("/typo3conf/ext/bw_tg_richthofen_template/Resources/Public/Images/Planes/albatros_d3.png");
}

/* Mitgliederliste */
.memberlist-search {
  margin-bottom: 0.75rem;
}

.memberlist-search-row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.memberlist-search-row .form-control {
  flex: 1;
  min-width: 120px;
}

.memberlist-count {
  margin-top: 0.35rem;
  font-size: 0.85rem;
  color: #888;
}

.memberlist-table {
  width: 100%;
}

.memberlist-table th[data-ml-sort] {
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
}

.memberlist-table th[data-ml-sort]::after {
  content: "\2195";
  opacity: 0.35;
  margin-left: 0.35em;
}

.memberlist-table th[data-ml-dir="asc"]::after  { content: "\2191"; opacity: 1; }
.memberlist-table th[data-ml-dir="desc"]::after { content: "\2193"; opacity: 1; }

.memberlist-empty {
  color: #888;
  font-style: italic;
}

@media (max-width: 767.98px) {
  .memberlist-table thead { display: none; }
  .memberlist-table tr {
    display: block;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  }
  .memberlist-table td {
    display: block;
    border: 0;
    padding: 0.15rem 0;
  }
}