/* ===============================
   Tipografía
   =============================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* Desactiva dark-mode automático */
.genuvi-auth-wrapper { color-scheme: light; }

/* ===============================
   Contenedor principal
   =============================== */
.genuvi-auth-wrapper{
  max-width:520px;
  margin:0 auto;
  padding:20px 20px 16px;
  background:#FFFFFF;
  border:1px solid #E8ECF1;
  border-radius:16px;
  box-shadow:0 2px 8px rgba(0,0,0,0.03);
  color:#000000;
  font-size:14px;
  line-height:1.35;
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}

/* ===============================
   Tabs
   =============================== */
.genuvi-auth-tabs{
  display:flex; gap:8px;
  background:#E8ECF1;
  padding:6px;
  border-radius:999px;
  margin-bottom:16px;
}
.genuvi-tab{
  flex:1; padding:10px 12px;
  border:none; background:transparent; border-radius:999px;
  cursor:pointer; font-weight:700; color:#000000;
}
.genuvi-tab.active{ background:#0894EF; color:#FFFFFF; }

/* ===============================
   Paneles
   =============================== */
.genuvi-pane{ display:none; }
.genuvi-pane.active{ display:block; }

/* ===============================
   Inputs y labels
   =============================== */
.genuvi-auth-wrapper label{
  display:block; font-weight:700; margin:10px 0 6px; color:#000000;
}
.genuvi-auth-wrapper input[type="email"],
.genuvi-auth-wrapper input[type="password"],
.genuvi-auth-wrapper input[type="text"]{
  width:100%; padding:12px 12px;
  border:1px solid #E8ECF1; border-radius:10px;
  background:#FFFFFF; color:#000000; outline:none; appearance:none;
}
.genuvi-auth-wrapper input[type="email"]:focus,
.genuvi-auth-wrapper input[type="password"]:focus,
.genuvi-auth-wrapper input[type="text"]:focus{
  border-color:#0894EF;
  box-shadow:0 0 0 3px rgba(8,148,239,0.15);
}

/* ===============================
   Checkbox
   =============================== */
.genuvi-auth-wrapper .remember{
  display:flex; align-items:center; gap:8px; font-weight:500; margin-top:6px; color:#000000;
}
.genuvi-auth-wrapper .remember input[type="checkbox"]{ accent-color:#0894EF; }

/* ===============================
   Icono de ojo (mostrar/ocultar)
   =============================== */
.pw-field { position:relative; display:inline-block; width:100%; }
.pw-field input { width:100%; padding-right:40px; }

/* Ícono fijo al lado derecho */
.eye-icon{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  background:center/contain no-repeat;
  cursor:pointer;
  opacity:0.7;
}

/* Ojo cerrado (default) */
.eye-icon{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23000000' stroke-width='2' viewBox='0 0 24 24'><path d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8S1 12 1 12z'/><circle cx='12' cy='12' r='3'/></svg>");
}

/* Ojo abierto (al mostrar) */
.eye-icon.showing{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23000000' stroke-width='2' viewBox='0 0 24 24'><path d='M17.94 17.94A10.94 10.94 0 0 1 12 20c-7 0-11-8-11-8a21.77 21.77 0 0 1 5.06-6.06M9.88 9.88A3 3 0 0 0 12 15a3 3 0 0 0 2.12-5.12M1 1l22 22'/></svg>");
  opacity:1;
}

/* ===============================
   Botones
   =============================== */
.genuvi-auth-wrapper .btn-primary{
  display:inline-block; width:100%; padding:12px 14px;
  border:none; border-radius:10px;
  background:#0894EF; color:#FFFFFF; font-weight:800; cursor:pointer; margin-top:14px;
  transition:transform .03s ease-in-out, filter .15s ease, background .15s ease, color .15s ease;
}
.genuvi-auth-wrapper .btn-primary:hover{ background:#DCF0FC; color:#000000; }
.genuvi-auth-wrapper .btn-primary:active{ transform:translateY(1px); }

.genuvi-auth-wrapper .btn-link,
.genuvi-auth-wrapper .forgot{
  display:inline-block; margin-top:10px; background:none; border:none; padding:0;
  color:#0894EF; cursor:pointer; font-weight:700; text-decoration:none;
}

/* ===============================
   Mensajes y texto pequeño
   =============================== */
.genuvi-auth-wrapper .genuvi-msg{ margin-top:10px; min-height:20px; color:#000000; }
.genuvi-auth-wrapper .smallprint{ font-size:12px; color:#000000; margin-top:8px; }
.title-center{ text-align:center; margin:0 0 8px; font-weight:700; }
.muted-center{ text-align:center; color:#000000; opacity:.8; margin:0 0 12px; }

/* ===============================
   Reenviar código
   =============================== */
.resend-wrap{ margin-top:8px; }
#genuvi-resend[disabled]{ opacity:.6; cursor:not-allowed; }

/* ===============================
   OTP (código de 5 dígitos)
   =============================== */
.otp-boxes{ display:flex; gap:8px; justify-content:center; margin:12px 0; }
.otp-boxes .otp{
  width:42px; height:48px; text-align:center; font-size:20px; font-weight:700;
  border:1px solid #E8ECF1; border-radius:10px; background:#FFFFFF; color:#000000;
}
.otp-boxes .otp:focus{ border-color:#0894EF; box-shadow:0 0 0 3px rgba(8,148,239,0.15); }

/* ===============================
   Utilidades
   =============================== */
.genuvi-auth-wrapper .hidden{ display:none !important; }

/* Fix colores autofill */
.genuvi-auth-wrapper input:-webkit-autofill{
  -webkit-box-shadow:0 0 0px 1000px #FFFFFF inset;
          box-shadow:0 0 0px 1000px #FFFFFF inset;
  -webkit-text-fill-color:#000000;
}