/* Estilos globais que no site antigo ficavam em <style> inline no index_header.php / index_footer.php.
Estilos específicos de cada bloco ficam junto do componente do bloco (src/site/blocks). */

/* ---- index_header.php (head) ---- */
.galeria-wrapper {
  border: 3px solid #FFF;
  box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075);
}

/* ---- index_header.php (head) ---- */
body, h3, h6 {
  font-family: 'Inter', sans-serif !important;
}
.div_vermelho {
  width:100px;
  height:5px;
  background-color:#E63232;
}
.div_azul {
  width:30px;
  height:5px;
  background-color:#1E91C8;
}
.btn-primary {
  background-color: #232D5F !important;
  border-color: #232D5F !important;
}
.btn-outline-primary {
  color: #232D5F !important;
  border-color: #232D5F !important;
}
.btn-outline-primary:hover {
  color: #FFF !important;
  background-color: #232D5F !important;
}
.container_cabecalho {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
}

.titulo_cabecalho {
  font-family: Inter;
  color:#FFF;
  font-size: 30px !important;
  font-weight: 700 !important;
  text-align:center;
}
.texto_cabecalho > p {
  font-family: Inter;
  color:#FFF;
  font-size: 21px !important;
  font-weight: 400 !important;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align:center;
}

.full-screen-div {
  width: 100%;
  height: 100vh;
  background-color: white;
  position: fixed;
  top: -100%;
  animation: slideDown 1s forwards;
  display: none;
  padding:50px;
  background-image: url('/legacy/img/megamenu-bg.jpg');
  background-size: cover; /* Tornar a imagem ocupar a tela inteira */
  background-repeat: no-repeat; /* Impedir que a imagem seja repetida */
}

.full-screen-div.mostrar {
  display: block;
  z-index: 999999999999999;
}

@keyframes slideUp {
  0% {
    top: 0;
  }
  100% {
    top: -100%;
  }
}

@keyframes slideDown {
  0% {
    top: -100%;
  }
  100% {
    top: 0;
  }
}

.btn_carrinho, .div_btn_carrinho {
  display:inline-block !important;
}

p, h1, h2, h3, h4, h5, h6, h7 {
  color: #647589 !important;
}
footer .footer-links h5 {
  color: #ffffff !important;
}
.texto_cabecalho > p {
  color: #FFF !important;
}

/* ---- index_header.php (menu) ---- */
.titulo_megamenu {
  color:#000;
  font-family: Inter;
  font-size: 28px;
  font-weight: 400;
  text-transform:uppercase;
}
.link_megamenu {
  color:#000;
  font-family: Inter;
  font-size: 20px;
  font-weight: 300;
  text-transform:uppercase;
  line-height:45px;
}
.link_megamenu:hover {
  color:#000;
  text-decoration:underline;
}
.titulo_down_app {
  color:#000;
  font-family: Inter;
  font-size: 12px;
  font-weight: 500;
}
.subtitulo_down_app {
  color:#000;
  font-family: Inter;
  font-size: 12px;
  font-weight: 300;
}
.redes-sociais-menu li {
  margin-right:20px;
}
.redes-sociais-menu li a {
  color:#000;
}

h2, h3, h4 {
  text-transform: none !important;
}

