/* ============================================================
   custom.css  ?  PrestaShop 8 / Bootstrap 4
   Variáveis globais e estilos gerais do tema.
   Estilos específicos do header estão em header.css.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;700;900&display=swap');

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

/* ============================================================
   VARIÁVEIS
   ============================================================ */
:root {
   --principal: #117b4b;
   --secundaria: #000000;
   --terciaria: #f9d543;
   --quaternaria: #e0292b;
   --highlight: #FFFFFF;
   --logo-width: 180px;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
body {
   font-family: 'Poppins', sans-serif;
   font-weight: 500;
}

p,
.page-content.page-cms ul {
   color: #000;
}

a {
   color: var(--principal);
}

a:hover {
   color: var(--principal);
}

.h1,
.h2,
.h3,
.h4,
body {
   color: #000;
}

.h1,
.h2,
.h3 {
   color: #000;
   text-transform: none;
}

.no-pad {
   padding-left: 0;
   padding-right: 0;
}

.img-responsive {
   height: auto;
   max-width: 100%;
}

.hide {
   display: none !important;
}

.form-control {
   border-radius: 6px;
}

.form-control:focus {
   outline: none;
}

.card,
body#checkout section.checkout-step {
   border-radius: 10px;
   border: 0 none;
}

/* ============================================================
   BOTÕES
   ============================================================ */
.btn-primary {
   background: #fff;
   color: #000;
   text-transform: none;
   font-weight: normal;
}

.btn-primary:focus,
.btn-primary:hover {
   background-color: #f2f2f2 !important;
   color: var(--principal) !important;
}

.btn-primary.disabled,
.btn-primary:disabled {
   background-color: var(--principal);
}

.btn-outline-primary {
   color: var(--principal);
   border-color: var(--principal);
}

.btn-outline-primary.active,
.btn-outline-primary:active,
.btn-outline-primary:focus,
.btn-outline-primary:hover {
   background-color: var(--principal);
   border-color: var(--principal);
}

.btn-link {
   color: var(--principal);
}

.btn:hover,
.card-block.checkout .btn-primary:hover,
#blockcart-modal .btn-primary:hover,
#add-to-cart-or-refresh .btn-primary:hover,
#customer-form .btn-primary:hover,
#login-form .btn-primary:hover {
   background: #333 !important;
   color: #fff !important;
}

.btn-info,
.card-block.checkout .btn-primary,
#blockcart-modal .btn-primary,
#add-to-cart-or-refresh .btn-primary,
#customer-form .btn-primary,
#login-form .btn-primary {
   background: #000;
   color: #fff;
   transition: all .2s ease;
   border-radius: 6px;
}

#login-form .btn-primary {
   width: 100%;
   max-width: 288px;
}

.input-group .input-group-btn>.btn {
   color: var(--principal);
}

.input-group .input-group-btn>.btn[data-action=show-password] {
   background: var(--principal);
   color: #fff;
}

.bootstrap-touchspin .group-span-filestyle .btn-touchspin,
.group-span-filestyle .btn-default {
   background: #fff;
}

/* ============================================================
   HEADER
   ============================================================ */
#header {
   background: var(--highlight);
   box-shadow: none;
}

#header a {
   color: #000;
}

#header a:hover {
   color: #000;
}

#header .header-nav {
   background-color: #fff;
   border-bottom: 0 none;
}

#header .header-nav,
#header .header-nav a {
   color: #fff;
}

/* Topo (header-top) */
#header .header-top,
body#checkout #header {
   background: #f4f1ec;
   color: #000;
   padding-top: 5px;
   padding-bottom: 5px;
}

#header .header-top ._whatsapp {
   color: #000;
}

#header .header-top ._whatsapp i {
   color: #25d366;
}

/* Barra superior opcional (_desktop_top) */
#header ._desktop_top {
   background: #fff;
   color: #000;
   font-size: 14px;
   padding-top: 10px;
   padding-bottom: 10px;
}

#header ._desktop_top i.fa {
   color: #1565ab;
}

#header ._desktop_top ._instagram i.fa {
   color: #f10071 !important;
}

/* Link de contato */
#header .header-top #_desktop_contact_link {
   display: inline-block;
   margin-right: 28px;
   color: #000;
}

#header .header-nav #_desktop_contact_link #contact-link {
   color: var(--principal);
   margin-top: 12px;
   text-align: right;
}

/* Logo */
.header-logo img {
   width: 100%;
   max-width: var(--logo-width) !important;
   height: auto;
}

#_desktop_logo {
   padding-top: 5px;
   padding-bottom: 0;
   max-width: 270px;
}

