/* =========================================================
   PROMOVCAR - CATEGORIAS EM ABAS HORIZONTAIS
   Desktop elegante + rolagem lateral no mobile
   ========================================================= */

.menu.superior {
    background: transparent !important;
    box-shadow: none !important;
    margin-top: 12px !important;
    margin-bottom: 18px !important;
    overflow: visible !important;
}


/* FAIXA PRINCIPAL */

.menu.superior .nivel-um {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    background: transparent !important;

    padding: 4px 10px !important;
    margin: 0 !important;

    list-style: none !important;
}


/* CADA CATEGORIA */

.menu.superior .nivel-um > li {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}


/* BOTÃO / ABA */

.menu.superior .nivel-um > li > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 42px !important;

    padding: 0 17px !important;

    background: #ffffff !important;

    color: #b00000 !important;

    border: 1px solid rgba(0,0,0,.10) !important;

    border-radius: 999px !important;

    text-decoration: none !important;

    font-size: 13px !important;

    font-weight: 700 !important;

    white-space: nowrap !important;

    box-shadow:
        0 2px 7px rgba(0,0,0,.04) !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease !important;
}


/* HOVER */

.menu.superior .nivel-um > li > a:hover {
    transform: translateY(-2px) !important;

    background: #fafafa !important;

    box-shadow:
        0 7px 17px rgba(0,0,0,.10) !important;
}


/* REMOVE SEPARADORES ANTIGOS */

.menu.superior .nivel-um > li + li {
    border-left: none !important;
}


/* SUBMENU */

.menu.superior .nivel-dois {
    margin-top: 8px !important;

    background: #ffffff !important;

    border: 1px solid rgba(0,0,0,.08) !important;

    border-radius: 12px !important;

    box-shadow:
        0 10px 30px rgba(0,0,0,.12) !important;

    overflow: hidden !important;
}

.menu.superior .nivel-dois li a {
    padding: 10px 14px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .menu.superior {
        width: 100% !important;

        overflow: hidden !important;

        margin-top: 8px !important;
        margin-bottom: 12px !important;
    }


    .menu.superior .nivel-um {
        display: flex !important;

        flex-wrap: nowrap !important;

        justify-content: flex-start !important;

        overflow-x: auto !important;

        overflow-y: hidden !important;

        gap: 7px !important;

        padding:
            6px 10px 10px 10px !important;

        scroll-behavior: smooth !important;

        -webkit-overflow-scrolling: touch !important;

        scrollbar-width: none !important;
    }


    /* Esconde barra de rolagem */

    .menu.superior .nivel-um::-webkit-scrollbar {
        display: none !important;
    }


    /* Categoria não encolhe */

    .menu.superior .nivel-um > li {
        flex: 0 0 auto !important;

        width: auto !important;

        min-width: auto !important;
    }


    /* Abas menores no celular */

    .menu.superior .nivel-um > li > a {
        min-height: 40px !important;

        padding: 0 14px !important;

        font-size: 12px !important;

        border-radius: 999px !important;

        white-space: nowrap !important;
    }

}


/* =========================================================
   CELULARES PEQUENOS
   ========================================================= */

@media (max-width: 380px) {

    .menu.superior .nivel-um > li > a {
        padding: 0 12px !important;

        font-size: 11px !important;

        min-height: 38px !important;
    }

}


/* =========================================================
   PROMOVCAR - LATERAL MODERNA
   TEMA SUPER LIGHT BLUE - LOJA INTEGRADA
   ========================================================= */


/* =========================
   COLUNA LATERAL
   ========================= */

.coluna {
    padding-right: 10px !important;
}


/* =========================================================
   PROMOVCAR - LATERAL PREMIUM
   Compatível com Super Light Blue
   ========================================================= */


/* =========================
   COLUNA LATERAL
   ========================= */

.coluna {
    padding-right: 12px !important;
}


/* =========================
   MENU LATERAL
   ========================= */

.menu.lateral {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}


/* lista principal */

.menu.lateral .nivel-um {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}


/* item */

.menu.lateral .nivel-um > li {
    margin-bottom: 7px !important;
    border: 0 !important;
    background: transparent !important;
}


/* link */

