/* Fontes */
@font-face {
  font-family: 'Neufile Grotesk Light';
  src: url('../tipografia/TIPOGRAFIA/letter_omega_typefoundry_-_neufile_grotesk_light_extended-webfont.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Neufile Grotesk Regular';
  src: url('../tipografia/letter_omega_typefoundry_-_neufile_grotesk_regular_extended-webfont.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Neufile Grotesk Semi Bold';
  src: url('../tipografia/letter_omega_typefoundry_-_neufile_grotesk_semibold_extended-webfont.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Neufile Grotesk Bold';
  src: url('../tipografia/letter_omega_typefoundry_-_neufile_grotesk_bold_extended-webfont.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Neufile Grotesk Extra Bold';
  src: url('../tipografia/letter_omega_typefoundry_-_neufile_grotesk_extrabold_extended-webfont.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
}

/* Reset */
* {
  box-sizing: border-box;
  background-color: #F3E4DD;
}

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  font-family: 'Neufile Grotesk Regular', sans-serif;
  font-weight: 400;
  color: #272727;
}

/* BotÃµes de idioma - estilo geral */
.idioma-botoes {
  display: flex;
  gap: 10px;
}

.idioma-botao {
  all: unset;
  display: inline-block;
  font-size: 2vw;
  font-family: "Neufile Grotesk Regular", sans-serif;
  color: grey;
  margin: 0;
  cursor: pointer;
  user-select: none;
  pointer-events: auto !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.3s;
  position: relative;
  z-index: 1001;
}

.idioma-botao.ativo {
  color: black;
}

/* Esconde ambos por padrÃ£o */
.idioma-banner,
.idioma-footer {
  display: none;
}
@media (max-width: 768px) {
  /* Esconde o idioma-banner do header no mobile, pois já existe no banner-container */
  #header-container .idioma-banner {
    display: none !important;
  }
  
  /* Mostra apenas o idioma-banner do banner-container */
  .banner-container .idioma-banner {
    display: flex;
    position: absolute;
    top: 99%;
    right: 6%;
    align-items: center;
    z-index: 1000;
    background-color: transparent !important;
  }
  
  .idioma-banner .idioma-botao {
    font-size: clamp(14px, 2vw, 24px);
    min-width: 20px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
  
/* Desktop (banner) */
@media (min-width: 768px) {
  .idioma-banner {
    display: flex;
    position: fixed;
    top: 50%;
    left: 2.5%;
    transform: translate(-50%, -50%);
    flex-direction: column;
    align-items: center;
    z-index: 1000;
  }

  .idioma-footer {
    display: none;
  }

  .idioma-banner .idioma-botao {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: clamp(14px, 2vw, 24px);
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* Mobile (footer) */
@media (max-width: 767px) {
  .footer-bottom {
    position: relative; /* ReferÃªncia para posicionamento absoluto */
  }

  .idioma-footer {
    display: flex;
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    gap: 10px;
    align-items: center;
    font-size: clamp(14px, 4vw, 18px);
    font-family: "Neufile Grotesk Regular", sans-serif;
    z-index: 10;
    margin-bottom: 10%;
  }

  .idioma-footer .idioma-botao {
    all: unset;
    display: flex;
    cursor: pointer;
    color: grey;
    pointer-events: auto;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    transition: color 0.3s;
  }

  .idioma-footer .idioma-botao.ativo {
    color: black;
  }
}

/* Ajuste para telas muito pequenas */
@media (max-width: 500px) {
  .idioma-footer {
    font-size: 4vw;
  }
}