#_desktop_logo h1,
#header #_desktop_logo h1 {
   margin-bottom: 0;
   max-width: 280px;
}

#_desktop_logo .right-nav {
   display: flex;
   justify-content: flex-end;
   align-items: center;
}

/* Carrinho */
#header #_desktop_cart .blockcart {
   color: var(--secundaria);
   background-color: var(--terciaria);
   border: 1px solid transparent;
   border-radius: 20px;
   padding: 6px 12px;
   text-align: center;
}

#header .header-nav .blockcart {
   background-color: transparent;
}

#header #_desktop_cart .blockcart.active a,
#header #header-top .blockcart i {
   color: var(--secundaria) !important;
   margin-right: 5px;
   font-size: 20px;
   top: 1px;
   position: relative;
}

#header #_desktop_cart .blockcart span {
   position: relative;
   top: -2px;
   font-weight: bold;
}

#header .header-nav .cart-preview.active a,
#header .header-nav .cart-preview.active i {
   color: #000;
}

#header .header-nav .cart-preview.active {
   background-color: transparent;
}

#header .header-nav .cart-preview i {
   color: var(--principal);
}

#header .header-nav .blockcart a:hover {
   color: var(--principal);
}

#header .cart-products-count {
   color: var(--highlight);
   background-color: var(--quaternaria);
   border-radius: 50%;
   min-width: 22px;
   height: 22px;
   line-height: 22px;
   text-align: center;
   display: inline-block;
   font-size: 12px;
   font-weight: bold;
   position: relative;
}

#_desktop_cart {
   display: inline-block;
}

/* Busca inline (widget dentro do header-top) */
#header #header-top .search-widgets {
   width: 100%;
   max-width: 100%;
}

#header-top .search-widgets form input[type=text] {
   border-radius: 10px !important;
   padding: 12px 20px 12px 40px !important;
   color: var(--principal);
   border: 1px solid #d9dabd;
   width: 100%;
   max-width: 100%;
   background: #FFF;
}

#search_widget form i {
   color: var(--principal);
}

#header-top .search-popup.open .search-widgets {
   width: 90%;
   float: none !important
}

/* Usuário */
#_desktop_user_info {
   display: inline-block;
   position: relative;
}

#_desktop_user_info .user-info a {
   color: var(--quaternaria);
   background: var(--highlight);
   border-radius: 60px;
   border: 1px solid var(--highlight);
   cursor: pointer;
   margin: 0 0 0 0;
   width: 45px;
   height: 44px;
   padding: 9px;
   display: block;
   text-align: center;
   transition: .5s;
}

#_desktop_user_info .user-info a:hover {
   background: #fff;
   color: var(--quaternaria);
}

#_desktop_user_info .user-info a i {
   position: relative;
   font-size: 24px
}

#_desktop_user_info .user-info a i.logged::after {
   width: 6px;
   height: 6px;
   display: block;
   position: absolute;
   content: '';
   background: var(--principal);
   top: -2px;
   right: 0;
   border-radius: 10px;
}

#_desktop_user_info .user-info a:hover i {
   color: var(--principal);
}

/* Dropdown de conta */
.account-dropdown {
   position: absolute;
   top: 53px;
   right: -20px;
   width: 260px;
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 8px 25px rgba(0, 0, 0, .15);
   padding: 13px;
   display: none;
   z-index: 9999;
}

.account-dropdown.active {
   display: block;
   animation: fadeDown .2s ease;
}

@keyframes fadeDown {
   from {
      opacity: 0;
      transform: translateY(-10px);
   }

   to {
      opacity: 1;
      transform: translateY(0);
   }
}

.account-dropdown-arrow {
   position: absolute;
   top: -8px;
   right: 35px;
   width: 16px;
   height: 16px;
   background: #fff;
   transform: rotate(45deg);
}

.account-login-btn {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 5px;
   background: var(--highlight);
   border: 0;
   color: var(--principal) !important;
   font-weight: 600;
   border-radius: 6px;
   padding: 12px 0 12px 12px;
   transition: 0.5s;
}

.account-login-btn:hover {
   background: var(--principal) !important;
   color: #fff !important;
}

.account-login-btn i {
   margin-right: 0 !important;
}

.account-separator {
   display: flex;
   align-items: center;
   margin: 10px 0;
   color: var(--principal);
}

.account-separator::before,
.account-separator::after {
   content: "";
   flex: 1;
   height: 1px;
   background: var(--highlight);
}

.account-separator span {
   padding: 0 12px;
}

.account-register {
   text-align: center;
   color: #333;
}

