@extends('layouts.app')

@section('title', 'Rotación de Inventario')

@section('content')
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <h2 class="mb-0">
                    <i class="fas fa-sync-alt me-2"></i>Rotación de Inventario
                </h2>
                <div>
                    <a href="{{ route('admin.inventory.reports') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left me-2"></i>Volver a Reportes
                    </a>
                    <a href="{{ route('admin.inventory.reports.turnover', array_merge(request()->all(), ['export' => 'excel'])) }}" class="btn btn-success">
                        <i class="fas fa-file-excel me-2"></i>Exportar Excel
                    </a>
                    <button onclick="window.print()" class="btn btn-primary">
                        <i class="fas fa-print me-2"></i>Imprimir
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Estadísticas -->
    @if(isset($stats))
    <div class="row g-3 mb-4">
        <div class="col-xl-3 col-md-6">
            <div class="card shadow-sm border-left-primary">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-muted mb-1">Total Productos</h6>
                            <h4 class="mb-0">{{ number_format($stats['total_products'] ?? 0) }}</h4>
                            @if(isset($comparisonStats))
                                <small class="text-muted">Comparación: {{ number_format($comparisonStats['total_products'] ?? 0) }}</small>
                            @endif
                        </div>
                        <div class="text-primary">
                            <i class="fas fa-box fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-md-6">
            <div class="card shadow-sm border-left-success">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-muted mb-1">Ingresos Totales</h6>
                            <h4 class="mb-0">${{ number_format($stats['total_revenue'] ?? 0, 2) }}</h4>
                            @if(isset($comparisonStats))
                                <small class="text-muted">Comparación: ${{ number_format($comparisonStats['total_revenue'] ?? 0, 2) }}</small>
                                @php
                                    $change = $comparisonStats['change_percentage_revenue'] ?? 0;
                                    $badgeClass = $change >= 0 ? 'badge-success' : 'badge-danger';
                                    $icon = $change >= 0 ? 'fa-arrow-up' : 'fa-arrow-down';
                                @endphp
                                <span class="badge {{ $badgeClass }} ms-2">
                                    <i class="fas {{ $icon }} me-1"></i>{{ number_format(abs($change), 2) }}%
                                </span>
                            @endif
                        </div>
                        <div class="text-success">
                            <i class="fas fa-dollar-sign fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-md-6">
            <div class="card shadow-sm border-left-info">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-muted mb-1">Unidades Vendidas</h6>
                            <h4 class="mb-0">{{ number_format($stats['total_sold'] ?? 0, 2) }}</h4>
                            @if(isset($comparisonStats))
                                <small class="text-muted">Comparación: {{ number_format($comparisonStats['total_sold'] ?? 0, 2) }}</small>
                            @endif
                        </div>
                        <div class="text-info">
                            <i class="fas fa-shopping-cart fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-md-6">
            <div class="card shadow-sm border-left-warning">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h6 class="text-muted mb-1">Rotación Promedio</h6>
                            <h4 class="mb-0">{{ number_format($stats['avg_turnover_rate'] ?? 0, 2) }}x</h4>
                            @if(isset($comparisonStats))
                                <small class="text-muted">Comparación: {{ number_format($comparisonStats['avg_turnover_rate'] ?? 0, 2) }}x</small>
                            @endif
                        </div>
                        <div class="text-warning">
                            <i class="fas fa-sync-alt fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Filtros -->
    <div class="card shadow-sm mb-4">
        <div class="card-header bg-light d-flex justify-content-between align-items-center">
            <h5 class="mb-0">
                <i class="fas fa-filter me-2"></i>Filtros
            </h5>
            <div>
                @if(auth()->check())
                    <select id="savedFilters" class="form-select form-select-sm d-inline-block" style="width: auto;">
                        <option value="">Filtros Guardados</option>
                    </select>
                    <button type="button" class="btn btn-sm btn-info" data-bs-toggle="modal" data-bs-target="#saveFilterModal">
                        <i class="fas fa-save me-1"></i>Guardar Filtros
                    </button>
                @endif
            </div>
        </div>
        <div class="card-body">
            <form method="GET" action="{{ route('admin.inventory.reports.turnover') }}" id="filterForm" class="row g-3">
                <div class="col-md-3">
                    <label for="date_from" class="form-label">Fecha Desde</label>
                    <input type="date" name="date_from" id="date_from" class="form-control" value="{{ $dateFrom ?? '' }}">
                </div>
                <div class="col-md-3">
                    <label for="date_to" class="form-label">Fecha Hasta</label>
                    <input type="date" name="date_to" id="date_to" class="form-control" value="{{ $dateTo ?? '' }}">
                </div>
                <div class="col-md-3">
                    <label for="warehouse_name" class="form-label">Almacén</label>
                    <select name="warehouse_name" id="warehouse_name" class="form-select">
                        <option value="">Todos los Almacenes</option>
                        @foreach($warehouses as $w)
                            <option value="{{ $w->name }}" {{ request('warehouse_name') == $w->name ? 'selected' : '' }}>
                                {{ $w->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-2">
                    <label for="per_page" class="form-label">Items por página</label>
                    <select name="per_page" id="per_page" class="form-select">
                        <option value="10" {{ request('per_page') == '10' ? 'selected' : '' }}>10</option>
                        <option value="20" {{ request('per_page') == '20' || !request('per_page') ? 'selected' : '' }}>20</option>
                        <option value="50" {{ request('per_page') == '50' ? 'selected' : '' }}>50</option>
                        <option value="100" {{ request('per_page') == '100' ? 'selected' : '' }}>100</option>
                    </select>
                </div>
                <div class="col-md-1 d-flex align-items-end">
                    <button type="submit" class="btn btn-primary">
                        <i class="fas fa-search"></i>
                    </button>
                </div>
                <div class="col-12">
                    <label for="search" class="form-label">Búsqueda Avanzada</label>
                    <input type="text" class="form-control" id="search" name="search" 
                           value="{{ request('search') }}" 
                           placeholder="Buscar por producto, SKU, código, categoría, marca...">
                    <small class="text-muted">Busca en nombre, SKU, código, categoría o marca del producto</small>
                </div>
            </form>
            <div class="row g-3 mt-2">
                <div class="col-md-3">
                    <label for="compare_period" class="form-label">
                        <i class="fas fa-chart-line me-1"></i>Comparar con
                    </label>
                    <select name="compare_period" id="compare_period" class="form-select">
                        <option value="">Sin comparación</option>
                        <option value="previous_month" {{ request('compare_period') == 'previous_month' ? 'selected' : '' }}>Mes Anterior</option>
                        <option value="previous_year" {{ request('compare_period') == 'previous_year' ? 'selected' : '' }}>Año Anterior</option>
                        <option value="custom" {{ request('compare_period') == 'custom' ? 'selected' : '' }}>Período Personalizado</option>
                    </select>
                </div>
                <div class="col-md-3" id="compare_custom_dates" style="display: {{ request('compare_period') == 'custom' ? 'block' : 'none' }};">
                    <label for="compare_date_from" class="form-label">Fecha Desde (Comparación)</label>
                    <input type="date" name="compare_date_from" id="compare_date_from" class="form-control" 
                           value="{{ request('compare_date_from') }}">
                </div>
                <div class="col-md-3" id="compare_custom_dates_to" style="display: {{ request('compare_period') == 'custom' ? 'block' : 'none' }};">
                    <label for="compare_date_to" class="form-label">Fecha Hasta (Comparación)</label>
                    <input type="date" name="compare_date_to" id="compare_date_to" class="form-control" 
                           value="{{ request('compare_date_to') }}">
                </div>
                <div class="col-md-3 d-flex align-items-end gap-2">
                    <a href="{{ route('admin.inventory.reports.turnover') }}" class="btn btn-secondary">
                        <i class="fas fa-redo me-2"></i>Limpiar
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- Gráficos de Rotación -->
    @if(count($turnover) > 0)
    <div class="row mb-4">
        <div class="col-md-6">
            <div class="card shadow-sm">
                <div class="card-header bg-primary text-white">
                    <h5 class="mb-0">
                        <i class="fas fa-chart-bar me-2"></i>Top 10 Rotación de Productos
                    </h5>
                </div>
                <div class="card-body">
                    <canvas id="turnoverRateChart" height="80"></canvas>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card shadow-sm">
                <div class="card-header bg-info text-white">
                    <h5 class="mb-0">
                        <i class="fas fa-chart-line me-2"></i>Días para Rotar (Top 10)
                    </h5>
                </div>
                <div class="card-body">
                    <canvas id="daysToTurnoverChart" height="80"></canvas>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Tabla de Rotación -->
    <div class="card shadow-sm">
        <div class="card-header bg-light">
            <h5 class="mb-0">
                <i class="fas fa-list me-2"></i>Análisis de Rotación de Productos
                <span class="badge bg-primary ms-2">{{ $paginatedTurnover->total() ?? count($turnover) }} productos</span>
            </h5>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-bordered table-striped table-hover mb-0">
                    <thead class="table-dark">
                        <tr>
                            <th>#</th>
                            <th>Producto</th>
                            <th>SKU</th>
                            <th class="text-end">Ventas (Unidades)</th>
                            <th class="text-end">Ingresos</th>
                            <th class="text-end">Stock Promedio</th>
                            <th class="text-end">Stock Actual</th>
                            <th class="text-end">Rotación</th>
                            <th class="text-end">Días para Rotar</th>
                            <th class="text-end">Costo Promedio</th>
                            <th class="text-end">Valor Inventario</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse(isset($paginatedTurnover) ? $paginatedTurnover : $turnover as $index => $item)
                            <tr>
                                <td>{{ isset($paginatedTurnover) ? (($paginatedTurnover->currentPage() - 1) * $paginatedTurnover->perPage() + $index + 1) : ($index + 1) }}</td>
                                <td>
                                    <strong>{{ $item['product']->name }}</strong>
                                    @if($item['product']->category)
                                        <br><small class="text-muted">{{ $item['product']->category->name }}</small>
                                    @endif
                                </td>
                                <td>{{ $item['product']->sku ?? 'N/A' }}</td>
                                <td class="text-end">{{ number_format($item['total_sold'], 2) }}</td>
                                <td class="text-end">${{ number_format($item['total_revenue'], 2) }}</td>
                                <td class="text-end">{{ number_format($item['avg_stock'], 2) }}</td>
                                <td class="text-end">
                                    <span class="badge bg-{{ $item['current_stock'] > 0 ? 'success' : 'danger' }}">
                                        {{ number_format($item['current_stock'], 2) }}
                                    </span>
                                </td>
                                <td class="text-end">
                                    <span class="badge bg-{{ $item['turnover_rate'] > 12 ? 'success' : ($item['turnover_rate'] > 6 ? 'warning' : 'danger') }}">
                                        {{ number_format($item['turnover_rate'], 2) }}x
                                    </span>
                                </td>
                                <td class="text-end">
                                    <span class="badge bg-{{ $item['days_to_turnover'] < 30 ? 'success' : ($item['days_to_turnover'] < 60 ? 'warning' : 'danger') }}">
                                        {{ number_format($item['days_to_turnover'], 0) }} días
                                    </span>
                                </td>
                                <td class="text-end">${{ number_format($item['avg_cost'], 2) }}</td>
                                <td class="text-end">${{ number_format($item['inventory_value'], 2) }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="11" class="text-center py-4">
                                    <i class="fas fa-info-circle me-2"></i>No se encontraron productos con ventas en el período seleccionado.
                                </td>
                            </tr>
                        @endforelse
                    </tbody>
                    @if(count($turnover) > 0)
                    <tfoot class="table-light">
                        <tr>
                            <th colspan="3" class="text-end">Totales:</th>
                            <th class="text-end">{{ number_format(array_sum(array_map(function($item) { return $item['total_sold'] ?? 0; }, $turnover)), 2) }}</th>
                            <th class="text-end">${{ number_format(array_sum(array_map(function($item) { return $item['total_revenue'] ?? 0; }, $turnover)), 2) }}</th>
                            <th class="text-end">-</th>
                            <th class="text-end">-</th>
                            <th class="text-end">-</th>
                            <th class="text-end">-</th>
                            <th class="text-end">-</th>
                            <th class="text-end">${{ number_format(array_sum(array_map(function($item) { return $item['inventory_value'] ?? 0; }, $turnover)), 2) }}</th>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
            @if(isset($paginatedTurnover) && $paginatedTurnover->hasPages())
            <div class="card-footer bg-white">
                <div class="d-flex justify-content-between align-items-center">
                    <div>
                        Mostrando {{ $paginatedTurnover->firstItem() }} a {{ $paginatedTurnover->lastItem() }} de {{ $paginatedTurnover->total() }} productos
                    </div>
                    <div>
                        {{ $paginatedTurnover->links() }}
                    </div>
                </div>
            </div>
            @endif
        </div>
    </div>

    <!-- Leyenda -->
    <div class="card shadow-sm mt-4">
        <div class="card-header bg-info text-white">
            <h6 class="mb-0">
                <i class="fas fa-info-circle me-2"></i>Leyenda
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <strong>Rotación:</strong>
                    <ul class="mb-0">
                        <li><span class="badge bg-success">> 12x</span> Alta rotación (excelente)</li>
                        <li><span class="badge bg-warning">6-12x</span> Rotación media (buena)</li>
                        <li><span class="badge bg-danger">< 6x</span> Baja rotación (requiere atención)</li>
                    </ul>
                </div>
                <div class="col-md-6">
                    <strong>Días para Rotar:</strong>
                    <ul class="mb-0">
                        <li><span class="badge bg-success">< 30 días</span> Rotación rápida</li>
                        <li><span class="badge bg-warning">30-60 días</span> Rotación normal</li>
                        <li><span class="badge bg-danger">> 60 días</span> Rotación lenta</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .border-left-primary {
        border-left: 4px solid #007bff;
    }
    .border-left-success {
        border-left: 4px solid #28a745;
    }
    .border-left-info {
        border-left: 4px solid #17a2b8;
    }
    .border-left-warning {
        border-left: 4px solid #ffc107;
    }
    .badge {
        font-weight: 500;
        letter-spacing: 0.3px;
    }
    @media print {
        .btn, .card-header, .navbar, .sidebar {
            display: none !important;
        }
        .card {
            border: none !important;
            box-shadow: none !important;
        }
    }
</style>

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Comparación histórica
    const comparePeriod = document.getElementById('compare_period');
    const compareCustomDates = document.getElementById('compare_custom_dates');
    const compareCustomDatesTo = document.getElementById('compare_custom_dates_to');
    
    if (comparePeriod) {
        comparePeriod.addEventListener('change', function() {
            if (this.value === 'custom') {
                if (compareCustomDates) compareCustomDates.style.display = 'block';
                if (compareCustomDatesTo) compareCustomDatesTo.style.display = 'block';
            } else {
                if (compareCustomDates) compareCustomDates.style.display = 'none';
                if (compareCustomDatesTo) compareCustomDatesTo.style.display = 'none';
            }
        });
        
        if (comparePeriod.value) {
            comparePeriod.dispatchEvent(new Event('change'));
        }
    }
    
    @if(count($turnover) > 0)
    @php
        $topTurnover = array_slice($turnover, 0, 10);
        $turnoverLabels = [];
        $turnoverRates = [];
        $daysToTurnover = [];
        foreach($topTurnover as $item) {
            $productName = $item['product']->name ?? 'Sin nombre';
            $turnoverLabels[] = strlen($productName) > 15 ? substr($productName, 0, 15) . '...' : $productName;
            $turnoverRates[] = floatval($item['turnover_rate'] ?? 0);
            $daysToTurnover[] = floatval($item['days_to_turnover'] ?? 0);
        }
    @endphp
    const turnoverLabels = @json($turnoverLabels);
    const turnoverRates = @json($turnoverRates);
    const daysToTurnover = @json($daysToTurnover);
    
    // Gráfico de Rotación
    const ctx1 = document.getElementById('turnoverRateChart');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'bar',
            data: {
                labels: turnoverLabels,
                datasets: [{
                    label: 'Tasa de Rotación',
                    data: turnoverRates,
                    backgroundColor: turnoverRates.map(rate => {
                        if (rate > 12) return 'rgba(40, 167, 69, 0.6)';
                        if (rate > 6) return 'rgba(255, 193, 7, 0.6)';
                        return 'rgba(220, 53, 69, 0.6)';
                    }),
                    borderColor: turnoverRates.map(rate => {
                        if (rate > 12) return 'rgba(40, 167, 69, 1)';
                        if (rate > 6) return 'rgba(255, 193, 7, 1)';
                        return 'rgba(220, 53, 69, 1)';
                    }),
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: true,
                scales: {
                    y: {
                        beginAtZero: true,
                        title: {
                            display: true,
                            text: 'Tasa de Rotación (x)'
                        }
                    }
                },
                plugins: {
                    legend: {
                        display: false
                    }
                }
            }
        });
    }
    
    // Gráfico de Días para Rotar
    const ctx2 = document.getElementById('daysToTurnoverChart');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'line',
            data: {
                labels: turnoverLabels,
                datasets: [{
                    label: 'Días para Rotar',
                    data: daysToTurnover,
                    borderColor: 'rgba(54, 162, 235, 1)',
                    backgroundColor: 'rgba(54, 162, 235, 0.1)',
                    borderWidth: 2,
                    fill: true,
                    tension: 0.4
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: true,
                scales: {
                    y: {
                        beginAtZero: true,
                        title: {
                            display: true,
                            text: 'Días'
                        }
                    }
                },
                plugins: {
                    legend: {
                        display: true,
                        position: 'top'
                    }
                }
            }
        });
    }
    @endif

    // Sistema de filtros guardados
    const reportType = 'turnover';
    const filterForm = $('#filterForm');
    const savedFiltersSelect = $('#savedFilters');
    const currentUserId = {{ auth()->id() ?? 0 }};

    // Cargar filtros guardados
    function loadSavedFilters() {
        fetch(`{{ url('admin/saved-report-filters') }}?report_type=${reportType}`, {
            headers: {
                'X-Requested-With': 'XMLHttpRequest',
                'Accept': 'application/json',
            }
        })
        .then(response => response.json())
        .then(data => {
            savedFiltersSelect.empty();
            savedFiltersSelect.append('<option value="">Filtros Guardados</option>');
            
            if (data.filters && data.filters.length > 0) {
                data.filters.forEach(filter => {
                    const option = $('<option>')
                        .val(filter.id)
                        .text(filter.name + (filter.is_default ? ' (Predeterminado)' : '') + (filter.is_shared ? ' [Compartido]' : ''));
                    savedFiltersSelect.append(option);
                });
            } else {
                savedFiltersSelect.append('<option value="">No hay filtros guardados</option>');
            }
        })
        .catch(error => {
            console.error('Error al cargar filtros:', error);
        });
    }

    // Aplicar filtro guardado
    savedFiltersSelect.on('change', function() {
        const filterId = $(this).val();
        if (filterId) {
            applyFilter(filterId);
        }
    });

    function applyFilter(filterId) {
        fetch(`{{ url('admin/saved-report-filters') }}/${filterId}/apply`, {
            headers: {
                'X-Requested-With': 'XMLHttpRequest',
                'Accept': 'application/json',
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.success && data.filters) {
                Object.keys(data.filters).forEach(key => {
                    const field = filterForm.find(`[name="${key}"]`);
                    if (field.length) {
                        if (field.attr('type') === 'checkbox') {
                            field.prop('checked', data.filters[key]);
                        } else {
                            field.val(data.filters[key] || '');
                        }
                    }
                });
                filterForm.submit();
            }
        })
        .catch(error => {
            console.error('Error al aplicar filtro:', error);
            alert('Error al aplicar el filtro');
        });
    }

    // Guardar filtro
    $('#saveFilterForm').on('submit', function(e) {
        e.preventDefault();
        
        const formData = new FormData(this);
        const filters = {};
        
        // Recopilar todos los valores del formulario de filtros
        filterForm.find('input, select, textarea').each(function() {
            const field = $(this);
            const name = field.attr('name');
            if (name && name !== '_token') {
                if (field.attr('type') === 'checkbox') {
                    if (field.is(':checked')) filters[name] = true;
                } else if (field.val()) {
                    filters[name] = field.val();
                }
            }
        });
        
        formData.append('filters', JSON.stringify(filters));
        formData.append('report_type', reportType);
        
        fetch('{{ route("admin.saved-report-filters.store") }}', {
            method: 'POST',
            headers: {
                'X-Requested-With': 'XMLHttpRequest',
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                'Accept': 'application/json',
            },
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                alert('Filtro guardado exitosamente');
                $('#saveFilterModal').modal('hide');
                $('#saveFilterForm')[0].reset();
                loadSavedFilters();
            } else {
                alert(data.message || 'Error al guardar el filtro');
            }
        })
        .catch(error => {
            console.error('Error al guardar filtro:', error);
            alert('Error al guardar el filtro');
        });
    });

    // Cargar filtros al iniciar
    @if(auth()->check())
    loadSavedFilters();
    @endif
});
</script>

<!-- Modal para guardar filtros -->
@if(auth()->check())
<div class="modal fade" id="saveFilterModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Guardar Filtros</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="saveFilterForm">
                @csrf
                <div class="modal-body">
                    <input type="hidden" name="report_type" value="turnover">
                    <div class="mb-3">
                        <label for="filter_name" class="form-label">Nombre del Filtro</label>
                        <input type="text" class="form-control" id="filter_name" name="name" required>
                    </div>
                    <div class="mb-3">
                        <label for="filter_description" class="form-label">Descripción (opcional)</label>
                        <textarea class="form-control" id="filter_description" name="description" rows="2"></textarea>
                    </div>
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" id="is_default" name="is_default" value="1">
                        <label class="form-check-label" for="is_default">
                            Establecer como predeterminado
                        </label>
                    </div>
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" id="is_shared" name="is_shared" value="1">
                        <label class="form-check-label" for="is_shared">
                            Compartir con otros usuarios
                        </label>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-primary">Guardar</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endif
@endpush
@endsection