highlight approval flow for non-default login domains

public/app.js

@@ -89,6 +89,7 @@ const els = {
   otpCode: document.getElementById("otpCode"),
   verifyOtpBtn: document.getElementById("verifyOtpBtn"),
   authMessage: document.getElementById("authMessage"),
+  loginDomainNotice: document.getElementById("loginDomainNotice"),
   brandLogo: document.getElementById("brandLogo"),
   brandFallback: document.getElementById("brandFallback"),
   maintenanceBanner: document.getElementById("maintenanceBanner"),
@@ -488,6 +489,12 @@ function bindEvents() {
     await requestAccess();
   });
 
+  if (els.emailDomainSelect) {
+    els.emailDomainSelect.addEventListener("change", () => {
+      renderLoginDomainNotice();
+    });
+  }
+
   els.activateBtn.addEventListener("click", async () => {
     await activateStation();
   });
@@ -1063,6 +1070,25 @@ function renderLoginDomainSelect() {
   } else if (domains.length > 0) {
     els.emailDomainSelect.value = domains[0];
   }
+  renderLoginDomainNotice();
+}
+
+function renderLoginDomainNotice() {
+  if (!els.loginDomainNotice || !els.emailDomainSelect) {
+    return;
+  }
+  const domains = getAllowedLoginDomains();
+  const defaultDomain = String(domains[0] || "").trim().toLowerCase();
+  const selectedDomain = String(els.emailDomainSelect.value || defaultDomain).trim().toLowerCase();
+  const needsApproval = Boolean(defaultDomain && selectedDomain && selectedDomain !== defaultDomain);
+
+  els.loginDomainNotice.hidden = !needsApproval;
+  if (!needsApproval) {
+    els.loginDomainNotice.textContent = "";
+    return;
+  }
+
+  els.loginDomainNotice.textContent = `Hinweis: Fuer @${selectedDomain} wird ein Freigabeprozess gestartet. Zugriff ist erst nach Freigabe moeglich.`;
 }
 
 async function handleEmailTokenFromUrl() {
@@ -1133,6 +1159,7 @@ function setLoginEmail(email) {
     if (parts.domain && getAllowedLoginDomains().includes(parts.domain)) {
       els.emailDomainSelect.value = parts.domain;
     }
+    renderLoginDomainNotice();
   }
 }
 

public/index.html

@@ -74,6 +74,7 @@
                 <select id="emailDomainSelect"></select>
               </label>
             </div>
+            <p id="loginDomainNotice" class="message domain-notice" hidden></p>
             <label class="field">
               <span>Bestaetigungsart</span>
               <select id="authMethodSelect"></select>

public/styles.css

@@ -800,6 +800,21 @@ dd {
   color: var(--ok);
 }
 
+.message.domain-notice {
+  min-height: 0;
+  margin-top: 0.1rem;
+  padding: 0.5rem 0.7rem;
+  border-radius: 10px;
+  border: 1px solid var(--primary);
+  color: var(--text);
+  background: rgba(48, 182, 247, 0.12);
+  font-weight: 600;
+}
+
+html[data-theme="light"] .message.domain-notice {
+  background: rgba(0, 119, 182, 0.1);
+}
+
 .reveal {
   animation: fade-up 500ms ease;
 }