/* ============================================================
   TAG-KIPER — auth.css   Login / Forgot / Reset pages.
   ============================================================ */
.auth-page{
  background:linear-gradient(160deg,#0f172a 0%,#1e293b 60%,#0d1f2d 100%);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:2rem 1rem;
  font-family:'Inter',-apple-system,sans-serif;
}
.auth-card{
  width:100%;
  max-width:420px;
  background:#fff;
  border-radius:24px;
  box-shadow:0 8px 40px rgba(0,0,0,.3);
  overflow:hidden;
}
.auth-header{
  background:linear-gradient(135deg,#1e293b,#334155);
  padding:2rem 2rem 1.75rem;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.auth-header::before{
  content:'🏷️';
  position:absolute;
  font-size:8rem;
  opacity:.04;
  top:-1.5rem;right:-1rem;
  line-height:1;
  pointer-events:none;
}
.auth-logo{
  display:inline-block;
  font-size:1.4rem;
  font-weight:900;
  color:#fff;
  text-decoration:none;
  margin-bottom:1.25rem;
  letter-spacing:-.02em;
}
.auth-logo span{color:#f97316}
.auth-header h2{
  color:#fff;
  font-size:1.25rem;
  font-weight:900;
  margin:0 0 .3rem;
}
.auth-header p{
  color:rgba(255,255,255,.55);
  font-size:.88rem;
  margin:0;
  line-height:1.5;
}
.auth-body{padding:2rem}
@media(max-width:420px){
  .auth-body{padding:1.5rem}
  .auth-header{padding:1.5rem}
}

/* Campos */
.auth-field{margin-bottom:1.1rem}
.auth-label{
  display:block;
  font-weight:700;
  font-size:.84rem;
  color:#374151;
  margin-bottom:5px;
}
.auth-input{
  width:100%;
  border:2px solid #e2e8f0;
  border-radius:12px;
  padding:.65rem 1rem;
  font-size:.95rem;
  font-family:inherit;
  color:#1e293b;
  background:#f8fafc;
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.auth-input:focus{
  outline:none;
  border-color:#f97316;
  background:#fff;
  box-shadow:0 0 0 3px rgba(249,115,22,.12);
}
.auth-input.error{border-color:#dc2626;background:#fff5f5}

/* Botón submit */
.auth-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  border:none;
  border-radius:50px;
  padding:.9rem 2rem;
  font-size:.97rem;
  font-weight:800;
  cursor:pointer;
  font-family:inherit;
  transition:background .2s,transform .15s;
  background:#f97316;
  color:#fff;
  box-shadow:0 4px 14px rgba(249,115,22,.3);
}
.auth-btn:hover{background:#ea580c;transform:translateY(-1px)}
.auth-btn.dark{background:#1e293b;box-shadow:0 4px 14px rgba(30,41,59,.25)}
.auth-btn.dark:hover{background:#334155}

/* Alerta de error */
.auth-alert{
  border-radius:12px;
  padding:.8rem 1rem;
  font-size:.88rem;
  font-weight:600;
  margin-bottom:1.1rem;
  display:flex;
  align-items:flex-start;
  gap:.65rem;
}
.auth-alert.error  {background:#fee2e2;color:#7f1d1d;border:1.5px solid #fca5a5}
.auth-alert.success{background:#dcfce7;color:#14532d;border:1.5px solid #86efac}
.auth-alert.info   {background:#fffbeb;color:#78350f;border:1.5px solid #fde047}

/* Links auxiliares */
.auth-links{
  text-align:center;
  margin-top:1.25rem;
  font-size:.84rem;
  color:#94a3b8;
}
.auth-links a{
  color:#f97316;
  font-weight:700;
  text-decoration:none;
}
.auth-links a:hover{text-decoration:underline}

/* Separador */
.auth-divider{
  display:flex;
  align-items:center;
  gap:.75rem;
  margin:1.25rem 0;
  color:#cbd5e1;
  font-size:.8rem;
}
.auth-divider::before,
.auth-divider::after{
  content:'';
  flex:1;
  height:1px;
  background:#e2e8f0;
}

/* Card de solicitar etiqueta */
.wa-request-card{
  background:linear-gradient(135deg,#f0fdf4,#ecfdf5);
  border:1.5px solid #a7f3d0;
  border-radius:16px;
  padding:1.25rem;
  text-align:center;
  margin-top:1.25rem;
}
.wa-request-card h6{
  font-weight:800;
  color:#064e3b;
  font-size:.9rem;
  margin:0 0 .3rem;
}
.wa-request-card p{
  font-size:.82rem;
  color:#065f46;
  line-height:1.55;
  margin:0 0 1rem;
}
.wa-request-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#16a34a;
  color:#fff;
  text-decoration:none;
  border-radius:50px;
  padding:.75rem 1.5rem;
  font-size:.88rem;
  font-weight:800;
  transition:background .2s;
}
.wa-request-btn:hover{background:#15803d;color:#fff}
.wa-request-btn svg{width:18px;height:18px;fill:#fff;flex-shrink:0}

/* Fuerza contraseña */
.strength-bar{height:4px;border-radius:2px;background:#e2e8f0;margin-top:6px;overflow:hidden}
.strength-fill{height:100%;border-radius:2px;transition:width .3s,background .3s;width:0}
.strength-label{font-size:.75rem;margin-top:3px;font-weight:600}

/* Footer de auth */
.auth-page-footer{
  text-align:center;
  margin-top:1.25rem;
  font-size:.78rem;
  color:rgba(255,255,255,.25);
}
.auth-page-footer a{color:rgba(255,255,255,.35);text-decoration:none}
