body {
    font-family: "Roboto", "sans-serif";
}
/* INICIO PERSONALIZACAO DAS CORES DOS BOTOES*/

.alert-warning {
    background: #ff0000;
    color: #fff;
}

.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show>.btn-success.dropdown-toggle {
    background-color: #ff0000;
    border-color: #ff0000;
}

.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show>.btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 0, 0, 0.5);
}

.btn-success.focus, .btn-success:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 0, 0, 0.5);
}

.btn-success {
    background-color: #ff0000;
    border-color: #ff0000;
}
.btn-success:hover {
    background-color: #015Aff;
    border-color: #015Aff;
}
.btn-light {
    background-color: #015Aff;
    border-color: #015Aff;
    color: #fff;
}

/* FIM PERSONALIZACAO DAS CORES DOS BOTOES*/

.search__button {
    background: #015Aff;
}

.loading__spinner {
    color: #ED3237;
}

.site-header {
    background-color: #015Aff !important;
}
.site-header__logo img {
    height: 70px;
}

.site-header__cart i {
    color: #999;
}

.site-header__cart i:hover {
    color: #5a5a5a;
}

.site-header__cart .indicator__value {
    background-color: #ED3237;
    color: #fff;
}

.footer-contacts__text img {
    height: 70px;
}

.footer-apps__text img {
    width: 120px;
}

.nav-panel {
    background: #015Aff;
    color: #FFF;
}

.block-brands__slider .owl-nav i, .block-products-carousel__slider .owl-nav i {
    color: #ED3237;
}

.block-products-carousel__column .product-card__name {
    min-height: 55px;
}

.block-products-carousel__column .product-card__prices {
    min-height: 35px;
    margin-bottom: 10px;
}

.block-products-carousel__column .product-card__buttons {
    margin-top: 0px;
}

.product-card__prices {
    min-height: 15px;
}

.product-card__price {
    color: #015Aff;
}

.product-card__new-price {
    color: #015Aff;
}

.product__price {
    color: #015Aff;
}

.product__new-price {
    color: #015Aff;
}

.top-button {
    color: #015Aff;
}

@media (max-width: 991px) {
    .indicator__value {
        background: #015Aff;
        color: #FFF;
    }
}

.page-header__back i {
    color: #015Aff;
}

.input-check__input:checked ~ .input-check__box {
    background: #015Aff;
}

.block-slideshow .owl-carousel .owl-dot {
    background: #999;
}

.block-slideshow .owl-carousel .owl-dot.active {
    background: #ED3237;
}

.block-header__arrow {
    background: transparent;
    color: #ED3237;
}

.block-header__arrow:hover {
    background: #f7f7f7;
    color: #999;
}

.block-header__arrow:active {
    background: transparent;
    color: #015Aff;
}

.block-header__arrow:focus {
    background: #f7f7f7;
    color: #015Aff;
}

.filter__arrow {
    color: #ED3237;
}

.site-newsletter__title {
    color: #fff;
    background: #015Aff;
}
.site-newsletter {
    background: #015Aff;
}

.service-bar {
    background: #ff0000;
    color: #fff;
}

.footer-links__title {
    color: #015Aff;
}

.footer-contacts__title, .service-bar__title:hover {
    color: #015Aff;
}

.footer-newsletter__title {
    color: #015Aff;
}

.footer-payment__title {
    color: #015Aff;
}

.footer-seals__title {
    color: #015Aff;
}

.footer-apps__title {
    color: #015Aff;
}

.megamenu__links--level--1 .megamenu__item a {
    font-size: 14px;
    white-space: nowrap;
    margin-right: 15px;
}

.footer-seals__text img {
    width: 50%!important;
}

.block-header__title {
    color: #015Aff;
}

.page-header__title {
    color: #015Aff;
}

.product__name {
    color: #015Aff;
}

.container__products-carousel-grid {
    margin-top: 30px;
}

