/* =====================================================================
   Itzamná Tech — itz-auth.css
   Estilos unificados para páginas de autenticación del sitio público:
   /ingreso/ · /recuperar/ · /recuperar/restablecer.php
   Subir a: /css/itz-auth.css  (reemplaza el uso de signin.css)
   Convive con bootstrap.min.css y style.css del template; todas las
   clases llevan prefijo .itz- para evitar colisiones.
   ===================================================================== */

:root{
  --itza-primary:#0090e7;
  --itza-primary-deep:#0072b8;
  --itza-ink:#13243a;
  --itza-body:#44556b;
  --itza-muted:#7c8aa0;
  --itza-border:#dbe4ee;
  --itza-success:#1f9d5b;
  --itza-warning:#a8731c;
  --itza-danger:#d6455a;
}

/* ---- Contenedor y tarjeta ---- */
.itz-auth-wrap{
  display:flex; justify-content:center;
  padding:10px 16px 60px;
}
.itz-auth-card{
  width:100%; max-width:480px;
  background:#fff;
  border:1px solid var(--itza-border);
  border-radius:20px;
  padding:42px 38px 30px;
  box-shadow:0 18px 50px rgba(19,36,58,.10);
  text-align:left;
}
.itz-auth-card .itz-logo{
  width:54px; height:54px; border-radius:12px;
  display:block; margin-bottom:18px;
}
.itz-eyebrow{
  color:var(--itza-primary); font-size:11.5px; font-weight:800;
  text-transform:uppercase; letter-spacing:.16em; margin-bottom:6px;
  font-family:'Rubik',sans-serif;
}
.itz-title{
  font-family:'Rubik',sans-serif; color:var(--itza-ink);
  font-size:27px; font-weight:700; letter-spacing:-.01em; margin-bottom:10px;
}
.itz-subtitle{
  color:var(--itza-body); font-size:15px; line-height:1.6; margin-bottom:24px;
}
.itz-subtitle strong{ color:var(--itza-ink); }

/* ---- Alertas ---- */
.itz-alert{
  display:flex; gap:10px; align-items:flex-start;
  border-radius:12px; padding:13px 15px;
  font-size:14px; line-height:1.5; margin-bottom:22px; text-align:left;
}
.itz-alert i, .itz-alert .bi{ font-size:17px; line-height:1.35; }
.itz-alert-info{ background:#e8f5fd; border:1px solid #bfe2f8; color:#1c5d86; }
.itz-alert-info i{ color:var(--itza-primary); }
.itz-alert-success{ background:#e9f8f0; border:1px solid #bfe8d2; color:#176a40; }
.itz-alert-success i{ color:var(--itza-success); }
.itz-alert-warning{ background:#fdf4e3; border:1px solid #f0ddb2; color:#7a5413; }
.itz-alert-warning i{ color:var(--itza-warning); }
.itz-alert-danger{ background:#fdeef0; border:1px solid #f5c6cd; color:#933347; }
.itz-alert-danger i{ color:var(--itza-danger); }

/* ---- Campos (override seguro sobre bootstrap) ---- */
.itz-field{ margin-bottom:18px; width:100%; }
.itz-field > label{
  display:block; font-size:13.5px; font-weight:800;
  color:var(--itza-ink); margin-bottom:8px;
}
.itz-input-wrap{ position:relative; display:block; width:100%; }
.itz-input-wrap > i{
  position:absolute; left:15px; top:50%; transform:translateY(-50%);
  font-size:17px; color:var(--itza-muted); pointer-events:none;
  transition:color .18s ease;
}
.itz-auth-card input[type=email].itz-input,
.itz-auth-card input[type=password].itz-input,
.itz-auth-card input[type=text].itz-input{
  display:block; width:100%; height:52px;
  background:#fff;
  border:1.5px solid var(--itza-border);
  border-radius:12px;
  color:var(--itza-ink);
  font-size:15.5px; font-family:'Nunito',sans-serif;
  padding:0 50px 0 46px;
  outline:none; box-shadow:none;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.itz-auth-card .itz-input::placeholder{ color:#a8b4c6; }
.itz-auth-card .itz-input:focus{
  border-color:var(--itza-primary);
  box-shadow:0 0 0 4px rgba(0,144,231,.14);
}
.itz-input-wrap:focus-within > i{ color:var(--itza-primary); }
.itz-auth-card .itz-input.is-invalid{ border-color:var(--itza-danger); }
.itz-auth-card .itz-input.is-invalid:focus{ box-shadow:0 0 0 4px rgba(214,69,90,.12); }

.itz-toggle-pw{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:none; border:0; cursor:pointer; padding:9px;
  color:var(--itza-muted); font-size:17px; line-height:1; border-radius:8px;
}
.itz-toggle-pw:hover{ color:var(--itza-ink); }
.itz-toggle-pw:focus-visible{ outline:2px solid rgba(0,144,231,.5); }

.itz-field-error{
  display:none; color:var(--itza-danger);
  font-size:12.5px; font-weight:700; margin-top:7px;
  align-items:center; gap:5px;
}
.itz-field-error.show{ display:flex; }

/* ---- Checklist de requisitos de contraseña ---- */
.itz-pw-checklist{ list-style:none; margin:10px 0 0; padding:0; display:grid; gap:5px; }
.itz-pw-checklist li{
  display:flex; align-items:center; gap:7px;
  font-size:12.5px; font-weight:700; color:var(--itza-muted);
  transition:color .15s ease;
}
.itz-pw-checklist li i{ font-size:14px; }
.itz-pw-checklist li.ok{ color:var(--itza-success); }

/* ---- Botón principal ---- */
.itz-btn{
  width:100%; height:52px; border:0; border-radius:12px; margin-top:6px;
  background:linear-gradient(135deg, var(--itza-primary), var(--itza-primary-deep));
  color:#fff !important; font-size:15.5px; font-weight:800; font-family:'Nunito',sans-serif;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
  text-decoration:none;
  box-shadow:0 6px 16px rgba(0,144,231,.28);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.itz-btn:hover{ filter:brightness(1.06); box-shadow:0 10px 24px rgba(0,144,231,.34); transform:translateY(-1px); color:#fff; }
.itz-btn:active{ transform:translateY(0); }
.itz-btn:focus-visible{ outline:3px solid rgba(0,144,231,.45); outline-offset:2px; }
.itz-btn:disabled{ filter:grayscale(.4) brightness(.95); cursor:not-allowed; transform:none; }

/* ---- Honeypot anti-bots ---- */
.itz-hp{ position:absolute; left:-9999px; top:-9999px; height:0; width:0; overflow:hidden; }

/* ---- Divisor con greca maya ---- */
.itz-maya-divider{ display:flex; align-items:center; gap:14px; margin:26px 0 16px; }
.itz-maya-divider::before, .itz-maya-divider::after{
  content:""; flex:1; height:1px; background:var(--itza-border);
}
.itz-maya-divider svg{ opacity:.65; flex-shrink:0; }

/* ---- Enlaces secundarios y pie de tarjeta ---- */
.itz-aux-links{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.itz-link{
  display:inline-flex; align-items:center; gap:7px;
  color:var(--itza-primary); font-size:14px; font-weight:700; text-decoration:none;
}
.itz-link:hover{ text-decoration:underline; color:var(--itza-primary-deep); }
.itz-copy{ color:var(--itza-muted); font-size:12.5px; margin:12px 0 0; }

@media (max-width:480px){
  .itz-auth-card{ padding:32px 22px 24px; }
  .itz-title{ font-size:24px; }
}
@media (prefers-reduced-motion: reduce){
  .itz-auth-card *{ transition:none !important; }
}
