@extends('layouts.app')

@section('title', 'Editar Producto')

@section('content')
<div class="container-fluid">
    <!-- Breadcrumb -->
    <nav aria-label="breadcrumb" class="mb-4">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item"><a href="{{ route('configuracion.index') }}">Configuración</a></li>
            <li class="breadcrumb-item"><a href="{{ route('admin.inventory.products.index') }}">Inventario</a></li>
            <li class="breadcrumb-item"><a href="{{ route('admin.inventory.products.show', $product) }}">{{ $product->name }}</a></li>
            <li class="breadcrumb-item active">Editar</li>
        </ol>
    </nav>

    <!-- Alertas de Error -->
    @if ($errors->any())
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <h4 class="alert-heading">
                <i class="fas fa-exclamation-triangle me-2"></i>Error de Validación
            </h4>
            <p>Se encontraron los siguientes errores:</p>
            <ul class="mb-0">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    @if (session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <h4 class="alert-heading">
                <i class="fas fa-exclamation-triangle me-2"></i>Error del Sistema
            </h4>
            <p>{{ session('error') }}</p>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    @if (session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <h4 class="alert-heading">
                <i class="fas fa-check-circle me-2"></i>Éxito
            </h4>
            <p>{{ session('success') }}</p>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    <!-- Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="h3 mb-0 text-gray-800">
                <i class="fas fa-edit text-warning me-2"></i>Editar Producto
            </h1>
            <p class="text-muted mb-0">Modifica los datos del producto: <strong>{{ $product->name }}</strong></p>
        </div>
        <a href="{{ route('admin.inventory.products.index') }}" class="btn btn-secondary">
            <i class="fas fa-arrow-left me-2"></i>Volver
        </a>
    </div>

    <form action="{{ route('admin.inventory.products.update', $product) }}" method="POST" enctype="multipart/form-data" id="product-form">
        @csrf
        @method('PUT')
        
        <!-- Progress Bar -->
        <div class="card mb-4">
            <div class="card-body">
                <div class="progress mb-3" style="height: 8px;">
                    <div class="progress-bar bg-warning" role="progressbar" style="width: 0%"></div>
                </div>
                <small class="text-muted">Complete todos los campos para finalizar la edición del producto</small>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-8">
                <!-- Información Básica -->
                <div class="card mb-4" id="section-basic">
                    <div class="card-header bg-primary text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-info-circle"></i> Información Básica del Producto
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="code" class="form-label">Código del Producto <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="code" name="code" 
                                               value="{{ old('code', $product->code) }}" required>
                                        <button type="button" class="btn btn-outline-secondary" onclick="generarCodigo()">
                                            <i class="fas fa-sync"></i>
                                        </button>
                                    </div>
                                    @error('code')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="sku" class="form-label">SKU <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="sku" name="sku" 
                                               value="{{ old('sku', $product->sku) }}" required>
                                        <button type="button" class="btn btn-outline-secondary" onclick="generarSKU()">
                                            <i class="fas fa-sync"></i>
                                        </button>
                                    </div>
                                    @error('sku')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="name" class="form-label">Nombre del Producto <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control" id="name" name="name" 
                                           value="{{ old('name', $product->name) }}" required>
                                    @error('name')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="description" class="form-label">Descripción</label>
                                    <textarea class="form-control" id="description" name="description" rows="3">{{ old('description', $product->description) }}</textarea>
                                    @error('description')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="category_id" class="form-label">Categoría <span class="text-danger">*</span></label>
                                    <select class="form-select" id="category_id" name="category_id" required>
                                        <option value="">Seleccionar categoría</option>
                                        @foreach(\App\Models\Category::all() as $category)
                                            <option value="{{ $category->id }}" {{ old('category_id', $product->category_id) == $category->id ? 'selected' : '' }}>
                                                {{ $category->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('category_id')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="brand_id" class="form-label">Marca</label>
                                    <select class="form-select" id="brand_id" name="brand_id">
                                        <option value="">Seleccionar marca</option>
                                        @foreach(\App\Models\Brand::all() as $brand)
                                            <option value="{{ $brand->id }}" {{ old('brand_id', $product->brand_id) == $brand->id ? 'selected' : '' }}>
                                                {{ $brand->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('brand_id')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="barcode" class="form-label">Código de Barras Principal</label>
                                    <input type="text" class="form-control" id="barcode" name="barcode" 
                                           value="{{ old('barcode', $product->barcode) }}">
                                    @error('barcode')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <label for="unit" class="form-label">Unidad de Medida</label>
                                    <select class="form-select" id="unit" name="unit">
                                        <option value="pcs" {{ old('unit', $product->unit) == 'pcs' ? 'selected' : '' }}>Piezas</option>
                                        <option value="kg" {{ old('unit', $product->unit) == 'kg' ? 'selected' : '' }}>Kilogramos</option>
                                        <option value="g" {{ old('unit', $product->unit) == 'g' ? 'selected' : '' }}>Gramos</option>
                                        <option value="l" {{ old('unit', $product->unit) == 'l' ? 'selected' : '' }}>Litros</option>
                                        <option value="ml" {{ old('unit', $product->unit) == 'ml' ? 'selected' : '' }}>Mililitros</option>
                                        <option value="m" {{ old('unit', $product->unit) == 'm' ? 'selected' : '' }}>Metros</option>
                                        <option value="cm" {{ old('unit', $product->unit) == 'cm' ? 'selected' : '' }}>Centímetros</option>
                                    </select>
                                    @error('unit')
                                        <div class="text-danger small">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Medidas Físicas -->
                <div class="card mb-4" id="section-physical">
                    <div class="card-header bg-gradient-secondary text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-ruler-combined"></i> Medidas Físicas
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-3 mb-3">
                                <label for="weight" class="form-label">Peso (kg)</label>
                                <input type="number" class="form-control" id="weight" name="weight" 
                                       value="{{ old('weight', $product->weight) }}" step="0.01" min="0">
                                @error('weight')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="length" class="form-label">Largo (cm)</label>
                                <input type="number" class="form-control" id="length" name="length" 
                                       value="{{ old('length', $product->length) }}" step="0.01" min="0">
                                @error('length')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="width" class="form-label">Ancho (cm)</label>
                                <input type="number" class="form-control" id="width" name="width" 
                                       value="{{ old('width', $product->width) }}" step="0.01" min="0">
                                @error('width')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="height" class="form-label">Alto (cm)</label>
                                <input type="number" class="form-control" id="height" name="height" 
                                       value="{{ old('height', $product->height) }}" step="0.01" min="0">
                                @error('height')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="volume" class="form-label">Volumen Calculado (cm³)</label>
                                    <input type="number" class="form-control" id="volume" name="volume" 
                                           value="{{ old('volume', $product->volume) }}" step="0.01" min="0" readonly>
                                    <small class="text-muted">Se calcula automáticamente: Largo × Ancho × Alto</small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Sistema de Precios por Pestañas -->
                <div class="card mb-4" id="section-unit-prices">
                    <div class="card-header bg-success text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-dollar-sign"></i> Sistema de Precios por Pestañas
                        </h5>
                    </div>
                    <div class="card-body">
                        <!-- Costos Base -->
                        <div class="row mb-4">
                            <div class="col-md-3 mb-3">
                                <label for="base_cost_price" class="form-label">Precio Base <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text">$</span>
                                    <input type="number" class="form-control" id="base_cost_price" name="base_cost_price" 
                                           value="{{ old('base_cost_price', $product->base_cost_price) }}" step="0.01" min="0" required>
                                </div>
                                @error('base_cost_price')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="expense_1" class="form-label">Gasto 1</label>
                                <div class="input-group">
                                    <span class="input-group-text">$</span>
                                    <input type="number" class="form-control" id="expense_1" name="expense_1" 
                                           value="{{ old('expense_1', $product->expense_1) }}" step="0.01" min="0">
                                </div>
                                @error('expense_1')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="expense_2" class="form-label">Gasto 2</label>
                                <div class="input-group">
                                    <span class="input-group-text">$</span>
                                    <input type="number" class="form-control" id="expense_2" name="expense_2" 
                                           value="{{ old('expense_2', $product->expense_2) }}" step="0.01" min="0">
                                </div>
                                @error('expense_2')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Impuesto en Compras</label>
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" id="purchase_tax_enabled" 
                                           name="purchase_tax_enabled" {{ old('purchase_tax_enabled', $product->purchase_tax_enabled) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="purchase_tax_enabled">
                                        Incluir IVA
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-3 mb-3">
                                <label for="tax_id" class="form-label">Impuesto del Producto</label>
                                <select class="form-select" id="tax_id" name="tax_id">
                                    <option value="">Seleccionar impuesto</option>
                                    @foreach(\App\Models\Tax::active()->ordered()->get() as $tax)
                                        <option value="{{ $tax->id }}" 
                                                data-percentage="{{ $tax->percentage }}"
                                                data-type="{{ $tax->type }}"
                                                data-calculation="{{ $tax->calculation_type }}"
                                                {{ old('tax_id', $product->tax_id) == $tax->id ? 'selected' : '' }}>
                                            {{ $tax->name }} ({{ $tax->formatted_percentage }})
                                        </option>
                                    @endforeach
                                </select>
                                @error('tax_id')
                                    <div class="text-danger small">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <!-- Configuración de Nombres de Pestañas -->
                        <div class="row mb-4">
                            <div class="col-md-4 mb-3">
                                <label for="tab_name_1" class="form-label">Nombre Pestaña 1</label>
                                <input type="text" class="form-control" id="tab_name_1" name="tab_name_1" 
                                       value="{{ old('tab_name_1', $product->tab_name_1 ?: 'Unidad') }}">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="tab_enabled_1" 
                                           name="tab_enabled_1" {{ old('tab_enabled_1', $product->tab_enabled_1) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="tab_enabled_1">
                                        Habilitar
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-4 mb-3">
                                <label for="tab_name_2" class="form-label">Nombre Pestaña 2</label>
                                <input type="text" class="form-control" id="tab_name_2" name="tab_name_2" 
                                       value="{{ old('tab_name_2', $product->tab_name_2 ?: 'Caja') }}">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="tab_enabled_2" 
                                           name="tab_enabled_2" {{ old('tab_enabled_2', $product->tab_enabled_2) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="tab_enabled_2">
                                        Habilitar
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-4 mb-3">
                                <label for="tab_name_3" class="form-label">Nombre Pestaña 3</label>
                                <input type="text" class="form-control" id="tab_name_3" name="tab_name_3" 
                                       value="{{ old('tab_name_3', $product->tab_name_3 ?: 'Bulto') }}">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="tab_enabled_3" 
                                           name="tab_enabled_3" {{ old('tab_enabled_3', $product->tab_enabled_3) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="tab_enabled_3">
                                        Habilitar
                                    </label>
                                </div>
                            </div>
                        </div>

                        <!-- Pestañas de Unidades -->
                        <ul class="nav nav-tabs" id="priceTabs" role="tablist">
                            <li class="nav-item" role="presentation">
                                <button class="nav-link active" id="tab1-tab" data-bs-toggle="tab" data-bs-target="#tab1" type="button" role="tab">
                                    {{ $product->tab_name_1 ?: 'Unidad' }}
                                </button>
                            </li>
                            @if($product->tab_enabled_2)
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="tab2-tab" data-bs-toggle="tab" data-bs-target="#tab2" type="button" role="tab">
                                    {{ $product->tab_name_2 ?: 'Caja' }}
                                </button>
                            </li>
                            @endif
                            @if($product->tab_enabled_3)
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="tab3-tab" data-bs-toggle="tab" data-bs-target="#tab3" type="button" role="tab">
                                    {{ $product->tab_name_3 ?: 'Bulto' }}
                                </button>
                            </li>
                            @endif
                        </ul>

                        <div class="tab-content" id="priceTabsContent">
                            <!-- Tab 1 -->
                            <div class="tab-pane fade show active" id="tab1" role="tabpanel">
                                <div class="row mt-3">
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_1_quantity" class="form-label">Cantidad</label>
                                        <input type="number" class="form-control" id="unit_1_quantity" name="unit_1_quantity" 
                                               value="{{ old('unit_1_quantity', $product->unit_1_quantity ?: 1) }}" min="1">
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_1_operation" class="form-label">Operación</label>
                                        <select class="form-select" id="unit_1_operation" name="unit_1_operation">
                                            <option value="divide" {{ old('unit_1_operation', $product->unit_1_operation ?: 'divide') == 'divide' ? 'selected' : '' }}>Dividir</option>
                                            <option value="multiply" {{ old('unit_1_operation', $product->unit_1_operation) == 'multiply' ? 'selected' : '' }}>Multiplicar</option>
                                        </select>
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_1_currency" class="form-label">Moneda</label>
                                        <select class="form-select" id="unit_1_currency" name="unit_1_currency">
                                            @foreach($currencies as $currency)
                                                <option value="{{ $currency }}" {{ old('unit_1_currency', $product->unit_1_currency ?: 'USD') == $currency ? 'selected' : '' }}>
                                                    {{ $currency }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                
                                <!-- Precios por Nivel -->
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-primary">Nivel Básico</h6>
                                        <div class="mb-2">
                                            <label for="unit_1_utilidad_1" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_1_utilidad_1" name="unit_1_utilidad_1" 
                                                   value="{{ old('unit_1_utilidad_1', $product->unit_1_utilidad_1 ?: 25) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_1_tax_enabled_1" 
                                                   name="unit_1_tax_enabled_1" {{ old('unit_1_tax_enabled_1', $product->unit_1_tax_enabled_1) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_1_tax_enabled_1">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_sin_impuesto_1" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_sin_impuesto_1" name="unit_1_sin_impuesto_1" 
                                                   value="{{ old('unit_1_sin_impuesto_1', $product->unit_1_sin_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_con_impuesto_1" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_con_impuesto_1" name="unit_1_con_impuesto_1" 
                                                   value="{{ old('unit_1_con_impuesto_1', $product->unit_1_con_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_pvp_1" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_1_pvp_1" name="unit_1_pvp_1" 
                                                   value="{{ old('unit_1_pvp_1', $product->unit_1_pvp_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-success">Nivel Intermedio</h6>
                                        <div class="mb-2">
                                            <label for="unit_1_utilidad_2" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_1_utilidad_2" name="unit_1_utilidad_2" 
                                                   value="{{ old('unit_1_utilidad_2', $product->unit_1_utilidad_2 ?: 30) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_1_tax_enabled_2" 
                                                   name="unit_1_tax_enabled_2" {{ old('unit_1_tax_enabled_2', $product->unit_1_tax_enabled_2) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_1_tax_enabled_2">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_sin_impuesto_2" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_sin_impuesto_2" name="unit_1_sin_impuesto_2" 
                                                   value="{{ old('unit_1_sin_impuesto_2', $product->unit_1_sin_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_con_impuesto_2" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_con_impuesto_2" name="unit_1_con_impuesto_2" 
                                                   value="{{ old('unit_1_con_impuesto_2', $product->unit_1_con_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_pvp_2" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_1_pvp_2" name="unit_1_pvp_2" 
                                                   value="{{ old('unit_1_pvp_2', $product->unit_1_pvp_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-warning">Nivel Premium</h6>
                                        <div class="mb-2">
                                            <label for="unit_1_utilidad_3" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_1_utilidad_3" name="unit_1_utilidad_3" 
                                                   value="{{ old('unit_1_utilidad_3', $product->unit_1_utilidad_3 ?: 35) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_1_tax_enabled_3" 
                                                   name="unit_1_tax_enabled_3" {{ old('unit_1_tax_enabled_3', $product->unit_1_tax_enabled_3) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_1_tax_enabled_3">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_sin_impuesto_3" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_sin_impuesto_3" name="unit_1_sin_impuesto_3" 
                                                   value="{{ old('unit_1_sin_impuesto_3', $product->unit_1_sin_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_con_impuesto_3" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_1_con_impuesto_3" name="unit_1_con_impuesto_3" 
                                                   value="{{ old('unit_1_con_impuesto_3', $product->unit_1_con_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_1_pvp_3" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_1_pvp_3" name="unit_1_pvp_3" 
                                                   value="{{ old('unit_1_pvp_3', $product->unit_1_pvp_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Tab 2 -->
                            @if($product->tab_enabled_2)
                            <div class="tab-pane fade" id="tab2" role="tabpanel">
                                <div class="row mt-3">
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_2_quantity" class="form-label">Cantidad</label>
                                        <input type="number" class="form-control" id="unit_2_quantity" name="unit_2_quantity" 
                                               value="{{ old('unit_2_quantity', $product->unit_2_quantity ?: 6) }}" min="1">
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_2_operation" class="form-label">Operación</label>
                                        <select class="form-select" id="unit_2_operation" name="unit_2_operation">
                                            <option value="divide" {{ old('unit_2_operation', $product->unit_2_operation ?: 'divide') == 'divide' ? 'selected' : '' }}>Dividir</option>
                                            <option value="multiply" {{ old('unit_2_operation', $product->unit_2_operation) == 'multiply' ? 'selected' : '' }}>Multiplicar</option>
                                        </select>
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_2_currency" class="form-label">Moneda</label>
                                        <select class="form-select" id="unit_2_currency" name="unit_2_currency">
                                            @foreach($currencies as $currency)
                                                <option value="{{ $currency }}" {{ old('unit_2_currency', $product->unit_2_currency ?: 'USD') == $currency ? 'selected' : '' }}>
                                                    {{ $currency }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                
                                <!-- Precios por Nivel -->
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-primary">Nivel Básico</h6>
                                        <div class="mb-2">
                                            <label for="unit_2_utilidad_1" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_2_utilidad_1" name="unit_2_utilidad_1" 
                                                   value="{{ old('unit_2_utilidad_1', $product->unit_2_utilidad_1 ?: 25) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_2_tax_enabled_1" 
                                                   name="unit_2_tax_enabled_1" {{ old('unit_2_tax_enabled_1', $product->unit_2_tax_enabled_1) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_2_tax_enabled_1">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_sin_impuesto_1" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_sin_impuesto_1" name="unit_2_sin_impuesto_1" 
                                                   value="{{ old('unit_2_sin_impuesto_1', $product->unit_2_sin_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_con_impuesto_1" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_con_impuesto_1" name="unit_2_con_impuesto_1" 
                                                   value="{{ old('unit_2_con_impuesto_1', $product->unit_2_con_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_pvp_1" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_2_pvp_1" name="unit_2_pvp_1" 
                                                   value="{{ old('unit_2_pvp_1', $product->unit_2_pvp_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-success">Nivel Intermedio</h6>
                                        <div class="mb-2">
                                            <label for="unit_2_utilidad_2" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_2_utilidad_2" name="unit_2_utilidad_2" 
                                                   value="{{ old('unit_2_utilidad_2', $product->unit_2_utilidad_2 ?: 30) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_2_tax_enabled_2" 
                                                   name="unit_2_tax_enabled_2" {{ old('unit_2_tax_enabled_2', $product->unit_2_tax_enabled_2) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_2_tax_enabled_2">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_sin_impuesto_2" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_sin_impuesto_2" name="unit_2_sin_impuesto_2" 
                                                   value="{{ old('unit_2_sin_impuesto_2', $product->unit_2_sin_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_con_impuesto_2" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_con_impuesto_2" name="unit_2_con_impuesto_2" 
                                                   value="{{ old('unit_2_con_impuesto_2', $product->unit_2_con_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_pvp_2" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_2_pvp_2" name="unit_2_pvp_2" 
                                                   value="{{ old('unit_2_pvp_2', $product->unit_2_pvp_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-warning">Nivel Premium</h6>
                                        <div class="mb-2">
                                            <label for="unit_2_utilidad_3" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_2_utilidad_3" name="unit_2_utilidad_3" 
                                                   value="{{ old('unit_2_utilidad_3', $product->unit_2_utilidad_3 ?: 35) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_2_tax_enabled_3" 
                                                   name="unit_2_tax_enabled_3" {{ old('unit_2_tax_enabled_3', $product->unit_2_tax_enabled_3) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_2_tax_enabled_3">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_sin_impuesto_3" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_sin_impuesto_3" name="unit_2_sin_impuesto_3" 
                                                   value="{{ old('unit_2_sin_impuesto_3', $product->unit_2_sin_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_con_impuesto_3" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_2_con_impuesto_3" name="unit_2_con_impuesto_3" 
                                                   value="{{ old('unit_2_con_impuesto_3', $product->unit_2_con_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_2_pvp_3" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_2_pvp_3" name="unit_2_pvp_3" 
                                                   value="{{ old('unit_2_pvp_3', $product->unit_2_pvp_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endif

                            <!-- Tab 3 -->
                            @if($product->tab_enabled_3)
                            <div class="tab-pane fade" id="tab3" role="tabpanel">
                                <div class="row mt-3">
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_3_quantity" class="form-label">Cantidad</label>
                                        <input type="number" class="form-control" id="unit_3_quantity" name="unit_3_quantity" 
                                               value="{{ old('unit_3_quantity', $product->unit_3_quantity ?: 24) }}" min="1">
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_3_operation" class="form-label">Operación</label>
                                        <select class="form-select" id="unit_3_operation" name="unit_3_operation">
                                            <option value="divide" {{ old('unit_3_operation', $product->unit_3_operation ?: 'divide') == 'divide' ? 'selected' : '' }}>Dividir</option>
                                            <option value="multiply" {{ old('unit_3_operation', $product->unit_3_operation) == 'multiply' ? 'selected' : '' }}>Multiplicar</option>
                                        </select>
                                    </div>
                                    <div class="col-md-4 mb-3">
                                        <label for="unit_3_currency" class="form-label">Moneda</label>
                                        <select class="form-select" id="unit_3_currency" name="unit_3_currency">
                                            @foreach($currencies as $currency)
                                                <option value="{{ $currency }}" {{ old('unit_3_currency', $product->unit_3_currency ?: 'USD') == $currency ? 'selected' : '' }}>
                                                    {{ $currency }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                
                                <!-- Precios por Nivel -->
                                <div class="row">
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-primary">Nivel Básico</h6>
                                        <div class="mb-2">
                                            <label for="unit_3_utilidad_1" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_3_utilidad_1" name="unit_3_utilidad_1" 
                                                   value="{{ old('unit_3_utilidad_1', $product->unit_3_utilidad_1 ?: 25) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_3_tax_enabled_1" 
                                                   name="unit_3_tax_enabled_1" {{ old('unit_3_tax_enabled_1', $product->unit_3_tax_enabled_1) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_3_tax_enabled_1">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_sin_impuesto_1" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_sin_impuesto_1" name="unit_3_sin_impuesto_1" 
                                                   value="{{ old('unit_3_sin_impuesto_1', $product->unit_3_sin_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_con_impuesto_1" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_con_impuesto_1" name="unit_3_con_impuesto_1" 
                                                   value="{{ old('unit_3_con_impuesto_1', $product->unit_3_con_impuesto_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_pvp_1" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_3_pvp_1" name="unit_3_pvp_1" 
                                                   value="{{ old('unit_3_pvp_1', $product->unit_3_pvp_1) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-success">Nivel Intermedio</h6>
                                        <div class="mb-2">
                                            <label for="unit_3_utilidad_2" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_3_utilidad_2" name="unit_3_utilidad_2" 
                                                   value="{{ old('unit_3_utilidad_2', $product->unit_3_utilidad_2 ?: 30) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_3_tax_enabled_2" 
                                                   name="unit_3_tax_enabled_2" {{ old('unit_3_tax_enabled_2', $product->unit_3_tax_enabled_2) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_3_tax_enabled_2">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_sin_impuesto_2" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_sin_impuesto_2" name="unit_3_sin_impuesto_2" 
                                                   value="{{ old('unit_3_sin_impuesto_2', $product->unit_3_sin_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_con_impuesto_2" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_con_impuesto_2" name="unit_3_con_impuesto_2" 
                                                   value="{{ old('unit_3_con_impuesto_2', $product->unit_3_con_impuesto_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_pvp_2" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_3_pvp_2" name="unit_3_pvp_2" 
                                                   value="{{ old('unit_3_pvp_2', $product->unit_3_pvp_2) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                    
                                    <div class="col-md-4 mb-3">
                                        <h6 class="text-warning">Nivel Premium</h6>
                                        <div class="mb-2">
                                            <label for="unit_3_utilidad_3" class="form-label">Utilidad (%)</label>
                                            <input type="number" class="form-control" id="unit_3_utilidad_3" name="unit_3_utilidad_3" 
                                                   value="{{ old('unit_3_utilidad_3', $product->unit_3_utilidad_3 ?: 35) }}" step="0.01" min="0">
                                        </div>
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="unit_3_tax_enabled_3" 
                                                   name="unit_3_tax_enabled_3" {{ old('unit_3_tax_enabled_3', $product->unit_3_tax_enabled_3) ? 'checked' : '' }}>
                                            <label class="form-check-label" for="unit_3_tax_enabled_3">
                                                Incluir IVA
                                            </label>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_sin_impuesto_3" class="form-label">Sin Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_sin_impuesto_3" name="unit_3_sin_impuesto_3" 
                                                   value="{{ old('unit_3_sin_impuesto_3', $product->unit_3_sin_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_con_impuesto_3" class="form-label">Con Impuesto</label>
                                            <input type="number" class="form-control" id="unit_3_con_impuesto_3" name="unit_3_con_impuesto_3" 
                                                   value="{{ old('unit_3_con_impuesto_3', $product->unit_3_con_impuesto_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                        <div class="mb-2">
                                            <label for="unit_3_pvp_3" class="form-label">PVP</label>
                                            <input type="number" class="form-control" id="unit_3_pvp_3" name="unit_3_pvp_3" 
                                                   value="{{ old('unit_3_pvp_3', $product->unit_3_pvp_3) }}" step="0.01" min="0" readonly>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>
                </div>

                <!-- Sistema Multi-Código de Barras -->
                <div class="card mb-4" id="section-barcodes">
                    <div class="card-header bg-info text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-barcode"></i> Sistema Multi-Código de Barras
                        </h5>
                    </div>
                    <div class="card-body">
                        <div id="additional-barcodes">
                            @if($product->barcodes && $product->barcodes->count() > 0)
                                @foreach($product->barcodes as $index => $barcode)
                                    <div class="barcode-item mb-3" id="barcode-{{ $index }}">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <input type="text" class="form-control" name="additional_barcodes[{{ $index }}][barcode]" 
                                                       value="{{ $barcode->barcode }}" placeholder="Código de barras">
                                            </div>
                                            <div class="col-md-4">
                                                <select class="form-control" name="additional_barcodes[{{ $index }}][type]">
                                                    <option value="EAN13" {{ $barcode->type == 'EAN13' ? 'selected' : '' }}>EAN13</option>
                                                    <option value="UPC" {{ $barcode->type == 'UPC' ? 'selected' : '' }}>UPC</option>
                                                    <option value="CODE128" {{ $barcode->type == 'CODE128' ? 'selected' : '' }}>CODE128</option>
                                                </select>
                                            </div>
                                            <div class="col-md-2">
                                                <button type="button" class="btn btn-danger btn-sm" onclick="removeBarcode({{ $index }})">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </div>
                                        </div>
                                        <div class="row mt-2">
                                            <div class="col-12">
                                                <input type="text" class="form-control" name="additional_barcodes[{{ $index }}][description]" 
                                                       value="{{ $barcode->description }}" placeholder="Descripción (opcional)">
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            @endif
                        </div>
                        <button type="button" class="btn btn-outline-primary btn-sm" onclick="addBarcode()">
                            <i class="fas fa-plus me-2"></i>Agregar Código de Barras
                        </button>
                    </div>
                </div>
            </div>
            
            <div class="col-lg-4">
                <!-- Imagen del Producto -->
                <div class="card mb-4">
                    <div class="card-header bg-warning text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-image"></i> Imagen del Producto
                        </h5>
                    </div>
                    <div class="card-body text-center">
                        <div id="image-preview-container">
                            <img id="image-preview" src="{{ $product->image_url ?: '' }}" alt="Vista previa" class="img-thumbnail mb-3" style="{{ $product->image_url ? '' : 'display: none;' }} max-width: 200px;">
                            <div id="no-image" class="text-muted" style="{{ $product->image ? 'display: none;' : '' }}">
                                <i class="fas fa-image fa-3x mb-3"></i>
                                <p>No hay imagen seleccionada</p>
                            </div>
                        </div>
                        <input type="file" class="form-control" id="image" name="image" accept="image/*" onchange="previewImage(this)">
                        <div class="form-text">
                            <i class="fas fa-info-circle me-1"></i>
                            Formatos permitidos: JPEG, PNG, JPG, GIF. Tamaño máximo: 10MB
                        </div>
                        @error('image')
                            <div class="text-danger small mt-2">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
                
                <!-- Estado del Producto -->
                <div class="card mb-4">
                    <div class="card-header bg-secondary text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-toggle-on"></i> Estado del Producto
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="checkbox" id="is_active" name="is_active" 
                                   value="1" {{ old('is_active', $product->is_active) ? 'checked' : '' }}>
                            <label class="form-check-label" for="is_active">
                                Producto Activo
                            </label>
                        </div>
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="checkbox" id="is_featured" name="is_featured" 
                                   value="1" {{ old('is_featured', $product->is_featured) ? 'checked' : '' }}>
                            <label class="form-check-label" for="is_featured">
                                Producto Destacado
                            </label>
                        </div>
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="checkbox" id="requires_prescription" name="requires_prescription" 
                                   value="1" {{ old('requires_prescription', $product->requires_prescription) ? 'checked' : '' }}>
                            <label class="form-check-label" for="requires_prescription">
                                Requiere Receta
                            </label>
                        </div>
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="checkbox" id="purchase_tax_enabled" name="purchase_tax_enabled" 
                                   value="1" {{ old('purchase_tax_enabled', $product->purchase_tax_enabled) ? 'checked' : '' }}>
                            <label class="form-check-label" for="purchase_tax_enabled">
                                Impuesto de Compra Habilitado
                            </label>
                        </div>
                    </div>
                </div>
                
                <!-- Configuración de Inventario -->
                <div class="card mb-4">
                    <div class="card-header bg-dark text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-warehouse"></i> Configuración de Inventario
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-3">
                            <label for="stock_min" class="form-label">Stock Mínimo</label>
                            <input type="number" class="form-control" id="stock_min" name="stock_min" 
                                   value="{{ old('stock_min', $product->stock_min) }}" min="0">
                            @error('stock_min')
                                <div class="text-danger small">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="mb-3">
                            <label for="stock_max" class="form-label">Stock Máximo</label>
                            <input type="number" class="form-control" id="stock_max" name="stock_max" 
                                   value="{{ old('stock_max', $product->stock_max) }}" min="0">
                            @error('stock_max')
                                <div class="text-danger small">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="mb-3">
                            <label for="current_stock" class="form-label">Stock Actual</label>
                            <div class="input-group">
                                <input type="number" class="form-control" id="current_stock" name="current_stock" 
                                       value="{{ old('current_stock', $product->current_stock ?? 0) }}" min="0" readonly>
                                <button type="button" class="btn btn-info" data-bs-toggle="modal" data-bs-target="#inventoryModal">
                                    <i class="fas fa-info-circle"></i> Ver Inventario
                                </button>
                            </div>
                            @error('current_stock')
                                <div class="text-danger small">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
                
                <!-- Información Adicional -->
                <div class="card mb-4">
                    <div class="card-header bg-light">
                        <h5 class="mb-0">
                            <i class="fas fa-info"></i> Información Adicional
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-3">
                            <label for="notes" class="form-label">Notas</label>
                            <textarea class="form-control" id="notes" name="notes" rows="4">{{ old('notes', $product->notes) }}</textarea>
                            @error('notes')
                                <div class="text-danger small">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="mb-3">
                            <label for="tags" class="form-label">Etiquetas</label>
                            <input type="text" class="form-control" id="tags" name="tags" 
                                   value="{{ old('tags', $product->tags) }}" placeholder="Etiquetas separadas por comas">
                            @error('tags')
                                <div class="text-danger small">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <!-- Botones de Acción -->
        <div class="card mb-4">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    <a href="{{ route('admin.inventory.products.show', $product) }}" class="btn btn-outline-secondary">
                        <i class="fas fa-times me-2"></i>Cancelar
                    </a>
                    <button type="submit" class="btn btn-warning">
                        <i class="fas fa-save me-2"></i>Guardar Cambios
                    </button>
                </div>
            </div>
        </div>
    </form>
</div>

@push('scripts')
<script>
let barcodeCounter = {{ $product->barcodes ? $product->barcodes->count() : 0 }};

// Generar códigos únicos
function generarCodigo() {
    fetch("{{ route('admin.inventory.products.generate-codes') }}", {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': '{{ csrf_token() }}',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ prefix: 'PRD' })
    })
    .then(response => response.json())
    .then(data => {
        document.getElementById('code').value = data.code;
    })
    .catch(error => console.error('Error:', error));
}

function generarSKU() {
    fetch("{{ route('admin.inventory.products.generate-codes') }}", {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': '{{ csrf_token() }}',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ prefix: 'SKU' })
    })
    .then(response => response.json())
    .then(data => {
        document.getElementById('sku').value = data.sku;
    })
    .catch(error => console.error('Error:', error));
}

function generarBarcode() {
    fetch("{{ route('admin.inventory.products.generate-codes') }}", {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': '{{ csrf_token() }}',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ prefix: 'BAR' })
    })
    .then(response => response.json())
    .then(data => {
        document.getElementById('barcode').value = data.barcode;
    })
    .catch(error => console.error('Error:', error));
}

// Cálculo de volumen
function calculateVolume() {
    const length = parseFloat(document.getElementById('length').value) || 0;
    const width = parseFloat(document.getElementById('width').value) || 0;
    const height = parseFloat(document.getElementById('height').value) || 0;
    
    const volume = length * width * height;
    document.getElementById('volume').value = volume.toFixed(2);
}

// Cálculo de precios
function calculateUnitPrices(unitNumber) {
    const baseCostPrice = parseFloat(document.getElementById('base_cost_price').value) || 0;
    const expense1 = parseFloat(document.getElementById('expense_1').value) || 0;
    const expense2 = parseFloat(document.getElementById('expense_2').value) || 0;
    
    // Obtener el impuesto seleccionado
    const taxSelect = document.getElementById('tax_id');
    let taxPercentage = 0;
    let taxType = 'percentage';
    let taxCalculation = 'exclusive';
    
    if (taxSelect && taxSelect.value) {
        const selectedOption = taxSelect.options[taxSelect.selectedIndex];
        taxPercentage = parseFloat(selectedOption.getAttribute('data-percentage')) || 0;
        taxType = selectedOption.getAttribute('data-type') || 'percentage';
        taxCalculation = selectedOption.getAttribute('data-calculation') || 'exclusive';
    }
    
    const purchaseTaxEnabled = document.getElementById('purchase_tax_enabled').checked;
    
    // Calcular costo total base
    let totalBaseCost = baseCostPrice + expense1 + expense2;
    if (purchaseTaxEnabled) {
        totalBaseCost = totalBaseCost * (1 + taxPercentage / 100);
    }
    
    // Obtener configuración de la unidad
    const quantity = parseFloat(document.getElementById(`unit_${unitNumber}_quantity`).value) || 1;
    const operation = document.getElementById(`unit_${unitNumber}_operation`).value || 'divide';
    
    // Calcular costo unitario
    let unitCost = totalBaseCost;
    if (operation === 'divide') {
        unitCost = totalBaseCost / quantity;
    } else if (operation === 'multiply') {
        unitCost = totalBaseCost * quantity;
    }
    
    // Calcular precios para cada nivel
    for (let level = 1; level <= 3; level++) {
        const utilidadField = document.getElementById(`unit_${unitNumber}_utilidad_${level}`);
        const taxEnabledField = document.getElementById(`unit_${unitNumber}_tax_enabled_${level}`);
        const sinImpuestoField = document.getElementById(`unit_${unitNumber}_sin_impuesto_${level}`);
        const conImpuestoField = document.getElementById(`unit_${unitNumber}_con_impuesto_${level}`);
        const pvpField = document.getElementById(`unit_${unitNumber}_pvp_${level}`);
        
        if (utilidadField && taxEnabledField && sinImpuestoField && conImpuestoField && pvpField) {
            const utilidad = parseFloat(utilidadField.value) || 0;
            const taxEnabled = taxEnabledField.checked;
            
            // Calcular precio sin impuesto
            const precioSinImpuesto = unitCost * (1 + utilidad / 100);
            sinImpuestoField.value = precioSinImpuesto.toFixed(2);
            
            // Calcular precio con impuesto
            let precioConImpuesto = precioSinImpuesto;
            if (taxEnabled && taxPercentage > 0) {
                if (taxCalculation === 'exclusive') {
                    precioConImpuesto = precioSinImpuesto * (1 + taxPercentage / 100);
                } else {
                    precioConImpuesto = precioSinImpuesto / (1 - taxPercentage / 100);
                }
            }
            conImpuestoField.value = precioConImpuesto.toFixed(2);
            
            // El PVP es el precio con impuesto
            pvpField.value = precioConImpuesto.toFixed(2);
        }
    }
}

// Cambiar pestaña
function switchTab(tabNumber) {
    // Ocultar todas las pestañas
    for (let i = 1; i <= 3; i++) {
        const tabPane = document.getElementById(`tab${i}`);
        const tabButton = document.getElementById(`tab${i}-tab`);
        
        if (tabPane && tabButton) {
            tabPane.classList.remove('show', 'active');
            tabButton.classList.remove('active');
        }
    }
    
    // Mostrar la pestaña seleccionada
    const activeTabPane = document.getElementById(`tab${tabNumber}`);
    const activeTabButton = document.getElementById(`tab${tabNumber}-tab`);
    
    if (activeTabPane && activeTabButton) {
        activeTabPane.classList.add('show', 'active');
        activeTabButton.classList.add('active');
    }
    
    // Recalcular precios para la pestaña activa
    calculateUnitPrices(tabNumber);
}

// Carga de imagen
function previewImage(input) {
    if (input.files && input.files[0]) {
        const reader = new FileReader();
        
        reader.onload = function(e) {
            document.getElementById('image-preview').src = e.target.result;
            document.getElementById('image-preview').style.display = 'block';
            document.getElementById('no-image').style.display = 'none';
        };
        
        reader.readAsDataURL(input.files[0]);
    }
}

// Gestión de códigos de barras adicionales
function addBarcode() {
    barcodeCounter++;
    const barcodeHtml = `
        <div class="barcode-item mb-3" id="barcode-${barcodeCounter}">
            <div class="row">
                <div class="col-md-6">
                    <input type="text" class="form-control" name="additional_barcodes[${barcodeCounter}][barcode]" placeholder="Código de barras">
                </div>
                <div class="col-md-4">
                    <select class="form-control" name="additional_barcodes[${barcodeCounter}][type]">
                        <option value="EAN13">EAN13</option>
                        <option value="UPC">UPC</option>
                        <option value="CODE128">CODE128</option>
                    </select>
                </div>
                <div class="col-md-2">
                    <button type="button" class="btn btn-danger btn-sm" onclick="removeBarcode(${barcodeCounter})">
                        <i class="fas fa-trash"></i>
                    </button>
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-12">
                    <input type="text" class="form-control" name="additional_barcodes[${barcodeCounter}][description]" placeholder="Descripción (opcional)">
                </div>
            </div>
        </div>
    `;
    document.getElementById('additional-barcodes').insertAdjacentHTML('beforeend', barcodeHtml);
}

function removeBarcode(id) {
    document.getElementById(`barcode-${id}`).remove();
}

// Event listeners
document.addEventListener('DOMContentLoaded', function() {
    // Calcular volumen cuando cambien las dimensiones
    ['length', 'width', 'height'].forEach(fieldId => {
        const field = document.getElementById(fieldId);
        if (field) {
            field.addEventListener('input', calculateVolume);
        }
    });
    
    // Event listeners para cálculos automáticos
    const calculationFields = [
        'base_cost_price', 'expense_1', 'expense_2', 'purchase_tax_enabled', 'tax_id',
        'unit_1_quantity', 'unit_1_operation', 'unit_2_quantity', 'unit_2_operation', 'unit_3_quantity', 'unit_3_operation'
    ];
    
    calculationFields.forEach(fieldId => {
        const field = document.getElementById(fieldId);
        if (field) {
            field.addEventListener('input', function() {
                for (let i = 1; i <= 3; i++) {
                    if (document.getElementById(`tab_enabled_${i}`).checked) {
                        calculateUnitPrices(i);
                    }
                }
            });
            field.addEventListener('change', function() {
                for (let i = 1; i <= 3; i++) {
                    if (document.getElementById(`tab_enabled_${i}`).checked) {
                        calculateUnitPrices(i);
                    }
                }
            });
        }
    });
    
    // Event listener para el selector de impuesto
    const taxSelect = document.getElementById('tax_id');
    if (taxSelect) {
        taxSelect.addEventListener('change', function() {
            // Recalcular todas las pestañas habilitadas
            for (let i = 1; i <= 3; i++) {
                if (document.getElementById(`tab_enabled_${i}`).checked) {
                    calculateUnitPrices(i);
                }
            }
        });
    }
    
    // Event listeners para utilidades
    for (let unit = 1; unit <= 3; unit++) {
        for (let level = 1; level <= 3; level++) {
            const utilidadField = document.getElementById(`unit_${unit}_utilidad_${level}`);
            const taxEnabledField = document.getElementById(`unit_${unit}_tax_enabled_${level}`);
            
            if (utilidadField) {
                utilidadField.addEventListener('input', () => calculateUnitPrices(unit));
            }
            if (taxEnabledField) {
                taxEnabledField.addEventListener('change', () => calculateUnitPrices(unit));
            }
        }
    }
    
    // Event listeners para botones de pestañas
    for (let i = 1; i <= 3; i++) {
        const tabButton = document.getElementById(`tab${i}-tab`);
        if (tabButton) {
            tabButton.addEventListener('click', function(e) {
                e.preventDefault();
                switchTab(i);
            });
        }
    }
    
    // Calcular volumen inicial
    calculateVolume();
    
    // Calcular precios iniciales para pestañas habilitadas
    const enabledTabs = [];
    for (let i = 1; i <= 3; i++) {
        if (document.getElementById(`tab_enabled_${i}`).checked) {
            enabledTabs.push(i);
        }
    }
    
    if (enabledTabs.length > 0) {
        switchTab(enabledTabs[0]);
    }
});
</script>
@endpush

@push('styles')
<style>
    .gradient-primary {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    }
    
    .gradient-secondary {
        background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    }
    
    .gradient-success {
        background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    }
    
    .gradient-info {
        background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    }
    
    .gradient-warning {
        background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
    }
    
    .card {
        border: none;
        box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
        transition: all 0.3s ease-in-out;
    }
    
    .card:hover {
        transform: translateY(-2px);
        box-shadow: 0 0.25rem 2rem 0 rgba(58, 59, 69, 0.25);
    }
    
    .nav-tabs .nav-link {
        border: none;
        border-bottom: 3px solid transparent;
        color: #6c757d;
        font-weight: 500;
        transition: all 0.3s ease;
    }
    
    .nav-tabs .nav-link:hover {
        border-bottom-color: #dee2e6;
        color: #495057;
    }
    
    .nav-tabs .nav-link.active {
        border-bottom-color: #007bff;
        color: #007bff;
        background: none;
    }
    
    .form-control:focus {
        border-color: #80bdff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }
    
    .btn {
        border-radius: 0.375rem;
        font-weight: 500;
        transition: all 0.3s ease;
    }
    
    .btn:hover {
        transform: translateY(-1px);
    }
    
    .progress {
        border-radius: 0.5rem;
        overflow: hidden;
    }
    
    .progress-bar {
        transition: width 0.6s ease;
    }
    
    .barcode-item {
        border: 1px solid #e3e6f0;
        border-radius: 0.375rem;
        padding: 1rem;
        background: #f8f9fc;
    }
    
    .img-thumbnail {
        border-radius: 0.5rem;
        transition: all 0.3s ease;
    }
    
    .img-thumbnail:hover {
        transform: scale(1.05);
    }
</style>
@endpush
@endsection

<!-- Modal de Información del Inventario -->
<div class="modal fade" id="inventoryModal" tabindex="-1" aria-labelledby="inventoryModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-info text-white">
                <h5 class="modal-title" id="inventoryModalLabel">
                    <i class="fas fa-warehouse"></i> Información Completa del Inventario
                </h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6">
                        <h6 class="text-primary mb-3">
                            <i class="fas fa-boxes"></i> Stock por Almacén
                        </h6>
                        <div class="table-responsive">
                            <table class="table table-sm">
                                <thead class="table-light">
                                    <tr>
                                        <th>Almacén</th>
                                        <th>Cantidad</th>
                                        <th>Estado</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>Almacén Principal</td>
                                        <td><span class="badge bg-success">{{ $product->current_stock ?? 0 }}</span></td>
                                        <td>
                                            @if(($product->current_stock ?? 0) <= ($product->stock_min ?? 0))
                                                <span class="badge bg-danger">Bajo Stock</span>
                                            @elseif(($product->current_stock ?? 0) >= ($product->stock_max ?? 0))
                                                <span class="badge bg-warning">Stock Alto</span>
                                            @else
                                                <span class="badge bg-success">Normal</span>
                                            @endif
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <h6 class="text-primary mb-3">
                            <i class="fas fa-chart-line"></i> Configuración de Stock
                        </h6>
                        <div class="row">
                            <div class="col-6">
                                <div class="card bg-light">
                                    <div class="card-body text-center">
                                        <h6 class="card-title text-muted">Stock Mínimo</h6>
                                        <h4 class="text-warning">{{ $product->stock_min ?? 0 }}</h4>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="card bg-light">
                                    <div class="card-body text-center">
                                        <h6 class="card-title text-muted">Stock Máximo</h6>
                                        <h4 class="text-info">{{ $product->stock_max ?? 0 }}</h4>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <div class="mt-3">
                            <h6 class="text-primary mb-2">
                                <i class="fas fa-map-marker-alt"></i> Ubicación
                            </h6>
                            <p class="mb-0">
                                <i class="fas fa-warehouse text-muted"></i> 
                                {{ $product->warehouse_location ?? 'Sin ubicación asignada' }}
                            </p>
                        </div>
                    </div>
                </div>
                
                <div class="row mt-4">
                    <div class="col-12">
                        <h6 class="text-primary mb-3">
                            <i class="fas fa-history"></i> Últimos Movimientos
                        </h6>
                        <div class="table-responsive">
                            <table class="table table-sm">
                                <thead class="table-light">
                                    <tr>
                                        <th>Fecha</th>
                                        <th>Tipo</th>
                                        <th>Cantidad</th>
                                        <th>Usuario</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td colspan="4" class="text-center text-muted">
                                            <i class="fas fa-info-circle"></i> 
                                            No hay movimientos registrados
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                    <i class="fas fa-times"></i> Cerrar
                </button>
                <button type="button" class="btn btn-primary" onclick="window.open('{{ route('admin.inventory.reports') }}', '_blank')">
                    <i class="fas fa-chart-bar"></i> Ver Reportes
                </button>
            </div>
        </div>
    </div>
</div>