/* ==========================================================================
   SignaCRM — Login (visual consistente)
   Depende dos tokens de assets/css/app.css
   ========================================================================== */

.login-wrap{
  min-height: 100dvh;
  display:flex; align-items:center; justify-content:center;
  padding: 40px 16px; background: var(--bg);
}

.login-card{
  width: 100%;
  max-width: 560px; /* mais confortável que 420px */
  border:1px solid var(--border-color);
  border-radius: var(--radius);
  background: var(--card-bg);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.login-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; padding: 16px 18px;
  background: var(--surface-2);
  border-bottom:1px solid var(--border-color);
}
.login-head .brand{
  display:flex; align-items:center; gap:10px; font-weight: 700;
  color: var(--text);
}

/* Botão mini de tema no login */
.theme-mini{
  display:inline-flex; align-items:center; justify-content:center;
  width: 38px; height: 38px;
  border-radius: 10px; border:1px solid var(--border-color);
  background: var(--surface); color: var(--text);
  cursor: pointer;
}
.theme-mini:hover{ filter: brightness(.98); }
.theme-mini .icon-sun{display:inline-block}
.theme-mini .icon-moon{display:none}
html[data-theme="dark"] .theme-mini .icon-sun{display:none}
html[data-theme="dark"] .theme-mini .icon-moon{display:inline-block}

.login-body{
  padding: 22px 18px 18px;
  display:grid; gap: 16px;
}

.field{ display:grid; gap: 6px; }
.field label{
  font-size:.9rem; color: var(--muted);
}
.field input[type="text"],
.field input[type="email"],
.field input[type="password"]{
  height: 46px; /* inputs mais altos */
  padding: 0 .75rem;
  border-radius: .65rem;
  border:1px solid var(--border-color);
  background: var(--input-bg);
  color: var(--text);
  font-size: .95rem;
  outline: none;
}
.field input::placeholder{ color: var(--muted); }
.field input:focus{
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in hsl, var(--primary) 18%, transparent);
}

.login-actions{
  display:flex; align-items:center; justify-content:space-between;
  gap: 10px; margin-top: 6px;
}
.muted{ color: var(--muted); font-size:.9rem; }

.login-error{
  border:1px solid rgba(239,68,68,.45);
  background: rgba(239,68,68,.1);
  color:#ef4444;
  border-radius: .7rem;
  padding: 10px 12px;
  font-size: .92rem;
}