/**
 * Minha Conta — entrada por e-mail e a segunda etapa do cadastro.
 *
 * Os tokens repetem os do checkout porque esta folha carrega SOZINHA em Minha
 * Conta: o checkout.css não entra aqui, e herdar variável que não existe
 * deixaria a tela sem cor.
 */

.locfit-acc,
.locfit-comp {
	--lc-bg: #ffffff;
	--lc-surface: #f7f8fa;
	--lc-border: #e2e5ea;
	--lc-border-strong: #cbd1da;
	--lc-text: #14181f;
	--lc-muted: #626b7a;
	--lc-brand: #0f7b4f;
	--lc-brand-dark: #0b5f3c;
	--lc-brand-soft: #e8f5ee;
	--lc-danger: #c0392b;
	--lc-radius-sm: 9px;
	--lc-focus: 0 0 0 3px rgba(15, 123, 79, .18);
}

/* ---------------------------------------------------------------
 * Cartão único — em vez de duas colunas de peso igual
 * ------------------------------------------------------------- */

.locfit-acc {
	max-width: 470px;
	margin: 46px auto 64px;
	padding: 38px 34px 34px;
	background: var(--lc-bg);
	border: 1px solid var(--lc-border);
	border-radius: 18px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 34px rgba(16, 24, 40, .08);
	color: var(--lc-text);
	text-align: left;
}

/* O tema centraliza texto em algumas telas de conta; aqui tudo é alinhado à
   esquerda, que é como formulário se lê. */
.locfit-acc p,
.locfit-acc label,
.locfit-acc h2 { text-align: left; }

/* Um fio da cor da marca no topo do cartão. É o único enfeite: dá identidade
   sem competir com o campo, que é a única coisa que a pessoa precisa ver. */
.locfit-acc::before {
	content: "";
	display: block;
	width: 34px;
	height: 3px;
	margin: 0 0 20px;
	border-radius: 99px;
	background: var(--lc-brand);
}

.locfit-acc__passo { display: none; }
.locfit-acc__passo.is-on { display: block; }
.locfit-acc__oculto { display: none !important; }

.locfit-acc__titulo {
	margin: 0 0 6px;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -.01em;
	line-height: 1.25;
	color: var(--lc-text);
	text-transform: none;
}

.locfit-acc__lead {
	margin: 0 0 22px;
	font-size: 14px;
	color: var(--lc-muted);
}

.locfit-acc__lead:empty { display: none; }

.locfit-acc__campo { margin: 0 0 14px; }

.locfit-acc__campo label {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 600;
}

/* 52px: a tela é vazia e pede respiro. 16px de fonte evita o zoom do iOS. */
.locfit-acc input[type="email"],
.locfit-acc input[type="text"],
.locfit-acc input[type="password"] {
	width: 100%;
	height: 52px;
	padding: 0 15px;
	font-size: 16px;
	line-height: 50px;
	color: var(--lc-text);
	background: #fff;
	border: 1px solid var(--lc-border-strong);
	border-radius: var(--lc-radius-sm);
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.locfit-acc input:focus {
	border-color: var(--lc-brand);
	box-shadow: var(--lc-focus);
	outline: none;
}

/* A cor do texto é declarada em todos os estados: o tema repinta botão no
   hover e deixaria o rótulo cinza sobre verde. */
.locfit-acc .locfit-acc__btn,
.locfit-acc .locfit-acc__btn:hover,
.locfit-acc .locfit-acc__btn:focus,
.locfit-acc .locfit-acc__btn:focus-visible,
.locfit-acc .locfit-acc__btn:active,
.locfit-acc button[type="submit"],
.locfit-acc button[type="submit"]:hover,
.locfit-acc button[type="submit"]:focus,
.locfit-acc button[type="submit"]:active {
	color: #fff;
	text-decoration: none;
}

.locfit-acc .locfit-acc__btn,
.locfit-acc button[type="submit"] {
	display: block;
	width: 100%;
	height: 52px;
	margin: 0;
	padding: 0 18px;
	font-size: 16px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	background: var(--lc-brand);
	border: 1px solid var(--lc-brand);
	border-radius: var(--lc-radius-sm);
	cursor: pointer;
	transition: background-color .15s ease;
}

.locfit-acc .locfit-acc__btn:hover,
.locfit-acc button[type="submit"]:hover,
.locfit-acc .locfit-acc__btn:focus-visible {
	background: var(--lc-brand-dark);
	border-color: var(--lc-brand-dark);
}

.locfit-acc .locfit-acc__btn[disabled] { opacity: .6; cursor: default; }

.locfit-acc__volta {
	display: inline-block;
	margin: 0 0 16px;
	padding: 0;
	font-size: 13px;
	color: var(--lc-brand-dark);
	background: none;
	border: 0;
	text-decoration: underline;
	text-transform: none;
	cursor: pointer;
}

.locfit-acc__eco {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 18px;
	padding: 10px 14px;
	font-size: 14px;
	background: var(--lc-surface);
	border: 1px solid var(--lc-border);
	border-radius: var(--lc-radius-sm);
}

.locfit-acc__eco:empty { display: none; }

.locfit-acc__erro {
	display: block;
	margin: 6px 0 0;
	font-size: 12.5px;
	color: var(--lc-danger);
}

.locfit-acc__erro:empty { display: none; }

/* Login social no topo, com um "ou" separando do e-mail. */
.locfit-acc__social { margin: 0 0 4px; }

.locfit-acc__social a,
.locfit-acc__social button,
.locfit-acc__social .nsl-button {
	width: 100%;
	justify-content: center;
}

.locfit-acc__ou {
	position: relative;
	margin: 18px 0;
	text-align: center;
}

.locfit-acc__ou::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	height: 1px;
	background: var(--lc-border);
}