.product-tabs__item {
    color: #015Aff;
}

.product-tabs__item:hover {
    color: #015Aff;
}

.product-tabs__item--active {
    border-bottom-color: #015Aff;
}

.block-products-carousel[data-layout=grid-5] .product-card .product-card__actions {
    padding: 15px 15px 15px;
}

[dir=ltr] .nav-panel__nav-links {
    margin-right: 0px;
    height: 46px;
}

.nav-links__list {
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.nav-links__item-link:hover {
    color: #ED3237;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .nav-links__item-link {
        font-size: 12px;
        font-weight: 500;
        white-space: nowrap;
    }
}

@media (min-width: 1200px) {
    .nav-links__item-link {
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
    }
}

.nav-links__item--has-submenu .nav-links__item-body {
    padding-right: 15px!important;
}

.nav-links__item-body .fa-chevron-down {
    display: none;
}

.megamenu__links--level--1 > .megamenu__item > a {
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    padding-right: 20px;
}

.megamenu__links--level--1 > .megamenu__item > a:hover {
    color: #015Aff;
}

.megamenu__links--level--1 > .megamenu__item > a:active {
    color: #015Aff;
}

.megamenu__links--level--1 > .megamenu__item > a:focus {
    color: #015Aff;
}

.nav-links__item {
    margin-left: 2px;
    margin-right: 2px;
}

.topbar {
    background: #015Aff;
}

.topbar-link:hover {
    color: #fff;
}

.topbar-link {
    background: #ff0000;
    color: #fff;
    padding: 10px;
}
.topbar-dropdown__btn {
    color: #fff;
}

.topbar-message {
    background: #606061;
    color: #FFF;
    min-height: 40px;
    padding: 10px;
}

.topbar-message .fa-shipping-fast {
    font-size: 20px;
}

.topbar-app {
    background: #e1e1e1;
    color: #FFF;
    min-height: 40px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 0px;
    padding-right: 0px;
}

.topbar-app img {
    background: #FFF;
    padding: 7px;
    box-shadow: 1px 1px 3px #606061;
    -webkit-box-shadow: 1px 1px 3px #606061;
    -moz-box-shadow: 1px 1px 3px #606061;
    border-radius: 10px;
    height: 48px;
}

.topbar-app .btn {
    font-weight: 500;
    border-radius: 5px;
    box-shadow: 1px 1px 3px #606061;
    -webkit-box-shadow: 1px 1px 3px #606061;
    -moz-box-shadow: 1px 1px 3px #606061;
}

/* 1. ÍCONES DO CARRINHO E LISTA DE DESEJOS (Deixar Brancos) */
.site-header__cart i {
    color: #FFFFFF !important;
}
.site-header__cart i:hover {
    color: #e2e2e2 !important;
}

/* 2. TEXTOS DE CONTATO (Telefone e WhatsApp Brancos) */
/* Seletores genéricos para forçar a cor branca em contatos no cabeçalho */
.site-header a[href*="whatsapp"],
.site-header a[href*="tel"],
.site-header .fa-whatsapp,
.site-header .fa-phone,
.site-header-contact,
.site-header span,
.site-header p {
    color: #FFFFFF !important;
}


