/* =============================================================================
   Login - Industrial style
   ============================================================================= */
body{
  margin:0;
  font-family:'Inter','Segoe UI',system-ui,-apple-system,Arial,sans-serif;
  color:#f1f5f9;
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 15% 20%, rgba(242,200,75,.12) 0%, transparent 35%),
    radial-gradient(circle at 85% 80%, rgba(56,189,248,.10) 0%, transparent 40%),
    linear-gradient(180deg,#0b1220 0%, #060912 100%);
  position:relative;
}
body::before{
  content:'';
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:48px 48px;
  pointer-events:none;
  mask:radial-gradient(circle at 50% 50%, #000 0%, transparent 80%);
}
.auth-stage{
  width:100%; max-width:480px;
  padding:24px;
  position:relative;
  z-index:1;
}
.auth-card{
  background:linear-gradient(180deg, rgba(17,24,39,.95) 0%, rgba(11,18,32,.95) 100%);
  border:1px solid #1e293b;
  border-radius:14px;
  padding:34px 32px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.6), 0 0 0 1px rgba(242,200,75,.05) inset;
  position:relative; overflow:hidden;
}
.auth-card::before{
  content:'';
  position:absolute;left:0;top:0;right:0;height:3px;
  background:linear-gradient(90deg, #F2C84B, #1B3D6E, #F2C84B);
}
.auth-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid #1e293b}
.auth-brand .logos{display:flex;align-items:center;justify-content:center;gap:16px;width:100%}
.auth-brand .logos img{height:46px;width:auto;max-width:140px;object-fit:contain}
.auth-brand .divider{width:1px;height:36px;background:#334155;opacity:.7}
.auth-brand .title{font-size:18px;font-weight:700;letter-spacing:.03em}
.auth-brand .sub{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.12em}

.auth-card h1{font-size:14px;margin:0 0 4px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#94a3b8}
.auth-card p.lead{font-size:13px;color:#64748b;margin:0 0 22px}

.field{margin-bottom:14px}
.field label{
  font-size:11px;color:#94a3b8;text-transform:uppercase;letter-spacing:.08em;
  font-weight:600;display:block;margin-bottom:6px;
}
.field .input-wrap{
  position:relative;
  display:flex;align-items:center;
}
.field .input-wrap svg{
  position:absolute;left:13px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;color:#64748b;pointer-events:none;
  transition:color .15s;
}
.field input{
  width:100%;
  background:#0f172a;
  border:1px solid #334155;
  color:#f1f5f9;
  border-radius:8px;
  padding:10px 14px 10px 40px;
  font:inherit;font-size:14px;line-height:1.4;
  transition:all .15s;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.25);
}
.field input::placeholder{color:#64748b;opacity:1}
.field input:hover{border-color:#475569}
.field input:focus{
  outline:none;
  border-color:#F2C84B;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.25), 0 0 0 3px rgba(242,200,75,.18);
  background:#1e293b;
}
.field input:focus + ,
.field .input-wrap:focus-within svg{color:#F2C84B}
/* Autocompletado: que Chrome no rompa el fondo oscuro */
.field input:-webkit-autofill,
.field input:-webkit-autofill:hover,
.field input:-webkit-autofill:focus{
  -webkit-text-fill-color:#f1f5f9;
  -webkit-box-shadow:0 0 0 1000px #0f172a inset;
  caret-color:#f1f5f9;
}

.btn-submit{
  width:100%;
  background:linear-gradient(180deg,#FFD970,#F2C84B);
  color:#0b1220;
  border:1px solid #ea580c;
  font-weight:700;
  letter-spacing:.04em;
  font-size:13px;
  text-transform:uppercase;
  padding:11px 14px;
  border-radius:8px;
  cursor:pointer;
  margin-top:8px;
  transition:filter .15s, transform .04s;
}
.btn-submit:hover{filter:brightness(1.05)}
.btn-submit:active{transform:translateY(1px)}

.auth-foot{
  margin-top:22px;
  display:flex;justify-content:space-between;align-items:center;
  font-size:11px;color:#475569;
}
.auth-foot a{color:#94a3b8;text-decoration:none}
.auth-foot a:hover{color:#F2C84B}

.alert{
  padding:10px 14px;border-radius:8px;
  margin-bottom:14px;font-size:13px;
  border-left:3px solid;
}
.alert--crit{background:rgba(239,68,68,.10);border-color:#ef4444;color:#fecaca}
.alert--ok  {background:rgba(34,197,94,.10);border-color:#22c55e;color:#bbf7d0}
.alert--info{background:rgba(56,189,248,.10);border-color:#38bdf8;color:#bae6fd}

.status-strip{
  position:fixed; bottom:14px; left:50%; transform:translateX(-50%);
  display:flex; gap:18px; padding:6px 14px;
  background:rgba(11,18,32,.6); backdrop-filter:blur(6px);
  border:1px solid #1e293b; border-radius:999px;
  font-size:11px; color:#64748b; letter-spacing:.05em;
}
.status-strip .dot{width:8px;height:8px;border-radius:50%;background:#22c55e;margin-right:6px;display:inline-block}