/* =========================================================
   LANGUE.CSS
   Sélecteur de langue flottant - ouverture horizontale
   ========================================================= */

.languages-section-wrapper {
  position: relative;
}

/* Bloc langue dans le coin */
.floating-language-switcher {
  position: absolute;
  top: 18px;
  right: 20px;
  z-index: 60;
}

/* Bouton courant */
.floating-language-current {
  min-width: 64px;
  height: 36px;
  padding: 0 12px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  cursor: pointer;

  background: rgba(255, 255, 255, 0.88);
  color: #2b3a50;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;

  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  transition: all 0.2s ease;
}

.floating-language-current:hover,
.floating-language-current:focus {
  background: rgba(255, 255, 255, 0.96);
  color: #0f2e4d;
  border-color: rgba(15, 46, 77, 0.12);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
}

.floating-language-current i {
  font-size: 11px;
  color: #6b7a90;
  transition: transform 0.2s ease;
}

/* =========================================================
   🔥 FOND GRIS FONCÉ
   ========================================================= */
.floating-language-dropdown {
  position: absolute;
  top: 0;
  right: calc(100% + 10px);

  display: flex;
  align-items: center;
  gap: 14px;

  padding: 8px 14px;
  border-radius: 12px;

  background: #2b2f36; /* gris foncé */
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);

  opacity: 0;
  visibility: hidden;
  transform: translateX(8px);
  transition: all 0.2s ease;

  white-space: nowrap;
}

/* Ouverture */
.floating-language-switcher:hover .floating-language-dropdown,
.floating-language-switcher:focus-within .floating-language-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.floating-language-switcher:hover .floating-language-current i,
.floating-language-switcher:focus-within .floating-language-current i {
  transform: rotate(180deg);
}

/* =========================================================
   OPTIONS LANGUE (BLANC)
   ========================================================= */

.floating-language-option,
.floating-language-option:link,
.floating-language-option:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  color: #ffffff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;

  transition: color 0.18s ease, opacity 0.18s ease;
}

/* hover */
.floating-language-option:hover,
.floating-language-option:focus {
  background: none !important;
  text-decoration: none !important;
  color: #ffffff;
  opacity: 0.75;
}

/* actif */
.floating-language-option.active,
.floating-language-option[aria-current="page"] {
  background: none !important;
  text-decoration: none !important;
  color: #ffffff;
  font-weight: 700;
  opacity: 1;
}

/* Séparateur */
.floating-language-option:not(:last-child)::after {
  content: "|";
  margin-left: 12px;
  color: rgba(255, 255, 255, 0.4);
}

/* Non dispo */
.floating-language-unavailable {
  color: rgba(255, 255, 255, 0.6);
  font-size: 13px;
}

/* =========================================================
   RTL
   ========================================================= */

html[dir="rtl"] .floating-language-switcher {
  right: auto;
  left: 20px;
}

html[dir="rtl"] .floating-language-dropdown {
  right: auto;
  left: calc(100% + 10px);
  transform: translateX(-8px);
}

html[dir="rtl"] .floating-language-switcher:hover .floating-language-dropdown,
html[dir="rtl"] .floating-language-switcher:focus-within .floating-language-dropdown {
  transform: translateX(0);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 992px) {
  .floating-language-switcher {
    top: 14px;
    right: 14px;
  }

  .floating-language-current {
    min-width: 58px;
    height: 34px;
    padding: 0 10px;
    font-size: 11px;
  }

  html[dir="rtl"] .floating-language-switcher {
    right: auto;
    left: 14px;
  }
}

@media (max-width: 640px) {
  .floating-language-switcher {
    top: 10px;
    right: 10px;
  }

  .floating-language-current {
    height: 32px;
    min-width: 54px;
    padding: 0 9px;
    border-radius: 8px;
    font-size: 11px;
  }

  .floating-language-dropdown {
    top: calc(100% + 8px);
    right: 0;
    left: auto;
    transform: translateY(8px);
    flex-direction: row;
    overflow-x: auto;
  }

  .floating-language-switcher:hover .floating-language-dropdown,
  .floating-language-switcher:focus-within .floating-language-dropdown {
    transform: translateY(0);
  }

  html[dir="rtl"] .floating-language-switcher {
    right: auto;
    left: 10px;
  }

  html[dir="rtl"] .floating-language-dropdown {
    left: 0;
    right: auto;
  }
}