Update app.py

app.py

@@ -566,28 +566,25 @@ body, .gradio-container {
 }
 .li-header h1 { margin:0 !important; font-size:1.65rem !important; font-weight:700 !important; color:#fff !important; }
 .li-header p  { margin:4px 0 0 !important; font-size:.86rem !important; color:rgba(255,255,255,.88) !important; }
-.li-header button.badge {
-    margin-left: auto !important; 
-    background: rgba(255,255,255,0.15) !important; 
-    border-radius: 99px !important;
-    padding: 6px 16px !important; 
-    font-size: 0.8rem !important; 
-    font-weight: 700 !important; 
-    color: #ffffff !important; 
+.li-header .badge {
+    margin-left: auto !important;
+    background: #004182 !important; /* Dunkles LinkedIn-Blau */
+    border-radius: 20px !important;
+    padding: 6px 14px !important;
+    font-size: 0.74rem !important;
+    font-weight: 700 !important;
+    color: #ffffff !important;
     white-space: nowrap !important;
-    cursor: pointer !important; 
-    transition: all 0.2s ease !important; 
-    border: 1px solid rgba(255,255,255,0.3) !important; 
-    outline: none !important;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
-    font-family: inherit !important;
-    letter-spacing: 0.3px !important;
+    cursor: pointer !important;
+    box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
+    border: 1px solid rgba(255,255,255,0.1) !important;
+    transition: all 0.2s ease !important;
+    display: inline-block !important; /* Wichtig für span */
 }
-.li-header button.badge:hover {
-    background: rgba(255,255,255,0.3) !important;
+.li-header .badge:hover {
+    background: #0A66C2 !important; /* Helles LinkedIn-Blau bei Hover */
     transform: translateY(-1px) !important;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
-    border-color: rgba(255,255,255,0.6) !important;
+    box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important;
 }
 .direction-banner {
     text-align:center; font-size:.8rem; font-weight:700; letter-spacing:.6px;
@@ -670,7 +667,7 @@ with gr.Blocks(title="LinkedIn Translator") as demo:
                 <h1>LinkedIn Translator</h1>
                 <p>Banale Wahrheit &harr; Epische LinkedIn-Prosa &nbsp;&middot;&nbsp; powered by Llama</p>
             </div>
-            <button class="badge" onclick="document.getElementById('tuning_toggle_btn').click()">✨ AI Post Tuning</button>
+            <span class="badge" onclick="document.getElementById('tuning_toggle_btn').click()">✨ AI Post Tuning</span>
         </div>
     """)