/* IIQ Registrierungsseite */

:root{
  --r-bg:#fafafa;
  --r-fg:#111827;
  --r-sub:#6b7280;
  --r-border:#e5e7eb;
  --r-green:#059669;
  --r-green-dark:#047857;
  --r-dark:#111827;
  --r-radius:10px;
  --r-shadow:0 20px 50px rgba(15,23,42,.08);
  --r-font:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
}

* { box-sizing:border-box; }

html, body {
  margin:0; padding:0;
  font-family:var(--r-font);
  color:var(--r-fg);
  background:var(--r-bg);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

:root {
  --mouse-x:0;
  --mouse-y:0;
}

.register-body {
  min-height:100vh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:4rem 1rem;
  position:relative;
  overflow-y:auto;
}

/* Partikel-Netz Hintergrund */
.particles-canvas {
  position:fixed;
  inset:0;
  z-index:0;
  background:#f9fafb;
  width:100%;
  height:100%;
  display:block;
}

@media (prefers-reduced-motion: reduce) {
  .particles-canvas { display:none; }
}

.register-main {
  position:relative;
  z-index:1;
  width:100%;
  max-width:420px;
}

.register-logo {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  margin-bottom:2rem;
  color:var(--r-fg);
  font-weight:700;
  font-size:1.3rem;
  text-decoration:none;
}

.register-card {
  background:#fff;
  border:1px solid var(--r-border);
  border-radius:var(--r-radius);
  box-shadow:var(--r-shadow);
  padding:2.25rem;
}

@media (max-width:480px){
  .register-card { padding:1.5rem; }
}

.register-title {
  font-size:1.65rem;
  font-weight:700;
  margin:0 0 .35rem;
  text-align:center;
}

.register-subtitle {
  text-align:center;
  color:var(--r-sub);
  margin:0 0 1.75rem;
  font-size:1rem;
}

.auth-sso {
  display:flex;
  flex-direction:column;
  gap:.75rem;
  margin-bottom:.75rem;
}

.auth-sso-btn {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  width:100%;
  padding:.85rem;
  background:#fff;
  border:1.5px solid var(--r-border);
  border-radius:var(--r-radius);
  font-size:1rem;
  font-weight:500;
  color:var(--r-fg);
  cursor:pointer;
  transition:border-color .15s, background .15s;
}

.auth-sso-btn:hover:not(:disabled) { border-color:var(--r-green); background:#f9fafb; }
.auth-sso-btn:disabled { opacity:.5; cursor:not-allowed; }

.auth-sso-icon { width:20px; height:20px; flex-shrink:0; }

.auth-divider {
  display:flex;
  align-items:center;
  gap:.75rem;
  margin:.75rem 0 1.25rem;
  color:var(--r-sub);
  font-size:.9rem;
}

.auth-divider::before,
.auth-divider::after {
  content:'';
  flex:1;
  height:1px;
  background:var(--r-border);
}

.register-form { display:flex; flex-direction:column; gap:1.1rem; }

.register-field { display:flex; flex-direction:column; gap:.45rem; }

.register-field label {
  font-size:.85rem;
  font-weight:600;
  color:var(--r-fg);
}

.register-field input[type="email"],
.register-field input[type="password"] {
  padding:.85rem 1rem;
  border:1.5px solid var(--r-border);
  border-radius:var(--r-radius);
  font-size:1rem;
  outline:none;
  transition:border-color .15s, box-shadow .15s;
}

.register-field input:focus {
  border-color:var(--r-green);
  box-shadow:0 0 0 3px rgba(5,150,105,.12);
}

.register-hint {
  font-size:.8rem;
  color:var(--r-sub);
  font-weight:400;
}

.register-interests-details {
  border:1.5px solid var(--r-border);
  border-radius:var(--r-radius);
  background:#fff;
  overflow:hidden;
}

.register-interests-summary {
  padding:.85rem 1rem;
  font-size:.95rem;
  font-weight:500;
  color:var(--r-sub);
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  transition:color .15s, background .15s;
}

.register-interests-summary::-webkit-details-marker { display:none; }

.register-interests-summary::after {
  content:'+';
  font-size:1.2rem;
  color:var(--r-green);
  font-weight:600;
}

.register-interests-details[open] > .register-interests-summary::after {
  content:'−';
}

.register-interests-summary:hover {
  color:var(--r-fg);
  background:#f9fafb;
}

.register-interests {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  padding:0 1rem 1rem;
}

.register-interest {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  padding:.65rem .8rem;
  border:1.5px solid var(--r-border);
  border-radius:8px;
  cursor:pointer;
  transition:all .15s;
  font-size:.9rem;
}

.register-interest:hover { border-color:#a7f3d0; background:#f0fdf4; }

.register-interest input[type="checkbox"] {
  width:18px; height:18px;
  accent-color:var(--r-green);
  margin-top:.15rem;
  cursor:pointer;
}

.register-interest.checked { border-color:var(--r-green); background:#ecfdf5; }

.register-submit {
  width:100%;
  padding:.95rem;
  background:var(--r-green);
  color:#fff;
  border:0;
  border-radius:var(--r-radius);
  font-size:1.05rem;
  font-weight:600;
  cursor:pointer;
  transition:background .15s, transform .1s;
  margin-top:.5rem;
}

.register-submit:hover { background:var(--r-green-dark); }
.register-submit:active { transform:scale(.99); }
.register-submit:disabled { opacity:.7; cursor:default; }

.register-msg {
  margin-top:1rem;
  padding:.75rem 1rem;
  border-radius:8px;
  font-size:.9rem;
  text-align:center;
  display:none;
}

.register-msg.error { display:block; background:#fef2f2; color:#991b1b; border:1px solid #fca5a5; }
.register-msg.success { display:block; background:#f0fdf4; color:#065f46; border:1px solid #a7f3d0; }

.register-footer {
  text-align:center;
  margin:1.25rem 0 0;
  font-size:.9rem;
  color:var(--r-sub);
}

.register-link {
  color:var(--r-green);
  text-decoration:none;
  font-weight:600;
}
.register-link:hover { text-decoration:underline; }