Logo SikaPics via balise img (fix ::before invisible)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/css/style.css

@@ -69,6 +69,13 @@ html, body {
   z-index: 1;
 }
 
+.accueil-logo {
+  max-width: 280px;
+  max-height: 100px;
+  margin-bottom: 1rem;
+  object-fit: contain;
+}
+
 .accueil-contenu h1 {
   font-size: 3.5rem;
   font-weight: 300;

frontend/css/themes.css

@@ -54,17 +54,7 @@
   font-weight: 600;
 }
 
-[data-theme="sikapics"] #nom-evenement::before {
-  content: '';
-  display: block;
-  width: 250px;
-  height: 80px;
-  margin: 0 auto 1.5rem;
-  background-image: url('/assets/logos/sikapics.png');
-  background-size: contain;
-  background-repeat: no-repeat;
-  background-position: center;
-}
+/* Logo SikaPics gere via JS (appliquerConfig) */
 
 [data-theme="sikapics"] .accueil-instruction {
   color: var(--texte-secondaire);

frontend/index.html

@@ -16,6 +16,7 @@
       <video id="accueil-video" class="accueil-media cache" muted loop playsinline></video>
       <img id="accueil-gif" class="accueil-media cache">
       <div class="accueil-contenu">
+        <img id="accueil-logo" class="accueil-logo cache" src="" alt="">
         <h1 id="nom-evenement">Photobooth</h1>
         <p class="accueil-instruction">Touchez pour commencer</p>
         <div id="accueil-animation-defaut" class="accueil-animation">

frontend/js/app.js

@@ -31,6 +31,18 @@ function appliquerConfig() {
     document.documentElement.style.setProperty('--secondaire', event.couleur_secondaire || '#ffffff');
   }
 
+  // Logo selon le theme
+  const logo = document.getElementById('accueil-logo');
+  if (logo) {
+    const logos = { sikapics: '/assets/logos/sikapics.png' };
+    if (logos[theme]) {
+      logo.src = logos[theme];
+      logo.classList.remove('cache');
+    } else {
+      logo.classList.add('cache');
+    }
+  }
+
   // Nom evenement
   const h1 = document.getElementById('nom-evenement');
   if (h1) h1.textContent = event.nom || 'Photobooth';