﻿/* =====================================================================
   QWOOD â€” AUTH (Mi cuenta) CSS EXTERNO Â· PRO
   Archivo: qwood-auth-login-register.css
   VersiÃ³n: 2026-02-06 Â· FIX Flicker + Fix botÃ³n registro + inputs
   Scope: body.qw-auth-custom (solo /mi-cuenta cuando NO logueado)
   ===================================================================== */

/* -----------------------------
   0) TOKENS
------------------------------ */
/* Tokens heredados de design-system.css (SSOT).
   Solo aliases locales del auth. */
body.qw-auth-custom .qw-auth-wrapper{
  --qw-font-sans: var(--qwood-font-sans, "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
  --qw-color-primary: var(--qwood-color-primary, #1bcf17);
  --qw-color-primary-dark: var(--qwood-color-primary-dark, #1bcf17);
  --qw-color-primary-soft: var(--qwood-color-primary-soft, rgba(27,207,23,.12));
  --qw-color-ring: var(--qwood-color-primary-ring, rgba(27,207,23,.22));
  --qw-bg: var(--qwood-color-bg, #ffffff);
  --qw-card: var(--qwood-color-card-bg, #ffffff);
  --qw-text: var(--qwood-color-text, #0f172a);
  --qw-muted: var(--qwood-color-muted, rgba(15,23,42,.68));
  /* 2026-05-09: alineado con home/wizard â€” borde gris transparente, sombra unificada */
  --qw-border: transparent;
  --qw-border-2: transparent;
  --qw-radius-lg: var(--qwood-radius-lg, 22px);
  --qw-radius-md: var(--qwood-radius-md, 16px);
  --qw-shadow: 0 12px 28px -10px rgba(15,23,42,.26), 0 4px 10px -4px rgba(15,23,42,.16);
  --qw-shadow-soft: 0 6px 16px -6px rgba(15,23,42,.22), 0 2px 6px -2px rgba(15,23,42,.14);
  --qw-focus: var(--qwood-ring-strong, 0 0 0 4px rgba(27,207,23,.28));
  --qw-gap: 16px;
}

/* -----------------------------
   1) SCOPE + RESET
------------------------------ */
body.qw-auth-custom{
  background: var(--qw-bg);
  font-family: var(--qw-font-sans);
}

body.qw-auth-custom .woocommerce,
body.qw-auth-custom .entry-content{
  width: 100%;
}

body.qw-auth-custom .qw-auth-wrapper,
body.qw-auth-custom .qw-auth-wrapper *,
body.qw-auth-custom .qw-auth-wrapper *::before,
body.qw-auth-custom .qw-auth-wrapper *::after{
  box-sizing: border-box;
}

body.qw-auth-custom .qw-auth-wrapper{
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 26px 16px 52px;
}

/* Oculta el layout nativo (evita â€œdoble columnaâ€ nativa) */
body.qw-auth-custom #customer_login,
body.qw-auth-custom .woocommerce .u-columns,
body.qw-auth-custom .woocommerce .col2-set{
  display:none !important;
}

/* -----------------------------
   2) CABECERA / TABS
------------------------------ */
body.qw-auth-custom .qw-auth-tabs{
  display:flex;
  gap: 12px;
  align-items: stretch;
  justify-content: center;
  margin: 8px auto 18px;
  max-width: 860px;
}

body.qw-auth-custom .qw-auth-tab{
  flex: 1 1 0;
  border: 1px solid var(--qw-border);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(6px);
  border-radius: 999px;
  padding: 12px 16px;
  min-height: 46px;
  font-weight: 800;
  letter-spacing: .2px;
  cursor:pointer;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, border-color .14s ease;
}

body.qw-auth-custom .qw-auth-tab:hover{
  transform: translateY(-1px);
  box-shadow: var(--qw-shadow-soft);
}

body.qw-auth-custom .qw-auth-tab.is-active{
  background: var(--qw-color-primary);
  color: #fff;
  border-color: rgba(27,207,23,.55);
  box-shadow: 0 16px 40px rgba(27,207,23,.18);
}

/* -----------------------------
   3) GRID + CARDS (anti-flicker)
------------------------------ */
body.qw-auth-custom .qw-auth-grid{
  position: relative;

  /* Importante: evita saltos y â€œtitileoâ€ */
  display: grid;
  grid-template-columns: 1fr;

  /* Deja aire para CTAs y evita cortes por borde inferior */
  padding-bottom: 26px;

  /* Evita que renders externos reflow/paint afecten */
  /* contain:paint eliminado (clipaba el boton secundario) */
  overflow: visible; /* clave: que no corte el botÃ³n */
}

/* Card â€œpanelâ€ */
body.qw-auth-custom .qw-auth-card{
  position: relative;
  grid-area: 1 / 1;
  width: 100%;
  /* FIX 2026-07-15 (card descentrado): grid item con min-width:auto no encogia por debajo del
     min-content de su contenido en viewports estrechos -> el card se desbordaba a la derecha de su
     pista 1fr y quedaba descentrado. min-width:0 permite que width:100% + margin:0 auto lo centren. */
  min-width: 0;

  /* Layout */
  max-width: 860px;
  margin: 0 auto;
  border-radius: var(--qw-radius-lg);
  background: rgba(255,255,255,.92);
  border: 1px solid var(--qw-border-2);
  box-shadow: var(--qw-shadow);
  padding: 28px 28px 28px;

  /* Evita que el botÃ³n se corte (no overflow hidden) */
  overflow: visible;

  /* TransiciÃ³n suave para alternar paneles SIN display:none */
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear;
  /* will-change eliminado: solo 2 cards max, trivial para el browser. */
}

body.qw-auth-custom .qw-auth-card.is-hidden{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear .16s;
}

@media (prefers-reduced-motion: reduce){
  body.qw-auth-custom .qw-auth-card,
  body.qw-auth-custom .qw-auth-card.is-hidden{
    transition: none !important;
    transform: none !important;
  }
}

/* TÃ­tulo */
body.qw-auth-custom .qw-auth-card h2{
  margin: 0 0 18px;
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.05;
  letter-spacing: -.6px;
  color: var(--qw-color-primary);
  font-weight: 900;
}

body.qw-auth-custom .qw-auth-subtitle{
  margin: -10px 0 18px;
  color: var(--qw-muted);
}

/* -----------------------------
   4) FORM LAYOUT
------------------------------ */
body.qw-auth-custom .qw-form{
  display: grid;
  gap: 14px;
}

body.qw-auth-custom .qw-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 720px){
  body.qw-auth-custom .qw-row{
    grid-template-columns: 1fr;
  }
}

/* Labels */
body.qw-auth-custom .qw-field label{
  display:block;
  font-weight: 800;
  color: rgba(17,24,39,.95);
  margin: 0 0 8px;
}

body.qw-auth-custom .qw-field label .required{
  color: #e11d48;
  margin-left: 4px;
}

/* Inputs / selects */
body.qw-auth-custom .qw-auth-wrapper input[type="text"],
body.qw-auth-custom .qw-auth-wrapper input[type="email"],
body.qw-auth-custom .qw-auth-wrapper input[type="password"],
body.qw-auth-custom .qw-auth-wrapper input[type="tel"],
body.qw-auth-custom .qw-auth-wrapper select{
  width: 100%;
  max-width: 100%;
  appearance: none;
  border-radius: var(--qw-radius-md);
  border: 1px solid rgba(15,23,42,.10);
  background: #ffffff;
  padding: 13px 14px;
  font-size: 16px;
  color: var(--qw-text);
  outline: none;
  transition: box-shadow .14s ease, border-color .14s ease, transform .14s ease;
}

body.qw-auth-custom .qw-auth-wrapper select{
  padding-right: 46px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--qw-color-primary) 50%),
    linear-gradient(135deg, var(--qw-color-primary) 50%, transparent 50%),
    linear-gradient(to right, transparent, transparent);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%,
    0 0;
  background-size: 6px 6px, 6px 6px, 100% 100%;
  background-repeat: no-repeat;
}

body.qw-auth-custom .qw-auth-wrapper input:focus,
body.qw-auth-custom .qw-auth-wrapper select:focus{
  border-color: rgba(27,207,23,.55);
  box-shadow: var(--qw-focus);
}

/* -----------------------------
   5) PASSWORD: â€œojoâ€ / toggle
------------------------------ */
body.qw-auth-custom .password-input,
body.qw-auth-custom .woocommerce form .password-input{
  position: relative;
  display:block;
  width: 100%;
  max-width: 100%;
}

/* Espacio para el ojo */
body.qw-auth-custom .password-input input[type="password"],
body.qw-auth-custom .password-input input[type="text"]{
  padding-right: 54px;
}

/* Toggle tÃ­pico Woo: span.show-password-input */
body.qw-auth-custom .show-password-input{
  position: absolute !important;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index: 2;
  color: rgba(15,23,42,.65);
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.9);
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

body.qw-auth-custom .show-password-input:hover{
  transform: translateY(-50%) scale(1.03);
  border-color: rgba(27,207,23,.35);
  box-shadow: 0 10px 20px rgba(2,6,23,.08);
}

/* Radios â€œDefinir / Generarâ€ */
body.qw-auth-custom .qw-pass-mode{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items:center;
  margin: 6px 0 8px;
}
body.qw-auth-custom .qw-pass-mode label{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  margin:0;
  line-height: 1.2;
  font-weight: 800;
}
body.qw-auth-custom .qw-pass-mode input[type="radio"]{
  transform: translateY(1px);
}

/* -----------------------------
   6) TURNSTILE
------------------------------ */
body.qw-auth-custom .qw-turnstile-wrap{
  display:block;
  margin: 12px 0 4px;
  max-width: 100%;
  overflow: hidden;
}
/* Turnstile iframe responsive: escalar si el contenedor es mÃ¡s estrecho que el widget */
body.qw-auth-custom .qw-turnstile-wrap iframe,
body.qw-auth-custom .cf-turnstile iframe,
body.qw-auth-custom .cf-turnstile {
  max-width: 100%;
}
@media (max-width: 360px) {
  body.qw-auth-custom .qw-turnstile-wrap,
  body.qw-auth-custom .cf-turnstile {
    transform: scale(0.9);
    transform-origin: left top;
  }
}

/* -----------------------------
   7) CHECKS + LINKS
------------------------------ */
body.qw-auth-custom .qw-checkline{
  display:flex;
  gap: 10px;
  align-items:center;
  margin-top: 4px;
  color: rgba(15,23,42,.82);
  font-weight: 700;
}

body.qw-auth-custom .qw-auth-wrapper a{
  color: var(--qw-color-primary-dark);
  text-decoration: none;
  font-weight: 800;
}
body.qw-auth-custom .qw-auth-wrapper a:hover{
  text-decoration: underline;
}

/* -----------------------------
   8) CTA BUTTONS (evitar â€œcorteâ€)
------------------------------ */
body.qw-auth-custom .qw-auth-actions{
  margin-top: 14px;
  display:flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 8px; /* aire extra para que nunca â€œtoqueâ€ el borde */
}

body.qw-auth-custom .qw-btn{
  width: 100%;
  max-width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 14px 16px;
  font-weight: 900;
  letter-spacing: .2px;
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
}

body.qw-auth-custom .qw-btn--primary{
  background: #1bcf17;
  color: #fff;
  box-shadow: 0 16px 34px rgba(27,207,23,.16);
}

body.qw-auth-custom .qw-btn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(27,207,23,.20);
}

body.qw-auth-custom .qw-btn--ghost{
  background: rgba(255,255,255,.75);
  color: var(--qw-color-primary-dark);
  border: 1px solid rgba(27,207,23,.28);
}

body.qw-auth-custom .qw-btn--ghost:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(2,6,23,.08);
}

/* Fix tÃ­pico: inputs submit/button de Woo dentro del scope */
body.qw-auth-custom .qw-auth-wrapper button,
body.qw-auth-custom .qw-auth-wrapper .button,
body.qw-auth-custom .qw-auth-wrapper input[type="submit"]{
  max-width: 100%;
}

/* -----------------------------
   9) HELPERS / ALERTS
------------------------------ */
body.qw-auth-custom .qw-note{
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(27,207,23,.20);
  background: rgba(27,207,23,.06);
  color: rgba(15,23,42,.86);
  font-weight: 700;
}

/* Honeypot: siempre fuera */
body.qw-auth-custom .qw-hp-field{
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* -----------------------------
   10) RESPONSIVE TWEAKS
------------------------------ */
@media (max-width: 980px){
  body.qw-auth-custom .qw-auth-card{
    padding: 24px 18px 24px;
  }
}

@media (max-width: 520px){
  body.qw-auth-custom .qw-auth-grid{
    /* min-height fijo eliminado: el grid abraza el card activo */
  }
}





/* =====================================================================
   QWOOD â€” MI CUENTA Â· RESET PASSWORD (Woo) Â· PATCH UNIFICADO
   - Inputs password estables (no â€œpÃ­ldora verdeâ€)
   - Toggle â€œojoâ€ pequeÃ±o dentro del campo
   - Strength + hint siempre debajo (no a la derecha) + no rompe anchuras
   - BotÃ³n Guardar verde QWOOD + disabled elegante
   ===================================================================== */

.woocommerce-account .woocommerce form.woocommerce-ResetPassword{
  gap: 18px 22px !important; /* si tu form estÃ¡ en grid, no molesta; si no, se ignora */
}

.woocommerce-account form.woocommerce-ResetPassword > p:first-child{
  margin-bottom: 22px !important;
  font-size: 20px !important;
  font-weight: 950 !important;
}

/* ---------------------------------------------------------------------
   1) ESTRUCTURA ESTABLE (evita cambios de ancho / apila contenido)
--------------------------------------------------------------------- */
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-form-row{
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* Wrapper Woo del password */
.woocommerce-account form.woocommerce-ResetPassword .password-input{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* ---------------------------------------------------------------------
   2) INPUTS (siempre blancos, 100%, con padding para el ojo)
--------------------------------------------------------------------- */
.woocommerce-account form.woocommerce-ResetPassword .password-input input[type="password"],
.woocommerce-account form.woocommerce-ResetPassword .password-input input[type="text"],
.woocommerce-account form.woocommerce-ResetPassword input[type="password"],
.woocommerce-account form.woocommerce-ResetPassword input[type="text"]{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  height: 52px !important;

  border-radius: 14px !important;
  border: none !important;
  background: #fff !important;
  color: #0b1220 !important;

  padding: 0 48px 0 14px !important; /* espacio para el ojo */
  box-shadow:
    0 6px 16px -6px rgba(15,23,42,.22),
    0 2px 6px -2px rgba(15,23,42,.14) !important;
}

/* ---------------------------------------------------------------------
   3) TOGGLE â€œOJOâ€ (botÃ³n pequeÃ±o, neutro)
--------------------------------------------------------------------- */
.woocommerce-account form.woocommerce-ResetPassword .show-password-input,
.woocommerce-account form.woocommerce-ResetPassword button.show-password-input{
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  transform: translateY(-50%) !important;

  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;

  border-radius: 10px !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  background: #fff !important;

  box-shadow: 0 10px 24px rgba(2,6,23,.06) !important;
  cursor: pointer;
}

.woocommerce-account form.woocommerce-ResetPassword .show-password-input::after{
  color: rgba(15,23,42,.65) !important;
  font-size: 16px !important;
  line-height: 34px !important;
}

.woocommerce-account form.woocommerce-ResetPassword .show-password-input:hover{
  box-shadow: 0 14px 30px rgba(2,6,23,.10) !important;
}

.woocommerce-account form.woocommerce-ResetPassword .show-password-input:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(27,207,23,.14), 0 14px 30px rgba(2,6,23,.10) !important;
  border-color: rgba(27,207,23,.45) !important;
}

/* ---------------------------------------------------------------------
   4) PASSWORD STRENGTH + HINT (siempre debajo, no rompe layout)
--------------------------------------------------------------------- */
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength,
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-hint{
  display: block !important;
  float: none !important;
  clear: both !important;

  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  box-sizing: border-box !important;
  overflow-wrap: anywhere;

  margin: 10px 0 0 !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  line-height: 1.25 !important;
}

/* strength alineado a la izquierda */
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength{
  text-align: left !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}

/* hint mÃ¡s discreto (sin caja) */
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-hint{
  padding: 8px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  margin-top: 6px !important;

  color: rgba(15,23,42,.70) !important;
  font-weight: 650 !important;
  font-size: 12.5px !important;
}

/* Colores del strength por estado */
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength.short,
.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength.bad{
  background: rgba(239,68,68,.10) !important;
  color: #b91c1c !important;
  border: 1px solid rgba(239,68,68,.25) !important;
}

.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength.good{
  background: rgba(245,158,11,.12) !important;
  color: #92400e !important;
  border: 1px solid rgba(245,158,11,.28) !important;
}

.woocommerce-account form.woocommerce-ResetPassword .woocommerce-password-strength.strong{
  background: rgba(27,207,23,.12) !important;
  color: #1bcf17 !important;
  border: 1px solid rgba(27,207,23,.28) !important;
}

/* ---------------------------------------------------------------------
   5) CTA: Guardar (verde QWOOD) + disabled elegante
--------------------------------------------------------------------- */
.woocommerce-account form.woocommerce-ResetPassword button[type="submit"]{
  background: #1bcf17 !important;
  color: #fff !important;
}

.woocommerce-account form.woocommerce-ResetPassword button[disabled],
.woocommerce-account form.woocommerce-ResetPassword button:disabled{
  opacity: .55 !important;
  filter: grayscale(.1);
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ---------------------------------------------------------------------
   6) DESKTOP: si el form estÃ¡ en grid, evita â€œempujesâ€
   (y opcionalmente permite que strength/hint crucen todo)
--------------------------------------------------------------------- */
@media (min-width: 860px){
  .woocommerce-account .woocommerce form.woocommerce-ResetPassword .woocommerce-form-row{
    width: 100% !important;
    min-width: 0 !important;
  }

  .woocommerce-account .woocommerce form.woocommerce-ResetPassword .woocommerce-password-strength,
  .woocommerce-account .woocommerce form.woocommerce-ResetPassword .woocommerce-password-hint{
    grid-column: 1 / -1;
  }
}
/* ==========================================================
   QWOOD â€” Reset password: evitar â€œsaltosâ€ por strength meter
   Scope: /mi-cuenta/lost-password/ (Woo ResetPassword)
   ========================================================== */

/* 1) Contenedor estable (no cambia ancho) */
.woocommerce form.woocommerce-ResetPassword{
  width: min(720px, calc(100% - 32px));
  margin: 0 auto;
}

/* 2) Inputs siempre full width estable */
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row input[type="password"]{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

/* 3) Reservar espacio fijo bajo el primer campo (password_1)
      para el meter + hint y asÃ­ NO empuja el layout */
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:has(input[name="password_1"]){
  position: relative;
  padding-bottom: 86px; /* reserva para strength + hint (ajusta si quieres) */
}

/* Fallback si el navegador no soporta :has()
   (la mayorÃ­a modernos ya lo soportan; esto cubre lo demÃ¡s) */
@supports not selector(:has(*)){
  .woocommerce form.woocommerce-ResetPassword input[name="password_1"]{
    display: block;
  }
  .woocommerce form.woocommerce-ResetPassword input[name="password_1"]{
    /* nada */
  }
  .woocommerce form.woocommerce-ResetPassword input[name="password_1"]{
    /* nada */
  }
  .woocommerce form.woocommerce-ResetPassword input[name="password_1"]{
    /* nada */
  }
  .woocommerce form.woocommerce-ResetPassword input[name="password_1"]{
    /* nada */
  }
  /* Apunta al form-row padre tÃ­pico de Woo */
  .woocommerce form.woocommerce-ResetPassword .woocommerce-form-row.form-row{
    /* no tocamos todos */
  }
  .woocommerce form.woocommerce-ResetPassword .woocommerce-form-row.form-row.woocommerce-form-row--wide{
    /* no tocamos todos */
  }
  .woocommerce form.woocommerce-ResetPassword .woocommerce-form-row.form-row:where(.form-row-first,.form-row-wide){
    /* no tocamos todos */
  }
  /* Reserva por aproximaciÃ³n: primer form-row del reset suele ser el password_1 */
  .woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:first-of-type{
    position: relative;
    padding-bottom: 86px;
  }
}

/* 4) Colocar strength/hint en â€œcapaâ€ absoluta dentro del espacio reservado */
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:has(input[name="password_1"]) .woocommerce-password-strength,
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:first-of-type .woocommerce-password-strength{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% - 74px); /* dentro del padding reservado */
  margin: 0 !important;
  padding: 10px 12px;
  border-radius: 12px;
  line-height: 1.2;
}

/* Hint debajo del strength, tambiÃ©n absoluto */
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:has(input[name="password_1"]) .woocommerce-password-hint,
.woocommerce form.woocommerce-ResetPassword .woocommerce-form-row:first-of-type .woocommerce-password-hint{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% - 34px);
  margin: 0 !important;
  font-size: 13px;
  line-height: 1.35;
  opacity: .9;
}

