/*
Minha Conta: desde 01/08/2026 existe um template PHP próprio
(page-myaccount.php, na raiz do tema), criado só para acrescentar a faixa
visual `.pagina-header` (título) em volta do conteúdo. O miolo continua
100% default do plugin (login/pedidos/endereço/editar conta/sair seguem
vindo intactos do WooCommerce via `[woocommerce_my_account]` dentro de
`the_content()`), este arquivo continua sendo só CSS por cima das classes
nativas do WooCommerce, sem markup próprio. Mais seguro numa área de
login/pedidos/endereço.
*/

/* Flexbox, não grid: na página deslogada (login/cadastro) só existe UM filho
   (sem o menu de navegação), com grid_template_columns fixo ele ficaria
   preso na primeira faixa de 240px pensada pro menu. Com flex, um filho
   único naturalmente ocupa a largura toda. */
.woocommerce-account .woocommerce{
    display: flex;
    flex-wrap: wrap;
    gap: var(--espaco-2xl);
    align-items: flex-start;
}
.woocommerce-account .woocommerce-MyAccount-navigation{
    flex: 0 0 240px;
}
.woocommerce-account .woocommerce-MyAccount-content{
    flex: 1 1 480px;
}
/* Login/cadastro (deslogado): .u-columns é filho direto de .woocommerce,
   sem passar por .woocommerce-MyAccount-content, precisa da largura toda.
   O CSS padrão do WooCommerce usa float nas colunas (.u-column1/.u-column2):
   sobrescrevemos pra flex, senão o float por si só não garante lado a
   lado de forma confiável dentro do nosso layout. */
.woocommerce-account .woocommerce > .u-columns{
    flex: 1 1 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: var(--espaco-2xl);
}
.woocommerce-account .u-columns .u-column1,
.woocommerce-account .u-columns .u-column2{
    float: none;
    width: auto;
    flex: 1 1 320px;
}

.woocommerce-MyAccount-navigation ul{
    background: var(--cor-linho-2);
    border-radius: var(--raio-md);
    overflow: hidden;
}
.woocommerce-MyAccount-navigation li{
    border-bottom: 1px solid rgba(51,41,31,0.1);
}
.woocommerce-MyAccount-navigation li:last-child{ border-bottom: none; }
.woocommerce-MyAccount-navigation li a{
    display: block;
    padding: var(--espaco-sm) var(--espaco-md);
    font-size: var(--texto-sm);
    font-weight: 600;
    color: var(--cor-cacau);
}
.woocommerce-MyAccount-navigation li.is-active a{
    color: var(--cor-mata);
    background: var(--cor-linho);
}
.woocommerce-MyAccount-navigation li a:hover{
    color: var(--cor-terracota);
}

.woocommerce-MyAccount-content p{
    margin-bottom: var(--espaco-md);
}

/* Tabela de pedidos */
.woocommerce-orders-table{
    width: 100%;
}
.woocommerce-orders-table th,
.woocommerce-orders-table td{
    padding: var(--espaco-sm);
    border-bottom: 1px solid var(--cor-linho-2);
    text-align: left;
    font-size: var(--texto-sm);
}
.woocommerce-orders-table__cell-order-status mark{
    background: none;
    color: var(--cor-mata);
    font-weight: 700;
}

/* Endereços */
.woocommerce-Addresses{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--espaco-lg);
}
.woocommerce-Address{
    background: var(--cor-linho-2);
    border-radius: var(--raio-md);
    padding: var(--espaco-lg);
}
.woocommerce-Address-title h3{
    font-size: var(--texto-md);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.woocommerce-Address-title .edit{
    font-size: var(--texto-xs);
    text-transform: uppercase;
}

/* Login / Registro (página Minha Conta deslogado) */
.woocommerce-account .u-columns{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--espaco-2xl);
}
@media (max-width: 767px){
    .woocommerce-account .u-columns{
        grid-template-columns: 1fr;
    }
}
.woocommerce-form-login, .woocommerce-form-register{
    background: var(--cor-linho-2);
    border-radius: var(--raio-md);
    padding: var(--espaco-xl);
}
.woocommerce-form-login .form-row, .woocommerce-form-register .form-row{
    margin-bottom: var(--espaco-md);
}
.woocommerce-form-login label, .woocommerce-form-register label{
    display: block;
    font-size: var(--texto-xs);
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cor-cacau-70);
    margin-bottom: var(--espaco-2xs);
}
.woocommerce-form-login .input-text, .woocommerce-form-register .input-text{
    width: 100%;
}
.woocommerce-form-login .woocommerce-form-login__rememberme{
    display: flex;
    align-items: center;
    gap: var(--espaco-xs);
    font-size: var(--texto-sm);
}
.woocommerce-LostPassword{
    display: block;
    margin-top: var(--espaco-sm);
    font-size: var(--texto-sm);
}
/* Achado real (auditoria de responsividade, 01/08/2026): o link "Perdeu
   sua senha?" media ~19px de altura de area clicavel real (so a altura da
   linha de texto), abaixo do minimo de 44px (WCAG 2.5.5). Padding vertical
   com display:inline-block da a folga sem mudar a posicao visual do texto
   nem o tamanho da fonte. */
.woocommerce-LostPassword a{
    display: flex;
    align-items: center;
    padding-block: var(--espaco-xs);
    min-height: 44px;
}

/* Item 8 (mapeamento Fase 2): botões "Entrar"/"Cadastre-se" medidos ao vivo
   com 40px de altura, poucos px abaixo do mínimo de 44px recomendado. */
.woocommerce-form-login button[name="login"],
.woocommerce-form-register button[name="register"]{
    min-height: 44px;
}

/* Item 7: ícone "Mostrar senha" (WooCommerce core, .show-password-input)
   media 22x22px de área clicável (mesmo tamanho do ícone, sem padding,
   position:absolute). O core JÁ gera aria-label="Mostrar senha"/"Ocultar
   senha" nesse botão (confirmado ao vivo no DOM: não faltava rótulo de
   acessibilidade pra leitor de tela, só a área de toque visual era
   pequena). Aumentamos a caixa clicável pra 44x44 via min-width/min-height
   + flex centralizando o ícone, sem alterar o tamanho visual do ícone em si
   (::before do core continua 20x22px). Testado ao vivo: caixa passou de
   22x22 pra 44x44, ícone permanece centralizado dentro do campo, sem
   sobrepor texto nem vazar do campo. */
.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input{
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 0;
}

/* Editar dados da conta */
.woocommerce-EditAccountForm .form-row{
    margin-bottom: var(--espaco-md);
}
.woocommerce-EditAccountForm fieldset{
    border: 1px solid var(--cor-linho-2);
    border-radius: var(--raio-md);
    padding: var(--espaco-lg);
    margin-top: var(--espaco-lg);
}
.woocommerce-EditAccountForm legend{
    font-family: var(--fonte-display);
    color: var(--cor-mata);
    padding: 0 var(--espaco-xs);
}