/* Variáveis de Cores */
:root {
    --color-primary: #E63946; 
    --color-primary-dark: #c4303d;
    --color-text-dark: #1f2937;
    --color-text-medium: #4b5563;
    --color-border: #e5e7eb;
    --color-background-light: #f9fafb;
    --color-white: #ffffff;
    --border-radius-base: 8px;
    --border-radius-small: 6px;
    --box-shadow-subtle: 0 4px 10px rgba(0, 0, 0, 0.05);
}

/* Reset básico e Tipografia */
.wmaw-wrapper {
    font-family: 'Montserrat', sans-serif;
    color: var(--color-text-dark);
    line-height: 1.6;
    width: 100%;
}

/* Estrutura Principal (Layout Flex) */
.woocommerce-account .woocommerce {
    display: flex;
    /* Removido gap: 32px; para permitir que o Elementor controle a largura total do widget. 
    O espaçamento lateral será gerenciado pela margem direita da navegação. */
    align-items: flex-start;
}

/* Navegação (Sidebar) */
.wmaw-wrapper .woocommerce-MyAccount-navigation {
    width: 280px;
    background: var(--color-white);
    border-radius: var(--border-radius-base);
    box-shadow: var(--box-shadow-subtle);
    padding: 20px;
    flex-shrink: 0;
    border: 1px solid var(--color-border);
    margin-right: 32px; /* Mantém o espaçamento de 32px apenas à direita da sidebar */
}

.wmaw-wrapper .woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wmaw-wrapper .woocommerce-MyAccount-navigation li {
    margin-bottom: 4px;
}

.wmaw-wrapper .woocommerce-MyAccount-navigation a {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    color: var(--color-text-medium);
    text-decoration: none;
    border-radius: var(--border-radius-small);
    transition: all 0.2s ease;
    font-weight: 500;
    font-size: 15px;
}

.wmaw-wrapper .woocommerce-MyAccount-navigation a:hover {
    background: var(--color-background-light);
    color: var(--color-text-dark);
}

/* Item de menu ativo (Destaque principal) */
.wmaw-wrapper .woocommerce-MyAccount-navigation li.is-active a {
    background: var(--color-primary);
    color: var(--color-white);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3);
    font-weight: 600;
}

.wmaw-wrapper .woocommerce-MyAccount-navigation li.is-active a:hover {
    background: var(--color-primary-dark);
    color: var(--color-white);
}

/* Conteúdo Principal */
.wmaw-wrapper .woocommerce-MyAccount-content {
    flex-grow: 1;
    background: var(--color-white);
    border-radius: var(--border-radius-base);
    padding: 30px;
    box-shadow: var(--box-shadow-subtle);
    min-height: 400px;
    box-sizing: border-box;
    border: 1px solid var(--color-border);
}

.wmaw-intro h2 {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-text-dark);
    margin: 0;
}

/* ================================================================= */
/* ESTILIZAÇÃO DA LISTA DE PEDIDOS (NOVA ESTRUTURA BASEADA EM DIVS) */
/* ================================================================= */

/* Container Principal da Lista */
.wmaw-orders-list {
    display: flex;
    flex-direction: column;
    font-size: 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-base);
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
    margin-bottom: 20px; /* Adicionado para espaçamento após a lista */
}

/* Cabeçalho da Lista */
.wmaw-orders-header {
    display: flex;
    background-color: var(--color-white);
    padding: 10px 15px;
    border-bottom: 1px solid var(--color-border);
    font-weight: 600;
    color: var(--color-text-dark);
    text-transform: capitalize;
}

/* Linha de Pedido (Corpo) */
.wmaw-order-row {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid var(--color-border);
    transition: background-color 0.2s ease;
    min-height: 40px; /* Garante altura mínima para a linha */
}

.wmaw-order-row:last-child {
    border-bottom: none; /* Remove a borda da última linha */
}

.wmaw-order-row:hover {
    background-color: var(--color-background-light);
}

/* Colunas (Células) */
/* Estilo para o conteúdo de cada coluna (usando <p> para alinhamento) */
.wmaw-order-data {
    margin: 0;
    padding: 0;
    line-height: 1.2; /* Ajusta a altura da linha */
}

.wmaw-orders-header > div {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    height: 30px; /* Altura fixa para alinhar com o conteúdo */
}

.wmaw-order-col {
    padding: 0 5px; /* Ajuste fino do padding horizontal */
    box-sizing: border-box;
    /* Alinhamento vertical centralizado por padrão no .wmaw-order-row */
}

/* Responsividade e Largura das Colunas (Desktop - Flexbox) */
.wmaw-col-pedido { flex-basis: 15%; }
.wmaw-col-data { flex-basis: 20%; }
.wmaw-col-status { flex-basis: 20%; }
.wmaw-col-total { flex-basis: 20%; }
.wmaw-col-acoes { flex-basis: 25%; }

