@extends('layouts.app')

@section('title', 'Detalles del Cliente')

@section('content')
<div class="container-fluid">
    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h1 class="h3 mb-0 text-gray-800">
                        <i class="fas fa-user-tie me-2"></i>Detalles del Cliente
                    </h1>
                    <p class="text-muted mb-0">{{ $client->business_name }}</p>
                </div>
                <div>
                    <a href="{{ route('admin.gestor.clients.edit', $client) }}" class="btn btn-warning me-2">
                        <i class="fas fa-edit me-2"></i>Editar
                    </a>
                    <a href="{{ route('admin.gestor.clients.index') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left me-2"></i>Volver
                    </a>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <!-- Información Principal -->
        <div class="col-md-8">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-info-circle me-2"></i>Información General
                    </h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Código:</label>
                                <p class="mb-0">
                                    <span class="badge bg-secondary fs-6">{{ $client->code }}</span>
                                </p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">{{ getTaxDocumentLabel() }}:</label>
                                <p class="mb-0">{{ $client->tax_id }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Nombre Comercial:</label>
                                <p class="mb-0">{{ $client->business_name }}</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Razón Social:</label>
                                <p class="mb-0">{{ $client->legal_name ?: 'No especificada' }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Tipo de Negocio:</label>
                                <p class="mb-0">
                                    <span class="badge bg-info">{{ ucfirst($client->business_type ?: 'No especificado') }}</span>
                                </p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Industria:</label>
                                <p class="mb-0">{{ $client->industry ?: 'No especificada' }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Estado:</label>
                                <p class="mb-0">{!! $client->status_badge !!}</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Activo:</label>
                                <p class="mb-0">
                                    @if($client->is_active)
                                        <span class="badge bg-success">Sí</span>
                                    @else
                                        <span class="badge bg-secondary">No</span>
                                    @endif
                                </p>
                            </div>
                        </div>
                    </div>

                    @if($client->website)
                        <div class="mb-3">
                            <label class="form-label fw-bold">Sitio Web:</label>
                            <p class="mb-0">
                                <a href="{{ $client->website }}" target="_blank" class="text-primary">
                                    {{ $client->website }}
                                </a>
                            </p>
                        </div>
                    @endif
                </div>
            </div>

            <!-- Información de Contacto -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-phone me-2"></i>Información de Contacto
                    </h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Persona de Contacto:</label>
                                <p class="mb-0">{{ $client->contact_person ?: 'No especificada' }}</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Cargo:</label>
                                <p class="mb-0">{{ $client->contact_position ?: 'No especificado' }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Email:</label>
                                <p class="mb-0">
                                    @if($client->email)
                                        <a href="mailto:{{ $client->email }}" class="text-primary">
                                            {{ $client->email }}
                                        </a>
                                    @else
                                        No especificado
                                    @endif
                                </p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Teléfono:</label>
                                <p class="mb-0">{{ $client->phone ?: 'No especificado' }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Móvil:</label>
                        <p class="mb-0">{{ $client->mobile ?: 'No especificado' }}</p>
                    </div>
                </div>
            </div>

            <!-- Dirección -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-map-marker-alt me-2"></i>Dirección
                    </h6>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-bold">Dirección Completa:</label>
                        <p class="mb-0">{{ $client->full_address ?: 'No especificada' }}</p>
                    </div>

                    @if($client->latitude && $client->longitude)
                        <div class="mb-3">
                            <label class="form-label fw-bold">Coordenadas:</label>
                            <p class="mb-0">
                                <span class="badge bg-success">
                                    <i class="fas fa-map-marker-alt me-1"></i>
                                    {{ $client->latitude }}, {{ $client->longitude }}
                                </span>
                                <a href="{{ $client->google_maps_url }}" target="_blank" class="btn btn-sm btn-outline-primary ms-2">
                                    <i class="fas fa-external-link-alt me-1"></i>Ver en Google Maps
                                </a>
                            </p>
                        </div>
                    @endif
                </div>
            </div>

            <!-- Información Comercial -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-handshake me-2"></i>Información Comercial
                    </h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Días de Crédito:</label>
                                <p class="mb-0">{{ $client->credit_days }} días</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Método de Pago:</label>
                                <p class="mb-0">{{ $client->payment_method_formatted }}</p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Nº SADA:</label>
                                <p class="mb-0">
                                    @if($client->sada_number)
                                        <span class="badge bg-info fs-6">{{ $client->sada_number }}</span>
                                    @else
                                        <span class="text-muted">No asignado</span>
                                    @endif
                                </p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Personalizado 1:</label>
                                <p class="mb-0">
                                    @if($client->custom_field_1)
                                        <span class="badge bg-secondary fs-6">{{ $client->custom_field_1 }}</span>
                                    @else
                                        <span class="text-muted">No asignado</span>
                                    @endif
                                </p>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Monto Máximo de Crédito:</label>
                                <p class="mb-0">${{ number_format($client->max_credit_amount, 0) }} {{ getMainCurrency() }}</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label fw-bold">Crédito Actualmente Usado:</label>
                                <div class="d-flex align-items-center">
                                    <p class="mb-0 me-2">${{ number_format($client->current_credit_used, 0) }} {{ getMainCurrency() }}</p>
                                    <span class="badge bg-warning" title="Campo calculado automáticamente">
                                        <i class="fas fa-lock"></i> Solo lectura
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Crédito Disponible:</label>
                        <p class="mb-0">${{ number_format($client->available_credit, 0) }} {{ getMainCurrency() }}</p>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Utilización del Crédito:</label>
                        <div class="progress">
                            <div class="progress-bar" role="progressbar" 
                                 style="width: {{ $client->credit_utilization_percentage }}%">
                                {{ $client->credit_utilization_percentage }}%
                            </div>
                        </div>
                        <small class="text-muted">{!! $client->credit_status_badge !!}</small>
                    </div>
                </div>
            </div>
        </div>

        <!-- Panel Lateral -->
        <div class="col-md-4">
            <!-- Asignaciones -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-info">
                        <i class="fas fa-users me-2"></i>Asignaciones
                    </h6>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-bold">Vendedor Asignado:</label>
                        <p class="mb-0">
                            @if($client->salesman)
                                <span class="badge bg-primary">{{ $client->salesman->full_name }}</span>
                                <br><small class="text-muted">{{ $client->salesman->code }}</small>
                            @else
                                <span class="text-muted">Sin asignar</span>
                            @endif
                        </p>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Zona Asignada:</label>
                        <p class="mb-0">
                            @if($client->zone)
                                <span class="badge" style="background-color: {{ $client->zone->color }}; color: white;">
                                    {{ $client->zone->name }}
                                </span>
                                <br><small class="text-muted">{{ $client->zone->code }}</small>
                            @else
                                <span class="text-muted">Sin asignar</span>
                            @endif
                        </p>
                    </div>
                </div>
            </div>

            <!-- Formulario para subir documentos (oculto por defecto) -->
            <div class="card shadow mb-4" id="uploadDocumentForm" style="display: none;">
                <div class="card-header py-3 d-flex justify-content-between align-items-center bg-success text-white">
                    <h6 class="m-0 font-weight-bold">
                        <i class="fas fa-upload me-2"></i>Subir Documento
                    </h6>
                    <button type="button" class="btn btn-sm btn-light" id="closeUploadForm">
                        <i class="fas fa-times me-1"></i>Cerrar
                    </button>
                </div>
                <div class="card-body">
                    <form action="{{ route('admin.gestor.clients.upload-document', $client) }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="document_type" class="form-label">Tipo de Documento <span class="text-danger">*</span></label>
                                    <select class="form-select @error('document_type') is-invalid @enderror" id="document_type" name="document_type" required>
                                        <option value="">Seleccionar tipo</option>
                                        <option value="Cédula" {{ old('document_type') == 'Cédula' ? 'selected' : '' }}>Cédula</option>
                                        <option value="RIF" {{ old('document_type') == 'RIF' ? 'selected' : '' }}>RIF</option>
                                        <option value="Pasaporte" {{ old('document_type') == 'Pasaporte' ? 'selected' : '' }}>Pasaporte</option>
                                        <option value="Licencia de Conducir" {{ old('document_type') == 'Licencia de Conducir' ? 'selected' : '' }}>Licencia de Conducir</option>
                                        <option value="Certificado de Ingresos" {{ old('document_type') == 'Certificado de Ingresos' ? 'selected' : '' }}>Certificado de Ingresos</option>
                                        <option value="Referencias Comerciales" {{ old('document_type') == 'Referencias Comerciales' ? 'selected' : '' }}>Referencias Comerciales</option>
                                        <option value="Estados Financieros" {{ old('document_type') == 'Estados Financieros' ? 'selected' : '' }}>Estados Financieros</option>
                                        <option value="Otro" {{ old('document_type') == 'Otro' ? 'selected' : '' }}>Otro</option>
                                    </select>
                                    @error('document_type')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="document_name" class="form-label">Nombre del Documento <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control @error('document_name') is-invalid @enderror" 
                                           id="document_name" name="document_name" value="{{ old('document_name') }}" required>
                                    @error('document_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="file" class="form-label">Archivo <span class="text-danger">*</span></label>
                            <input type="file" class="form-control @error('file') is-invalid @enderror" 
                                   id="file" name="file" accept=".pdf,.doc,.docx,.jpg,.jpeg,.png" required>
                            <div class="form-text">Formatos permitidos: PDF, DOC, DOCX, JPG, JPEG, PNG. Máximo 10MB.</div>
                            @error('file')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="expiration_date" class="form-label">Fecha de Vencimiento</label>
                                    <input type="date" class="form-control @error('expiration_date') is-invalid @enderror" 
                                           id="expiration_date" name="expiration_date" value="{{ old('expiration_date') }}">
                                    @error('expiration_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="notification_days" class="form-label">Días de Notificación</label>
                                    <input type="number" class="form-control @error('notification_days') is-invalid @enderror" 
                                           id="notification_days" name="notification_days" value="{{ old('notification_days', 30) }}" min="1" max="365">
                                    <div class="form-text">Días antes del vencimiento para notificar</div>
                                    @error('notification_days')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="description" class="form-label">Descripción</label>
                            <textarea class="form-control @error('description') is-invalid @enderror" 
                                      id="description" name="description" rows="3" placeholder="Descripción adicional del documento">{{ old('description') }}</textarea>
                            @error('description')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="d-flex justify-content-end gap-2">
                            <button type="button" class="btn btn-secondary" id="cancelUploadForm">Cancelar</button>
                            <button type="submit" class="btn btn-success">
                                <i class="fas fa-upload me-2"></i>Subir Documento
                            </button>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Documentos -->
            <div class="card shadow mb-4">
                <div class="card-header py-3 d-flex justify-content-between align-items-center">
                    <h6 class="m-0 font-weight-bold text-warning">
                        <i class="fas fa-file-alt me-2"></i>Documentos
                    </h6>
                    <button type="button" class="btn btn-sm btn-success" id="toggleUploadForm">
                        <i class="fas fa-plus me-1"></i>Agregar Documento
                    </button>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-bold">Total de Documentos:</label>
                        <p class="mb-0">
                            <span class="badge bg-warning">{{ $client->documents_count }}</span>
                        </p>
                    </div>

                    @if($client->documents_count > 0)
                        <div class="list-group">
                            @foreach($client->documents as $doc)
                                <div class="list-group-item">
                                    <div class="d-flex justify-content-between align-items-center">
                                        <div class="flex-grow-1">
                                            <div class="d-flex align-items-center">
                                                <i class="fas fa-file-{{ $doc->file_extension === 'pdf' ? 'pdf' : ($doc->file_extension === 'doc' || $doc->file_extension === 'docx' ? 'word' : 'alt') }} me-2 text-primary"></i>
                                                <div>
                                                    <strong>{{ $doc->document_name }}</strong>
                                                    <br><small class="text-muted">{{ $doc->document_type }}</small>
                                                    @if($doc->description)
                                                        <br><small class="text-muted">{{ Str::limit($doc->description, 50) }}</small>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                        <div class="d-flex align-items-center gap-2">
                                            @if($doc->expiration_date)
                                                <span class="badge bg-{{ $doc->expiration_date < now() ? 'danger' : ($doc->expiration_date < now()->addDays(30) ? 'warning' : 'success') }}">
                                                    {{ $doc->expiration_date->format('d/m/Y') }}
                                                </span>
                                            @endif
                                            <a href="{{ asset('storage/' . $doc->file_path) }}" target="_blank" class="btn btn-sm btn-outline-primary" title="Ver documento">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <form action="{{ route('admin.gestor.clients.delete-document', $doc) }}" method="POST" class="d-inline" onsubmit="return confirm('¿Estás seguro de eliminar este documento?')">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="btn btn-sm btn-outline-danger" title="Eliminar documento">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @else
                        <div class="text-center py-4">
                            <i class="fas fa-file-alt fa-3x text-muted mb-3"></i>
                            <p class="text-muted">No hay documentos registrados</p>
                            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#uploadDocumentModal">
                                <i class="fas fa-plus me-2"></i>Agregar Primer Documento
                            </button>
                        </div>
                    @endif
                </div>
            </div>

            <!-- Call Center -->
            @can('call-center.index')
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="fas fa-phone-alt me-2"></i>Call Center
                    </h6>
                </div>
                <div class="card-body">
                    @php
                        $interactionsCount = $client->call_center_logs_count ?? 0;
                        $lastInteraction = $client->callCenterLogs->first() ?? null;
                        $pendingFollowUps = \App\Models\CallCenterLog::where('client_id', $client->id)
                            ->where('status', 'Seguimiento')
                            ->whereNotNull('follow_up_date')
                            ->where('follow_up_date', '<=', now())
                            ->count();
                    @endphp
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">Total Interacciones:</label>
                        <p class="mb-0">
                            <span class="badge bg-primary fs-6">{{ number_format($interactionsCount) }}</span>
                        </p>
                    </div>

                    @if($lastInteraction)
                        <div class="mb-3">
                            <label class="form-label fw-bold">Última Interacción:</label>
                            <p class="mb-0">
                                <small class="text-muted">{{ $lastInteraction->created_at->format('d/m/Y H:i') }}</small><br>
                                <span class="badge bg-{{ $lastInteraction->status == 'Completado' ? 'success' : ($lastInteraction->status == 'Seguimiento' ? 'info' : 'warning') }}">
                                    {{ $lastInteraction->status }}
                                </span>
                                - {{ $lastInteraction->interaction_type }}
                            </p>
                        </div>
                    @endif

                    @if($pendingFollowUps > 0)
                        <div class="alert alert-warning mb-3">
                            <i class="fas fa-exclamation-triangle me-2"></i>
                            <strong>{{ $pendingFollowUps }}</strong> seguimiento(s) pendiente(s)
                        </div>
                    @endif

                    <div class="d-grid gap-2">
                        @can('call-center.create')
                        <a href="{{ route('admin.call-center.logs.create', ['client_id' => $client->id]) }}" 
                           class="btn btn-primary">
                            <i class="fas fa-plus me-2"></i>Nueva Interacción
                        </a>
                        @endcan
                        
                        <a href="{{ route('admin.call-center.client.interactions', $client->id) }}" 
                           class="btn btn-info">
                            <i class="fas fa-list me-2"></i>Ver Historial
                        </a>
                    </div>
                </div>
            </div>
            @endcan

            <!-- Acciones Rápidas -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-info">
                        <i class="fas fa-bolt me-2"></i>Acciones Rápidas
                    </h6>
                </div>
                <div class="card-body">
                    <div class="d-grid gap-2">
                        <a href="{{ route('admin.gestor.clients.edit', $client) }}" class="btn btn-warning">
                            <i class="fas fa-edit me-2"></i>Editar Cliente
                        </a>
                        
                        <form action="{{ route('admin.gestor.clients.toggle-status', $client) }}" method="POST" class="d-inline">
                            @csrf
                            <button type="submit" class="btn btn-{{ $client->is_active ? 'secondary' : 'success' }} w-100">
                                <i class="fas fa-{{ $client->is_active ? 'pause' : 'play' }} me-2"></i>
                                {{ $client->is_active ? 'Desactivar' : 'Activar' }}
                            </button>
                        </form>
                        
                        <a href="{{ route('admin.gestor.clients.index') }}" class="btn btn-info">
                            <i class="fas fa-list me-2"></i>Ver Todos los Clientes
                        </a>
                    </div>
                </div>
            </div>

            <!-- Información del Sistema -->
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-secondary">
                        <i class="fas fa-info me-2"></i>Información del Sistema
                    </h6>
                </div>
                <div class="card-body">
                    <div class="mb-2">
                        <small class="text-muted">Creado:</small><br>
                        <strong>{{ $client->created_at->format('d/m/Y H:i') }}</strong>
                    </div>
                    <div class="mb-2">
                        <small class="text-muted">Última actualización:</small><br>
                        <strong>{{ $client->updated_at->format('d/m/Y H:i') }}</strong>
                    </div>
                    @if($client->deleted_at)
                        <div class="mb-2">
                            <small class="text-muted">Eliminado:</small><br>
                            <strong class="text-danger">{{ $client->deleted_at->format('d/m/Y H:i') }}</strong>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    var uploadForm = document.getElementById('uploadDocumentForm');
    var toggleBtn = document.getElementById('toggleUploadForm');
    var closeBtn = document.getElementById('closeUploadForm');
    var cancelBtn = document.getElementById('cancelUploadForm');
    
    // Mostrar formulario
    if (toggleBtn) {
        toggleBtn.addEventListener('click', function() {
            if (uploadForm) {
                uploadForm.style.display = 'block';
                // Scroll suave al formulario
                uploadForm.scrollIntoView({ behavior: 'smooth', block: 'start' });
                // Enfocar el primer campo
                setTimeout(function() {
                    var firstInput = uploadForm.querySelector('input:not([type="hidden"]), select, textarea');
                    if (firstInput) {
                        firstInput.focus();
                    }
                }, 300);
            }
        });
    }
    
    // Cerrar formulario
    function closeForm() {
        if (uploadForm) {
            uploadForm.style.display = 'none';
            // Limpiar el formulario
            var form = uploadForm.querySelector('form');
            if (form) {
                form.reset();
                form.querySelectorAll('.is-invalid').forEach(function(el) {
                    el.classList.remove('is-invalid');
                });
                form.querySelectorAll('.invalid-feedback').forEach(function(el) {
                    el.remove();
                });
            }
        }
    }
    
    if (closeBtn) {
        closeBtn.addEventListener('click', closeForm);
    }
    
    if (cancelBtn) {
        cancelBtn.addEventListener('click', closeForm);
    }
    
    // Mostrar el formulario si hay errores de validación
    @if($errors->has('document_type') || $errors->has('document_name') || $errors->has('file') || $errors->has('expiration_date') || $errors->has('notification_days') || $errors->has('description'))
        if (uploadForm) {
            uploadForm.style.display = 'block';
            uploadForm.scrollIntoView({ behavior: 'smooth', block: 'start' });
        }
    @endif
});
</script>
@endpush
@endsection