:root{
  --bg:#000000;
  --fg:#e9e9ea;
  --muted:#a5a7ad;
  --card:#121214;
  --input:#1a1b1f;
  --border:#2a2b30;
  --primary:#3a7bd5;
  --primary-hover:#2f5fa0;
  --link:#8fbaff;
  --danger:#d9534f;
  --success:#28a745;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:14px/1.45 "Segoe UI", Roboto, Arial, sans-serif;
  display:flex; align-items:center; justify-content:center; padding:24px;
}

/* cartão base */
.auth-container{
  width:100%; max-width:460px; background:var(--card);
  border:1px solid var(--border); border-radius:12px;
  padding:28px; box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.auth-container h1{margin:0 0 18px; text-align:center}
p{margin:0 0 14px; color:var(--muted)}

/* formulário */
.auth-form .form-group{margin-bottom:16px}
.auth-form label{display:block; margin-bottom:6px; color:#d7d7dc; font-weight:600}

/* inputs de texto (NÃO estiliza checkbox/radio) */
.auth-form input[type="text"],
.auth-form input[type="email"],
.auth-form input[type="password"],
.auth-form input[type="search"],
.auth-form input[type="tel"],
.auth-form input[type="url"],
.auth-form input[type="number"],
.auth-form input[type="date"],
.auth-form input[type="time"],
.auth-form input[type="datetime-local"],
.auth-form select,
.auth-form textarea{
  width:100%;
  background:var(--input);
  color:#fff;
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:8px;
  outline:none;
}
.auth-form input[type="text"]:focus,
.auth-form input[type="email"]:focus,
.auth-form input[type="password"]:focus,
.auth-form input[type="search"]:focus,
.auth-form input[type="tel"]:focus,
.auth-form input[type="url"]:focus,
.auth-form input[type="number"]:focus,
.auth-form input[type="date"]:focus,
.auth-form input[type="time"]:focus,
.auth-form input[type="datetime-local"]:focus,
.auth-form select:focus,
.auth-form textarea:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(58,123,213,.25);
  transition: box-shadow .2s, border-color .2s;
}

/* Autofill dark */
.auth-form input:-webkit-autofill,
.auth-form input:-webkit-autofill:hover,
.auth-form input:-webkit-autofill:focus{
  -webkit-text-fill-color:#fff;
  caret-color:#fff;
  transition: background-color 9999s ease-in-out 0s;
  box-shadow: 0 0 0px 1000px var(--input) inset !important;
}
.auth-form input:-moz-autofill{
  -moz-text-fill-color:#fff;
  box-shadow: 0 0 0px 1000px var(--input) inset !important;
}

/* checkbox/radio */
.auth-form input[type="checkbox"],
.auth-form input[type="radio"]{
  width:auto; height:16px;
  margin:0; padding:0;
  border-radius:4px;
  box-shadow:none;
  background:transparent;
  vertical-align:middle;
  accent-color: var(--primary);
}
.checkbox-inline{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; color:var(--muted);
}

/* link "mostrar senha" */
.toggle-password{
  display:block;
  margin-top:6px;
  margin-bottom:6px;
  background:none; border:0; padding:0;
  color:var(--muted);
  font-size:12px; cursor:pointer;
}
.toggle-password:hover{color:#fff; text-decoration:underline}
.toggle-password + .small{ display:block; margin-top:2px; }

/* botões / links */
.btn-primary{
  width:100%; padding:12px 16px; border:0; border-radius:8px;
  font-weight:700; cursor:pointer; color:#fff; background:var(--primary);
  min-height:44px;
}
.btn-primary:hover{background:var(--primary-hover)}
.btn-secondary{
  padding:10px 14px; border-radius:8px; border:1px solid var(--border);
  background:transparent; color:#fff; cursor:pointer; min-height:40px;
}
.btn-danger{
  background: var(--danger);
  border: 0;
  color: #fff;
  padding: 10px 14px;
  min-height: 40px;
  border-radius: 8px;
  font-weight: 700;
}
.btn-danger:hover{ background:#c4423f; }
.auth-links{display:flex; gap:10px; justify-content:center; margin-top:12px}
.auth-links a{color:var(--link); text-decoration:none}
.auth-links a:hover{text-decoration:underline}

/* mensagens */
.auth-status{
  background:rgba(40,167,69,.12); color:#b4f1c1; border:1px solid rgba(40,167,69,.4);
  padding:10px 12px; border-radius:8px; margin-bottom:14px;
}
.auth-errors{
  background:rgba(217,83,79,.1); color:#ffc4c2; border:1px solid rgba(217,83,79,.35);
  padding:10px 12px; border-radius:8px; margin-bottom:14px;
}
.auth-errors ul{margin:0; padding-left:18px}
.small, small{color:var(--muted); font-size:12px}

/* centralição opcional para páginas com layout externo */
.auth-page-center{ min-height:100vh; display:flex; align-items:center; justify-content:center; }

/* utilitários para remover style="" inline */
.mt-12{ margin-top:12px }
.mt-16{ margin-top:16px }
.w-auto{ width:auto }
