Refactor: remove AGPL imgly dependency and migrate background removal to python backend

src/components/brand/BrandTabMedia.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import { Film, Volume2, Music, X, Upload } from 'lucide-react';
+import { Film, Volume2, Music, X, Upload, Wand2 } from 'lucide-react';
 import { DesignMD } from '../../types';
 import { FileDropZone } from '../ui/FileDropZone';
 
@@ -15,7 +15,7 @@ interface BrandTabMediaProps {
  * All positioning, fit, duration, and blend controls live in the TemplateBuilder
  * (per-template segment configuration), avoiding collisions.
  */
-export const BrandTabMedia: React.FC<BrandTabMediaProps> = ({ designMD, handleDesignChange }) => {
+export const BrandTabMedia: React.FC<BrandTabMediaProps & { onEditAsset?: (type: keyof DesignMD, url: string) => void }> = ({ designMD, handleDesignChange, onEditAsset }) => {
 
   /** Auto-detect video duration and store it in DesignMD (for BrandPreview playback) */
   const probeVideoDuration = useCallback((url: string, key: 'introDurationFrames' | 'outroDurationFrames') => {
@@ -60,6 +60,8 @@ export const BrandTabMedia: React.FC<BrandTabMediaProps> = ({ designMD, handleDe
           handleDesignChange('introVideoUrl', '');
           handleDesignChange('introDurationFrames', 60);
         }}
+        onEdit={() => onEditAsset?.('introVideoUrl', designMD.introVideoUrl || '')}
+        showEdit={!!(designMD.introVideoUrl && onEditAsset)}
       />
 
       {/* ═══ Outro Video ═══ */}
@@ -76,6 +78,8 @@ export const BrandTabMedia: React.FC<BrandTabMediaProps> = ({ designMD, handleDe
           handleDesignChange('outroVideoUrl', '');
           handleDesignChange('outroDurationFrames', 60);
         }}
+        onEdit={() => onEditAsset?.('outroVideoUrl', designMD.outroVideoUrl || '')}
+        showEdit={!!(designMD.outroVideoUrl && onEditAsset)}
       />
 
       {/* ═══ Brand Audio ═══ */}
@@ -178,7 +182,9 @@ const VideoUploadSimple: React.FC<{
   accentColor: string;
   onUrlChange: (url: string) => void;
   onClear: () => void;
-}> = ({ label, description, videoUrl, accentColor, onUrlChange, onClear }) => {
+  onEdit?: () => void;
+  showEdit?: boolean;
+}> = ({ label, description, videoUrl, accentColor, onUrlChange, onClear, onEdit, showEdit }) => {
   const hasVideo = !!videoUrl && videoUrl.trim().length > 0;
 
   return (
@@ -250,6 +256,15 @@ const VideoUploadSimple: React.FC<{
               }
             }}
           />
+          {showEdit && (
+            <button
+              onClick={onEdit}
+              className="w-full flex items-center justify-center gap-2 py-2.5 rounded-lg bg-violet-600/20 text-violet-400 hover:bg-violet-600/30 transition-colors text-xs font-semibold border border-violet-500/20"
+            >
+              <Wand2 size={14} />
+              Abrir en Editor Avanzado
+            </button>
+          )}
         </div>
       </div>