.menu.lateral .nivel-um > li > a {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-height: 46px !important;

    padding: 0 18px !important;

    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 10px !important;

    box-shadow: 0 3px 10px rgba(0,0,0,.05) !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        padding-left .18s ease !important;
}


/* pequeno detalhe visual */

.menu.lateral .nivel-um > li > a:after {
    content: "›";

    position: absolute;
    right: 14px;

    font-size: 20px;
    line-height: 1;

    opacity: .7;

    transition: transform .18s ease;
}


/* hover */

.menu.lateral .nivel-um > li > a:hover {
    transform: translateY(-2px) !important;
    padding-left: 22px !important;

    box-shadow: 0 7px 18px rgba(0,0,0,.09) !important;
}


.menu.lateral .nivel-um > li > a:hover:after {
    transform: translateX(3px);
}


/* =========================
   SUBMENU
   ========================= */

.menu.lateral .nivel-dois {
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 10px !important;

    box-shadow: 0 10px 28px rgba(0,0,0,.12) !important;

    overflow: hidden !important;
}


.menu.lateral .nivel-dois li a {
    padding: 11px 15px !important;

    font-size: 13px !important;

    transition:
        padding-left .18s ease,
        opacity .18s ease !important;
}


.menu.lateral .nivel-dois li a:hover {
    padding-left: 19px !important;
}


/* =========================
   NEWSLETTER
   ========================= */

.newsletter {
    margin-top: 22px !important;

    padding: 20px !important;

    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 14px !important;

    box-shadow: 0 5px 18px rgba(0,0,0,.06) !important;
}


/* título */

.newsletter .titulo {
    margin-bottom: 8px !important;

    font-size: 18px !important;
    font-weight: 700 !important;
}


/* texto */

.newsletter p {
    margin-bottom: 15px !important;

    font-size: 13px !important;
    line-height: 1.5 !important;

    opacity: .78;
}


/* linha do formulário */

.newsletter .newsletter-confirmacao,
.newsletter form {
    position: relative !important;
}


/* campo de e-mail */

.newsletter input[type="email"],
.newsletter input[type="text"] {
    height: 44px !important;

    padding-left: 13px !important;

    border: 1px solid rgba(0,0,0,.14) !important;
    border-radius: 9px !important;

    box-shadow: none !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease !important;
}


.newsletter input:focus {
    outline: none !important;

    border-color: rgba(0,0,0,.28) !important;

    box-shadow: 0 0 0 3px rgba(0,0,0,.04) !important;
}


/* botão newsletter */

.newsletter .botao,
.newsletter button {
    min-width: 44px !important;
    height: 44px !important;

    border-radius: 9px !important;

    box-shadow: none !important;

    transition:
        transform .18s ease,
        opacity .18s ease !important;
}


.newsletter .botao:hover,
.newsletter button:hover {
    transform: translateY(-1px) !important;
    opacity: .92 !important;
}


/* =========================
   MOBILE
   ========================= */

@media (max-width: 767px) {

    .coluna {
        padding: 0 8px !important;
    }

    .menu.lateral .nivel-um > li {
        margin-bottom: 6px !important;
    }

    .menu.lateral .nivel-um > li > a {
        min-height: 44px !important;

        padding: 0 15px !important;

        font-size: 13px !important;
    }

    .newsletter {
        padding: 16px !important;
        border-radius: 11px !important;
    }

}


/* =========================================================
   PROMOVCAR - SETAS APENAS NO MOBILE
   ========================================================= */

/* DESKTOP / TABLET */
@media (min-width: 768px) {

    .pc-seta,
    .pc-seta-nova,
    .pc-sec-seta,
    .pc-home-seta,
    .pc-carousel-arrow,
    .pc-seta-produto,
    .pc-seta-carousel,
    .pc-seta-independente,

    .flex-direction-nav,
    .flex-prev,
    .flex-next,

    .owl-prev,
    .owl-next,

    .slick-prev,
    .slick-next {

        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .pc-seta,
    .pc-seta-nova,
    .pc-sec-seta,
    .pc-home-seta,
    .pc-carousel-arrow,
    .pc-seta-produto,
    .pc-seta-carousel,
    .pc-seta-independente {

        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

}