header .main-navbar .nav-menu > li > a {
  padding: 0px 0 0px 0 !important;
  border-right: 1px solid #FFF !important;
  padding-right: 30px !important;
  margin-right: 30px !important;
  border-radius: 0px !important;
  font-family: Inter, sans-serif !important;
  font-weight: 300 !important;
}
@media (min-width: 992px) {
  header .main-navbar .nav-menu > li:hover .nav-submenu {
    margin-top: 22px !important;
    border-radius: 0px !important;
    padding-top: 0px !important;
    transform: translateX(-60%);
    position: absolute;
    left: 50%;
  }
}
header .main-navbar .nav-menu > li .nav-submenu {
  position: absolute;
  left: 0;
  z-index: 1;
  -webkit-box-shadow: 0 1px 5px 0 rgba(90, 90, 90, 0.2);
  box-shadow: 0 1px 5px 0 rgba(90, 90, 90, 0.2);
  padding: 15px 0 15px 0;
  background: #0B0B0B70 !important;
}
header .main-navbar .nav-menu > li .nav-submenu li a {
  border: 0;
  background: transparent;
  color: #FFF !important;
  border-radius: 0;
  font-size: 16px !important;
  font-weight: 400;
  text-transform: capitalize;
  padding: 2px 25px;
  display: block;
  letter-spacing: 0.07em;
  line-height: 1.9;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  position: relative;
  text-transform: uppercase !important;
  font-family: 'Inter', sans-serif !important;
  text-align: center;
}
header.header-6 .main-navbar .nav-menu > li .nav-submenu li a:hover {
  color: #FFF !important;
}

#mainnav-mobile {
  display:none !important;
}
#mainnav-desktop {
  display:block !important;
  margin-top: -2px;
}
#mainnav-desktop .nav-menu > li > a > .according-menu {
  display:none !important;
}
.main-navbar {
  display:block !important;
}
#mainnav-mobile .nav-menu > li > a > .according-menu {
  display:none !important;
}
@media (min-width: 100px) and (max-width: 1367px) {
  .header-right {
    display:none !important;
  }
}
@media (max-width: 1109px) {
  header .main-navbar .nav-menu.open {
    padding: 20px !important;
  }
  header .main-navbar .nav-menu > li > a {
    padding-right: 0px !important;
  }
  #mostrarMenu {
    display:none !important;
  }
  #mainnav-mobile {
    display:block !important;
  }
  #mainnav-desktop {
    display:none !important;
  }
  #mainnav-desktop .nav-menu {
    display:none !important;
  }
}

/* ---- index_header.php (menu) ---- */
header.header-1.fixed {
  background-image: none !important;
}

/* ---- index_header.php (menu mobile) ---- */
header.header-6 .menu {
  height: 60px !important;
  margin-top: 0px !important;
}
header .main-navbar-mobile .nav-menu > li {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
header .main-navbar-mobile .nav-menu > li > a {
  margin-right: 0px !important;
}

header .main-navbar-mobile .nav-menu > li > a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 300;
}
header .menu .header-right li a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 300;
}
.divisor-menu {
  border-right:1px solid #FFF;
  height:10px;
  margin-left:20px;
  margin-right:20px;
  margin-top: 11px;
}
header .main-navbar-mobile .nav-menu {
  margin-top: 0px !important;
  overflow: hidden !important;
}
@media (min-width: 900px) {
  header .main-navbar-mobile .nav-menu {
    right: -450px;
    width: 450px;
  }
}

/* ---- index_header.php (botão menu) ---- */
.btn-meu-menu {
  padding: 10px 25px 10px !important;
  border-radius: 30px !important;
}
.btn-meu-menu:hover {
  background-color: rgba(211, 211, 211, 0.2) !important;
}

/* Estilize o ícone e adicione a classe animated-icon */
.fa-regular.fa-bars-sort {
  font-size: 16px; /* Tamanho inicial das barras */
  transform: scaleX(1); /* Escala inicial horizontal (1 = normal) */
  transition: transform 0.5s ease; /* Transição suave para a escala */
}

/* Aplique a animação ao passar o mouse sobre btn-meu-menu */
.btn-meu-menu:hover .fa-regular.fa-bars-sort {
  animation: animateBars 1s; /* Nome da animação, duração e repetição */
}

@keyframes animateBars {
  0% {
    transform: scaleX(1); /* Escala inicial (normal) */
  }
  50% {
    transform: scaleX(0); /* Escala reduzida horizontalmente */
  }
  100% {
    transform: scaleX(1); /* Escala de volta ao normal */
  }
}

