/* Reskin de la página "Mi cuenta" nativa de WooCommerce (login/registro) --
   ver includes/Woocommerce/NativeAccountAuth.php. Clases de WC (.woocommerce-form-*,
   #reg_email, etc.) no se tocan en el template, se reskinean acá con !important
   donde hace falta para pisar el CSS del tema (mismo criterio que el shell del
   panel: vive fuera del theme a propósito). */

body.woocommerce-account {
	background: #f5f6f7;
}

.oxea-auth {
	max-width: 480px;
	margin: 64px auto;
	padding: 0 16px;
}

.oxea-auth__card {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	padding: 40px 36px;
}

.oxea-auth__logo {
	text-align: center;
	margin-bottom: 24px;
}

.oxea-auth__logo img {
	max-height: 40px;
	width: auto;
}

.oxea-auth__logo span {
	font-weight: 700;
	font-size: 1.25rem;
}

.oxea-auth__card h1 {
	text-align: center;
	font-size: 1.6rem;
	margin: 0 0 8px;
}

.oxea-auth__subtitle {
	text-align: center;
	color: #757575;
	margin: 0 0 24px;
}

/* WC arma login+registro como 2 columnas dentro de #customer_login -- acá
   se fuerza 1 sola columna ancha, sea cual sea el grid que traiga el tema. */
.oxea-auth #customer_login.u-columns {
	display: block !important;
}

.oxea-auth #customer_login .u-column1,
.oxea-auth #customer_login .u-column2 {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
}

/* Blocksy le pone gutter/borde a las columnas de .col2-set pensado para
   layout lado a lado (`.ct-woo-unauthorized .col2-set > :first-child/:last-child`,
   ver login-form.scss) -- con 1 sola columna visible ese padding-inline
   queda pegado igual y descentra el form dentro de la card. */
.oxea-auth #customer_login .u-column1,
.oxea-auth #customer_login .u-column2 {
	padding-inline-start: 0 !important;
	padding-inline-end: 0 !important;
	border-inline-end: none !important;
}

/* Default: pantalla de login. body.oxea-auth-register invierte cuál columna
   se ve -- ver NativeAccountAuth::add_body_class(). */
.oxea-auth #customer_login .u-column2 {
	display: none;
}

body.oxea-auth-register .oxea-auth #customer_login .u-column1 {
	display: none;
}

body.oxea-auth-register .oxea-auth #customer_login .u-column2 {
	display: block;
}

.oxea-auth h2 {
	/* Títulos nativos de WC ("Login"/"Register") -- el propio ya lo puso
	   render_card_open() como <h1>. */
	display: none;
}

.oxea-auth .woocommerce-form-row {
	margin: 0 0 16px;
}

.oxea-auth .woocommerce-form-row label:not(.screen-reader-text) {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.oxea-auth .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.oxea-auth input[type="text"],
.oxea-auth input[type="email"],
.oxea-auth input[type="password"] {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 16px;
	border: 1px solid #d5d7da;
	border-radius: 8px;
	font-size: 0.95rem;
}

/* Edge/Chromium agregan su propio ícono de "mostrar contraseña" sobre los
   campos password, superpuesto al botón "Ver" propio (mismo borde derecho) --
   se apaga el nativo para que quede solo el nuestro. */
.oxea-auth input[type="password"]::-ms-reveal,
.oxea-auth input[type="password"]::-ms-clear {
	display: none;
}

/* WooCommerce agregó su propio botón nativo de mostrar/ocultar contraseña
   (<button class="show-password-input"> dentro de <span class="password-input">)
   -- convive con el nuestro y quedan superpuestos. Se apaga el nativo,
   mismo criterio que el ::-ms-reveal de arriba (confirmado en vivo, 2026-09-08). */
.oxea-auth .show-password-input {
	display: none !important;
}

.oxea-auth .oxea-auth__password-checklist {
	margin: 4px 0 16px;
	font-size: 0.85rem;
	color: #757575;
}

.oxea-auth .oxea-auth__password-checklist p {
	font-weight: 600;
	margin: 0 0 6px;
}

.oxea-auth .oxea-auth__password-checklist ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.oxea-auth .oxea-auth__password-checklist li {
	position: relative;
	padding-left: 18px;
	margin-bottom: 4px;
}

.oxea-auth .oxea-auth__password-checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ccc;
}

.oxea-auth .oxea-auth__password-checklist li.is-met {
	color: #3f8626;
}

.oxea-auth .oxea-auth__password-checklist li.is-met::before {
	background: #4a9c2d;
}

.oxea-auth .oxea-auth__terms {
	font-size: 0.85rem;
	color: #444;
}

.oxea-auth .oxea-auth__terms a {
	color: #2271b1;
}

.oxea-auth .woocommerce-form-login__rememberme {
	font-size: 0.9rem;
}

.oxea-auth .woocommerce-Button,
.oxea-auth button[type="submit"] {
	display: block;
	width: 100%;
	padding: 12px;
	border-radius: 999px;
	background: #4a9c2d;
	color: #fff;
	border: none;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
}

.oxea-auth .woocommerce-Button:hover,
.oxea-auth button[type="submit"]:hover {
	background: #3f8626;
}

.oxea-auth .woocommerce-LostPassword {
	text-align: center;
	margin: 12px 0 0;
	font-size: 0.85rem;
}

.oxea-auth__switch {
	text-align: center;
	margin: 20px 0 0;
	font-size: 0.9rem;
}

.oxea-auth [data-oxea-toggle-password] {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	cursor: pointer;
	color: #999;
	font-size: 0.8rem;
}

.oxea-auth .oxea-auth__password-wrap {
	position: relative;
	display: block;
}

.oxea-auth .oxea-auth__password-wrap input {
	padding-right: 56px !important;
}

.oxea-auth .woocommerce-error,
.oxea-auth .woocommerce-message,
.oxea-auth .woocommerce-info {
	list-style: none;
	margin: 0 0 16px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 0.85rem;
}

.oxea-auth .woocommerce-error {
	background: #fdecea;
	color: #a33;
}

.oxea-auth .woocommerce-message,
.oxea-auth .woocommerce-info {
	background: #eef6e9;
	color: #3f8626;
}

.oxea-auth .woocommerce-error li,
.oxea-auth .woocommerce-message li,
.oxea-auth .woocommerce-info li {
	margin: 0;
}