/* Language Switcher - Professional Implementation */
:root {
  /* Turkish (Default) */
  --lang-tr: initial;
  --lang-en: none;
  
  /* Language-specific content visibility */
  --content-tr: block;
  --content-en: none;
}

/* Flash prevention - Hide content until language is set */
html.translating {
  visibility: hidden;
}

html.translating * {
  visibility: hidden;
}

/* Show content after language is set */
html[data-lang] {
  visibility: visible;
}

html[data-lang] * {
  visibility: visible;
}

/* Language-specific content display */
[data-lang="TR"] .lang-tr,
[data-lang="TR"] .lang-tr * {
  display: var(--content-tr) !important;
}

[data-lang="TR"] .lang-en,
[data-lang="TR"] .lang-en * {
  display: var(--content-en) !important;
}

[data-lang="EN"] .lang-tr,
[data-lang="EN"] .lang-tr * {
  display: var(--content-en) !important;
}

[data-lang="EN"] .lang-en,
[data-lang="EN"] .lang-en * {
  display: var(--content-tr) !important;
}

/* Optimized menu item translations - prevent flash */
[data-translate] {
  opacity: 0;
  transition: opacity 0.05s ease;
}

html[data-lang] [data-translate] {
  opacity: 1;
}

/* Additional optimization for menu items */
.navigator [data-translate],
.navigator-mobile [data-translate] {
  transition: opacity 0.02s ease;
}

/* Language switcher styling */
.language-switcher {
  position: relative;
  display: inline-block;
}

.language-switcher select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 32px 8px 12px;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.language-switcher select:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* Language switcher arrow */
.language-switcher::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  pointer-events: none;
}

/* Header language switcher specific styles */
.menu .menu-functions .language-switcher select {
  color: #111;
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 18px;
  padding: 6px 26px 6px 12px;
  height: 34px;
  line-height: 20px;
  background-position: calc(100% - 10px) center;
  background-size: 10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.menu .menu-functions .language-switcher select:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.menu .menu-functions .language-switcher select:focus {
  outline: none;
  border-color: #111;
  box-shadow: 0 0 0 3px rgba(0,0,0,0.06);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .language-switcher select {
    font-size: 13px;
    padding: 6px 28px 6px 10px;
  }
  
  .menu .menu-functions .language-switcher select {
    height: 32px;
    padding: 5px 24px 5px 10px;
  }
}