@media (max-width: 991px) {
  .divisor-item {
    display:none !important;
  }
}

/* ---- index_footer.php ---- */
.div-rodape-1 {
  background-color:#181818;
  padding-top:80px;
  padding-bottom:80px;
}
.titulo_rodape1 {
  font-family: Inter !important;
  color:#FFF;
  text-transform:uppercase;
  font-size:24px;
  font-weight:300 !important;
  padding-left: 0px;
}
.titulo_item_rodape1 {
  font-family: Inter !important;
  color:#FFF;
  font-size:28px;
  font-weight:500 !important;
  margin-top:30px;
  margin-bottom:30px;
}
.subtitulo_item_rodape1 > p {
  font-family: Inter !important;
  color:#FFF;
  font-size:17px;
  font-weight:300 !important;
}
.logo-fia-cba {
  text-align:right;
  padding-right: 0px;
}
.item-esq {
  padding-left:80px;
  padding-right:80px;
  border-right:1px solid #FFF;
}
.item-esq:first-child {
  padding-left:0px;
  padding-right:80px;
  border-left:0px solid #FFF;
}
.item-esq:last-child {
  padding-left:80px;
  padding-right:0px;
  border-right:0px solid #FFF;
}
@media (max-width: 991px) {
  .div-rodape-1 {
    background-color:#181818;
    padding-top:40px;
    padding-bottom:40px;
  }
  .logo-fia-cba {
    text-align:center;
    margin-top:20px;
  }
  .item-esq {
    padding-left:40px;
    padding-right:40px;
    padding-bottom: 40px;
  }
  .item-esq:first-child {
    padding-left:40px;
    padding-right:40px;
  }
  .item-esq:last-child {
    padding-left:40px;
    padding-right:40px;
    padding-bottom: 0px;
  }
  footer {
    padding-left:30px !important;
  }
}

/* ---- index_footer.php (whatsapp / cookies) ---- */
@media screen and (max-width: 640px) {
  .whats-footer a {
    right: 25px !important;
    bottom: 100px !important;
  }
}
.whats-footer a {
  position: fixed;
  right: 25px;
  bottom: 100px;
  z-index: 9999999999999;
  width: 50px;
  height: 50px;
  background-color: #25D366;
  color: #fff;
  border-radius: 20px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -moz-box-pack: center;
  -webkit-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-animation: pulsar-cia 1.9s infinite;
  -moz-animation: pulsar-cia 1.9s infinite;
  -o-animation: pulsar-cia 1.9s infinite;
  animation: pulsar-cia 1.9s infinite;
}
.whats-footer a span {
  position: absolute;
  background: red;
  top: -5px;
  left: -5px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 100%;
  font-size: 12px;
}
.whats-footer a i {
  color: #FFF !important;
  font-size: 26px !important;
  margin-right:0px !important;
}

.cookie-law-info-bar-novo {
  margin-left: 10% !important;
  margin-right: 50% !important;
  max-width: 80% !important;
  margin-bottom: 20px !important;
  border-radius: 10px !important;
}
@media screen and (max-width: 640px) {
  .cookie-law-info-bar-novo {
    margin-left: 5% !important;
    margin-right: 50% !important;
    max-width: 90% !important;
    margin-bottom: 70px !important;
    border-radius: 10px !important;
  }
}


/* ===== Fade-in das imagens (ver src/site/layout/imageFade.ts) =====
   A imagem fica invisível até carregar e então aparece suavemente. */
/* Fade por animation (e não transition) para não sobrescrever as transições de hover dos blocos. */
@keyframes img-fade-in { from { opacity: 0; } to { opacity: 1; } }
html.img-fade img[data-loaded] {
  animation: img-fade-in .6s ease;
}
html.img-fade img:not([data-loaded]) {
  opacity: 0;
}
@media (prefers-reduced-motion: reduce) {
  html.img-fade img[data-loaded] { animation: none; }
}