/* --- FORÇAR MENU EM UMA LINHA SÓ (MÉTODO ULTRA) --- */

/* Força o container principal a não quebrar linha */
#cabecalho .menu.superior, 
#cabecalho .menu.superior .conteiner,
#cabecalho .menu.superior .nivel-um {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Ajusta os blocos de cada botão */
#cabecalho .menu.superior .nivel-um > li {
    float: none !important;
    display: inline-block !important;
    flex: 1 1 auto !important;
    max-width: max-content !important;
}

/* Texto do menu */
#cabecalho .menu.superior .nivel-um > li > a {
    font-size: 10.5px !important;
    padding: 10px 3px !important;
    white-space: nowrap !important;
    letter-spacing: -0.5px !important;
}

.botao-comprar,
.produto .botao-comprar {
    background: linear-gradient(135deg, #A70000, #7A0000) !important;
    border: 1px solid #7A0000 !important;
    color: #fff !important;

    font-weight: 700 !important;
    font-size: 13px !important;

    padding: 11px 18px !important;
    border-radius: 12px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    line-height: 1 !important;
    letter-spacing: 0.3px !important;

    cursor: pointer !important;

    transition: all 0.25s ease !important;

    /* sombra premium */
    box-shadow: 0 6px 15px rgba(167, 0, 0, 0.22) !important;
}

/* HOVER (efeito elegante escuro) */
.botao-comprar:hover,
.produto .botao-comprar:hover {
    background: linear-gradient(135deg, #000000, #1a1a1a) !important;
    border-color: #000000 !important;

    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35) !important;
}

/* CLIQUE (sensação de pressionado) */
.botao-comprar:active,
.produto .botao-comprar:active {
    transform: translateY(0px) scale(0.98);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25) !important;
}

/* FOCUS (acessibilidade + acabamento profissional) */
.botao-comprar:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(167, 0, 0, 0.25), 0 6px 15px rgba(167, 0, 0, 0.2) !important;
}



/* Novo */

/* REMOVE QUALQUER BORDA/CONTORNO DO BOTÃO (LOJA INTEGRADA) */
.botao-comprar,
.produto .botao-comprar,
.produto a.botao-comprar {
    border: none !important;
    outline: none !important;
    box-shadow: 0 6px 15px rgba(167, 0, 0, 0.22) !important;
}

/* remove foco padrão do navegador (o “quadrado feio”) */
.botao-comprar:focus,
.produto .botao-comprar:focus,
.botao-comprar:focus-visible,
.produto .botao-comprar:focus-visible {
    outline: none !important;
    box-shadow: 0 6px 15px rgba(167, 0, 0, 0.22) !important;
}

/* garante que nenhum pseudo-elemento está criando borda */
.botao-comprar::before,
.botao-comprar::after {
    border: none !important;
    outline: none !important;
}


/* FORÇA TEXTO BRANCO NO BOTÃO COMPRAR */
.botao-comprar,
.botao-comprar * ,
.produto .botao-comprar,
.produto .botao-comprar * {
    color: #ffffff !important;
}

/* caso seja link (<a>) */
a.botao-comprar,
a.botao-comprar * {
    color: #ffffff !important;
}

