/* public/auth.css
   ═══════════════════════════════════════════════════════════
   Estilos para pantallas de login y registro.
   Reutiliza tokens de styles.css (--g, --t, --br, etc).
   ═══════════════════════════════════════════════════════════ */

.auth-wrap{
  min-height:calc(100vh - 60px);
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--s);
}

/* Lado izquierdo: imagen/branding */
.auth-side{
  position:relative;
  background:#F5F6F6;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 60px;
  border-right:1px solid var(--br);
}
.auth-side-content{
  position:relative;z-index:1;
  text-align:center;
  max-width:380px;
}
.auth-side-eyebrow{
  font-size:9px;letter-spacing:5px;color:var(--g);
  text-transform:uppercase;margin-bottom:18px;
  display:flex;align-items:center;gap:12px;
  justify-content:center;
}
.auth-side-eyebrow::before,
.auth-side-eyebrow::after{
  content:'';width:24px;height:1px;background:var(--g);
}
.auth-side-h{
  font-family:'Cormorant Garamond',serif;
  font-size:46px;font-weight:300;line-height:1.1;
  color:var(--t);margin-bottom:20px;
}
.auth-side-h i{color:var(--g);font-style:italic;}
.auth-side-p{
  font-size:12px;line-height:1.9;color:var(--t3);
  font-weight:300;
}
.auth-side-orb{
  position:absolute;
  width:480px;height:480px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(184,149,42,0.18) 0%, transparent 70%);
  filter:blur(40px);
  z-index:0;
}
.auth-side-orb-1{top:-100px;right:-150px;}
.auth-side-orb-2{bottom:-100px;left:-150px;}

/* Lado derecho: formulario */
.auth-form-side{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:60px 48px;
  background:var(--s);
}
.auth-form{
  width:100%;
  max-width:380px;
}
.auth-eyebrow{
  font-size:9px;letter-spacing:4px;color:var(--g);
  text-transform:uppercase;margin-bottom:14px;
}
.auth-h{
  font-family:'Cormorant Garamond',serif;
  font-size:38px;font-weight:300;line-height:1.1;
  color:var(--t);margin-bottom:8px;
}
.auth-sub{
  font-size:12px;color:var(--t3);
  font-weight:300;margin-bottom:36px;line-height:1.7;
}

/* Campos del formulario */
.field{margin-bottom:20px;}
.field label{
  display:block;
  font-size:9px;letter-spacing:2px;
  color:var(--t3);text-transform:uppercase;
  font-weight:500;margin-bottom:8px;
}
.field label .opt{
  color:var(--t4);font-weight:400;
  letter-spacing:1px;text-transform:none;
}
.field input{
  width:100%;height:42px;
  padding:0 14px;
  background:transparent;
  border:1px solid var(--br);
  font-family:'Montserrat',sans-serif;
  font-size:13px;color:var(--t);
  outline:none;
  transition:border-color .15s;
}
.field input:focus{border-color:var(--g);}
.field input::placeholder{color:var(--t4);font-size:12px;}
.field .field-help{
  font-size:10px;color:var(--t4);
  margin-top:6px;line-height:1.5;
}

/* Mostrar contraseña */
.pwd-wrap{position:relative;}
.pwd-toggle{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  background:transparent;border:none;cursor:pointer;
  color:var(--t4);font-size:12px;letter-spacing:1px;
  text-transform:uppercase;font-family:'Montserrat',sans-serif;
}
.pwd-toggle:hover{color:var(--g);}

/* Botón principal */
.auth-btn{
  width:100%;height:46px;
  background:var(--g);color:#fff;border:none;
  font-family:'Montserrat',sans-serif;
  font-size:10px;letter-spacing:3px;
  text-transform:uppercase;font-weight:600;
  cursor:pointer;
  transition:background .15s;
  margin-top:8px;
}
.auth-btn:hover{background:var(--gh);}
.auth-btn:disabled{
  background:var(--t4);
  cursor:not-allowed;
}

/* Divider y link de cambio (Registrarse / Iniciar sesión) */
.auth-divider{
  display:flex;align-items:center;gap:16px;
  margin:32px 0 20px;
  font-size:9px;letter-spacing:2px;color:var(--t4);
  text-transform:uppercase;
}
.auth-divider::before,
.auth-divider::after{
  content:'';flex:1;height:1px;background:var(--br);
}
.auth-switch{
  text-align:center;
  font-size:12px;color:var(--t3);
  font-weight:300;
}
.auth-switch a{
  color:var(--g);text-decoration:none;
  font-weight:500;letter-spacing:.5px;
}
.auth-switch a:hover{text-decoration:underline;}

/* Mensajes (error / éxito) */
.auth-msg{
  padding:12px 14px;
  margin-bottom:20px;
  font-size:11px;line-height:1.6;
  border-left:2px solid;
  background:var(--s2);
}
.auth-msg.error{
  border-color:#c0392b;
  color:#a93226;
}
.auth-msg.success{
  border-color:#27ae60;
  color:#1e7e3f;
}
body.dark .auth-msg.error{color:#ff8b80;}
body.dark .auth-msg.success{color:#7fd99f;}

/* Footer del formulario: links menores */
.auth-foot{
  text-align:center;
  margin-top:24px;
  font-size:10px;color:var(--t4);
  letter-spacing:1px;
}
.auth-foot a{color:var(--t3);text-decoration:none;}
.auth-foot a:hover{color:var(--g);}

/* Responsive */
@media (max-width:960px){
  .auth-wrap{
    grid-template-columns:1fr;
    min-height:calc(100vh - 60px);
  }
  .auth-side{
    min-height:200px;
    padding:48px 24px;
    border-right:none;
    border-bottom:1px solid var(--br);
  }
  .auth-side-h{font-size:32px;}
  .auth-side-p{font-size:11px;}
  .auth-form-side{padding:40px 24px;}
  .auth-h{font-size:30px;}
}
@media (max-width:560px){
  .auth-side{padding:36px 20px;}
  .auth-side-h{font-size:26px;}
  .auth-form-side{padding:32px 20px;}
}