.account-register a {
   color: black !important;
   background-color: var(--terciaria);
   font-weight: 600;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 5px;
   text-decoration: none;
   border-radius: 6px;
   padding: 12px 0;
   transition: 0.5s;
}

.account-register a:hover {
   text-decoration: underline;
   background: #f4f1ec;
   color: var(--principal) !important;
}

.criarconta-aviso {
   background: #f9ec00;
   color: #000;
    border-radius: 5px;
    padding: 5px 10px;
    display: inline-block;
    font-size: 11px;
    margin-bottom: 10px
}

/* ============================================================
   MENU DESKTOP (top-menu / displayNavFullWidth)
   ============================================================ */
#header #_desktop_top_menu {
   display: flex;
   justify-content: flex-start;
}

._display_menu {
   background: var(--principal);
}

._display_menu .container {
   text-align: center;
}

#header #top-menu {
   margin-bottom: 0;
   /*display: flex;
    justify-content: space-between;
    width: 100%;*/
}

#header #top-menu>li {
   margin-right: 5px;
   position: relative;
}

#header #top-menu>li>a,
#header #top-menu>.category>a {
color: #fff;
    padding: 14px 25px 16px;
    font-size: 16px;
    position: relative;
    display: block;
    font-weight: 600;
}

#header #top-menu>.category>a::after {
   background: transparent;
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   height: 4px;
   transition: all .2s ease;
}

#header #top-menu>.category:hover>a {
   background-color: #0b5836;
}

#header #top-menu>.category:hover a::after,
#header #top-menu>.category>a:hover::after {
   background: var(--highlight);
   border-radius: 6px;
}

.top-menu .sub-menu {
   top: 52px !important;
   margin-left: -10px;
   border-radius: 6px;
   width: 250px;
}

.top-menu[data-depth="1"] {
   margin: 0;
}

.top-menu .sub-menu ul[data-depth="1"]>li {
   float: none;
   margin: 0;
}

.top-menu .sub-menu ul[data-depth="1"]>li a {
   color: var(--principal) !important;
   white-space: normal;
   font-weight: normal;
   text-transform: none;
   padding: 10px;
   border-radius: 6px;
}

.top-menu .sub-menu ul[data-depth="1"]>li a:hover {
   color: #000 !important;
   background-color: #f2f2f2 !important;
}

#header .top-menu a[data-depth="0"]:hover {
   color: var(--principal);
}

.top-menu .sub-menu a:hover {
   color: var(--principal);
}

#_mobile_top_menu .top-menu li {
   border-bottom: 1px solid rgba(255, 255, 255, .15);
   margin-right: 0px !important
}

#_mobile_top_menu .top-menu a {
   padding: 14px 14px !important
}

/* ============================================================
   CHECKOUT ? header simplificado
   ============================================================ */
#checkout #_desktop_top_menu,
#checkout #_desktop_contact_link {
   display: none !important;
}

body#checkout a:hover {
   color: var(--principal);
}

/* ============================================================
   CARROSSEL / SLIDER
   ============================================================ */
#carousel {
   text-align: center;
   margin-bottom: 0;
}

.carousel .carousel-inner {
   height: auto;
   margin-bottom: 0;
}

._display_slider_home {
   overflow: hidden;
}

.carousel .carousel-item .caption .display-1 {
   display: none;
}

.carousel .carousel-control .icon-next:hover i,
.carousel .carousel-control .icon-prev:hover i {
   color: var(--principal);
}

/* =========================================================
   SLIDER
   ========================================================= */

#carousel .carousel-item figure {
   position: relative;
   margin: 0;
   width: 100%;
   aspect-ratio: 4 / 1;
}

#carousel .carousel-item figure>img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center center;
}


/* =========================================================
   CAPTION
   ========================================================= */

#carousel .carousel-item .caption {
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;

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

   padding: 0 !important;
   margin: 0 !important;

   text-align: left !important;

   background: transparent !important;
}


/* O container é quem determina o alinhamento horizontal */
#carousel .carousel-item .caption>.container {
   width: 100%;
   margin-left: auto;
   margin-right: auto;

   display: flex;
   align-items: center;

   text-align: left;
}


/* Conteúdo */
#carousel .carousel-item .caption-content {
   width: 100%;
   max-width: 560px;

   margin: 0;
   padding: 0;

   text-align: left;
}


/* Título */
#carousel .carousel-item .caption-content h2 {
   margin: 0 0 24px 0;
   padding: 0;

   text-align: left;

   line-height: 1;
}


/* Descrição */
#carousel .carousel-item .caption-content .caption-description {
   margin: 0;

   text-align: left;
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
#wrapper .breadcrumb {
   font-size: 12px;
   padding-top: 30px;
   padding-bottom: 20px;
}

