🎨 Redesign from AnyCoder

This Pull Request contains a redesigned version of the app with:

- ✨ Modern, mobile-friendly design
- 🎯 Minimal, clean components
- 📱 Responsive layout
- 🚀 Improved user experience

Generated by [AnyCoder](https://huggingface.co/spaces/akhaliq/anycoder)

app.py

@@ -1,14 +1,6 @@
 """
-Docling Document Processor - Aplicação Principal.
-
-Este é o ponto de entrada da aplicação Gradio que permite
-o upload e processamento de documentos usando Docling.
-
-Recursos:
-- Upload múltiplo (1-5 arquivos)
-- Formatos: PDF, DOC, DOCX
-- Saída: JSON, Markdown ou ambos (ZIP)
-- Aceleração GPU via ZeroGPU
+Docling Document Processor - Modern Redesigned UI
+A clean, mobile-first interface for document processing with AI.
 """
 
 import os
@@ -52,34 +44,21 @@ logger = setup_logger("docling_space")
 # RATE LIMITING (in-memory)
 # =============================================================================
 
-# Armazena requisições por IP: {ip: [timestamps]}
 _rate_limit_store: dict[str, list[datetime]] = defaultdict(list)
 
 
 def check_rate_limit(request: gr.Request) -> bool:
-    """
-    Verifica se o IP excedeu o limite de requisições.
-
-    Args:
-        request: Objeto de request do Gradio.
-
-    Returns:
-        True se está dentro do limite, False se excedeu.
-    """
+    """Verifica se o IP excedeu o limite de requisições."""
     if request is None:
         return True
 
-    # Obtém IP do cliente de múltiplas fontes
     ip = None
-
-    # Tenta headers primeiro (X-Forwarded-For para proxies/containers)
     if hasattr(request, "headers"):
         headers = request.headers or {}
         ip = headers.get("x-forwarded-for", "").split(",")[0].strip()
         if not ip:
             ip = headers.get("x-real-ip", "").strip()
 
-    # Fallback para client info
     if not ip:
         client_info = getattr(request, "client", None)
         if client_info:
@@ -90,30 +69,25 @@ def check_rate_limit(request: gr.Request) -> bool:
             else:
                 ip = str(client_info)
 
-    # Se ainda não tem IP, usa session_hash como identificador alternativo
     if not ip or ip == "unknown":
         session_hash = getattr(request, "session_hash", None)
         if session_hash:
             ip = f"session_{session_hash[:16]}"
         else:
-            # Último fallback: permite a requisição mas não rastreia
             return True
 
     now = datetime.now()
     window_start = now - timedelta(hours=config.RATE_LIMIT_WINDOW_HOURS)
 
-    # Limpa requisições antigas
     _rate_limit_store[ip] = [
         ts for ts in _rate_limit_store[ip]
         if ts > window_start
     ]
 
-    # Verifica limite
     if len(_rate_limit_store[ip]) >= config.RATE_LIMIT_REQUESTS:
         logger.warning(f"Rate limit excedido para IP: {ip}")
         return False
 
-    # Registra nova requisição
     _rate_limit_store[ip].append(now)
     return True
 
@@ -127,25 +101,12 @@ def _process_documents_internal(
     output_format: str,
     progress: Optional[gr.Progress] = None
 ) -> tuple[str | list[str], str]:
-    """
-    Função interna de processamento (sem decorator GPU).
-
-    Args:
-        files: Lista de arquivos enviados.
-        output_format: Formato de saída ("JSON", "Markdown", "Ambos").
-        progress: Objeto de progresso do Gradio.
-
-    Returns:
-        Tupla (caminho(s) do arquivo de saída, mensagem de status).
-    """
+    """Função interna de processamento (sem decorator GPU)."""
     start_time = time.time()
-
-    # Limpa arquivos temporários antigos
     cleanup_old_files()
 
-    # Valida arquivos
     if progress:
-        progress(0.1, desc="Validando arquivos...")
+        progress(0.1, desc="🔍 Validating files...")
 
     try:
         validated_files = validate_files(files)
@@ -153,9 +114,8 @@ def _process_documents_internal(
         logger.warning(f"Erro de validação: {e.message}")
         raise gr.Error(e.message)
 
-    # Prepara processador
     if progress:
-        progress(0.2, desc="Inicializando Docling...")
+        progress(0.2, desc="⚡ Initializing Docling...")
 
     processor = DoclingProcessor(
         enable_ocr=True,
@@ -163,27 +123,21 @@ def _process_documents_internal(
         use_gpu=HAS_SPACES
     )
 
-    # Cria diretório de saída
     output_dir = create_temp_directory(prefix="output_")
     output_files = []
     processed_count = 0
     total_files = len(validated_files)
 
-    # Processa cada arquivo
     for i, (file_path, sanitized_name) in enumerate(validated_files):
         progress_pct = 0.2 + (0.6 * (i / total_files))
 
         if progress:
-            progress(progress_pct, desc=f"Processando {sanitized_name}...")
+            progress(progress_pct, desc=f"📄 Processing {sanitized_name}...")
 
         try:
-            # Processa documento
             processed_data = processor.process_document(file_path)
-
-            # Gera nome base sem extensão
             base_name = Path(sanitized_name).stem
 
-            # Formata saída
             if output_format == "JSON":
                 json_content = format_to_json(processed_data, sanitized_name)
                 json_path = save_output_file(
@@ -227,20 +181,17 @@ def _process_documents_internal(
             logger.error(f"Erro ao processar {sanitized_name}: {e}")
             logger.debug(traceback.format_exc())
 
-            # Continua com próximos arquivos
             if total_files == 1:
                 raise gr.Error(
                     f"❌ Erro ao processar {sanitized_name}: {str(e)}"
                 )
 
-    # Prepara saída final
     if progress:
-        progress(0.9, desc="Preparando download...")
+        progress(0.9, desc="📦 Preparing download...")
 
     if not output_files:
         raise gr.Error("❌ Nenhum arquivo foi processado com sucesso.")
 
-    # Se há múltiplos arquivos ou formato "Ambos", cria ZIP
     if len(output_files) > 1 or output_format == "Ambos":
         zip_path = create_zip_output(
             output_files,
@@ -250,18 +201,16 @@ def _process_documents_internal(
     else:
         final_output = str(output_files[0][0])
 
-    # Calcula tempo total
     elapsed_time = time.time() - start_time
 
     if progress:
-        progress(1.0, desc="Concluído!")
+        progress(1.0, desc="✅ Complete!")
 
-    # Mensagem de status
     status_msg = (
-        f"✅ Processamento concluído!\n\n"
-        f"📄 **Arquivos processados:** {processed_count}/{total_files}\n"
-        f"📦 **Formato:** {output_format}\n"
-        f"⏱️ **Tempo:** {elapsed_time:.1f} segundos"
+        f"### ✅ Processing Complete!\n\n"
+        f"**Files processed:** {processed_count}/{total_files}  \n"
+        f"**Format:** {output_format}  \n"
+        f"**Time:** {elapsed_time:.1f}s"
     )
 
     logger.info(
@@ -292,30 +241,15 @@ def process_documents(
     request: gr.Request,
     progress: gr.Progress = gr.Progress()
 ) -> tuple[str | list[str], str]:
-    """
-    Função principal de processamento.
-
-    Usa GPU se disponível, senão fallback para CPU.
-
-    Args:
-        files: Lista de arquivos enviados.
-        output_format: Formato de saída.
-        request: Request do Gradio (para rate limiting).
-        progress: Objeto de progresso.
-
-    Returns:
-        Tupla (caminho do arquivo de saída, mensagem de status).
-    """
-    # Verifica rate limit
+    """Função principal de processamento."""
     if not check_rate_limit(request):
         raise gr.Error(
-            f"⚠️ Limite de requisições excedido. "
-            f"Máximo: {config.RATE_LIMIT_REQUESTS} por hora. "
-            f"Tente novamente mais tarde."
+            f"⚠️ Rate limit exceeded. "
+            f"Maximum: {config.RATE_LIMIT_REQUESTS} requests per hour. "
+            f"Please try again later."
         )
 
     try:
-        # Tenta usar GPU
         if HAS_SPACES and process_documents_gpu is not None:
             logger.info("Usando processamento GPU (ZeroGPU)")
             return process_documents_gpu(files, output_format, progress)
@@ -324,154 +258,140 @@ def process_documents(
             return _process_documents_internal(files, output_format, progress)
 
     except gr.Error:
-        # Re-raise erros do Gradio
         raise
     except TimeoutError:
         logger.error("Timeout no processamento")
         raise gr.Error(
-            "⏱️ Tempo limite excedido. Tente com arquivos menores ou menos arquivos."
+            "⏱️ Time limit exceeded. Try with smaller or fewer files."
         )
     except MemoryError:
         logger.error("Memória insuficiente")
         raise gr.Error(
-            "💾 Memória insuficiente. Tente com arquivos menores."
+            "💾 Insufficient memory. Try with smaller files."
         )
     except Exception as e:
         logger.error(f"Erro inesperado: {e}")
         logger.debug(traceback.format_exc())
-        raise gr.Error(f"❌ Erro inesperado: {str(e)}")
+        raise gr.Error(f"❌ Unexpected error: {str(e)}")
 
 
 # =============================================================================
-# INTERFACE GRADIO
+# INTERFACE GRADIO - MODERN REDESIGN
 # =============================================================================
 
-# CSS customizado
-CUSTOM_CSS = """
-.main-container {
-    max-width: 900px;
-    margin: 0 auto;
-}
-
-.upload-box {
-    border: 2px dashed #4a90a4;
-    border-radius: 12px;
-    padding: 20px;
-    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
-}
-
-.status-box {
-    background: #f0f7f4;
-    border-radius: 8px;
-    padding: 15px;
-    margin-top: 10px;
-}
-
-.info-text {
-    font-size: 0.9em;
-    color: #666;
-}
-"""
-
-# Texto de descrição
-DESCRIPTION = """
-# 📄 Docling Document Processor
-
-Converta documentos PDF, DOC e DOCX em formatos estruturados usando IA.
-
-## Recursos
-- 🔍 **Extração inteligente** de texto, tabelas e metadados
--  **Detecção automática** de idioma
-- 🚀 **Aceleração GPU** para processamento rápido
-- 📊 **Preserva estrutura** hierárquica do documento
-"""
-
-INSTRUCTIONS = """
-### Como usar
-
-1. **Upload**: Arraste ou selecione seus arquivos (máx. 5 arquivos, 50MB cada)
-2. **Formato**: Escolha o formato de saída desejado
-3. **Processar**: Clique no botão e aguarde
-4. **Download**: Baixe o resultado quando concluído
-
-### Formatos suportados
-- **Entrada**: PDF, DOC, DOCX
-- **Saída**: JSON, Markdown ou ambos (ZIP)
-"""
-
-
 def create_interface() -> gr.Blocks:
-    """Cria e retorna a interface Gradio."""
+    """Creates a modern, mobile-first Gradio interface."""
 
     with gr.Blocks(
-        title="Docling Document Processor",
-        theme=gr.themes.Soft(
-            primary_hue="teal",
-            secondary_hue="blue",
-        ),
-        css=CUSTOM_CSS,
+        title="📄 Docling Processor",
+        fill_height=True,
     ) as demo:
 
-        # Header
-        gr.Markdown(DESCRIPTION)
+        # Header Section
+        with gr.Row():
+            with gr.Column(scale=1):
+                gr.Markdown(
+                    """
+                    # 📄 Docling Document Processor
+                    
+                    Transform PDF, DOC, and DOCX files into structured formats using AI.
+                    
+                    Built with [anycoder](https://huggingface.co/spaces/akhaliq/anycoder)
+                    """,
+                    elem_classes=["header-text"]
+                )
+
+        gr.Markdown("---")
 
+        # Main Content Area
         with gr.Row():
-            # Coluna principal
-            with gr.Column(scale=2):
-                # Upload de arquivos
+            with gr.Column(scale=1):
+                
+                # Upload Section
                 file_input = gr.File(
                     file_count="multiple",
                     file_types=[".pdf", ".doc", ".docx"],
-                    label="📁 Upload de Documentos",
-                    elem_classes=["upload-box"],
+                    label="📁 Upload Documents",
+                    height=200,
+                    elem_classes=["upload-area"]
                 )
-
-                # Seletor de formato
+                
+                # Format Selector
                 format_selector = gr.Radio(
                     choices=config.OUTPUT_FORMATS,
                     value="Markdown",
-                    label="📤 Formato de Saída",
-                    info="Escolha como deseja receber o documento processado",
+                    label="📤 Output Format",
+                    info="Choose your preferred output format",
+                    elem_classes=["format-selector"]
                 )
-
-                # Botão de processar
+                
+                # Process Button
                 process_btn = gr.Button(
-                    "🚀 Processar Documentos",
+                    "🚀 Process Documents",
                     variant="primary",
                     size="lg",
+                    elem_classes=["process-button"]
                 )
-
-            # Coluna de informações
-            with gr.Column(scale=1):
-                gr.Markdown(INSTRUCTIONS)
-
-        # Área de resultados
+                
+                # Info Box
+                with gr.Accordion("ℹ️ How to Use", open=False):
+                    gr.Markdown(
+                        """
+                        ### Quick Start
+                        
+                        1. **Upload** your documents (max 5 files, 50MB each)
+                        2. **Select** output format (JSON, Markdown, or both)
+                        3. **Click** Process Documents
+                        4. **Download** your results
+                        
+                        ### Features
+                        
+                        - 🔍 Smart text, table & metadata extraction
+                        - 🌐 Automatic language detection
+                        - 🚀 GPU acceleration for fast processing
+                        - 📊 Preserves document structure
+                        
+                        ### Supported Formats
+                        
+                        **Input:** PDF, DOC, DOCX  
+                        **Output:** JSON, Markdown, or ZIP (both)
+                        """
+                    )
+
+        # Results Section
+        gr.Markdown("---")
+        
         with gr.Row():
-            with gr.Column():
-                # Status
+            with gr.Column(scale=1):
+                # Status Output
                 status_output = gr.Markdown(
                     label="Status",
-                    elem_classes=["status-box"],
+                    elem_classes=["status-output"]
                 )
-
-                # Arquivo de saída
+                
+                # File Download
                 file_output = gr.File(
-                    label="📥 Download do Resultado",
+                    label="📥 Download Results",
                     interactive=False,
+                    elem_classes=["download-area"]
                 )
 
-        # Informações de limites
+        # Footer
+        gr.Markdown("---")
         gr.Markdown(
             f"""
-            ---
-            **Limites:** {config.MAX_FILES_PER_SESSION} arquivos por vez |
-            {config.MAX_FILE_SIZE_MB}MB por arquivo |
-            {config.RATE_LIMIT_REQUESTS} requisições/hora
+            <div style="text-align: center; color: #666; font-size: 0.9em;">
+                <p><strong>Limits:</strong> {config.MAX_FILES_PER_SESSION} files per upload | 
+                {config.MAX_FILE_SIZE_MB}MB per file | 
+                {config.RATE_LIMIT_REQUESTS} requests/hour</p>
+                <p>Powered by <a href="https://github.com/docling-project/docling">Docling</a> • 
+                Built with <a href="https://huggingface.co/spaces/akhaliq/anycoder">anycoder</a></p>
+            </div>
             """,
-            elem_classes=["info-text"],
+            elem_classes=["footer-text"]
         )
 
-        # Evento de processamento
+        # Event Handlers
         process_btn.click(
             fn=process_documents,
             inputs=[file_input, format_selector],
@@ -479,7 +399,7 @@ def create_interface() -> gr.Blocks:
             show_progress="full",
         )
 
-        # Limpa status quando novos arquivos são selecionados
+        # Clear status when new files are selected
         file_input.change(
             fn=lambda: ("", None),
             outputs=[status_output, file_output],
@@ -515,13 +435,160 @@ if __name__ == "__main__":
             server_port=7860,
             max_file_size=f"{config.MAX_FILE_SIZE_MB}mb",
             show_error=True,
-            share=is_containerized,  # Habilita link compartilhável em containers
+            share=is_containerized,
+            theme=gr.themes.Soft(
+                primary_hue="blue",
+                secondary_hue="indigo",
+                neutral_hue="slate",
+                font=gr.themes.GoogleFont("Inter"),
+                text_size="lg",
+                spacing_size="lg",
+                radius_size="md"
+            ).set(
+                button_primary_background_fill="*primary_600",
+                button_primary_background_fill_hover="*primary_700",
+                button_primary_text_color="white",
+                block_title_text_weight="600",
+                block_label_text_weight="500",
+            ),
+            css="""
+            /* Mobile-First Responsive Design */
+            .gradio-container {
+                max-width: 1200px !important;
+                margin: 0 auto !important;
+                padding: 1rem !important;
+            }
+            
+            /* Header Styling */
+            .header-text h1 {
+                font-size: 2rem !important;
+                font-weight: 700 !important;
+                margin-bottom: 0.5rem !important;
+                background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+            }
+            
+            .header-text p {
+                font-size: 1.1rem !important;
+                color: #64748b !important;
+                line-height: 1.6 !important;
+            }
+            
+            /* Upload Area */
+            .upload-area {
+                border: 2px dashed #cbd5e1 !important;
+                border-radius: 12px !important;
+                transition: all 0.3s ease !important;
+            }
+            
+            .upload-area:hover {
+                border-color: #667eea !important;
+                background: #f8fafc !important;
+            }
+            
+            /* Format Selector */
+            .format-selector label {
+                font-weight: 500 !important;
+                margin-bottom: 0.5rem !important;
+            }
+            
+            /* Process Button */
+            .process-button {
+                margin-top: 1rem !important;
+                font-size: 1.1rem !important;
+                padding: 0.75rem 2rem !important;
+                border-radius: 8px !important;
+                font-weight: 600 !important;
+                box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1) !important;
+                transition: all 0.3s ease !important;
+            }
+            
+            .process-button:hover {
+                transform: translateY(-2px) !important;
+                box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.2) !important;
+            }
+            
+            /* Status Output */
+            .status-output {
+                background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%) !important;
+                border-left: 4px solid #0ea5e9 !important;
+                padding: 1rem !important;
+                border-radius: 8px !important;
+                margin-top: 1rem !important;
+            }
+            
+            /* Download Area */
+            .download-area {
+                margin-top: 1rem !important;
+                border-radius: 8px !important;
+            }
+            
+            /* Footer */
+            .footer-text {
+                opacity: 0.8 !important;
+            }
+            
+            .footer-text a {
+                color: #667eea !important;
+                text-decoration: none !important;
+                font-weight: 500 !important;
+            }
+            
+            .footer-text a:hover {
+                text-decoration: underline !important;
+            }
+            
+            /* Accordion Styling */
+            .accordion {
+                margin-top: 1rem !important;
+            }
+            
+            /* Mobile Responsiveness */
+            @media (max-width: 768px) {
+                .gradio-container {
+                    padding: 0.5rem !important;
+                }
+                
+                .header-text h1 {
+                    font-size: 1.5rem !important;
+                }
+                
+                .header-text p {
+                    font-size: 1rem !important;
+                }
+                
+                .process-button {
+                    width: 100% !important;
+                    font-size: 1rem !important;
+                }
+            }
+            
+            /* Dark Mode Support */
+            @media (prefers-color-scheme: dark) {
+                .upload-area {
+                    border-color: #475569 !important;
+                }
+                
+                .upload-area:hover {
+                    background: #1e293b !important;
+                }
+                
+                .status-output {
+                    background: linear-gradient(135deg, #1e293b 0%, #334155 100%) !important;
+                }
+            }
+            """,
+            footer_links=[
+                {"label": "Built with anycoder", "url": "https://huggingface.co/spaces/akhaliq/anycoder"},
+                "gradio",
+                "api"
+            ]
         )
     except Exception as e:
         logger.error(f"Erro ao iniciar aplicação: {e}")
         logger.info("Tentando iniciar com configuração alternativa...")
 
-        # Fallback: tenta com share=True
         try:
             demo.queue().launch(
                 server_name="0.0.0.0",
@@ -529,7 +596,11 @@ if __name__ == "__main__":
                 max_file_size=f"{config.MAX_FILE_SIZE_MB}mb",
                 show_error=True,
                 share=True,
+                theme=gr.themes.Soft(primary_hue="blue"),
+                footer_links=[
+                    {"label": "Built with anycoder", "url": "https://huggingface.co/spaces/akhaliq/anycoder"}
+                ]
             )
         except Exception as fallback_error:
             logger.critical(f"Falha crítica ao iniciar: {fallback_error}")
-            raise
+            raise