/* ============================================
   GOOGLE TRANSLATE WIDGET - OPTIMIERT
   ============================================ */

/* Google Translate Widget Container */
#google_translate_element {
    display: inline-block;
    margin-left: 20px;
}

/* Google Translate Gadget Styling */
.goog-te-gadget-simple {
    background: transparent !important;
    border: none !important;
    padding: 5px !important;
}

.goog-te-menu-value {
    color: white !important;
    font-size: 14px !important;
}

.goog-te-menu-value img {
    display: none !important;
}

.goog-te-menu-value::before {
    content: "🌐 ";
}

/* ============================================
   GOOGLE TRANSLATE BANNER - AUSBLENDEN
   ============================================ */

/* Hauptbanner ausblenden */
.goog-te-banner-frame,
.goog-te-banner,
.goog-te-balloon-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    z-index: -1 !important;
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    overflow: hidden !important;
}

/* Body Position korrigieren - WICHTIG! */
body {
    top: 0 !important;
    position: static !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Übersetzungs-Container ausblenden */
.skiptranslate {
    display: none !important;
    visibility: hidden !important;
}

/* Google Translate iframe ausblenden */
iframe[id*="goog"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    position: absolute !important;
    top: -9999px !important;
}

/* ============================================
   NAVBAR FIX - IMMER SICHTBAR
   ============================================ */

.navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 999999 !important;
    transform: translateY(0) !important;
    margin-top: 0 !important;
}

/* Body Padding für fixed Navbar */
body {
    padding-top: 70px !important;
}

/* ============================================
   FLAGGEN-BUTTONS
   ============================================ */

.language-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 20px 0;
    padding: 15px;
    background: rgba(255,255,255,0.05);
    border-radius: 10px;
}

.flag-btn {
    padding: 10px 15px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 8px;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: 0.3s;
    font-family: inherit;
}

.flag-btn:hover {
    background: rgba(255,255,255,0.2);
    transform: translateY(-2px);
}

.flag-btn.active {
    background: #007bff;
    border-color: #007bff;
}

.flag {
    font-size: 1.2em;
}

/* ============================================
   MOBILE SPRACHAUSWAHL
   ============================================ */

.language-selector-mobile {
    display: none;
    width: 100%;
    margin: 15px 0;
}

.language-selector-mobile select {
    width: 100%;
    padding: 10px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 8px;
    color: white;
    font-size: 14px;
    font-family: inherit;
}

.language-selector-mobile select option {
    background: #1a1a1a;
    color: white;
}

/* ============================================
   RTL FÜR ARABISCH
   ============================================ */

[dir="rtl"] {
    text-align: right;
}

[dir="rtl"] .navbar {
    direction: rtl;
}

[dir="rtl"] .nav-links {
    direction: rtl;
}

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

@media (max-width: 768px) {
    .language-flags {
        display: none;
    }
    
    .language-selector-mobile {
        display: block;
    }
    
    #google_translate_element {
        margin-left: 10px;
    }
    
    body {
        padding-top: 60px !important;
    }
    
    .navbar {
        height: 60px;
    }
}

/* ============================================
   GOOGLE TRANSLATE POPUP FIX
   ============================================ */

/* Übersetzungs-Popup ausblenden */
.goog-te-menu-frame {
    max-height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* Text nach Übersetzung nicht verstecken */
.goog-text-highlight {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Font Fix nach Übersetzung */
body > .skiptranslate {
    display: none;
}

/* Wichtig: Verhindert dass Google das Layout verschiebt */
html {
    position: relative !important;
}

html.translated-ltr,
html.translated-rtl {
    position: relative !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}