/* ============================================================
   LISTAGEM DE PRODUTOS
   ============================================================ */
   .products {
    display: flex;
    flex-wrap: wrap;
}
.products .js-product {
    display: flex;
}
#products .products-section-title,
.featured-products .products-section-title,
.product-accessories .products-section-title,
.product-miniature .products-section-title {
   text-align: left;
   text-transform: none;
   font-weight: 400;
   font-size: 50px;
   padding: 10px 0;
   background: transparent;
   border-radius: 50px;
   color: #000;
   font-family: "Bebas Neue", sans-serif;
   font-style: normal;
   margin: 40px 0px 20px;
}

#products .products-section-title span,
.featured-products .products-section-title span,
.product-accessories .products-section-title span,
.product-miniature .products-section-title span {
   display: inline-block;
   padding-bottom: 3px;
   position: relative;
   z-index: 1;
   top: 1px;
   padding-right: 10px;
}

#products .thumbnail-container .product-thumbnail,
.featured-products .thumbnail-container .product-thumbnail,
.product-accessories .thumbnail-container .product-thumbnail,
.product-miniature .thumbnail-container .product-thumbnail {
   box-shadow: 0 0 10px 4px #f2f2f2;
}

.products .js-product .product-miniature {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#products .thumbnail-container,
.featured-products .thumbnail-container,
.product-accessories .thumbnail-container,
.product-miniature .thumbnail-container {
   /*background-color: transparent;*/
   box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, .1);
   border-radius: 8px;
   width: 100%;
   display: flex;
    flex-direction: column;
    height: 100%;
}

#products .product-title a,
.featured-products .product-title a,
.product-accessories .product-title a,
.product-miniature .product-title a {
   font-size: 16px;
   font-weight: bold !important;
   color: #000 !important;
}

#products .product-description,
.featured-products .product-description,
.product-accessories .product-description,
.product-miniature .product-description {
   background-color: transparent;
   flex: 1;
}

#products .highlighted-informations,
.featured-products .highlighted-informations,
.product-accessories .highlighted-informations,
.product-miniature .highlighted-informations {
   display: none;
}

#products .highlighted-informations .quick-view:hover,
.featured-products .highlighted-informations .quick-view:hover,
.product-accessories .highlighted-informations .quick-view:hover,
.product-miniature .highlighted-informations .quick-view:hover {
   color: var(--principal);
}

#products .all-product-link,
.featured-products .all-product-link,
.product-accessories .all-product-link,
.product-miniature .all-product-link {
   color: var(--principal);
}

#products .all-product-link:hover,
.featured-products .all-product-link:hover {
   color: #000;
}

.featured-products h2 {
   margin-bottom: 40px;
}

.featured-products .all-product-link {
   color: #000;
   text-align: center;
}

.product-flags li.product-flag {
   background-color: var(--principal);
   color: #fff;
}

.product-flags li.product-flag.on-sale {
   background-color: #000;
   color: #fff;
}

.product-flags li.product-flag.discount,
.product-flags li.product-flag.discount-amount,
.product-flags li.product-flag.discount-percentage {
   background-color: #000;
}

.product-price {
   color: var(--principal);
}

.has-discount.product-price,
.has-discount p,
.product-price {
   color: #1d1d1b;
   font-weight: normal;
}

.has-discount .discount {
   background-color: #1d1d1b;
}

/* ============================================================
   PÁGINA DE PRODUTO
   ============================================================ */
.tabs {
   box-shadow: none;
   background-color: transparent;
   padding: 0;
}

.tabs .nav-tabs .nav-link {
   color: #000;
}

.nav-tabs .nav-item.open .nav-link,
.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:focus,
.nav-tabs .nav-link.active:hover {
   background-color: transparent;
}

.tabs .nav-tabs .nav-link.active {
   color: #fff;
}

.tabs .nav-tabs .nav-link.active,
.tabs .nav-tabs .nav-link:hover {
   background-color: #000;
   border-bottom: 3px solid #000;
   color: #fff;
}

#product-modal .modal-content .modal-body .product-images img:hover {
   border: 3px solid var(--principal);
}

.product-images>li.thumb-container>.thumb.selected,
.product-images>li.thumb-container>.thumb:hover {
   border: 3px solid #000;
}

.product-customization .product-message:focus {
   outline: .1875rem solid var(--principal);
}

#blockcart-modal .product-name {
   color: var(--principal);
}

#blockcart-modal .product-name,
.cart-grid-body a.label:hover {
   color: #1d1d1b;
}