.locfit-acc__ou span {
	position: relative;
	padding: 0 12px;
	background: var(--lc-bg);
	font-size: 12.5px;
	color: var(--lc-muted);
}

/* O formulário nativo entra dentro do cartão: tiramos moldura, título e a
   caixa dupla que o tema desenha. */
.locfit-acc form.woocommerce-form-login,
.locfit-acc form.woocommerce-form-register,
.locfit-acc form.login,
.locfit-acc form.register {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

.locfit-acc form .woocommerce-form__label-for-checkbox {
	font-size: 13px;
	color: var(--lc-muted);
}

.locfit-acc form .lost_password {
	margin: 14px 0 0;
	font-size: 13.5px;
	text-align: center;
}

.locfit-acc form .lost_password a,
.locfit-acc form a.lost_password { color: var(--lc-brand-dark); }

/* ---------------------------------------------------------------
 * O olho de "ver a senha"
 * -------------------------------------------------------------
 * Ele é injetado por JavaScript — não existe no HTML que o servidor
 * entrega —, então não dá para mirar numa classe com segurança. Em vez de
 * adivinhar o nome, ancoramos pelo FORMATO: o alvo é grudado no fim da linha
 * da senha, com a altura do campo. Como o input é o último elemento da linha,
 * ancorar por `bottom` acerta tanto se o botão for irmão do campo quanto se
 * estiver dentro de um invólucro que o JS criou.
 *
 * Em produção ele aparecia como um bloco cinza colado na borda, quebrando o
 * canto arredondado do campo. Aqui vira ícone dentro do campo. */

.locfit-acc .form-row-password,
.locfit-acc .password-input,
.locfit-acc .woocommerce-password-input,
.locfit-acc .wd-password-wrapper {
	position: relative;
	display: block;
	width: 100%;
}

.locfit-acc input[type="password"] {
	padding-right: 52px;
}

.locfit-acc [class*="show-password"],
.locfit-acc [class*="password-toggle"],
.locfit-acc [class*="show_password"] {
	position: absolute;
	right: 1px;
	bottom: 1px;
	top: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 50px;
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0 var(--lc-radius-sm) var(--lc-radius-sm) 0;
	box-shadow: none;
	opacity: .5;
	cursor: pointer;
	transition: opacity .15s ease, background-color .15s ease;
}

.locfit-acc [class*="show-password"]:hover,
.locfit-acc [class*="password-toggle"]:hover {
	opacity: 1;
	background: var(--lc-surface);
}

/* Preenchimento automático do navegador pintava o campo de azul-lilás e ele
   destoava de todos os outros. */
.locfit-acc input:-webkit-autofill,
.locfit-comp input:-webkit-autofill,
.locfit-acc input:-webkit-autofill:focus,
.locfit-comp input:-webkit-autofill:focus {
	-webkit-text-fill-color: var(--lc-text);
	-webkit-box-shadow: 0 0 0 60px #fff inset;
	box-shadow: 0 0 0 60px #fff inset;
}

/* Espaço entre o botão e o que vem depois dele dentro do formulário nativo
   (lembrar de mim, esqueci a senha, política de privacidade). */
.locfit-acc form p { margin: 0 0 14px; }
.locfit-acc form p:last-child { margin-bottom: 0; }
.locfit-acc form .woocommerce-privacy-policy-text p {
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--lc-muted);
}
.locfit-acc form .woocommerce-form-login__rememberme { display: inline-block; margin: 2px 0 12px; }