.site-header form,
.site-header .search,
.site-header__search {
    background-color: #FFFFFF !important;
    border-radius: 30px !important;
    border: none !important;
    box-shadow: none !important;

    /* Mantém a altura fina */
    height: 38px !important;

    /* AJUSTE AQUI: 15px de espaço nas laterais para segurar o microfone dentro da barra */
    padding: 0px 15px !important;

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

/* CÓDIGO DO MICROFONE: Garante que ele fique no canto esquerdo com um respiro */
.site-header form i.fa-microphone,
.site-header form .fa-microphone,
[class*="microphone"] {
    margin-right: 10px !important;
    /* Afasta o texto digitado para a direita */
    margin-left: 5px !important;
    /* Garante que ele não cole na borda esquerda da barra */
    color: #015Aff !important;
    font-size: 16px !important;
}
/* 3. BARRA DE PESQUISA (Branca, Arredondada, sem linha extra e mais Fina) */
/* Fundo branco e cantos arredondados na caixa principal */
.site-header form,
.site-header .search,
.site-header__search {
    background-color: #FFFFFF !important;
    border-radius: 30px !important;
    /* Cantos arredondados */
    border: none !important;
    /* Remove a linha branca/borda inferior */
    box-shadow: none !important;
    /* Remove sombras que parecem linhas */

    /* MODIFICAÇÕES PARA DEIXAR MAIS FINA: */
    padding: 0px 15px !important;
    /* Zeramos o espaçamento vertical e aumentamos um pouco o das laterais */
    height: 38px !important;
    /* Força a barra a ter uma altura menor (ajuste esse número se quiser mais fina ou mais grossa) */
    display: flex !important;
    /* Garante que o conteúdo interno se alinhe ao novo tamanho */
    align-items: center !important;
    /* Centraliza a lupa e o texto verticalmente dentro da barra fina */
}

/* Input (onde digita): Transparente para usar o fundo branco da caixa */
.site-header input[type="text"],
.site-header input.search__input {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #333333 !important;
    /* Texto que o cliente digitar fica escuro */
    outline: none !important;
    /* Remove linha extra ao clicar */
}

/* 4. ÍCONES DENTRO DA PESQUISA (Lupa e Microfone) */
.site-header form button,
.site-header .search__button,
.site-header form i {
    background: transparent !important;
    color: #015Aff !important;
    /* Ícones em azul para contrastar com o fundo branco */
    border: none !important;
}

/* ELIMINAR QUALQUER BORDA OU SOMBRA DO TOPO */
.site-header,
.site-header__search,
.topbar,
.nav-panel {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
}

/* AJUSTE DE RECORTE DO TOPO */
.site-header {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}
.nav-panel {
    margin-top: 0px !important;
    padding-top: 0px !important;
}

/* 3. BARRA DE PESQUISA (Ajustada, Fina e com Elementos Alinhados) */
.site-header form,
.site-header .search,
.site-header__search {
    background-color: #FFFFFF !important;
    border-radius: 30px !important;
    border: none !important;
    box-shadow: none !important;

    /* Mantém a barra fina */
    height: 38px !important;
    padding: 0px 15px !important;

    /* Alinhamento base */
    display: flex !important;
    align-items: center !important;
}

/* Força o campo de texto a ocupar o espaço correto e trazer as palavras de volta */
.site-header input[type="text"],
.site-header input.search__input {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #333333 !important;
    outline: none !important;

    /* Garante o preenchimento correto na horizontal */
    width: 100% !important;
    max-width: 80% !important;
    /* Deixa margem nas pontas para os ícones */
    height: 100% !important;
    padding: 0px 10px !important;

    /* Faz o texto do "Busca por..." reaparecer alinhado */
    line-height: 38px !important;
}

/* Organiza os botões (Lupa e Microfone) de forma independente */
.site-header form button,
.site-header .search__button,
.site-header__search button,
.site-header form .search__button {
    background: transparent !important;
    color: #015Aff !important;
    border: none !important;
    box-shadow: none !important;

    /* Mantém os botões em formato quadrado e centralizado */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: 35px !important;
    /* Como modificar para criar distância: */
    margin-left: 10px !important;
    /* Cria espaço na esquerda de cada botão, afastando-os do texto */
    margin-right: 5px !important;
    /* Cria espaço na direita */
    padding: 0 !important;
}

/* Ajuste fino para os ícones internos não herdarem tamanhos gigantes */
.site-header form i,
.site-header__search i {
    color: #015Aff !important;
    font-size: 16px !important;
    /* Tamanho ideal para a barra fina */
}

/* 1. Remove a trava do texto para ele ocupar o espaço real */
.site-header input[type="text"],
.site-header input.search__input {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #333333 !important;
    outline: none !important;

    flex: 1 !important;
    /* Faz o texto crescer */
    max-width: none !important;
    /* REMOVE a trava que causou o erro */
    width: 100% !important;
    height: 100% !important;
    padding: 0px 15px !important;
}

/* 2. Joga a Lupa e o X para o extremo direito */
.site-header form button,
.site-header .search__button,
.site-header__search button {
    background: transparent !important;
    color: #015Aff !important;
    border: none !important;
    box-shadow: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: 35px !important;

    /* A MÁGICA AQUI: Empurra os botões para o canto direito */
    margin-left: auto !important;
    margin-right: 5px !important;
    /* Dá um respiro para não colar na borda azul */
}

/* 3. BARRA DE PESQUISA */
.site-header form,
.site-header .search,
.site-header__search {
    background-color: #FFFFFF !important;
    border-radius: 30px !important;
    border: none !important;
    box-shadow: none !important;

    height: 38px !important;
    padding: 0px 15px !important;

    /* CORREÇÃO DO ERRO: Força o formulário a ocupar toda a barra branca */
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* O campo de texto estica para ocupar o espaço do meio e empurra o X e a Lupa */
.site-header input[type="text"],
.site-header input.search__input {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #333333 !important;
    outline: none !important;

    /* Faz o campo crescer ocupando todo o vazio */
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0px 10px !important;
}

/* Trava a Lupa e o X na direita e impede que sejam esmagados */
.site-header form button,
.site-header .search__button,
.site-header__search button {
    background: transparent !important;
    color: #015Aff !important;
    border: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: auto !important;
    padding: 0 5px !important;

    /* Trava os botões para não encolherem e empurra eles para o final */
    flex-shrink: 0 !important;
}

/* Garante o Microfone no canto esquerdo */
.site-header form i.fa-microphone,
.site-header form .fa-microphone,
[class*="microphone"] {
    margin-right: 5px !important;
    flex-shrink: 0 !important;
}

.site-header form i,
.site-header__search i {
    color: #015Aff !important;
    font-size: 16px !important;
}

/* FORÇA BRUTA: FALE CONOSCO E TODOS OS CONTATOS BRANCOS */
.site-header [class*="contact"],
.site-header [class*="contact"] *,
.site-header [class*="phone"],
.site-header [class*="phone"] *,
.site-header p,
.site-header small,
.site-header span,
.site-header .text-muted {
    color: #FFFFFF !important;
}

/* REMOVER VÃO BRANCO ENTRE NEWSLETTER E BARRA DE SERVIÇOS */
.site-newsletter {
    margin-bottom: 0px !important;
    border-bottom: none !important;
}

.service-bar {
    margin-top: 0px !important;
    border-top: none !important;
}

/* Limpa a caixa externa da pesquisa e PUXA A BARRA PARA CIMA no PC */
.site-header .search, .site-header__search {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    /* Zera qualquer margem que estava quebrando o menu */

    /* O NOVO TRUQUE: Sobe a barra flutuando sem quebrar o que está embaixo */
    transform: translateY(-25px) !important;
}

//* ========================================= */
/* 1. REGRAS GERAIS (PC E CELULAR)           */
/* ========================================= */

.site-newsletter {
    margin-bottom: 0px !important;
    border-bottom: none !important;
}
.service-bar {
    margin-top: 0px !important;
    border-top: none !important;
}

/* ========================================= */
/* 2. EXCLUSIVO PARA COMPUTADOR (DESKTOP)    */
/* ========================================= */
@media (min-width: 992px) {

    /* Contatos do cabeçalho em Branco */
    .site-header [class*="contact"], .site-header [class*="contact"] *,
    .site-header [class*="phone"], .site-header [class*="phone"] *,
    .site-header p, .site-header small, .site-header span, .site-header .text-muted {
        color: #FFFFFF !important;
    }

    /* Limpa a caixa externa da pesquisa e PUXA A BARRA PARA CIMA no PC */
    .site-header .search, .site-header__search {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 auto !important;

        /* O ELEVADOR DO PC (Se precisar subir mais, mude para -20px, -25px...) */
        transform: translateY(-15px) !important;
    }

    /* TRATAMENTO DE CHOQUE: Transforma APENAS a pesquisa na pílula branca */
    .site-header .search form, .site-header__search form {
        background-color: #FFFFFF !important;
        border-radius: 30px !important;
        border: 1px solid #cccccc !important;
        overflow: hidden !important;
        height: 38px !important;
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Configura APENAS o campo de digitar o texto da pesquisa */
    .site-header .search input, .site-header__search input {
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        color: #333333 !important;
        outline: none !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        height: 100% !important;
        padding: 0px 10px !important;
        max-width: none !important;
    }

    /* Trava a Lupa e o X no canto direito */
    .site-header .search button, .site-header__search button {
        background: transparent !important;
        color: #015Aff !important;
        border: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 100% !important;
        width: auto !important;
        padding: 0 5px !important;
        flex-shrink: 0 !important;
        margin-left: auto !important;
        margin-right: 5px !important;
    }

    /* Garante o Microfone no canto esquerdo */
    .site-header .search i.fa-microphone, .site-header__search .fa-microphone, [class*="microphone"] {
        margin-left: 10px !important;
        margin-right: 5px !important;
        flex-shrink: 0 !important;
        color: #015Aff !important;
        font-size: 16px !important;
    }
}

/* ========================================= */
/* 3. EXCLUSIVO PARA CELULAR (MOBILE)        */
/* ========================================= */
@media (max-width: 991px) {

    /* O painel azul: Forçamos a altura para empurrar o banner para baixo */
    .mobile-header {
        background-color: #015Aff !important;
        position: relative !important;
        height: 120px !important;
        box-shadow: none !important;
        border-bottom: none !important;
    }

    .mobile-header__panel {
        box-shadow: none !important;
        border-bottom: none !important;
    }

    /* Ícones do menu e carrinho em Branco */
    .mobile-header i, .mobile-indicator i, .mobile-header__menu-button i {
        color: #FFFFFF !important;
    }

    /* Bolinha do carrinho em Vermelho */
    .mobile-indicator .indicator__value {
        background-color: #ff0000 !important;
        color: #FFFFFF !important;
    }

    /* A barra: Flutuando no fundo azul, em segurança */
    .mobile-header .search,
    .mobile-header__search,
    .mobile-search {
        position: absolute !important;
        bottom: 15px !important;
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        margin-left: 15px !important;
        margin-right: 15px !important;
        background-color: #015Aff !important;
        padding: 0 !important;
        border: none !important;
        z-index: 99 !important;
    }

    /* TRATAMENTO DE CHOQUE 2: Transforma APENAS a pesquisa do celular na pílula branca */
    .mobile-header .search form, .mobile-header__search form, .mobile-search form {
        display: flex !important;
        align-items: center !important;
        border: 1px solid #cccccc !important;
        border-radius: 30px !important;
        background-color: #FFFFFF !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }

    /* Campo de texto do celular restrito apenas à pesquisa */
    .mobile-header .search input, .mobile-header__search input, .mobile-search input {
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        height: 40px !important;
        padding-left: 15px !important;
        flex: 1 !important;
        width: 100% !important;
        outline: none !important;
    }

    /* Lupa do celular alinhada à direita em Azul */
    .mobile-header .search button, .mobile-header__search button, .mobile-search button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        width: 45px !important;
        height: 40px !important;
        color: #015Aff !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .mobile-header .search button i, .mobile-header__search button i, .mobile-search button i {
        color: #015Aff !important;
        font-size: 18px !important;
        display: block !important;
    }
}