/* ============================================================
   ORDENAÇÃO / FILTROS
   ============================================================ */
.products-sort-order .select-list:hover {
   background: var(--principal);
}

.facet-dropdown.open>.select-title {
   border: 3px solid var(--principal);
}

.facet-dropdown .select-list:hover {
   background: var(--principal);
}

.pagination .current a {
   color: var(--principal);
}

.page-item.active .page-link,
.page-item.active .page-link:focus,
.page-item.active .page-link:hover {
   background-color: var(--principal);
   border-color: var(--principal);
}

.page-link {
   color: var(--principal);
}

/* ============================================================
   CATEGORIAS (coluna lateral)
   ============================================================ */
.block-categories {
   border-bottom: 1px solid #ccc;
   border-left: 3px solid var(--principal);
}

.block-categories a {
   color: #000;
}

.block-categories .collapse-icons .add:hover,
.block-categories .collapse-icons .remove:hover,
.block-categories .arrows .arrow-down:hover,
.block-categories .arrows .arrow-right:hover {
   color: var(--principal);
}

.block-categories .category-sub-menu li {
   border-top: 1px solid #f2f2f2;
}

.block-categories .category-sub-menu li[data-depth="0"]>a {
   border-bottom: 0 none;
   padding-top: 2px;
   padding-bottom: 6px;
}

.block-categories ul {
   margin-bottom: 0;
}

#left-column {
   padding-left: 0;
}

.block-category {
   min-height: 10px;
}

._display_catgories_products .block-categories {
   box-shadow: none;
   background: none;
   padding: 0;
   margin-bottom: 30px;
}

._display_catgories_products .block-categories li {
   display: inline-flex;
}

._display_catgories_products .block-categories li a {
   padding: 10px 15px;
   border-left: 2px solid rgba(0, 0, 0, .25);
}

._display_catgories_products .block-categories>ul>li>ul>li:first-child a {
   padding-left: 0;
   border-left: 0 none;
}

._display_catgories_products .block-categories>ul>li:first-child,
._display_catgories_products .block-categories .navbar-toggler {
   display: none;
}

._display_catgories_products .block-categories li a {
   border-left-color: #1d1d1b;
   border-left-width: 1px;
}

/* ============================================================
   CARRINHO / CHECKOUT
   ============================================================ */
.page-cart #content-wrapper {
   margin-top: 40px;
}

.page-order #wrapper {
   padding-top: 40px;
}

.cart-grid-body a.label:hover {
   color: #000;
}

.block-promo .promo-input+button {
   border: 2px solid #000;
}

.block-promo .promo-code-button.cancel-promo {
   color: var(--principal);
}

body#checkout section.checkout-step .address-item.selected {
   border: 3px solid var(--principal);
}

/* ============================================================
   MINHA CONTA
   ============================================================ */
.page-my-account #content .links a span.link-item {
   border-radius: 10px;
   box-shadow: 2px 2px 7px 0 rgba(0, 0, 0, .2);
}

.page-my-account #content .links a {
   font-weight: normal;
   text-transform: none;
}

.page-my-account .links a span.link-item i {
   color: var(--principal) !important;
}

.page-my-account #content .links a:hover i {
   color: var(--principal);
}

.account-list a:hover {
   color: var(--principal);
}

/* ============================================================
   CONTATO
   ============================================================ */
.page-contact .page-header {
   margin-top: 60px;
   margin-bottom: 60px;
}

.page-contact .card-block {
   background: #000;
   box-shadow: none;
   color: #fff;
   position: relative;
   margin-bottom: 100px !important;
}

.page-contact .card-block::after {
   background: #fff;
   width: 1px;
   left: -30px;
   top: 0;
   bottom: 0;
   position: absolute;
   content: '';
   display: block;
}

.contact-rich h4 {
   text-transform: none;
   color: #000;
}

.contact-rich {
   color: #000;
}

.contact-rich a {
   color: #000;
}

.page-contact .contact-form {
   background-color: transparent;
   color: #fff;
}

.page-contact .label,
.page-contact label {
   color: #fff;
}

.page-contact .contact-form h3 {
   display: none;
}

#contact-infos {
   font-size: 12px;
}

/* ============================================================
   PÁGINA GENÉRICA / CMS
   ============================================================ */
.page-content.page-cms {
   background-color: transparent;
   padding: 0;
}

#wrapper,
.page-content.page-cms {
   padding-top: 0;
   background-color: #f5f0eb;
}

#main .page-header {
   padding-top: 2%;
}

#main .page-header h1 {
   color: var(--principal);
}

