/*
Theme Name: ATC Theme
Theme URI: https://carrefoursolucoes.com.br
Author: Banco Carrefour
Description: Tema exclusivo do Banco Carrefour
Requires PHP: 5.7
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: atc-theme 
*/

* {
  word-break: normal;
}
header + * {
  margin-top: 0;
}

p:empty {
  display: none;
}

mark {
  padding: 0;
}

.carousel p:empty, 
.carousel br {
  display: none;
}
.btn-tooltip br {
  display: none;
}

p > a,
a.phoneLink,
.yoast-breadcrumbs a,
.wp-block-post-title > a,
.is-style-list-phone a {
  text-decoration: none;
}

.carousel-passadores {
  position: absolute;
  width: 100%;
  text-align: end;
  margin-top: -58px;
  padding: 0 0.5rem;
}
.carousel-passadores button {
  position: relative;
  width: 32px;
  height: 32px;
  display: inline-block;
  padding: 0 4px;
}
.carousel-passadores button span {
  width: 100%;
}

/* Menu Content */

.is-menu-open .wp-block-navigation__responsive-container-content {
  width: 100%;
}

/* Menus e Submenus */

/* UL pai */
.is-menu-open .wp-block-navigation__responsive-container-content > ul {
  gap: 16px !important;
  padding: 0 1rem;
  width: inherit;

  /* LI pai */
  & > li {
    width: 100%;
    align-items: flex-start !important;
    border-bottom: 1px solid #eee;
    padding-bottom: 12px;

    /* Ícone */
    &::before {
      content: "";
      display: block;
      width: 24px;
      height: 24px;
      background-image: url(../images/arrow-down.png);
      background-size: cover;
      position: absolute;
      right: 0;
    }
  
    /* Link pai */
    & > a {
      color: var(--wp--preset--color--primary) !important;
    }

    /* UL filha */
    & > ul {
      padding: 1rem 1rem 0 !important;
      justify-items: left;
    }
  }
}

.is-menu-open .wp-block-navigation__responsive-container-content > ul > li:not(:has(> ul))::before {
  background-image: none !important;
}

/* Menu LI Ícone DropDown */

.is-menu-open .wp-block-navigation__responsive-container-content > ul > li:focus:before {
  transform: rotate(180deg);
}

/* Menu Link filha */

.is-menu-open ul.wp-block-navigation__submenu-container > li:nth-child(1n+2) a {
  margin-top: 10px !important;
}

/* Menu Fechar */

.is-menu-open .wp-block-navigation__responsive-container-close {
  padding: 1rem;
}

/* Esconde os submenus por padrão */
@media (max-width: 768px) {
  .wp-block-navigation__submenu-container {
    display: none !important;
    transition: all 0.3s ease;
  }
}

.open {
  display: block !important;
}

/* Estilo para o botão do submenu */
.is-menu-open .wp-block-navigation__submenu-icon {
  margin-left: 10px !important;
}

/* Menu Fim */

/* Carrossel */

.card-thumb img {
  transition: all 0.2s ease-in-out;
}
.card-thumb:hover img {
  opacity: 0.9;
}
.btn-mobile .carousel-control-prev,
.btn-mobile .carousel-control-next {
  width: 32px;
  height: 32px;
  top: -60px;
  left: auto;
  right: 0;
  transform: scale(0.6);
}
.btn-mobile .carousel-control-prev {
  right: 30px;
}

/* --------------- Para Tablet e mobile ----------------*/

@media (max-width: 1024px) {
  /* Classes para diminuir fontes */
  .fs-md-3 {
    font-size: var(--wp--preset--font-size--2-x-large) !important;
  }
  .fs-md-4 {
    font-size: var(--wp--preset--font-size--x-large) !important;
  }
  .fs-md-5 {
    font-size: var(--wp--preset--font-size--large) !important;
  }
  .fs-md-6 {
    font-size: var(--wp--preset--font-size--medium) !important;
  }
  /* Diminuir fontes no tablet */
  :root {
    --wp--preset--font-size--5-x-large: 2.5rem;
    --wp--preset--font-size--4-x-large: 2rem;
    --wp--preset--font-size--3-x-large: 1.75rem;
    --wp--preset--font-size--2-x-large: 1.5rem;
    --wp--preset--font-size--x-large: 1.25rem;
    --wp--preset--font-size--large: 1.125rem;
    --wp--preset--font-size--medium: 1rem;
    --wp--preset--font-size--small: 0.875rem;
  }
}

/* Menu com breakpoint de 1080px */
@media (min-width: 1080px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
      display: none !important;
  }

  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
      display: block !important;
      width: 100%;
      position: relative;
      z-index: auto;
      background-color: inherit;
  }
}

/* Desligar o breakpoint de menu padrão 600px */
@media (min-width: 600px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
      display: flex;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
      display: none;
  }
}

/* --------------- Somente para Tablet ----------------*/

@media (min-width: 768px) and (max-width: 1220px) {
  .columns-tablet {
    flex-direction: column;
  }
}

/* --------------- Somente para Mobile ----------------*/

@media (max-width: 768px) {

  /* Diminuir fontes no mobile */
  :root {
    --wp--preset--font-size--5-x-large: 2rem;
    --wp--preset--font-size--4-x-large: 1.75rem;
    --wp--preset--font-size--3-x-large: 1.5rem;
    --wp--preset--font-size--2-x-large: 1.25rem;
    --wp--preset--font-size--x-large: 1.125rem;
    --wp--preset--font-size--large: 1rem;
  }

  /* Trocar imagens no banner */
  .background-mobile-none {
    min-height: auto !important;
  }
  .background-mobile-none > img {
    display: none !important;
  }
  .background-mobile-none > .wp-block-cover__inner-container {
    padding: 0 !important;
  }
  .background-mobile-none > .wp-block-cover__background {
    opacity: 1 !important;
    height: 99%;
  }

  /* 	Menu */
  .main-menu {
    padding: 0 1rem;
  }
  .wp-block-site-logo img {
    width: 100px;
  }
  header .wp-block-button__link {
    padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
    font-size: var(--wp--preset--font-size--small);
  }
  nav.wp-block-navigation {
    order: 1;
  }
  
  /* Gaps */
  .gap-mobile-0 {
    gap: 0;
  }
}