/* ============================================================
   ArriendosPro — LOGIN SPLIT (autocontenido, estilo familia)
   No depende de app.css: define sus propios tokens y reset.
   ============================================================ */
.auth-page{
  --navy-a:#001f3f; --navy-b:#001529; --navy-c:#003366; --navy-accent:#0074D9; --navy-dark:#0a1628;
  --bg-c:#f4f6f9; --card:#ffffff; --text:#1c2530; --text-2:#4a5568; --text-3:#6b7686; --border:#e3e8ef;
  margin:0; padding:0; box-sizing:border-box;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'DM Sans',sans-serif;
  background:var(--bg-c); color:var(--text);
  display:flex; align-items:center; justify-content:center; min-height:100vh; padding:28px;
}
.auth-page *{box-sizing:border-box;margin:0;padding:0;}
.auth-page input,.auth-page button,.auth-page select{font-family:inherit;}
.auth-page .oculto{display:none !important;}

.auth-shell{
  width:100%; max-width:1150px; background:var(--card); border-radius:20px; overflow:hidden;
  display:flex; box-shadow:0 30px 90px rgba(0,21,41,.22); border:1px solid var(--border);
}

/* Panel izquierdo (marca) */
.auth-brand{flex:1.15; background:linear-gradient(165deg,var(--navy-a) 0%,var(--navy-b) 78%);
  color:#fff; padding:44px 42px; display:flex; flex-direction:column; gap:34px; min-width:0;}
.auth-brand-top{display:flex; align-items:center; gap:12px;}
.auth-logo-ico{font-size:1.9rem; line-height:1;}
.auth-brand-name{font-weight:800; font-size:1.35rem; letter-spacing:.2px;}
.auth-hero{font-size:1.85rem; font-weight:800; line-height:1.22; margin:0 0 12px; letter-spacing:.2px;}
.auth-lede{color:rgba(255,255,255,.62); font-size:.92rem; line-height:1.65; margin:0 0 26px;}
.auth-feats{display:flex; flex-direction:column; gap:18px;}
.auth-feat{display:flex; gap:14px; align-items:flex-start;}
.auth-feat-ic{flex:none; width:44px; height:44px; border-radius:12px;
  background:rgba(0,116,217,.28); border:1px solid rgba(0,116,217,.45);
  display:grid; place-items:center; font-size:17px; color:#7cc4ff;}
.auth-feat-tx b{display:block; font-size:.93rem; margin-bottom:2px; color:#fff; font-weight:700;}
.auth-feat-tx span{display:block; font-size:.8rem; line-height:1.5; color:rgba(255,255,255,.58);}
.auth-trust{display:flex; gap:20px; flex-wrap:wrap; margin-top:auto; padding-top:26px;
  border-top:1px solid rgba(255,255,255,.1);}
.auth-trust span{display:flex; align-items:center; gap:7px; font-size:.74rem; color:rgba(255,255,255,.6);}
.auth-trust i{color:#5cb3ff; font-size:.85rem;}

/* Panel derecho (formulario) */
.auth-form-wrap{flex:1; display:flex; align-items:center; justify-content:center; padding:46px 40px; min-width:0;}
.auth-form-card{width:100%; max-width:430px;}
.auth-form-top{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:22px;}
.auth-form-logo{display:none; align-items:center; gap:8px; font-weight:800; font-size:1.2rem; color:var(--navy-a);}
.auth-welcome{font-size:1.5rem; font-weight:800; color:var(--navy-a); margin:0 0 4px;}
.auth-sub{color:var(--text-3); font-size:.9rem; margin-bottom:26px; line-height:1.5;}
.auth-field{margin-bottom:16px;}
.auth-field label{display:block; font-size:.74rem; font-weight:600; color:var(--text-2);
  text-transform:uppercase; letter-spacing:1px; margin-bottom:7px;}
.auth-input-wrap{position:relative;}
.auth-input-wrap > i{position:absolute; left:13px; top:50%; transform:translateY(-50%);
  color:var(--text-3); font-size:.9rem; pointer-events:none;}
.auth-input{width:100%; padding:12px 14px 12px 38px; border-radius:10px;
  border:1.5px solid #cfd6e0; background:#fff; color:var(--text); font-size:.95rem; outline:none;
  transition:border-color .2s, box-shadow .2s;}
.auth-input:focus{border-color:var(--navy-accent); box-shadow:0 0 0 3px rgba(0,116,217,.12);}
.auth-input::placeholder{color:#9aa3b2; opacity:.75;}
.auth-help{display:block; font-size:.74rem; color:var(--text-3); margin-top:6px;}
.auth-eye{position:absolute; right:8px; top:50%; transform:translateY(-50%);
  background:none; border:none; color:var(--text-3); cursor:pointer; padding:6px; font-size:.95rem;}
.auth-eye:hover{color:var(--navy-accent);}
.auth-alert{padding:11px 14px; border-radius:9px; font-size:.84rem; margin-bottom:18px;
  display:block; line-height:1.5;}
.auth-alert.err{background:#fde8e8; color:#a51818; border:1px solid #f5b5b5;}
.auth-btn{width:100%; padding:14px; border-radius:11px; margin-top:6px;
  background:linear-gradient(135deg,var(--navy-accent),#0a84ef); color:#fff; font-weight:800; font-size:.95rem;
  border:none; cursor:pointer; letter-spacing:.3px; box-shadow:0 10px 26px rgba(0,116,217,.38); transition:.25s;}
.auth-btn:hover{transform:translateY(-2px); box-shadow:0 14px 34px rgba(0,116,217,.5);}
.auth-btn:disabled{opacity:.55; cursor:not-allowed; transform:none;}
.auth-footer{margin-top:22px; padding-top:18px; border-top:1px solid #eef1f5;
  display:flex; flex-direction:column; align-items:center; gap:12px;}
.auth-admin-link{color:var(--navy-accent); text-decoration:none; font-size:.86rem; font-weight:600;}
.auth-admin-link:hover{text-decoration:underline;}
.auth-copy{font-size:.74rem; color:var(--text-3); display:flex; gap:12px;}
.auth-copy a{color:var(--text-3); text-decoration:none;}
.auth-copy a:hover{color:var(--navy-accent);}

@media (max-width:1020px){
  .auth-brand{display:none;}
  .auth-shell{max-width:470px;}
  .auth-form-wrap{padding:38px 26px;}
  .auth-form-logo{display:flex;}
}
@media (max-width:480px){
  .auth-page{padding:14px;}
  .auth-form-wrap{padding:28px 18px;}
}