#main .page-header h1 span,
.page-contact .page-header h1 span {
   background: #f5f5f5;
   display: inline-block;
   padding-bottom: 3px;
   position: relative;
   z-index: 1;
   top: 1px;
   padding-right: 10px;
}

#main .page-header h1::after,
.page-contact .page-header h1::after {
   content: '';
   display: block;
   height: 1px;
   background: var(--principal);
   width: 100%;
   position: relative;
   bottom: -10px;
}

.page-heading,
.page-subheading {
   font-family: 'PT Sans Narrow', sans-serif;
   font-size: 22px;
   letter-spacing: 3px;
}

.page-heading {
   font-size: 30px;
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.block_newsletter form input[type=email] {
   border: 1px solid var(--principal);
}

.block_newsletter form input[type=email]:focus {
   border: 3px solid var(--principal);
}

.block_newsletter form input[type=text]:focus {
   outline: 3px solid var(--principal);
}

.block_newsletter .btn-primary {
   background: var(--principal) !important;
   color: #fff;
}

.block_newsletter .btn-primary:hover {
   background: #b5cee3 !important;
   color: #fff;
}

/* ============================================================
   RODAPÉ
   ============================================================ */
#footer {
   padding-top: 20px;
}

#footer #block-newsletter-label {
   color: #fff;
   font-weight: bold;
}

.footer-container {
   box-shadow: none;
   background-color: var(--secundaria);
   color: #fff;
   margin-top: 0;
   padding-top: 40px;
   padding-bottom: 40px;
}

.block-contact .block-contact-title,
.linklist .blockcms-title a,
.footer-container .h1,
.footer-container .h2,
.footer-container .h3 {
   color: #fff;
   display: inline-block;
   text-transform: uppercase;
   padding-bottom: 15px;
   margin-bottom: 0;
   font-size: 26px !important;
   font-weight: 400;
   font-family: "Bebas Neue", sans-serif;
   font-style: normal;
}

.block-contact .block-contact-title::after,
.linklist .blockcms-title a::after,
.footer-container .h1::after,
.footer-container .h2::after,
.footer-container .h3::after {
   content: '';
   height: 3px;
   width: 15px;
   background-color: var(--terciaria);
   display: block;
   margin-top: 14px;
}

#block_myaccount_infos .myaccount-title a {
   color: #fff;
   font-size: 26px !important;
   font-weight: 400;
}

.footer-container li a {
   color: rgba(255, 255, 255, .85);
   font-size: 14px;
}

.footer-container li a:hover {
   color: #fff;
   text-decoration: underline;
}

.block-contact,
.block-contact .dropdown {
   color: rgba(255, 255, 255, .85);
   font-size: 14px;
}

.block-contact a {
   color: #fff;
   text-decoration: underline;
}

._footer-telefone {
   padding-top: 5px;
}

._footer-social {
   margin-bottom: 15px;
}

._footer-social ul {
   margin-bottom: 0;
}

._footer-social li {
   display: inline-block;
   padding: 3px 10px 0;
}

._footer-social i {
   font-size: 24px;
}

.social-links li a {
    display: flex;
    align-items: center;
    gap: 8px;
}

.block-social {
   color: #000;
   text-align: center;
}
.block-social ul {
   justify-content: center;
   gap: 20px;
}
.block-social ul li {
   background-color: rgba(255, 255, 255, .15);
   border-radius: 50%;
}

.block-social ul li:hover {
   background-color: var(--highlight);
}
.block-social li a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: auto;
    overflow: inherit !important;
    text-indent: inherit !important;
    color: var(--principal) !important;
}
.block-social li a:hover {
   color: #000 !important;
}
.block-social li::before {
   display: none;
}
.block-social li.facebook a::before {
    content: "\f344";
}

.block-social li.instagram a::before {
    content: "\f437";
}

.block-social li a::before {
    font-family: "bootstrap-icons";
    font-size: 32px;
    position: relative;
    top: 10px;
}
/* Sub-rodapé */
.subfooter-container {
   color: #000;
   background-color: #fff;
   font-size: 12px;
   padding-top: 20px;
}

.subfooter-container ._copy {
   padding-top: 20px;
   font-size: 10px;
   border-top: 1px solid #e5e5e5;
   margin-top: 20px;
   margin-bottom: 20px;
}

.subfooter-container ._direitos {
   text-align: center;
   padding-top: 30px;
   padding-bottom: 30px;
}

._developer {
   font-size: 11px;
   letter-spacing: 1px;
   margin-bottom: 20px;
}

._developer a {
   color: var(--principal);
}

/* ============================================================
   CARROSSEL DE MARCAS / HPP
   ============================================================ */