/* Esconde o label no desktop */
.wmaw-order-row .wmaw-order-col::before {
    content: attr(data-title);
    font-weight: 600;
    color: var(--color-text-dark);
    display: none; /* Escondido no desktop */
    margin-right: 10px;
}

/* Estilos para Links dentro da Lista */
.wmaw-orders-list a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.2s;
}

.wmaw-orders-list a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

/* Estilos para o botão Visualizar dentro da lista (usando o estilo secundário) */
.wmaw-btn-visualizar {
    background: var(--color-primary); /* Botão vermelho */
    color: var(--color-white); /* Texto branco */
    border: 1px solid var(--color-primary);
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Sombra sutil */
    line-height: 1.2;
    text-transform: none;
    transition: all 0.2s ease;
    display: inline-block;
}

a.wmaw-btn-visualizar {
    color: #F6F6F6;
}

.wmaw-btn-visualizar:hover {
    background: var(--color-primary-dark); /* Tom mais escuro no hover */
    color: var(--color-white);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

a.wmaw-btn-visualizar:hover {
    color: #F6F6F6;
    text-decoration: underline;

}

/* Responsividade (Mobile - Stacked View) */
@media (max-width: 768px) {
    /* Esconde o cabeçalho */
    .wmaw-orders-header {
        display: none;
    }

    /* Transforma a linha em bloco vertical */
    .wmaw-order-row {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px;
    }

    /* Colunas ocupam 100% da largura */
    .wmaw-order-col {
        width: 100%;
        padding: 5px 0;
        text-align: left !important; /* Sobrescreve o alinhamento de 'Ações' */
    }

    /* Mostra o 'data-title' como label */
    .wmaw-order-row .wmaw-order-col::before {
        display: inline-block;
    }
    
    /* Ajusta a coluna de Ações para ter um espaçamento melhor */
    .wmaw-col-acoes {
        margin-top: 10px;
    }
}

/* FIM DA ESTILIZAÇÃO DA LISTA DE PEDIDOS */
/* ================================================================= */


/* Estilização de Botões - Foco em Elegância e Cor */
.wmaw-content .wmaw-button, .wmaw-content .woocommerce-button {
    background: var(--color-primary);
    color: var(--color-white);
    padding: 10px 20px;
    border-radius: var(--border-radius-small);
    text-decoration: none;
    display: inline-block;
    border: none;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.2s ease;
    font-size: 14px;
    line-height: 1.2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.wmaw-content .wmaw-button:hover, .wmaw-content .woocommerce-button:hover {
    background: var(--color-primary-dark);
    box-shadow: 0 4px 10px rgba(230, 57, 70, 0.3);
    transform: translateY(-1px);
}

/* Botão Secundário (Ex: Visualizar Pedido na Tabela) - Estilo Ghost/Outline */
/* NOTA: Os estilos para .woocommerce-orders-table .button e .woocommerce-orders-table .woocommerce-button foram movidos/adaptados para a nova estrutura de divs acima. */
.wmaw-content .wmaw-button-secondary {
    background: var(--color-white);
    color: var(--color-primary); /* Texto na cor primária */
    border: 1px solid var(--color-primary); /* Borda na cor primária */
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: none;
    line-height: 1.2;
    text-transform: none;
    transition: all 0.2s ease;
}

.wmaw-content .wmaw-button-secondary:hover {
    background: var(--color-primary); /* Fundo na cor primária no hover */
    color: var(--color-white);
    box-shadow: none;
    transform: none;
}

/* Botão "Voltar para pedidos" (Mais discreto) */
.wmaw-content .button.wc-backward {
    background: var(--color-background-light);
    color: var(--color-text-medium);
    border: 1px solid var(--color-border);
    box-shadow: none;
    transform: none;
}

.wmaw-content .button.wc-backward:hover {
    background: var(--color-border);
    color: var(--color-text-dark);
    transform: none;
}

/* =================================================================================================================================================================================================== */
/* ========================================================================== ESTILIZAÇÃO PARA O FORMULÁRIO DE ENDEREÇO ============================================================================== */
/* =================================================================================================================================================================================================== */
.woocommerce form .form-row {
    padding: ;
}

.woocommerce-Input:focus, .input-text:focus, .select:focus, textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15);
    outline: none;
}
.woocommerce-form-row label {
    font-weight: 500;
    color: var(--color-text-dark);
    margin-bottom: 5px;
    display: block;
}
/* =================================================================================================================================================================================================== */
/* ========================================================================== FIM DA ESTILIZAÇÃO PARA O FORMULÁRIO DE ENDEREÇO ======================================================================= */
/* =================================================================================================================================================================================================== */


