Integration der rechtlichen Dokumente (Frontend)

dev/lobby-frontend/src/css/auth.css

@@ -115,6 +115,17 @@
     cursor: pointer;
 }
 
+.checkbox-group a {
+    color: var(--color-cyan-bright);
+    text-decoration: none; /* Unterstrich entfernen für einen cleaneren Look */
+    transition: text-shadow 0.2s ease, color 0.2s ease;
+}
+
+.checkbox-group a:hover {
+    color: var(--color-text-main);
+    text-shadow: 0 0 8px var(--color-cyan-bright);
+}
+
 .checkbox-group input[type="checkbox"] {
     appearance: none;
     width: 18px;
@@ -215,3 +226,42 @@
     pointer-events: auto;
     transition: color 0.2s ease, text-shadow 0.2s ease;
 }
+
+
+
+#dev-warning-banner {
+    position: absolute;
+    top: 35px; /* Leichter Abstand zum oberen Bildschirmrand */
+    left: 50%;
+    transform: translateX(-50%); /* Zentriert das Banner horizontal */
+    
+    /* Optik: Roter, halbtransparenter Hintergrund mit rotem Rahmen */
+    background: rgba(255, 68, 68, 0.3); 
+    border: 1px solid var(--color-error);
+    box-shadow: 0 0 15px rgba(255, 68, 68, 0.8); /* Sanfter roter Glow */
+    
+    color: var(--color-text-main);
+    padding: 12px 25px;
+    font-size: 14px;
+    font-family: var(--font-main);
+    text-align: center;
+    letter-spacing: 1px;
+    
+    /* Z-Index hoch ansetzen, damit es garantiert über allem anderen liegt */
+    z-index: 100;
+    pointer-events: auto; /* Erlaubt das Markieren des Textes mit der Maus */
+}
+
+/* ----------------------------------------------------------------------
+ * Hervorhebung des Warn-Icons innerhalb des Banners
+ * ---------------------------------------------------------------------- */
+#dev-warning-banner .warning-icon {
+    color: var(--color-error);
+    font-size: 16px;
+    margin-right: 5px;
+    text-shadow: 0 0 8px var(--color-error);
+}
+
+#dev-warning-banner strong {
+    color: var(--color-error);
+}