/* =========================================================================
   Mi Cuenta — Acceder / Registrarse (login + registro de WooCommerce)
   Marca Spilltek: azul marino #1d386f, verde #16a13d.
   Se encola solo en is_account_page() desde theme-woocommerce.php.
   Objetivo: contenedor centrado con aire (que no toque los bordes) y un
   estilo más cuidado de tarjetas, inputs, botones y enlaces.
   ========================================================================= */

/* --- Contenedor centrado: el área de cuenta deja de tocar los bordes ----- */
.woocommerce-account .entry-content > .woocommerce {
	max-width: 1080px;
	margin: 44px auto 72px;
	padding: 0 24px;
	box-sizing: border-box;
}

/* --- Dos columnas (login | registro) parejas y separadas ----------------- */
.woocommerce-account #customer_login.col2-set {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	width: 100%;
	margin: 0;
}
/* WooCommerce añade ::before/::after de clearfix al .col2-set. En display:grid
   esos pseudos se convierten en CELDAS y descolocan las columnas (login
   arriba-derecha, registro abajo-izquierda, en diagonal). Se eliminan para que
   solo queden las 2 columnas reales (.col-1 y .col-2) una al lado de la otra. */
.woocommerce-account #customer_login.col2-set::before,
.woocommerce-account #customer_login.col2-set::after {
	content: none;
	display: none;
}
.woocommerce-account #customer_login .col-1,
.woocommerce-account #customer_login .col-2 {
	width: 100%;
	float: none;       /* WC usa float por defecto */
	margin: 0;
}

/* --- Títulos "Acceder" / "Registrarse" ----------------------------------- */
.woocommerce-account #customer_login h2 {
	font-size: 26px;
	font-weight: 800;
	color: #1d386f;
	margin: 0 0 16px;
	line-height: 1.2;
}

/* --- Tarjetas de formulario ---------------------------------------------- */
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register {
	border: 1px solid #e4e8ef;
	border-radius: 14px;
	padding: 28px 28px 30px;
	margin: 0;
	background: #fff;
	box-shadow: 0 6px 24px rgba(15, 23, 42, 0.06);
}

/* --- Labels e inputs ----------------------------------------------------- */
.woocommerce-account #customer_login .form-row label {
	display: block;
	font-weight: 600;
	color: #1f2a3a;
	margin-bottom: 6px;
}
.woocommerce-account #customer_login .input-text {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px;
	border: 1px solid #cdd5e0;
	border-radius: 9px;
	background: #f8fafc;
	font-size: 15px;
	color: #1f2a3a;
	transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.woocommerce-account #customer_login .input-text:focus {
	border-color: #1d386f;
	box-shadow: 0 0 0 3px rgba(29, 56, 111, .12);
	background: #fff;
	outline: none;
}

/* Mostrar/ocultar contraseña: que el ojo no pise el borde redondeado */
.woocommerce-account #customer_login .woocommerce-password-hint,
.woocommerce-account #customer_login .password-input {
	display: block;
	position: relative;
}
.woocommerce-account #customer_login .show-password-input {
	top: 14px;
	right: 14px;
}

/* --- Botones (Acceso / Registrarse) en azul marino de marca -------------- */
.woocommerce-account #customer_login form .button,
.woocommerce-account #customer_login form button[type="submit"] {
	background: #1d386f;
	border: 0;
	color: #fff;
	padding: 12px 28px;
	border-radius: 9px;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	cursor: pointer;
	transition: background .2s ease, transform .15s ease;
}
.woocommerce-account #customer_login form .button:hover,
.woocommerce-account #customer_login form button[type="submit"]:hover {
	background: #16294f;
	color: #fff;
}
.woocommerce-account #customer_login form .button:active,
.woocommerce-account #customer_login form button[type="submit"]:active {
	transform: translateY(1px);
}

/* --- "Recuérdame": alinear casilla + texto ------------------------------- */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 4px 0 0;
	font-size: 14px;
	color: #5b6470;
}
.woocommerce-account #customer_login .woocommerce-form-login__submit {
	margin-right: 14px;
}

/* --- Enlaces (¿Olvidaste la contraseña?, política de privacidad) en verde - */
.woocommerce-account #customer_login a {
	color: #16a13d;
	text-decoration: none;
	font-weight: 600;
}
.woocommerce-account #customer_login a:hover {
	color: #128a34;
	text-decoration: underline;
}
.woocommerce-account #customer_login .woocommerce-LostPassword {
	margin: 16px 0 0;
}

/* --- Texto informativo / política de privacidad -------------------------- */
.woocommerce-account #customer_login .col-2 > p,
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p {
	color: #5b6470;
	font-size: 14px;
	line-height: 1.6;
}

/* --- Responsive: una sola columna en tablet/móvil ------------------------ */
@media (max-width: 768px) {
	.woocommerce-account .entry-content > .woocommerce {
		margin: 28px auto 48px;
		padding: 0 16px;
	}
	.woocommerce-account #customer_login.col2-set {
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.woocommerce-account #customer_login form.login,
	.woocommerce-account #customer_login form.register {
		padding: 22px 20px 24px;
	}
}