@media ( max-width: 560px ) {
	.locfit-acc {
		margin: 26px auto 40px;
		padding: 26px 20px 22px;
		border-radius: 14px;
		box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 18px rgba(16, 24, 40, .06);
	}

	.locfit-acc__titulo { font-size: 20px; }
}

/* ---------------------------------------------------------------
 * Segunda etapa — completar o cadastro, sem obrigação
 * ------------------------------------------------------------- */

.locfit-comp {
	margin: 0 0 26px;
	padding: 22px;
	background: var(--lc-bg);
	border: 1px solid var(--lc-border);
	border-radius: 14px;
	color: var(--lc-text);
}

.locfit-comp__titulo {
	margin: 0 0 6px;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.01em;
	text-transform: none;
}

.locfit-comp__lead {
	margin: 0 0 18px;
	font-size: 13.5px;
	color: var(--lc-muted);
}

.locfit-comp__prog {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 20px;
}

.locfit-comp__barra {
	flex: 1;
	height: 6px;
	border-radius: 99px;
	background: var(--lc-border);
	overflow: hidden;
}

.locfit-comp__barra i {
	display: block;
	height: 100%;
	border-radius: 99px;
	background: var(--lc-brand);
	transition: width .3s ease;
}

.locfit-comp__prog b {
	font-size: 12px;
	font-weight: 600;
	color: var(--lc-muted);
	white-space: nowrap;
}

.locfit-comp__linha { display: flex; gap: 12px; }
.locfit-comp__campo { flex: 1 1 0; margin: 0 0 14px; min-width: 0; }

.locfit-comp__campo label {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 600;
}