.hppColumnBlock .hppback,
.hppCarouselBlock .hppback,
.hppColumnBlock .hppforward,
.hppCarouselBlock .hppforward {
   font-size: 36px;
   color: #b5cee3;
   top: 42%;
   background: #fff;
   z-index: 1;
   border-radius: 200px;
   box-shadow: 2px 2px 5px rgba(0, 0, 0, .2);
}

.hppColumnBlock .hppback,
.hppCarouselBlock .hppback {
   left: -15px;
}

.hppColumnBlock .hppforward,
.hppCarouselBlock .hppforward {
   right: -15px;
}

/* YBC Manufacturer */
#ybc-mnf-block .ybc-mnf-block-title {
   display: none;
}

#ybc-mnf-block-ul .owl-carousel.owl-drag .owl-item {
   text-align: center;
}

/* ============================================================
   UTILITÁRIOS DIVERSOS
   ============================================================ */
#wrapper .banner {
   margin-top: 30px;
   margin-bottom: 60px;
}

#content-wrapper #subcategories {
   display: none;
}

.footer_materia {
   background: url(/themes/classic/assets/img/bg.png) no-repeat center;
   background-color: #1d1d1b;
   color: #fff;
   border-bottom: 2px solid #fff;
}

.footer_materia #custom-text {
   background: transparent;
   margin-bottom: 0;
}

.footer_materia #custom-text h2 {
   color: #fff;
   display: inline-block;
   text-transform: none;
   border-bottom: 2px solid #fff;
   padding-bottom: 15px;
   letter-spacing: 1px;
   margin-bottom: 30px;
}

.cms-box {
   text-align: center;
   padding: 60px 50px;
   background: #1d1d1b;
   color: #fff;
   font-family: 'PT Sans Narrow', sans-serif;
}

.cms-box p {
   font-size: 20px;
   text-align: justify;
}

.cms-box .page-subheading {
   text-align: center;
}

#custom-text {
   padding: 0px;
   background: none;
   background-color: transparent;
   margin-top: 40px;
   margin-bottom: 60px;
}

._tln_float .my-float {
   opacity: 0;
}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media (max-width: 767px) {
   :root {
      --logo-width: 120px !important;
   }

   /* Header mobile */
   #header .header-top {
      padding-top: 0;
      padding-bottom: 0;
      background-color: var(--principal);
   }

   #header .header-nav {
      background: var(--principal);
      margin-bottom: 0;
   }

   #header .header-nav .user-info {
      margin-left: 0;
   }

   #header .header-nav .blockcart {
      padding: 13px 10px;
      margin-left: 5px;
   }

   #_desktop_user_info .user-info a {
      width: 35px;
      height: 34px;
      padding: 3px
   }

   #header a,
   #header .header-nav #menu-icon .material-icons,
   #header .header-nav .cart-preview .shopping-cart {
      color: #fff;
   }

   #header .header-nav .user-info .logged {
      color: var(--principal);
   }

   /* Menu mobile offcanvas */
   #header #top-menu>.category {
      margin-right: 0;
   }

   #header #top-menu>.category>a {
      color: #fff !important;
      border-radius: 0 !important;
   }

   #mobile_top_menu_wrapper .top-menu a[data-depth="0"] {
      padding: 14px 0 14px 14px !important;
      color: #fff !important;
   }

   #mobile_top_menu_wrapper .top-menu .mega-menu-title {
      display: none;
   }

   #mobile_top_menu_wrapper .top-menu {
      display: block !important;
   }

   #header.is-open,
   #header.is-open .header-top,
   #mobile_top_menu_wrapper {
      background-color: var(--principal);
   }

   #top-menu .sub-menu {
      padding: 7px;
   }

   #mobile_top_menu_wrapper .top-menu .navbar-toggler {
      position: relative;
      top: -4px;
   }

   /* Checkout mobile */
   body#checkout #header {
      background: transparent;
      padding-top: 0;
      padding-bottom: 0;
   }

   body#checkout #header .header-nav .logo {
      max-height: 2rem;
   }

   body#checkout #header .header-nav {
      max-height: 50px;
      margin-bottom: 5px;
   }

   body#checkout #_desktop_cart {
      display: none;
   }

   /* Formulários */
   #login-form .btn-primary,
   #customer-form .btn-primary {
      width: 100%;
   }

   #contact-infos {
      padding-top: 20px !important;
   }

   /* Selos */
   ._selos_certificados {
      margin-bottom: 30px;
   }

   #products .all-product-link,
   .featured-products .all-product-link,
   .product-accessories .all-product-link,
   .product-miniature .all-product-link {
      width: 100%;
   }

   .footer-container .links ul {
      background-color: transparent !important;
   }
   .footer-container .links ul>li a {
      color: #FFF
   }
}