/* =================================================================================================================================================================================================== */
/* ========================================================================== ESTILIZAÇÃO PARA STATUS DO PEDIDO ====================================================================================== */
/* =================================================================================================================================================================================================== */
.order-status,
.woocommerce-orders-table .status-on-hold,
.woocommerce-orders-table .status-processing,
.woocommerce-orders-table .status-completed,
.woocommerce-orders-table .status-cancelled,
.woocommerce-orders-table .status-refunded,
.woocommerce-orders-table .status-failed,
.woocommerce-orders-table .status-pending {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 16px;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.2;
    text-align: center;
}
.status-completed, .woocommerce-orders-table .status-completed {
    background-color: #d1fae5;
    color: #065f46;
}
.status-processing, .woocommerce-orders-table .status-processing {
    background-color: #dbeafe;
    color: #1e40af;
}
.status-on-hold, .woocommerce-orders-table .status-on-hold {
    background-color: #fef3c7;
    color: #b45309;
}
.status-cancelled, .status-failed, .status-refunded,
.woocommerce-orders-table .status-cancelled, .woocommerce-orders-table .status-failed, .woocommerce-orders-table .status-refunded {
    background-color: #fee2e2;
    color: #991b1b;
}
.status-pending, .woocommerce-orders-table .status-pending {
    background-color: #eef2ff;
    color: var(--color-primary);
}
/* =================================================================================================================================================================================================== */
/* ========================================================================== FIM DA ESTILIZAÇÃO PARA STATUS DO PEDIDO =============================================================================== */
/* =================================================================================================================================================================================================== */


/* =================================================================================================================================================================================================== */
/* ========================================================================== ESTILIZAÇÃO DA PÀGINA DE ENDEREÇOS ===================================================================================== */
/* =================================================================================================================================================================================================== */
.cardheader {
    display: flex;
    justify-content: space-between; 
    align-items: center; 
    margin-bottom: 15px;
}
.titleaddress {
    font-size: 18px; 
    font-weight: 600;
}
.editbtn {
    background: var(--color-primary);
    color: var(--color-white);
    padding: 8px 16px;
    border-radius: var(--border-radius-small);
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s ease;
    line-height: 1.2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.editbtn:hover {
    color: var(--color-white);
    background: var(--color-primary-dark);
    box-shadow: 0 4px 10px rgba(230, 57, 70, 0.3);
    transform: translateY(-1px);
}
.addresscontent {
    font-style: normal;
    line-height: 1.8;
    color: var(--color-text-medium);
}
/* =================================================================================================================================================================================================== */
/* ========================================================================== FIM DA ESTILIZAÇÃO DA PÀGINA DE ENDEREÇOS ============================================================================== */
/* =================================================================================================================================================================================================== */
   
   
   
   
   
   
    
/* Ajustes de Responsividade */
@media (max-width: 992px) {
    .wmaw-wrapper .woocommerce-MyAccount-navigation {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .woocommerce-account .woocommerce {
        flex-direction: column;
    }

    .wmaw-wrapper .woocommerce-MyAccount-content {
        padding: 20px;
    }
}

/* Estilos de mensagens do WooCommerce */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
    padding: 15px 20px;
    margin: 0 0 20px 0;
    border-radius: var(--border-radius-small);
    border-left: 5px solid;
    font-size: 15px;
    font-weight: 500;
    list-style: none outside;
}

.woocommerce-message {
    background: #d1fae5;
    border-color: #065f46;
    color: #065f46;
}

.woocommerce-info {
    background: #dbeafe;
    border-color: #1e40af;
    color: #1e40af;
}

.woocommerce-error {
    background: #fee2e2;
    border-color: #991b1b;
    color: #991b1b;
}

.woocommerce-message a, .woocommerce-info a, .woocommerce-error a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
}

/* Estilos para o formulário de login/registro */
.woocommerce-form-login, .woocommerce-form-register {
    margin: 0 auto;
    padding: 30px;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-base);
    background: var(--color-white);
    box-shadow: var(--box-shadow-subtle);
}

.woocommerce-form-login .button, .woocommerce-form-register .button {
    width: 100%;
    text-align: center;
}

.woocommerce-form-login .woocommerce-form-row--wide, .woocommerce-form-register .woocommerce-form-row--wide {
    clear: both;
}

.woocommerce-form-login .form-row:nth-child(3) {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.woocommerce-form-login .woocommerce-form__label-for-checkbox {
    margin-bottom: 0;
    display: flex;
    align-items: center;
}

.woocommerce-form-login .woocommerce-form__input-checkbox {
    margin-right: 5px;
}

.woocommerce-form-login .lost_password a {
    font-size: 14px;
    color: var(--color-text-medium);
}

.woocommerce-form-login .lost_password a:hover {
    color: var(--color-primary);
}

/* Ajustes de Responsividade */
@media (max-width: 992px) {
    .wmaw-wrapper .woocommerce-MyAccount-navigation {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .woocommerce-account .woocommerce {
        flex-direction: column;
    }

    .wmaw-wrapper .woocommerce-MyAccount-content {
        padding: 20px;
    }
}