/* 5) Que el meter no â€œcrezcaâ€ por textos largos */
.woocommerce form.woocommerce-ResetPassword .woocommerce-password-strength,
.woocommerce form.woocommerce-ResetPassword .woocommerce-password-hint{
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* (Opcional) Si quieres que el hint pueda partir lÃ­neas sin mover nada */
.woocommerce form.woocommerce-ResetPassword .woocommerce-password-hint{
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;  /* mÃ¡ximo 2 lÃ­neas */
  -webkit-box-orient: vertical;
}

/* ---------------------------------------------------------------------
   QWOOD - Auth global refactor 2026-03-11
   Simplifica fondos, tabs y CTA sin tocar el flujo Woo.
--------------------------------------------------------------------- */
body.qw-auth-custom{
  background: var(--qw-bg);
}

body.qw-auth-custom .qw-auth-tab{
  background: #ffffff;
  backdrop-filter: none;
  box-shadow: 0 10px 24px rgba(15,23,42,.05);
}

body.qw-auth-custom .qw-auth-tab.is-active{
  background: #1bcf17;
  border-color: rgba(27,207,23,.52);
  box-shadow: 0 14px 30px rgba(27,207,23,.18);
}

body.qw-auth-custom .qw-auth-wrapper select{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%231bcf17' d='M1.2 1.5a1 1 0 0 1 1.4 0L7 5l4.4-3.5a1 1 0 1 1 1.2 1.6l-5 4a1 1 0 0 1-1.2 0l-5-4a1 1 0 0 1 0-1.6Z'/%3E%3C/svg%3E");
  background-position: right .9rem center;
  background-size: 14px 9px;
  background-repeat: no-repeat;
}

body.qw-auth-custom .qw-btn{
  border-radius: 999px;
}

body.qw-auth-custom .qw-btn--primary{
  background: #1bcf17;
  box-shadow: 0 14px 30px rgba(27,207,23,.18);
}

body.qw-auth-custom .qw-btn--primary:hover{
  background: #1bcf17;
  box-shadow: 0 18px 34px rgba(27,207,23,.22);
}

body.qw-auth-custom .qw-btn--ghost{
  background: #ffffff;
  border-color: rgba(27,207,23,.20);
}

body.qw-auth-custom .qw-note{
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(15,23,42,.06);
}

/* =====================================================================
   QWOOD - Auth CTA alias fix 2026-03-13
   El markup real usa qw-btn-primary/qw-btn-secondary sin el modificador legacy.
   ===================================================================== */
body.qw-auth-custom .qw-auth-wrapper .qw-btn-primary,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-primary{
  background: #1bcf17 !important;
  color: #ffffff !important;
  border: 1px solid rgba(27,207,23,.52) !important;
  box-shadow: 0 14px 30px rgba(27,207,23,.18) !important;
}

body.qw-auth-custom .qw-auth-wrapper .qw-btn-primary:hover,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-primary:hover,
body.qw-auth-custom .qw-auth-wrapper .qw-btn-primary:focus-visible,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-primary:focus-visible{
  background: #1bcf17 !important;
  color: #ffffff !important;
  border-color: rgba(27, 207, 23,.58) !important;
  box-shadow: 0 18px 34px rgba(27,207,23,.22) !important;
}

body.qw-auth-custom .qw-auth-wrapper .qw-btn-secondary,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-secondary{
  background: rgba(255,255,255,.92) !important;
  color: var(--qw-color-primary-dark) !important;
  border: 1px solid rgba(27,207,23,.24) !important;
  box-shadow: 0 12px 26px rgba(2,6,23,.08) !important;
}

body.qw-auth-custom .qw-auth-wrapper .qw-btn-secondary:hover,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-secondary:hover,
body.qw-auth-custom .qw-auth-wrapper .qw-btn-secondary:focus-visible,
body.qw-auth-custom .qw-auth-wrapper .button.qw-btn-secondary:focus-visible{
  background: #ffffff !important;
  color: var(--qw-color-primary-dark) !important;
  border-color: rgba(27,207,23,.34) !important;
  box-shadow: 0 16px 30px rgba(2,6,23,.10) !important;
}

.woocommerce-account form.woocommerce-ResetPassword button[type="submit"]{
  border-radius: 999px !important;
  box-shadow: 0 14px 30px rgba(27,207,23,.18) !important;
}

@media (max-width: 720px){
  body.qw-auth-custom .qw-auth-tabs{
    flex-direction: column;
  }
}

/* ---------------------------------------------------------------------
   QWOOD - Auth submit CTA hardening 2026-03-14
--------------------------------------------------------------------- */
body.qw-auth-custom .qw-auth-wrapper button.qw-btn-primary,
body.qw-auth-custom .qw-auth-wrapper button[type="submit"].qw-btn-primary,
body.qw-auth-custom .qw-auth-wrapper .woocommerce-form-login__submit.qw-btn-primary{
  background:#1bcf17 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border:1px solid rgba(27,207,23,.54) !important;
  box-shadow:0 14px 30px rgba(27,207,23,.18) !important;
}

body.qw-auth-custom .qw-auth-wrapper button.qw-btn-primary:hover,
body.qw-auth-custom .qw-auth-wrapper button[type="submit"].qw-btn-primary:hover,
body.qw-auth-custom .qw-auth-wrapper .woocommerce-form-login__submit.qw-btn-primary:hover,
body.qw-auth-custom .qw-auth-wrapper button.qw-btn-primary:focus-visible,
body.qw-auth-custom .qw-auth-wrapper button[type="submit"].qw-btn-primary:focus-visible,
body.qw-auth-custom .qw-auth-wrapper .woocommerce-form-login__submit.qw-btn-primary:focus-visible{
  background:#1bcf17 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(27, 207, 23,.58) !important;
}