#ybc-mnf-block {
   background: #FFF;
   border-radius: 6px;
}

#ybc-mnf-block .ybc-mnf-block-title {
   display: block !important;
   padding: 30px 15px 0px;
   color: var(--principal);
}

#ybc-mnf-block h4:after {
   content: 'Distribuidora oficial das maiores editoras do pa\00EDs'
}

#ybc-mnf-block .ybc-mnf-block-a-img {
   text-align: center;
}

/* === Custom: linhas de contato (Ligue / WhatsApp / E-mail) no rodapé (layout enviado 2026-07-14) === */
#contact-infos .contact-infos-lines {
   margin: 15px 0 0;
   line-height: 1.8;
}

#contact-infos .contact-infos-lines strong {
   color: #fff;
}

#contact-infos .contact-infos-lines a {
   color: rgba(255, 255, 255, .85);
}

#contact-infos .contact-infos-lines a:hover {
   color: #fff;
   text-decoration: underline;
}

#contact-infos .contact-infos-email {
   margin: 15px 0 0;
}

/* === Custom: faixa de garantias (blockreassurance) em linha, 4 por linha (layout enviado 2026-07-14) === */
.display-seguranca {
   background-color: var(--principal);
   border-top: 2px solid var(--highlight);
   border-bottom: 1px solid var(--highlight);
   box-shadow: 0px -1px 5px 1px rgba(0, 0, 0, .5);
}

#block-reassurance {
   padding: 12px 0;
   margin-top: 0;
}

#block-reassurance ul {
   display: flex;
   flex-wrap: wrap;
   list-style: none;
   margin: 0;
   padding: 0 20px;
   gap: 20px;
}

#block-reassurance ul li {
   flex: 1 1 0;
   min-width: 220px;
   border-bottom: 0;
}

#block-reassurance .block-reassurance-item {
   display: flex;
   align-items: center;
   gap: 14px;
   text-align: left;
}

#block-reassurance .block-reassurance-item img {
   width: auto;
   height: 33px;
   object-fit: contain;
   flex-shrink: 0;
   margin-right: 0px;
}

#block-reassurance .block-reassurance-item {
   margin: 0;
   font-size: 12px;
   font-weight: normal;
   color: #666;
   line-height: 1.35;
}

#block-reassurance .block-reassurance-item .reassurance-title {
   display: block;
   color: var(--highlight);
   font-size: 14px;
   text-transform: uppercase;
   margin-bottom: 2px;
   font-weight: 600;
}

#block-reassurance .block-reassurance-item .reassurance-description {
   display: block;
   color: var(--terciaria);
}

#block-reassurance li .block-reassurance-item {
   padding: 10px;
}

@media (max-width: 991px) {
   #block-reassurance {
      padding: 5px 0;
   }

   #block-reassurance ul {
      /* justify-content: center;*/
   }

   #block-reassurance ul li {
      flex: 1 1 45%;
   }
}

@media (max-width: 767px) {

   #block-reassurance ul,
   .block-reassurance ul {
      display: flex;
      flex-wrap: nowrap;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
   }

   #block-reassurance li,
   .block-reassurance li {
      flex: 0 0 100% !important;
      max-width: 100%;
      justify-items: center;
      scroll-snap-align: start;
   }

   #block-reassurance ul::-webkit-scrollbar,
   .block-reassurance ul::-webkit-scrollbar {
      display: none;
   }
}

@media (max-width: 575px) {
   #block-reassurance ul li {
      flex: 1 1 100%;
   }
}

#blockcart-modal .cart-content p.cart-products-count {
   color: #000
}

/* === Custom: topbar institucional + WhatsApp no header (layout enviado 2026-07-14) === */
.header-whatsapp {
   display: block;
   line-height: 1.2;
   margin: 0 10px;
   white-space: nowrap;
}

.header-whatsapp-label {
   font-size: 10px;
   color: var(--quaternaria);
   font-weight: bold;
   opacity: .7;
   text-transform: uppercase;
   letter-spacing: .03em;
   text-align: right;
   display: block;
}

.header-whatsapp-number {
   display: inline-flex;
   align-items: center;
   gap: 4px;
   color: var(--secundaria) !important;
   font-weight: bold;
   font-size: 15px;
}

.header-whatsapp-number i {
   font-size: 16px;
   color: #01a03b;
}

.header-whatsapp-number:hover {
   color: var(--secundaria) !important;
}