/* ServeOS — sistema/assets/auth.css
 * Estilo compartilhado das telas de autenticação (login, esqueci senha,
 * redefinir senha) de qualquer camada — Master, Empresa ou Funcionário.
 */

:root{
  --bg: #0b0f1a;
  --bg-card: #161d2e;
  --bg-input: #0d1220;
  --border: #232b40;
  --text: #f4f6fa;
  --text-muted: #8993ab;
  --accent: #3b82f6;
  --success: #4ade80;
  --success-bg: #16301f;
  --danger: #f87171;
  --danger-bg: #3a1d1d;
}

*{ box-sizing:border-box; }

body{
  margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 20% 15%, rgba(59,130,246,.10), transparent 40%),
    radial-gradient(circle at 85% 85%, rgba(99,102,241,.08), transparent 40%),
    var(--bg);
  color:var(--text); font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  padding:20px;
}

.card{
  width:100%; max-width:380px; padding:34px 32px;
  border:1px solid var(--border); border-radius:16px; background:var(--bg-card);
  box-shadow:0 20px 50px -20px rgba(0,0,0,.5);
}

.marca{ display:flex; align-items:center; gap:11px; margin-bottom:22px; }
.marca .icone{
  width:38px; height:38px; border-radius:11px;
  background:linear-gradient(135deg, #3b82f6, #6366f1);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:16px; color:#fff; flex-shrink:0;
}
.marca .nome{ font-size:17px; font-weight:700; line-height:1.15; }
.marca .camada{ font-size:12px; color:var(--text-muted); margin-top:1px; }

h1{ font-size:18px; margin:0 0 4px; }
p.sub{ color:var(--text-muted); font-size:13px; margin:0 0 20px; }

label{ display:block; font-size:13px; margin:14px 0 6px; color:#aab2c5; font-weight:500; }
input{
  width:100%; box-sizing:border-box; padding:11px 13px; border-radius:9px; border:1px solid var(--border);
  background:var(--bg-input); color:var(--text); font-size:14px; font-family:inherit;
}
input:focus{ outline:none; border-color:var(--accent); }

button{
  margin-top:22px; width:100%; padding:12px; border:none; border-radius:9px; background:var(--accent);
  color:#fff; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit; transition:filter .12s;
}
button:hover{ filter:brightness(1.08); }

.msg{ padding:12px 14px; border-radius:9px; font-size:13px; margin-bottom:8px; }
.msg.erro{ background:var(--danger-bg); color:var(--danger); }
.msg.ok{ background:var(--success-bg); color:var(--success); }

.rodape-card{ margin-top:18px; font-size:13px; text-align:center; }
.rodape-card a{ color:var(--accent); text-decoration:none; }
.rodape-card a:hover{ text-decoration:underline; }