/* auth.css – estilos compartidos */
body{
  font-family:Arial,Helvetica,sans-serif;
  background:#f4f4f4;
  display:flex;
  align-items:center;
  justify-content:center;
  height:100vh;
  margin:0;
}
.card{
  background:#fff;
  padding:30px 32px;
  border-radius:10px;
  box-shadow:0 0 8px rgba(0,0,0,.1);
  width:350px;
}
h1,h2{margin:0 0 22px;text-align:center;font-size:1.4rem}
label{display:block;margin-top:14px;font-size:.9rem}
input[type=email],
input[type=password],
input[type=text]{
  width:100%;
  padding:9px;
  border:1px solid #ccc;
  border-radius:6px;
  font-size:.95rem;
}
button{
  width:100%;
  margin-top:24px;
  padding:11px;
  border:0;
  background:#0069d9;
  color:#fff;
  border-radius:6px;
  font-weight:bold;
  cursor:pointer;
}
button:hover{background:#0053b1}
.msg{
  font-size:.9rem;
  text-align:center;
  margin:12px 0 0;
}
.msg.danger{color:#c00}
.msg.success{color:#28a745}
.msg.aviso {
  font-size: 1.1em;
  text-align: center;
  color: #d39e00; /* mismo color que .warning */
}
.msg.warning{color:#d39e00}
a{color:#0069d9;text-decoration:none}
a:hover{ text-decoration:underline }
.eye{
  position:absolute;
  right:12px;
  top:36px;
  cursor:pointer;
  font-size:1.1rem;
  color:#666;
}
/* estilos comunes */
body{font-family:Arial,Helvetica,sans-serif;background:#f4f4f4;display:flex;align-items:center;justify-content:center;height:100vh;margin:0}
.card{background:#fff;padding:30px 32px;border-radius:10px;box-shadow:0 0 8px rgba(0,0,0,.1);width:350px}
h1,h2{margin:0 0 22px;text-align:center;font-size:1.4rem}
label{display:block;margin-top:14px;font-size:.9rem}
input[type=email],input[type=password],input[type=text]{width:100%;padding:9px;border:1px solid #ccc;border-radius:6px;font-size:.95rem}
button{width:100%;margin-top:24px;padding:11px;border:0;background:#0069d9;color:#fff;border-radius:6px;font-weight:bold;cursor:pointer}
button:hover{background:#0053b1}
.msg{font-size:.9rem;text-align:center;margin:12px 0}
.msg.danger{color:#c00}.msg.success{color:#28a745}.msg.warning{color:#d39e00}.msg.info{color:#333}
a{color:#0069d9;text-decoration:none}a:hover{text-decoration:underline}

/* ojo */
.input-wrapper{position:relative}
.eye{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:1.15rem;color:#666;cursor:pointer;user-select:none}
.eye.off::after{content:'';position:absolute;left:0;top:50%;width:100%;height:2px;background:#666;transform:rotate(45deg)}