/* assets/css/lang-switcher.css (Ultramodern / Glassmorphism stílus) */

.lang-switcher {
  position: relative;
  margin-left: 20px;
}

/* A gomb, ami látszik (pl. HU Zászló) */
.lang-switcher .current-lang {
  display: flex;
  align-items: center;
  cursor: pointer;
  background: transparent; /* Nincs háttér */
  padding: 8px 12px;
  border-radius: 8px; /* Lekerekítés */
  transition: background 0.3s ease, transform 0.2s ease;
}

/* Finom hover effekt a gombra */
.lang-switcher .current-lang:hover {
  background: rgba(255, 255, 255, 0.1); /* Áttetsző fehér kiemelés */
  transform: translateY(-2px); /* Enyhe emelkedés */
}

.lang-switcher .current-lang img {
  width: 24px;
  height: auto;
  margin-right: 8px;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* A szöveg (HU, EN, DE) a gombon */
.lang-switcher .current-lang span {
  font-size: 14px;
  font-weight: 600; /* Kicsit vastagabb */
  color: #ffffff; /* FEHÉR szöveg (a kék háttér miatt) */
  text-transform: uppercase;
  line-height: 1;
}

/* A kis nyíl a gombon */
.lang-switcher .current-lang .arrow {
  margin-left: 6px;
  font-size: 10px;
  color: #ffffff; /* FEHÉR nyíl */
  transition: transform 0.3s ease;
}

.lang-switcher.active .current-lang .arrow {
  transform: rotate(180deg);
}

/* A lenyíló menü (Dropdown) - EZ A LÉNYEG */
.lang-switcher .lang-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 10px; /* Kicsit több távolság */
  
  /* Az "Ultramodern" Glassmorphism */
  background: rgba(30, 30, 30, 0.7); /* Sötét, áttetsző háttér */
  -webkit-backdrop-filter: blur(15px); /* iOS */
  backdrop-filter: blur(15px); /* A "fagyott üveg" effekt */
  border: 1px solid rgba(255, 255, 255, 0.15); /* Finom él */
  
  border-radius: 12px; /* Erősebb lekerekítés */
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2); /* Mélyebb árnyék */
  width: 170px;
  z-index: 100;
  overflow: hidden; /* Fontos a belső lekerekítéshez */
  
  /* Animáció */
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Animáció megjelenéskor */
.lang-switcher.active .lang-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* A menüpontok (Magyar, English, Deutsch) */
.lang-switcher .lang-option {
  display: flex;
  align-items: center;
  padding: 12px 18px; /* Tágasabb */
  cursor: pointer;
  transition: background-color 0.2s ease;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05); /* Finom elválasztó */
}

.lang-switcher .lang-option:last-child {
  border-bottom: none; /* Az utolsónak nem kell */
}

/* Hover effekt a menüpontokra */
.lang-switcher .lang-option:hover {
  background-color: rgba(255, 255, 255, 0.1); /* Világosabb kiemelés */
}

.lang-switcher .lang-option img {
  width: 24px;
  margin-right: 12px;
  border-radius: 3px;
}

/* A szöveg a menüpontokban */
.lang-switcher .lang-option span {
  font-size: 14px;
  font-weight: 500;
  color: #f5f5f5; /* Világos szöveg */
  transition: color 0.2s ease;
}

.lang-switcher .lang-option:hover span {
  color: #ffffff; /* Teljesen fehér hover-re */
}
/* assets/css/lang-switcher.css - Kiegészítés a mobil menühöz */

.navbar-nav .lang-switcher {
  margin-left: 0;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 0 20px;
}

.navbar-nav .lang-switcher .current-lang {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 10px 15px;
}

.navbar-nav .lang-switcher .current-lang span,
.navbar-nav .lang-switcher .current-lang .arrow {
   color: #ffffff;
}

.navbar-nav .lang-switcher .lang-dropdown {
   margin-top: 5px;
   background: rgba(40, 40, 40, 0.8);
   backdrop-filter: blur(10px);
}

.navbar-nav .lang-switcher .lang-option span {
    color: #f0f0f0;
}