:root {
  --bg:#0b0f14;
  --muted:#a8b3cf;
  --text:#e6f0ff;
  --primary:#2d7fd6;
  --primary-2:#1b6bbf;
  --danger:#ff6b6b;
  --field-bg:#0e1520;
  --ring-idle: rgba(45,127,214,.16);
  --ring-focus: rgba(45,127,214,.28);
  --shadow-idle: 0 4px 12px rgba(0,0,0,.45);
  --shadow-focus: 0 10px 28px rgba(0,0,0,.55);
  --shadow-hover: 0 14px 34px rgba(0,0,0,.60);
}

body {
  margin:0;
  font-family:'Inter',sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}

/* container centralizado */
.container-auth {
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px;
  text-align:center;
  background:
    radial-gradient(1200px 800px at 20% -10%, rgba(45,127,214,.10), transparent 60%),
    radial-gradient(900px 700px at 120% 30%, rgba(50,230,138,.08), transparent 55%);
}
.container-auth.align-top{
  justify-content:flex-start;
  padding-top:72px; /* ajuste a gosto */
}

/* logo */
.brand img {
  width:250px;
  margin-bottom:20px;
  filter: drop-shadow(0 6px 22px rgba(0,0,0,.45));
}

/* textos auxiliares */
.hint {
  font-size:16px;
  color:var(--muted);
  margin-bottom:20px;
  max-width:420px;
  line-height:1.5;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

/* alerts */
.alert {
  border-radius:10px;
  font-size:14px;
  padding:12px;
  margin-bottom:18px;
  max-width:460px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
}
.alert-success { background:#0f241b; color:#d6ffe9; }
.alert-danger  { background:#241114; color:#f8a3a3; }

/* grupos de input */
.group {
  margin-bottom:18px;
  max-width:460px; width:100%;
  margin-left:auto; margin-right:auto;
}

/* field (input wrapper) */
.field {
  position:relative;
  display:flex; align-items:center;
  background:var(--field-bg);
  border-radius:10px; height:52px;
  box-shadow:0 0 0 2px var(--ring-idle), var(--shadow-idle);
  transition:box-shadow .18s ease, transform .12s ease;
}
.field:hover {
  box-shadow:0 0 0 2px var(--ring-focus), var(--shadow-focus);
  transform:translateY(-1px);
}
.field:focus-within {
  box-shadow:0 0 0 3px var(--ring-focus), var(--shadow-focus);
  transform:translateY(-2px);
}
.field input {
  flex:1; height:100%; border:0; outline:0;
  padding:0 16px; background:transparent; color:var(--text); font-size:15px;
}
.field input::placeholder { color:#9bb0d2; }
.field:focus-within input { color:#fff; caret-color:#fff; }

/* corrige autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-text-fill-color:var(--text) !important;
  transition:background-color 9999s ease-in-out 0s !important;
  -webkit-box-shadow:0 0 0px 1000px var(--field-bg) inset !important;
  box-shadow:0 0 0px 1000px var(--field-bg) inset !important;
  border-radius:10px;
  caret-color:var(--text);
}

/* botão principal */
.btn-auth {
  margin-top:20px;
  max-width:460px; width:100%; height:52px;
  border:0; border-radius:10px; font-weight:600;
  background-image:linear-gradient(90deg,var(--primary),var(--primary-2));
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.45);
  box-shadow:var(--shadow-focus);
  transition:transform .15s ease, box-shadow .15s ease, filter .2s ease;
  cursor:pointer;
}
.btn-auth:hover {
  transform:translateY(-2px);
  box-shadow:var(--shadow-hover);
  filter:brightness(1.03);
}

/* linha remember + link */
.row-opts {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:12px auto 22px;
  max-width:460px; width:100%;
}

/* checkbox + label */
.form-check {
  display:flex; align-items:center; gap:8px;
  margin:0; padding:0;
}
.form-check-input {
  width:18px; height:18px; border-radius:5px;
  border:1px solid rgba(255,255,255,.25);
  background:var(--field-bg);
  cursor:pointer; appearance:none; position:relative;
  box-shadow:0 0 0 2px var(--ring-idle), 0 2px 6px rgba(0,0,0,.45);
  transition:box-shadow .18s ease, transform .12s ease;
}
.form-check-input:checked {
  background-image:linear-gradient(90deg,var(--primary),var(--primary-2));
  border-color:transparent;
  box-shadow:0 0 0 3px var(--ring-focus), 0 6px 16px rgba(0,0,0,.55);
  transform:translateY(-1px);
}
.form-check-input:checked::after {
  content:"✔"; color:#fff; font-size:12px;
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
}
.form-check-label {
  margin:0; line-height:1; font-size:14px; color:#cfd8ff;
}

/* links */
.recover-link,
.link-auth {
  font-size:14px;
  color:#9ec8ff;
  text-decoration:none;
}
.recover-link:hover,
.link-auth:hover {
  text-decoration:underline;
}

/* botão ícone (ex: cadeado no password) */
.icon-btn {
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  height:38px; width:38px; border:0; border-radius:8px;
  background:transparent; color:var(--text);
  display:grid; place-items:center; cursor:pointer;
  transition:background .15s ease, transform .1s ease;
}
.icon-btn:hover{ background:rgba(255,255,255,.07); }
.icon-hidden{ display:none; }