.locfit-comp input {
	width: 100%;
	height: 48px;
	padding: 0 14px;
	font-size: 16px;
	line-height: 46px;
	color: var(--lc-text);
	background: #fff;
	border: 1px solid var(--lc-border-strong);
	border-radius: var(--lc-radius-sm);
	transition: border-color .15s ease, box-shadow .15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.locfit-comp input:focus {
	border-color: var(--lc-brand);
	box-shadow: var(--lc-focus);
	outline: none;
}

.locfit-comp__erro {
	display: block;
	margin: 5px 0 0;
	font-size: 12.5px;
	color: var(--lc-danger);
}

.locfit-comp__erro:empty { display: none; }

.locfit-comp__cep {
	margin: -4px 0 14px;
	padding: 9px 12px;
	font-size: 12.5px;
	border-radius: 8px;
	display: none;
}

.locfit-comp__cep.is-on,
.locfit-comp__cep.is-ok,
.locfit-comp__cep.is-erro { display: block; }

.locfit-comp__cep.is-on { background: var(--lc-surface); color: var(--lc-muted); border: 1px solid var(--lc-border); }
.locfit-comp__cep.is-ok { background: var(--lc-brand-soft); color: var(--lc-brand-dark); border: 1px solid #b9e0cb; }
.locfit-comp__cep.is-erro { background: #fdecea; color: #8a1c12; border: 1px solid #f5c6c0; }

.locfit-comp__acoes {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 6px 0 0;
}

.locfit-comp .locfit-comp__btn,
.locfit-comp .locfit-comp__btn:hover,
.locfit-comp .locfit-comp__btn:focus,
.locfit-comp .locfit-comp__btn:active {
	color: #fff;
	text-decoration: none;
}

.locfit-comp .locfit-comp__btn {
	min-height: 46px;
	padding: 0 22px;
	font-size: 15px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	background: var(--lc-brand);
	border: 1px solid var(--lc-brand);
	border-radius: var(--lc-radius-sm);
	cursor: pointer;
}

.locfit-comp .locfit-comp__btn:hover { background: var(--lc-brand-dark); border-color: var(--lc-brand-dark); }
.locfit-comp .locfit-comp__btn[disabled] { opacity: .6; cursor: default; }

.locfit-comp__depois {
	padding: 0;
	font-size: 13.5px;
	color: var(--lc-muted);
	background: none;
	border: 0;
	text-decoration: underline;
	text-transform: none;
	cursor: pointer;
}

/* Concluído: o formulário sai de cena e fica uma linha. Ficar tudo aberto
   depois de salvar dava a impressão de que faltava alguma coisa. */
.locfit-comp.is-feito .locfit-comp__form,
.locfit-comp.is-feito .locfit-comp__lead,
.locfit-comp.is-feito .locfit-comp__prog { display: none; }

.locfit-comp.is-feito {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding: 14px 18px;
	background: var(--lc-brand-soft);
	border-color: #b9e0cb;
}

.locfit-comp.is-feito .locfit-comp__titulo {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--lc-brand-dark);
}

.locfit-comp.is-feito .locfit-comp__titulo::before {
	content: "✓";
	margin-right: 8px;
	font-weight: 700;
}

.locfit-comp__editar {
	padding: 0;
	font-size: 13px;
	color: var(--lc-brand-dark);
	background: none;
	border: 0;
	text-decoration: underline;
	text-transform: none;
	cursor: pointer;
}

.locfit-comp:not(.is-feito) .locfit-comp__editar { display: none; }

.locfit-comp__msg { margin: 12px 0 0; font-size: 13px; }
.locfit-comp__msg:empty { display: none; }
.locfit-comp__msg.is-ok { color: var(--lc-brand-dark); }
.locfit-comp__msg.is-erro { color: var(--lc-danger); }

@media ( max-width: 560px ) {
	.locfit-comp__linha { flex-direction: column; gap: 0; }
	.locfit-comp__campo { flex: 1 1 auto !important; }
	.locfit-comp__acoes { flex-direction: column; align-items: stretch; }
	.locfit-comp .locfit-comp__btn { width: 100%; }
}


/* ===================================================================
 * 1.30.0 — A TELA DE ENTRADA DEIXA DE SER UMA ILHA BRANCA
 *
 * O PROBLEMA, MEDIDO EM 01/10/2026
 * A página de Minha Conta deslogada tem três zonas pretas e um buraco:
 * a barra do menu, a faixa `.wd-page-title` (#0A0A0A, 176px, "Minha
 * conta"), e o rodapé (#000). Entre a faixa e o rodapé o fundo volta a
 * branco, e o cartão de 470px flutua nele com 160px de vazio embaixo.
 * O preto começava, parava, e recomeçava.
 *
 * A CORREÇÃO, E POR QUE É UMA DECLARAÇÃO SÓ
 * Nenhum ancestral do cartão pinta fundo: `.wd-registration-page`,
 * `.woocommerce` e os contêineres do Elementor estão todos em
 * `rgba(0,0,0,0)` — o branco vem do próprio body. Pintar o body é
 * suficiente para a faixa escorrer até o rodapé, e não depende de
 * nenhum seletor do Elementor (os IDs `.elementor-element-XXXXXXXX`
 * mudam quando a página é reeditada; amarrar neles seria amarrar em
 * areia).
 *
 * A classe entra pelo `body_class` só para quem NÃO está logado. O
 * painel da conta continua claro.
 * ================================================================= */

/* CORRIGIDO DEPOIS DA MEDIÇÃO NA LOJA (01/10/2026)
 *
 * A primeira tentativa pintava só o `body` e não funcionou, por dois
 * motivos que só a loja mostrou:
 *
 * 1. ESPECIFICIDADE. O tema declara
 *    `body:not([class*="wrapper-boxed"]) { background-color: var(--wd-main-bgcolor) }`
 *    em base.css. Um seletor de atributo dentro de `:not()` conta como
 *    classe, então aquilo é (0,1,1) — exatamente o mesmo peso de
 *    `body.locfit-conta-escura`. Empate se resolve por ordem, e a folha
 *    do tema vem depois. É a MESMA armadilha dos botões cinzas do
 *    Woodmart 8.6.0. Por isso `html body...` aqui: (0,1,2), sem
 *    `!important`.
 *
 * 2. O BRANCO NÃO ERA DO BODY. Minha medição anterior andou só 6 níveis
 *    acima do cartão e parou cedo. Mais acima há dois embrulhos do tema
 *    pintando branco: `.wd-page-wrapper` e `.wd-page-content`, ambos com
 *    `background-color: var(--wd-main-bgcolor)` (0,1,0).
 *
 * ONDE O ESCURO PÁRA, E POR QUÊ
 * Medido na loja: `.wd-page-content` vai de 0 a 1086px e contém a faixa
 * do título (0–177) e a área da conta (177–1086). O bloco de marketing
 * "Aulas e Treinos Online" começa EXATAMENTE em 1086 e está FORA dele.
 *
 * Então pintamos `.wd-page-content`, não `.wd-page-wrapper`: o escuro
 * cobre faixa + login e para sozinho onde o conteúdo de marketing
 * começa. Esse conteúdo foi desenhado para fundo branco — texto em
 * #626B7A e #14181F sobre preto daria 4,4:1 e 1,4:1. Pintar a página
 * inteira teria arruinado tudo que está abaixo da dobra.
 *
 * O `body` continua escuro só para o overscroll (a faixa elástica do
 * topo/rodapé no celular) não piscar branco.
 */

html body.locfit-conta-escura {
	background-color: #0a0a0a;
}

body.locfit-conta-escura .wd-page-content {
	/* Chapado, exatamente o #0A0A0A da faixa `.wd-page-title` logo acima.
	 *
	 * A 1.30.1 tinha dois gradientes radiais aqui, um verde e um amarelo.
	 * Na tela isso virava uma mancha esverdeada que não existe em nenhum
	 * outro lugar da loja e que denunciava onde o bloco escuro começava e
	 * terminava — o contrário do objetivo, que é a faixa do título e a
	 * área da conta parecerem uma coisa só. Sem gradiente, a emenda some.
	 */
	background-color: #0a0a0a;
	background-image: none;
}

/* Sobre o preto, a moldura clara some e a sombra precisa ter o que
   dizer: a de antes (8% de preto) era invisível em fundo escuro. */
body.locfit-conta-escura .locfit-acc {
	border-color: transparent;
	box-shadow: 0 24px 70px rgba( 0, 0, 0, .5 );
}

/* O fio do topo passa a ser o amarelo da marca (#FFCF00, medido no
   cabeçalho da loja). Verde nesta folha é cor de AÇÃO — é o botão
   "Continuar". Um fio verde acima de um botão verde dividia a atenção
   entre um enfeite e a única coisa clicável da tela. */
.locfit-acc::before {
	background: #ffcf00;
	width: 38px;
	height: 4px;
}

/* CABEÇALHO CENTRALIZADO (1.30.0)
 *
 * Título e subtítulo no centro; rótulo, campo e botão continuam à
 * esquerda. Formulário se lê pela borda esquerda — centralizar rótulo
 * faria o olho procurar onde cada linha começa a cada campo. O
 * cabeçalho é a única parte que não é formulário, e centralizado ele
 * para de disputar o canto esquerdo com o rótulo "Seu e-mail".
 *
 * A regra genérica lá em cima (`.locfit-acc h2, .locfit-acc p`) força
 * `text-align: left` para vencer o tema, que centraliza texto em
 * algumas telas de conta. Por isso estas duas precisam ser mais
 * específicas que ela — e são, por causa do `.locfit-acc__passo`.
 */
.locfit-acc .locfit-acc__passo > .locfit-acc__titulo,
.locfit-acc .locfit-acc__passo > .locfit-acc__lead {
	text-align: center;
}

/* O fio da marca também vai para o centro, senão fica um traço solto
   na esquerda acima de um cabeçalho centralizado. */
.locfit-acc::before { margin-left: auto; margin-right: auto; }

.locfit-acc__passo > .locfit-acc__titulo { margin-top: 2px; }

.locfit-acc__passo > .locfit-acc__lead {
	margin-bottom: 24px;
	font-size: 14.5px;
	line-height: 1.5;
}

/* O passo 2 mantém título e subtítulo, e lá eles vêm logo depois do
   botão "trocar e-mail" — sem esta regra o conjunto fica apertado. */
.locfit-acc__passo .locfit-acc__titulo { margin-top: 2px; }

/* O divisor "ou" tem um `span` com fundo opaco para abrir o fio. Em
   cartão branco sobre página escura o branco continua certo — fica
   declarado para não herdar o preto do body por acidente. */
body.locfit-conta-escura .locfit-acc__ou span { background: #fff; }

@media ( max-width: 560px ) {
	/* No celular a faixa do título é mais baixa; o cartão sobe junto. */
	body.locfit-conta-escura .locfit-acc { margin-top: 26px; margin-bottom: 40px; }
}

/* O cartão media 470px na loja porque o Woodmart declara `box-sizing:
   border-box` globalmente — a largura é nossa, a regra que a faz valer
   era do tema. Depender disso já custou caro uma vez (os botões cinzas
   do Woodmart 8.6.0). Declarado aqui, no nosso próprio subárvore. */
.locfit-acc,
.locfit-acc *,
.locfit-comp,
.locfit-comp * { box-sizing: border-box; }

/* ===================================================================
 * 1.30.2 — O PASSO 2 ESTAVA COM TRÊS DEFEITOS
 *
 * Visto na loja em 01/10/2026, depois do e-mail reconhecido.
 * ================================================================= */

/* 1. DOIS DIVISORES EMPILHADOS.
 *
 * O Woodmart imprime dentro do formulário de login um
 * `p.title.wd-login-divider` com "Ou faça o login com". Nós inserimos o
 * nosso `.locfit-acc__ou` logo acima do bloco social. Resultado: duas
 * linhas de "ou" uma embaixo da outra, a de cima em caixa alta.
 *
 * Escondemos a do tema, não a nossa: a nossa é a que fica na posição
 * certa (imediatamente antes do bloco social, mesmo quando o plugin
 * social injeta o markup depois de nós) e a que combina com o divisor
 * do checkout. Só dentro do cartão — fora dele o tema segue intacto.
 */
.locfit-acc .wd-login-divider { display: none !important; }

/* 2. "← TROCAR E-MAIL" VIROU BLOCO CINZA MAIÚSCULO.
 *
 * É a base de botões do Woodmart 8.6.0 de novo:
 * `:is(.btn,.button,button,[type="submit"],[type="button"])` pesa
 * (0,1,0) — o mesmo que `.locfit-acc__volta`. Empate resolvido por
 * ordem, e a folha do tema vem depois. A checkout.css ganhou defesa
 * contra isso na 1.29.2; esta folha não, e por isso o botão apareceu
 * com o cinza #F3F3F3 e o text-transform do tema.
 *
 * A correção é subir a especificidade (0,2,0) e declarar TODAS as
 * propriedades que o tema toca — inclusive em :hover, que o tema
 * repinta.
 */
.locfit-acc .locfit-acc__volta,
.locfit-acc .locfit-acc__volta:hover,
.locfit-acc .locfit-acc__volta:focus,
.locfit-acc .locfit-acc__volta:focus-visible {
	width: auto;
	height: auto;
	min-height: 0;
	padding: 0;
	background-color: transparent;
	background-image: none;
	border: 0;
	border-radius: 0;
	color: var(--lc-brand-dark);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: underline;
	box-shadow: none;
}

/* O BOTÃO DO GOOGLE FICA COMO O TEMA DESENHA — azul, largura cheia.
 *
 * A 1.30.2 tinha transformado ele em botão de contorno branco. Foi
 * intervenção minha, não pedida: o problema relatado era de POSIÇÃO (ele
 * aparecia caído no fim do cartão, empurrado pelos dois divisores
 * empilhados), não de cor. O azul é a identidade do Google e as pessoas
 * reconhecem o botão por ela.
 *
 * O que continua nosso é só a normalização de largura e alinhamento, que
 * já existia antes desta sessão (ver `.locfit-acc__social a` acima).
 * Nada de fundo, borda ou cor de texto aqui.
 */

/* O "Perdeu sua senha?" vinha no amarelo de link do tema, que sobre
   branco dá contraste baixo e ainda briga com o amarelo da marca no
   topo do cartão. */
/* A classe `lost_password` fica NO PRÓPRIO <a>, não num elemento pai —
   conferido no HTML servido pela loja. A folha mirava `.lost_password a`
   desde a primeira versão, ou seja, nunca casou com nada e o link ficou
   esse tempo todo com a cor de link do tema. Os dois formatos agora. */
.locfit-acc form .lost_password a,
.locfit-acc form .lost_password a:hover,
.locfit-acc form a.lost_password,
.locfit-acc form a.lost_password:hover {
	color: var(--lc-muted);
	text-decoration: underline;
}

/* ===================================================================
 * 1.30.3 — O PASSO 2 GANHA O MESMO RITMO DO PASSO 1
 *
 * A 1.30.2 consertou três sintomas (divisor duplicado, botão de voltar
 * cinza, Google azul) sem olhar a composição. O resultado ficou pior:
 * o "trocar e-mail" virou um link minúsculo colado no título, o título
 * encostou no rótulo "Senha", e a etapa inteira ficou sem respiro —
 * enquanto o passo 1, ao lado, tem ritmo.
 *
 * Aqui a etapa é tratada como tela, não como lista de defeitos.
 * ================================================================= */

/* O VOLTAR vira controle, não link perdido.
 *
 * Link sublinhado de 13px encostado no topo do cartão não lê como algo
 * clicável de verdade — lê como sobra. Vira uma pílula discreta,
 * alinhada à esquerda, com espaço embaixo. Continua secundária (sem
 * preenchimento, texto apagado), mas tem área de toque e contorno.
 *
 * As propriedades estão todas declaradas por causa da base de botões do
 * Woodmart 8.6.0 — `:is(.btn,.button,button,…)` pesa (0,1,0) e empata
 * com uma classe nossa; (0,2,0) aqui resolve sem `!important`.
 */
.locfit-acc .locfit-acc__volta,
.locfit-acc .locfit-acc__volta:hover,
.locfit-acc .locfit-acc__volta:focus,
.locfit-acc .locfit-acc__volta:focus-visible {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	width: auto;
	height: 32px;
	min-height: 0;
	margin: 0 0 20px;
	padding: 0 12px;
	background-color: transparent;
	background-image: none;
	border: 1px solid var(--lc-border);
	border-radius: 99px;
	color: var(--lc-muted);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1;
	text-transform: none;
	text-decoration: none;
	box-shadow: none;
}

.locfit-acc .locfit-acc__volta:hover {
	background-color: var(--lc-surface);
	border-color: var(--lc-border-strong);
	color: var(--lc-text);
}

/* O E-MAIL ECOADO é quem separa o título do campo.
   Centralizado, como o cabeçalho; discreto, porque é confirmação e não
   conteúdo novo. */
.locfit-acc__eco {
	justify-content: center;
	margin: 0 0 22px;
	color: var(--lc-text);
	font-weight: 500;
	word-break: break-all;
}

/* O rótulo nativo "Senha" tinha o visual cru do WooCommerce, enquanto o
   "Seu e-mail" do passo 1 era nosso. Igualados. */
.locfit-acc form .form-row > label,
.locfit-acc form .woocommerce-form-row > label {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 600;
	color: #242424;
	text-align: left;
}

/* O asterisco vermelho de obrigatório gritava numa tela de um campo só.
   Fica, por acessibilidade, mas sem o vermelho de alerta. */
.locfit-acc form .required {
	color: var(--lc-muted);
	text-decoration: none;
	border: 0;
}

/* O botão nativo chega com o rótulo "entrar" em minúsculas, do
   WooCommerce. Não dá para trocar o texto sem tocar no formulário (que
   é dele, e é quem submete) — então a capitalização é visual. */
.locfit-acc form button[type="submit"],
.locfit-acc form .woocommerce-form-login__submit {
	text-transform: capitalize;
}

/* A linha de "Lembrar-me" e "Perdeu sua senha?" é uma linha só, com os
   dois nas pontas — antes o `text-align: center` do nosso CSS brigava
   com o layout em linha do tema e o resultado dependia de qual vencia. */
.locfit-acc form .login-form-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 16px 0 0;
}

.locfit-acc form .login-form-footer .lost_password,
.locfit-acc form .lost_password {
	margin: 0;
	text-align: right;
	font-size: 13px;
}

/* A ordem é declarada, não herdada da marcação.
 *
 * No HTML do tema o link "Perdeu sua senha?" vem ANTES do "Lembrar-me"
 * (com `<br>` entre eles), mas na tela o tema mostra Lembrar-me à
 * esquerda. Depender da ordem do DOM faria o layout trocar de lado numa
 * atualização do Woodmart. Com `order` o resultado é o mesmo nos dois
 * casos. */
.locfit-acc form .woocommerce-form-login__rememberme {
	order: 1;
	margin: 0;
	white-space: nowrap;
}

.locfit-acc form .login-form-footer .lost_password,
.locfit-acc form .login-form-footer a.lost_password { order: 2; }

/* Os `<br>` do tema viram itens de flex e abrem buracos na linha. */
.locfit-acc form .login-form-footer br { display: none; }

/* Com a linha acima virando flex, o divisor precisa do seu próprio ar. */
.locfit-acc__ou { margin: 22px 0 16px; }
