Fix mobile layout: Verbesserte Lösung für Sprachauswahl-Überlappung mit mehr Abstand

app.py

@@ -20,7 +20,7 @@ app.config['BABEL_TRANSLATION_DIRECTORIES'] = 'translations'
 babel = Babel()
 
 # Version der App
-APP_VERSION = "1.4.3"
+APP_VERSION = "1.4.5"
 
 # HTML-Template wird jetzt aus templates/index.html geladen
 

templates/index.html

@@ -473,9 +473,11 @@ button:focus, .accordion-header:focus {
         max-width: none;
         overflow: hidden;
     }
+    .header-section {
+        margin-top: 4.5em; /* Mehr Abstand für Sprachauswahl und Hilfe-Button */
+    }
     h1 {
         font-size: 1.3em;
-        margin-top: 3.5em; /* Abstand für Sprachauswahl */
     }
     .help-button-container {
         top: 1em;
@@ -797,7 +799,7 @@ footer br + a {
                 <option value="en" {% if get_locale() == 'en' %}selected{% endif %}>{{ _('English') }}</option>
             </select>
         </div>
-        <div style="text-align:center; margin-bottom:1.2em;">
+        <div class="header-section" style="text-align:center; margin-bottom:1.2em;">
             <div style="font-size:1.1em; font-style:italic; color:#475569;">{{ _('Elpatrons') }}</div>
             <h1 style="margin:0;">{{ _('Datumsrechner') }}</h1>
             <div style="font-size:0.9em; color:#1e293b; margin-top:0.3em;">
@@ -853,7 +855,7 @@ footer br + a {
                                 </select>
                             </label>
                         </fieldset>
-                        <button name="action" value="tage_werktage" type="submit">Berechnen</button>
+                        <button name="action" value="tage_werktage" type="submit">{{ _('Berechnen') }}</button>
                     </form>
                     {% if tage is not none %}
                         <div class="result" aria-live="polite">