/* ZENS — Mi cuenta (acceso / registro). Calca la tarjeta de login.html del handoff. */

/* una sola columna centrada de 460, como el diseno */
.woocommerce-account #customer_login.u-columns { display: block; max-width: 460px; margin: 0 auto; }
.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 { float: none; width: 100%; margin: 0; }

/* el titulo de la pagina sobra en la pantalla de acceso: el propio card lo lleva */
body.woocommerce-account:not(.logged-in) .page-header,
body.woocommerce-account:not(.logged-in) .entry-header { display: none; }

.woocommerce-account #customer_login h2 {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(2.2rem, 5vw, 3rem); line-height: 1.05;
  color: var(--zns-maroon); text-align: center; margin: 0 0 8px;
}
.woocommerce-account .zc-sub {
  text-align: center; color: var(--fg-muted);
  font-family: var(--font-body); font-size: 19px; line-height: 1.6; margin: 0 0 34px;
}

/* ---- boton social (Nextend) = .social-btn del diseno ---- */
.woocommerce-account .nsl-container { margin: 0 0 12px !important; padding: 0 !important; text-align: center; }
.woocommerce-account .nsl-container-buttons { display: block !important; }
.woocommerce-account .nsl-container-buttons a,
.woocommerce-account .nsl-container .nsl-button {
  display: flex !important; align-items: center !important; justify-content: center !important;
  gap: 12px; width: 100% !important; max-width: none !important;
  padding: 14px !important; margin: 0 0 12px !important;
  border-radius: var(--r-pill) !important; border: 1px solid var(--zns-line) !important;
  background: var(--zns-white, #fff) !important; box-shadow: none !important;
  font-family: var(--font-serif) !important; font-size: 16px !important; font-weight: 500 !important;
  color: var(--zns-maroon) !important; text-transform: none !important; letter-spacing: normal !important;
  transition: border-color .25s var(--ease), background .25s var(--ease);
}
.woocommerce-account .nsl-container-buttons a:hover { border-color: var(--zns-maroon) !important; }
.woocommerce-account .nsl-container .nsl-button-label-container {
  font-family: var(--font-serif) !important; font-size: 16px !important;
  color: var(--zns-maroon) !important; margin: 0 !important; padding: 0 !important;
}
.woocommerce-account .nsl-container svg { width: 18px !important; height: 18px !important; }

/* ---- separador "o" ---- */
.woocommerce-account .zc-or { display: flex; align-items: center; gap: 16px; margin: 24px 0; }
.woocommerce-account .zc-or .rule { flex: 1; height: 1px; background: var(--zns-line); }
.woocommerce-account .zc-or span:not(.rule) {
  font-family: var(--font-serif); font-size: 13px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--fg-faint);
}

/* ---- formulario: valores literales del sistema ---- */
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register {
  border: 0; padding: 0; margin: 0; border-radius: 0; background: transparent;
}
.woocommerce-account #customer_login .form-row { margin: 0 0 18px; padding: 0; }
.woocommerce-account #customer_login label {
  display: block; font-family: var(--font-serif); font-size: 14px; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--fg-muted); margin-bottom: 9px;
}
.woocommerce-account #customer_login .woocommerce-Input--text,
.woocommerce-account #customer_login input[type="text"],
.woocommerce-account #customer_login input[type="email"],
.woocommerce-account #customer_login input[type="password"] {
  width: 100%; box-sizing: border-box; background: #fff;
  border: 1px solid var(--zns-line); border-radius: var(--r-sm);
  padding: 13px 15px; font-family: var(--font-body); font-size: 19px;
  color: var(--zns-maroon); line-height: 1.4; height: auto;
}
.woocommerce-account #customer_login input::placeholder { color: var(--zns-mushroom); }
.woocommerce-account #customer_login input:focus { border-color: var(--zns-maroon); outline: none; }
.woocommerce-account #customer_login .password-input { display: block; width: 100%; }

.woocommerce-account #customer_login button[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; width: 100%;
  font-family: var(--font-serif); font-size: 15.5px; font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase;
  padding: 15px 32px; border-radius: var(--r-pill); border: 1px solid transparent;
  background: var(--zns-maroon); color: var(--zns-cream); cursor: pointer;
  transition: background .3s var(--ease); margin-top: 6px; float: none;
}
.woocommerce-account #customer_login button[type="submit"]:hover { background: var(--zns-maroon-90); }

/* recuerdame + enlaces */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
  display: flex; align-items: center; gap: 9px; margin: 0 0 16px;
  font-family: var(--font-body); font-size: 16.5px; color: var(--fg-muted);
  letter-spacing: normal; text-transform: none;
}
.woocommerce-account #customer_login .woocommerce-form-login__rememberme span { font: inherit; }
.woocommerce-account #customer_login .lost_password,
.woocommerce-account .zc-toggle {
  display: block; text-align: center; margin-top: 14px;
  font-family: var(--font-body); font-size: 16px; color: var(--zns-maroon);
}
.woocommerce-account #customer_login .lost_password a { color: var(--zns-maroon); }
.woocommerce-account #customer_login .lost_password a:hover,
.woocommerce-account .zc-toggle:hover { color: var(--zns-red); }
.woocommerce-account .zc-toggle strong { font-weight: 600; }

/* textos legales pequenos */
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p,
.woocommerce-account #customer_login form.register > p:not(.form-row) {
  font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--fg-faint);
}

@media (max-width: 560px) {
  .woocommerce-account #customer_login.u-columns { max-width: none; }
}
/* zwoo.css pisa el boton: recuperamos los valores del sistema */
.woocommerce-account #customer_login form button[type="submit"] {
  font-size: 15.5px !important; letter-spacing: .2em !important;
  padding: 15px 32px !important; line-height: 1.2 !important;
}

/* ---- aire: la pantalla de acceso necesita respirar ---- */
body.woocommerce-account:not(.logged-in) .woocommerce { padding: 88px 20px 96px; }

/* el asterisco de obligatorio no esta en el diseno (ambos campos lo son) */
.woocommerce-account #customer_login .required { display: none; }

/* etiquetas: mismo caracter, algo menos de peso */
.woocommerce-account #customer_login label { font-size: 13px; letter-spacing: .2em; }

@media (max-width: 560px) {
  body.woocommerce-account:not(.logged-in) .woocommerce { padding: 56px 20px 64px; }
}
