@import url(./module/normalize.css);
@import url(./module/variables.css);

/* CSS DESIGN */
@import url(./module/header.css);
@import url(./module/footer.css);
@import url(./module/home.css);
@import url(./module/projet.css);
@import url(./module/galerie.css);
@import url(./module/login.css);
@import url(./module/article.css);

/* CSS RESPONSIVE */
@import url(./responsive/headerRS.css);
@import url(./responsive/homeRS.css);
@import url(./responsive/footerRS.css);
@import url(./responsive/projetRS.css);



.goog-te-gadget-simple{
  background-color: transparent !important;
  border: none !important;
  font-family: var(--ssa-font-primary) !important;
  display: inline !important;
  padding: 0 !important;
  cursor: pointer !important;
}
.goog-te-gadget-icon{
  display: none !important;
}

/* Masquer uniquement la barre du haut Google (pas le dropdown dans #google_translate_element) */
body > .skiptranslate,
body > .skiptranslate iframe {
  display: none !important;
}

/* Li du widget langue : ne pas étirer en grille */
.navbar li.nav-lang-widget {
  width: auto !important;
  min-width: 0 !important;
  justify-content: center;
  display: flex !important;
  align-items: center !important;
}

/* Widget Google Traduction : conteneur compact */
#google_translate_element {
  display: flex !important;
  align-items: center !important;
  overflow: visible !important;
  position: relative !important;
}

/* Conteneur Google Translate */
#google_translate_element .goog-te-gadget {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

/* Wrapper personnalisé pour le widget de traduction */
.custom-translate-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 6px;
  font-family: var(--ssa-font-primary);
  font-size: inherit;
  color: var(--texte-couleur);
  text-decoration: none;
  line-height: 1;
  height: 100%;
}

.custom-translate-wrapper:hover {
  text-decoration: underline var(--caps-orange) 2px;
}

.custom-translate-wrapper .translate-flag {
  width: 20px;
  height: 20px;
  display: block;
  flex-shrink: 0;
  object-fit: contain;
  object-position: center center;
  margin: 0;
  padding: 0;
  align-self: center;
  flex: 0 0 20px;
}

.custom-translate-wrapper .translate-label {
  white-space: nowrap;
  line-height: 1;
  display: block;
  align-self: center;
}

.custom-translate-wrapper .translate-arrow {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-left: 2px;
  color: var(--texte-couleur);
  line-height: 0;
}

.custom-translate-wrapper .translate-arrow svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Dropdown du sélecteur de langue */
.custom-translate-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 4px;
  background: var(--fond-header-footer);
  border: 1px solid var(--texte-couleur, #ccc);
  border-radius: 6px;
  box-shadow: var(--ssa-shadow);
  z-index: 1000;
  min-width: 140px;
  padding: 4px 0;
}

.custom-translate-dropdown[hidden] {
  display: none !important;
}

.custom-translate-option {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  border: none;
  background: none;
  font-family: var(--ssa-font-primary);
  font-size: inherit;
  color: var(--texte-couleur);
  cursor: pointer;
  text-align: left;
  line-height: 1;
}

.custom-translate-option:hover {
  background: rgba(0, 0, 0, 0.05);
}

.custom-translate-option .translate-flag {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  display: block;
  object-fit: contain;
  object-position: center center;
  align-self: center;
  flex: 0 0 20px;
  margin: 0;
  padding: 0;
}

.custom-translate-option .translate-option-label {
  display: block;
  line-height: 1;
  align-self: center;
  white-space: nowrap;
}

/* Forcer la taille de l'iframe du widget (Google injecte tout dans un iframe) */
#google_translate_element iframe {
  width: 48px !important;
  min-width: 48px !important;
  height: 28px !important;
  min-height: 28px !important;
}

/* Masquer tous les éléments visibles du widget Google mais garder le select fonctionnel */
#google_translate_element .goog-te-gadget > span:first-child {
  display: none !important;
}

#google_translate_element .goog-te-gadget {
  display: none !important;
}

#google_translate_element .goog-te-gadget-simple {
  display: none !important;
}

#google_translate_element .goog-te-gadget-icon {
  display: none !important;
}

/* Garder le select mais le masquer visuellement */
#google_translate_element select.goog-te-combo {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

#google_translate_element .goog-te-combo {
  font-size: 12px !important;
  padding: 2px 4px !important;
  height: 24px !important;
  min-width: 40px !important;
  max-width: 48px !important;
  border: 1px solid var(--texte-couleur, #666) !important;
  border-radius: 4px !important;
  background: var(--fond-page, #fff) !important;
  color: var(--texte-couleur, #333) !important;
  cursor: pointer !important;
}

/* Masquer les autres éléments Google Translate */
#google_translate_element .goog-te-gadget > span:not(:first-child) {
  display: none !important;
}