/* 1. Großen Hintergrund neutral dunkel einfärben */
[class*="Lobby"], 
[class*="warteraum"], 
.lobby-background-container,
div[style*="background-image"] {
  background-image: none !important;
  background-color: #1a1a1a !important; 
}

/* 2. Platz über der Anmelde-Box schaffen */
[class*="LobbyCard"], 
[class*="LobbyContent"],
div[class*="card"] {
  position: relative !important;
  margin-top: 120px !important; 
}

/* 3. Das breite Logo (Bild + Text) perfekt zentriert darüberlegen */
[class*="LobbyCard"]::before,
[class*="LobbyContent"]::before,
div[class*="card"]::before {
  content: "" !important;
  position: absolute !important;
  top: -100px !important;       /* Schiebt das Bild über die Box */
  left: 50% !important;
  transform: translateX(-50%) !important; /* Zentriert die gesamte Logobreite */
  
  /* HIER DIE BREITE FÜR DEIN NEUES BILD ERHÖHEN: */
  width: 320px !important;       /* Mach diesen Wert so breit, dass dein Firmenname ganz draufpasst */
  height: 80px !important;       /* Die Höhe deines Logos */
  
  background-image: url('/assets/images/logo.svg') !important;
  background-size: contain !important;     /* Verhindert Verzerrung, skaliert sauber */
  background-repeat: no-repeat !important;
  background-position: center center !important; /* Zentriert Logo + Text im Container */
}