Add theme-aware logo swap

app.py

@@ -1188,23 +1188,85 @@ def create_interface():
     model_id = get_env_or_secret("HF_MODEL_ID", "ReportAId/whisper-medium-it-finetuned")
     base_model_id = get_env_or_secret("BASE_WHISPER_MODEL_ID", "openai/whisper-medium")
 
-    # Carica il logo SVG inline per garantirne la visualizzazione anche senza routing file
+    # Carica i loghi chiaro/scuro inline e alterna in base al tema preferito
     logo_html = None
     try:
-        logo_path = os.path.join(os.path.dirname(__file__), "assets", "ReportAId.svg")
-        with open(logo_path, "r", encoding="utf-8") as f:
-            svg_content = f.read()
-        # Wrappa lo svg in un contenitore centrato
+        assets_dir = os.path.join(os.path.dirname(__file__), "assets")
+        light_path = os.path.join(assets_dir, "RaidLight.svg")
+        dark_path = os.path.join(assets_dir, "RaidDark.svg")
+
+        with open(light_path, "r", encoding="utf-8") as f:
+            light_svg = f.read()
+        with open(dark_path, "r", encoding="utf-8") as f:
+            dark_svg = f.read()
+
         logo_html = f"""
-        <div style=\"text-align: center; margin: 16px 0 8px;\">
-            <div style=\"display:inline-block; height:60px;\">{svg_content}</div>
+        <style>
+            .logo-container {{
+                text-align: center;
+                margin: 16px 0 8px;
+            }}
+            .logo-container .sr-only {{
+                position: absolute;
+                width: 1px;
+                height: 1px;
+                padding: 0;
+                margin: -1px;
+                overflow: hidden;
+                clip: rect(0, 0, 0, 0);
+                white-space: nowrap;
+                border: 0;
+            }}
+            .logo-container svg {{
+                height: 72px;
+                width: auto;
+                max-width: 100%;
+            }}
+            .logo-container .logo-dark {{
+                display: none;
+            }}
+            @media (prefers-color-scheme: dark) {{
+                .logo-container .logo-light {{
+                    display: none !important;
+                }}
+                .logo-container .logo-dark {{
+                    display: inline-block !important;
+                }}
+            }}
+        </style>
+        <div class=\"logo-container\">
+            <div class=\"logo-light\" aria-hidden=\"true\">{light_svg}</div>
+            <div class=\"logo-dark\" aria-hidden=\"true\">{dark_svg}</div>
+            <span class=\"sr-only\">ReportAId</span>
         </div>
         """
     except Exception:
-        # Fallback al path file= se per qualche motivo non riusciamo a leggere il file
+        # Fallback: immagini servite dal path file= con switch CSS
         logo_html = """
-        <div style=\"text-align: center; margin: 16px 0 8px;\">
-            <img src=\"file=assets/ReportAId.svg\" alt=\"ReportAId\" style=\"height: 60px; margin-bottom: 8px;\">
+        <style>
+            .logo-container { text-align: center; margin: 16px 0 8px; }
+            .logo-container .sr-only {
+                position: absolute;
+                width: 1px;
+                height: 1px;
+                padding: 0;
+                margin: -1px;
+                overflow: hidden;
+                clip: rect(0, 0, 0, 0);
+                white-space: nowrap;
+                border: 0;
+            }
+            .logo-container img { height: 72px; width: auto; max-width: 100%; }
+            .logo-container .logo-dark { display: none; }
+            @media (prefers-color-scheme: dark) {
+                .logo-container .logo-light { display: none !important; }
+                .logo-container .logo-dark { display: inline-block !important; }
+            }
+        </style>
+        <div class=\"logo-container\">
+            <img class=\"logo-light\" src=\"file=assets/RaidLight.svg\" alt=\"ReportAId\">
+            <img class=\"logo-dark\" src=\"file=assets/RaidDark.svg\" alt=\"ReportAId\">
+            <span class=\"sr-only\">ReportAId</span>
         </div>
         """