feat: flat design Sunset Glitch palette + Font Awesome icons

templates/components/watchlist_section.html

@@ -1,6 +1,6 @@
 <div class="section-container">
     <div class="section-header">
-        <h2>📋 Ma Watchlist</h2>
+        <h2><i class="fa-solid fa-clipboard-list"></i> Ma Watchlist</h2>
         <div class="header-actions">
             <button class="btn btn-sm btn-primary" hx-post="/api/watchlist/check" hx-swap="none">
                 <i class="fas fa-sync"></i> Vérifier épisodes
@@ -35,15 +35,15 @@
     display: flex;
     gap: 15px;
     padding: 15px;
-    background: #e6e8e6;
+    background: var(--bg-card);
     border-radius: 4px;
-    border: 1px solid #ced0ce;
+    border: 1px solid var(--secondary);
     transition: border-color 0.2s;
 }
-.watchlist-item:hover { border-color: #f15025; }
+.watchlist-item:hover { border-color: #FFBF69; }
 .item-poster img { width: 80px; height: 120px; border-radius: 4px; object-fit: cover; }
 .item-info { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
-.item-info h3 { font-size: 1rem; margin-bottom: 5px; color: #191919; }
+.item-info h3 { font-size: 1rem; margin-bottom: 5px; color: #F2F2F2; }
 .item-meta { display: flex; gap: 8px; margin-bottom: 8px; }
 .item-actions { display: flex; gap: 10px; margin-top: 10px; }
 </style>