/* auth.css - shared styles for login & register */
*,*::before,*::after { box-sizing:border-box }

body {
  margin:0;
  background:#0f1220;
  color:#e8eef6;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial;
  min-height:100dvh;
  display:grid;
  place-items:center;
}

.auth-card {
  width:min(92vw,380px);
  background:#171b2e;
  border-radius:16px;
  padding:20px 18px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}

.auth-title {
  font-size:20px;
  font-weight:700;
  margin:2px 2px 14px;
}

.auth-row {
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:10px 0 14px;
}

.auth-label {
  font-size:13px;
  color:#8ea0b5;
}

.auth-input {
  width:100%;
  display:block;
  background:#0c1020;
  color:#e8eef6;
  border:1px solid #2a2f4a;
  border-radius:12px;
  padding:12px 14px;
  outline:none;
}
.auth-input:focus { border-color:#6ea8fe; }

.auth-actions {
  display:flex;
  gap:10px;
  align-items:center;
}

.btn {
  border:0;
  border-radius:12px;
  padding:10px 14px;
  cursor:pointer;
  background:#6ea8fe;
  color:#0b0f1e;
  font-weight:600;
  width:100%;
}

.muted {
  font-size:13px;
  color:#8ea0b5;
  text-align:center;
  margin-top:10px;
}

.muted a {
  color:#6ea8fe;
  text-decoration:none;
}

.err {
  color:#ff6b6b;
  font-size:14px;
  margin-bottom:6px;
}

.auth-title {
  display: flex;         /* Zet logo en tekst naast elkaar */
  align-items: left;     /* Lijn ze verticaal in het midden uit */
  justify-content: left; /* Centreer het geheel in de beschikbare ruimte */
  gap: 10px;             /* Voeg 10px ruimte toe tussen het logo en de tekst */
}

.auth-title img {
  height: 24px !important; /* Voeg !important toe */
  width: auto;
}