/* ===================================================================
// ESTILOS FINAIS - Página "Minha Conta" do WooCommerce
// Com Menu Hamburger Responsivo
// ===================================================================*/

/* --- Variáveis de Cor --- */
:root {
    --color-background: #FFFFFF;
    --color-text: #222222;
    --color-heading: #000000;
    --color-border: #E0E0E0;
    --color-accent: #000000;
    --color-accent-text: #FFFFFF;
    --border-radius-main: 8px;
}

/* --- NOVO: Estilo do Botão "Hamburger" --- */
.account-nav-toggle {
    display: flex; /* Para alinhar texto e ícone */
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 15px 20px;
    margin-bottom: 25px; /* Mesmo valor do 'gap' antigo */
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-heading);
    background-color: #F5F5F5;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-main);
    cursor: pointer;
    text-align: left;
}
.account-nav-toggle .icon {
    transition: transform 0.3s ease;
}
.account-nav-toggle[aria-expanded="true"] .icon {
    transform: rotate(90deg);
}

/* --- Layout Principal --- */
body.woocommerce-account .woocommerce {
    display: flex;
    flex-direction: column;
}

/* MOBILE (DEFAULT): Menu escondido com transição suave - SELETORES REFORÇADOS */
.woocommerce-MyAccount-navigation {
    overflow: hidden;
    flex-shrink: 0;
    
    /* A mágica para esconder/mostrar com transição */
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.5s ease-in-out, opacity 0.3s ease, visibility 0.5s;
}

.woocommerce-MyAccount-navigation ul {
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-main);
}

/* ESTADO ABERTO: Quando o JS adiciona a classe .is-open - SELETORES REFORÇADOS */
.woocommerce-MyAccount-navigation.is-open {
    max-height: 1000px; /* Um valor alto o suficiente para caber o menu */
    opacity: 1;
    visibility: visible;
}
/* ... (o resto dos estilos do menu interno não precisam mudar) ... */
.woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-MyAccount-navigation ul li { margin: 0; border-bottom: 1px solid var(--color-border); }
.woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none; }
.woocommerce-MyAccount-navigation ul li a { display: block; padding: 15px 20px; color: var(--color-text); text-decoration: none; font-weight: 500; transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; }
.woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-MyAccount-navigation ul li.is-active > a { background-color: var(--color-accent); color: var(--color-accent-text); }


/* --- Conteúdo da Conta --- */
body.woocommerce-account .woocommerce-MyAccount-content {
    flex-grow: 1;
}
/* ... (todo o resto do CSS de conteúdo, formulários, botões, etc. pode ser colado aqui sem alterações) ... */
.woocommerce-MyAccount-content h3 { color: var(--color-heading); border-bottom: 2px solid var(--color-border); padding-bottom: 10px; margin-top: 0; margin-bottom: 20px; font-size: 1.8rem; }
.woocommerce-MyAccount-content p { margin-bottom: 1.5em; }
.woocommerce-MyAccount-content a { color: var(--color-heading); font-weight: 600; text-decoration: underline; text-decoration-color: var(--color-border); transition: text-decoration-color 0.2s ease; }
.woocommerce-MyAccount-content a:hover { text-decoration-color: var(--color-heading); }
.woocommerce-MyAccount-content form { margin-top: 20px; }
.woocommerce-MyAccount-content ul { list-style: none; }
.woocommerce-form-row { margin-bottom: 15px; }
.woocommerce-form-row label { display: block; font-weight: 600; margin-bottom: 5px; color: var(--color-heading); }
.woocommerce-Input, .woocommerce-input-wrapper input, input[type="text"], input[type="email"], input[type="password"], input[type="tel"] { width: 100%; padding: 12px; border: 1px solid var(--color-border); background-color: var(--color-background); box-sizing: border-box; font-size: 1rem; transition: border-color 0.2s ease; border-radius: 4px; }
.woocommerce-Input:focus, input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="tel"]:focus { border-color: var(--color-border-focus); outline: none; box-shadow: 0 0 0 2px rgba(0,0,0,0.05); }
.woocommerce-Button, button[type="submit"] { background-color: var(--color-accent) !important; color: var(--color-accent-text) !important; border: none !important; padding: 12px 25px !important; font-size: 1rem !important; font-weight: 600 !important; text-transform: uppercase !important; cursor: pointer; transition: background-color 0.2s ease-in-out; width: auto; display: inline-block; border-radius: 4px !important; }
.woocommerce-Button:hover, button[type="submit"]:hover { }
.woocommerce-orders-table { width: 100%; border-collapse: collapse; margin-top: 20px; }
.woocommerce-orders-table th, .woocommerce-orders-table td { padding: 15px; text-align: left; border: 1px solid var(--color-border); }
.woocommerce-orders-table thead { background-color: #F5F5F5; }
.woocommerce-orders-table thead th { font-weight: 600; color: var(--color-heading); }
.woocommerce-error { border-top-color: #555 !important; }


/* ===================================================================
// Media Query para Telas Maiores (Desktop)
// ===================================================================*/
@media (min-width: 768px) {
    /* Esconde o botão hamburger no desktop */
    .account-nav-toggle {
        display: none;
    }

    /* Restaura o layout de colunas */
    .woocommerce {
        display: flex;
        flex-direction: row;
        gap: 30px; /* Espaçamento entre as colunas */
    }

    /* Garante que o menu esteja sempre visível no desktop */
    .woocommerce-MyAccount-navigation {
        flex-basis: 250px;
        flex-shrink: 0;
        max-height: initial; 
        opacity: 1;
        visibility: visible;
    }

    .woocommerce-MyAccount-content {
        flex-grow: 1;
    }
}

.entry-title {
    display: none;
}