@extends('layouts.layoutsPrint')

@section('content')

<div class="container-fluid py-4">
    <!-- Header con logo y datos empresa -->
    <div class="row mb-4 no-print-hide">
        <div class="col-12 text-center mb-3">
            <button class="btn btn-primary" onclick="window.print()">
                <i class="fas fa-print"></i> Imprimir
            </button>
        </div>
    </div>

    <div class="ficha-producto">
        <!-- Encabezado -->
        <div class="row encabezado pb-3 mb-3" style="border-bottom: 2px solid #dee2e6;">
            <div class="col-6">
                <h4 class="text-primary mb-0">{{ $fantasy_name }}</h4>
                <small class="text-muted">Ficha de Producto</small>
            </div>
            <div class="col-6 text-right">
                <small class="text-muted">Fecha: {{ \Carbon\Carbon::now()->format('d/m/Y H:i') }}</small>
            </div>
        </div>

        <!-- Titulo del producto -->
        <div class="row mb-4">
            <div class="col-12 text-center">
                <h2 class="mb-1">{{ $producto->descripcion }}</h2>
                @if($producto->codigo_interno)
                    <span class="badge badge-secondary" style="font-size: 1rem;">Cod: {{ $producto->codigo_interno }}</span>
                @endif
                @if($producto->sku)
                    <span class="badge badge-info" style="font-size: 1rem;">SKU: {{ $producto->sku }}</span>
                @endif
            </div>
        </div>

        <!-- Codigo de barras -->
        @if($codigo_barra_imagen)
        <div class="row mb-4">
            <div class="col-12 text-center">
                <img src="{{ $codigo_barra_imagen }}" alt="Codigo de Barras" style="max-width: 300px; height: auto;">
                <div class="mt-1">
                    <code style="font-size: 14px;">{{ $producto->codigo_interno }}</code>
                </div>
            </div>
        </div>
        @endif

        <!-- Caracteristicas -->
        <div class="row mb-3">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-info-circle text-primary"></i> Caracteristicas</h5>
            </div>
        </div>
        <div class="row mb-4">
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>Tipo:</strong></td>
                        <td>{{ $producto->tipo->descripcion ?? '-' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Rubro:</strong></td>
                        <td>{{ $producto->rubro_sub->rubro->descripcion ?? '-' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Sub-Rubro:</strong></td>
                        <td>{{ $producto->rubro_sub->descripcion ?? '-' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Proveedor:</strong></td>
                        <td>{{ $producto->proveedor->field_name1 ?? '-' }}</td>
                    </tr>
                </table>
            </div>
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>Unidad Medida:</strong></td>
                        <td>{{ $producto->unidad_de_medida->descripcion ?? '-' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Prioridad:</strong></td>
                        <td>{{ $producto->prioridad->descripcion ?? '-' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Habilitado:</strong></td>
                        <td>{{ $producto->habilitado ? 'Si' : 'No' }}</td>
                    </tr>
                    <tr>
                        <td><strong>Ubicaciones:</strong></td>
                        <td>{{ $ubicaciones ?: '-' }}</td>
                    </tr>
                </table>
            </div>
        </div>

        @if($variantes)
        <div class="row mb-4">
            <div class="col-12">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="20%"><strong>Variantes:</strong></td>
                        <td>{{ $variantes }}</td>
                    </tr>
                </table>
            </div>
        </div>
        @endif

        <!-- Precios -->
        <div class="row mb-3">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-dollar-sign text-success"></i> Precios</h5>
            </div>
        </div>
        <div class="row mb-4">
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>Costo:</strong></td>
                        <td>{{ $producto->moneda->simbolo ?? '$' }} {{ number_format($producto->costo, 2, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td><strong>Margen:</strong></td>
                        <td>{{ number_format($producto->margen, 2, ',', '.') }}%</td>
                    </tr>
                    <tr>
                        <td><strong>Precio Sin IVA:</strong></td>
                        <td>{{ $producto->moneda->simbolo ?? '$' }} {{ number_format($producto->precio_sin_iva, 2, ',', '.') }}</td>
                    </tr>
                </table>
            </div>
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>IVA ({{ $producto->system_tax->percent_iva ?? 0 }}%):</strong></td>
                        <td>{{ $producto->moneda->simbolo ?? '$' }} {{ number_format($producto->iva ?? 0, 2, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td><strong>Precio Final:</strong></td>
                        <td class="text-success" style="font-size: 1.2rem; font-weight: bold;">
                            {{ $producto->moneda->simbolo ?? '$' }} {{ number_format($producto->precio_final, 2, ',', '.') }}
                        </td>
                    </tr>
                    <tr>
                        <td><strong>Lista de Precio:</strong></td>
                        <td>{{ $producto->lista_de_precio->descripcion ?? '-' }}</td>
                    </tr>
                </table>
            </div>
        </div>

        <!-- Stock -->
        <div class="row mb-3">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-boxes text-warning"></i> Stock</h5>
            </div>
        </div>
        <div class="row mb-4">
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>Stock Actual:</strong></td>
                        <td style="font-size: 1.3rem; font-weight: bold;">{{ number_format($stock_total, 2, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td><strong>Stock Minimo:</strong></td>
                        <td>{{ number_format($producto->stock_minimo ?? 0, 2, ',', '.') }}</td>
                    </tr>
                </table>
            </div>
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <td width="40%"><strong>Stock Maximo:</strong></td>
                        <td>{{ number_format($producto->stock_maximo ?? 0, 2, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td><strong>Punto de Pedido:</strong></td>
                        <td>{{ number_format($producto->punto_pedido ?? 0, 2, ',', '.') }}</td>
                    </tr>
                </table>
            </div>
        </div>

        <!-- Observaciones -->
        @if($producto->observacion)
        <div class="row mb-3">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-sticky-note text-info"></i> Observaciones</h5>
            </div>
        </div>
        <div class="row mb-4">
            <div class="col-12">
                <p>{{ $producto->observacion }}</p>
            </div>
        </div>
        @endif

        <!-- Foto del producto -->
        @if($producto->foto)
        <div class="row mb-4">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-image text-secondary"></i> Imagen</h5>
                <div class="text-center">
                    <img src="{{ asset('storage/productos/' . $producto->foto) }}"
                         alt="{{ $producto->descripcion }}"
                         style="max-width: 400px; max-height: 300px; object-fit: contain;">
                </div>
            </div>
        </div>
        @endif

        <!-- Fotos adicionales -->
        @if($producto->fotos && $producto->fotos->count() > 0)
        <div class="row mb-4">
            <div class="col-12">
                <h5 class="border-bottom pb-2 mb-3"><i class="fas fa-images text-secondary"></i> Fotos Adicionales</h5>
                <div class="row">
                    @foreach($producto->fotos as $foto)
                    <div class="col-md-3 mb-2">
                        <img src="{{ asset('storage/productos/' . $foto->foto) }}"
                             alt="Foto adicional"
                             style="max-width: 100%; max-height: 150px; object-fit: contain;">
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
        @endif

        <!-- Pie de pagina -->
        <div class="row mt-4 pt-3" style="border-top: 1px solid #dee2e6;">
            <div class="col-12 text-center">
                <small class="text-muted">
                    Ficha generada el {{ \Carbon\Carbon::now()->format('d/m/Y H:i:s') }} - {{ $fantasy_name }}
                </small>
            </div>
        </div>
    </div>
</div>

<style>
    .ficha-producto {
        max-width: 800px;
        margin: 0 auto;
        background: white;
        padding: 20px;
    }

    @media print {
        .no-print-hide {
            display: none !important;
        }

        .ficha-producto {
            max-width: 100% !important;
            padding: 0 !important;
        }

        .badge {
            border: 1px solid #666 !important;
            -webkit-print-color-adjust: exact !important;
            print-color-adjust: exact !important;
        }

        h5 i {
            display: none;
        }
    }
</style>

@endsection