@extends('layouts.app')
@section('title', __('product.add_new_product'))

@section('content')

<!-- Content Header (Page header) -->
<section class="content-header">
    <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">@lang('product.add_new_product')</h1>
</section>

<!-- Main content -->
<section class="content">
    @php
    $form_class = empty($duplicate_product) ? 'create' : '';
    $is_image_required = !empty($common_settings['is_product_image_required']);
    // Generate batch_id once on page load
    $page_batch_id = date('Ymd_His') . '_' . substr(microtime(), 2, 4);
    
    // Check if units with this batch_id exist
    $business_id = request()->session()->get('user.business_id');
    $units_with_batch = \App\Unit::where('business_id', $business_id)
                        ->where('batch_id', $page_batch_id)
                        ->exists();
    
    // If units exist with this batch_id, use only those
    // Otherwise, get all units
    if ($units_with_batch) {
        $filtered_units = \App\Unit::where('business_id', $business_id)
                            ->where('batch_id', $page_batch_id)
                            ->orderBy('actual_name')
                            ->pluck('actual_name', 'id')
                            ->toArray();
    } else {
        $filtered_units = $units; // Use the existing $units variable passed from controller
    }
    @endphp
    {!! Form::open(['url' => action([\App\Http\Controllers\ProductController::class, 'store']), 'method' => 'post',
    'id' => 'product_add_form','class' => 'product_form ' . $form_class, 'files' => true ]) !!}
    
    <!-- Hidden field for page batch ID - generated once per page load -->
    <input type="hidden" id="page_batch_id" name="page_batch_id" value="{{ $page_batch_id }}">
    
    @component('components.widget', ['class' => 'box-primary'])
    <div class="row">
        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('name', __('product.product_name') . ':*') !!}
                {!! Form::text('name', !empty($duplicate_product->name) ? $duplicate_product->name : null, ['class' => 'form-control', 'required',
                'placeholder' => __('product.product_name')]); !!}
            </div>
        </div>

        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('sku', __('product.sku') . ':') !!} @show_tooltip(__('tooltip.sku'))
                {!! Form::text('sku', null, ['class' => 'form-control',
                'placeholder' => __('product.sku')]); !!}
            </div>
        </div>
        
        <div class="col-sm-3" style="display:none;">
            <div class="form-group">
                {!! Form::label('barcode_type', __('product.barcode_type') . ':*') !!}
                {!! Form::select('barcode_type', $barcode_types, !empty($duplicate_product->barcode_type) ? $duplicate_product->barcode_type : $barcode_default, ['class' => 'form-control select2', 'required']); !!}
            </div>
        </div>
        
                <!-- Rest of the form fields -->
        <div class="col-sm-3 @if(!session('business.enable_brand')) hide @endif">
            <div class="form-group">
                {!! Form::label('brand_id', __('product.brand') . ':') !!}
                <div class="input-group">
                    {!! Form::select('brand_id', $brands, !empty($duplicate_product->brand_id) ? $duplicate_product->brand_id : null, ['placeholder' => __('messages.please_select'), 'class' => 'form-control select2']); !!}
                    <span class="input-group-btn">
                        <button type="button" @if(!auth()->user()->can('brand.create')) disabled @endif class="btn btn-default bg-white btn-flat btn-modal" data-href="{{action([\App\Http\Controllers\BrandController::class, 'create'], ['quick_add' => true])}}" title="@lang('brand.add_brand')" data-container=".view_modal"><i class="fa fa-plus-circle text-primary fa-lg"></i></button>
                    </span>
                </div>
            </div>
        </div>
        
        <div class="col-sm-3 @if(!session('business.enable_category')) hide @endif">
            <div class="form-group">
                {!! Form::label('category_id', __('product.category') . ':') !!}
                {!! Form::select('category_id', $categories, !empty($duplicate_product->category_id) ? $duplicate_product->category_id : null, ['placeholder' => __('messages.please_select'), 'class' => 'form-control select2']); !!}
            </div>
        </div>
        
        

<!-- Unit Management - Direct input with full unit details -->
<div class="col-sm-6">
    <div class="box box-primary">
        <div class="with-border ml-5">
            <h3 class="box-title">@lang('lang_v1.unit_management')</h3>
        </div>
        <div class="">
            <div class="table-responsive" style="font-size:12px;">
                <table class="table table-bordered table-striped" id="unit_management_table">
                    <thead>
                        <tr>
                            <th style="width: 15%;">@lang('unit.name') <span class="text-danger">*</span></th>
                            <th style="width: 10%;">@lang('unit.short_name') <span class="text-danger">*</span></th>
                            <th style="width: 12%;">@lang('unit.allow_decimal')</th>
                            <th style="width: 10%;">@lang('lang_v1.relation_unit')</th>
                            <th style="width: 10%;">@lang('lang_v1.relation_qty')</th>
                            <th style="width: 15%;">@lang('lang_v1.price')</th>
                            <th style="width: 5%;">@lang('messages.action')</th>
                        </tr>
                    </thead>
                    <tbody>
                        <!-- Base Unit Row (always present) -->
                        <tr class="base-unit-row" data-row-index="0">
                            <td>
                                <div class="input-group">
                                    <input type="text" name="units[0][actual_name]" class="form-control unit-name-input" placeholder="@lang('unit.name')" required>
                                    <span class="input-group-btn">
                                        <button type="button" class="btn btn-primary btn-sm add-unit-from-row" title="@lang('unit.add_unit')">
                                            <i class="fa fa-plus"></i>
                                        </button>
                                    </span>
                                </div>
                                <input type="hidden" name="units[0][unit_id]" class="unit-id-hidden" value="">
                            </td>
                            <td>
                                <input type="text" name="units[0][short_name]" class="form-control unit-short-name-input" placeholder="@lang('unit.short_name')" required>
                            </td>
                            <td>
                                <select name="units[0][allow_decimal]" class="form-control unit-allow-decimal">
                                    <option value="1">@lang('messages.yes')</option>
                                    <option value="0">@lang('messages.no')</option>
                                </select>
                            </td>
                            <td>
                                <span class="label label-primary">@lang('lang_v1.base_unit')</span>
                                <input type="hidden" name="units[0][relation_unit_id]" value="">
                                <input type="hidden" name="units[0][relation_qty]" value="1">
                            </td>
                            <td>
                                <span class="text-muted">1</span>
                            </td>
                            <td>
                                <input type="number" name="units[0][price]" class="form-control price-input" step="any" placeholder="0.00">
                            </td>
                            <td>
                                <span class="text-muted">@lang('lang_v1.base_unit')</span>
                            </td>
                        </tr>
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="7">
                                <button type="button" class="btn btn-primary btn-sm" id="add_unit_row">
                                    <i class="fa fa-plus"></i> @lang('lang_v1.add_unit_row')
                                </button>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>
           
        </div>
    </div>
</div>
        
        


<div class="col-sm-6">
    <div class="row">

        @php
        $default_location = null;
        if(count($business_locations) == 1){
        $default_location = array_key_first($business_locations->toArray());
        }
        @endphp
        <div class="col-sm-6">
            <div class="form-group">
                {!! Form::label('product_locations', __('business.business_locations') . ':') !!} @show_tooltip(__('lang_v1.product_location_help'))
                {!! Form::select('product_locations[]', $business_locations, $default_location, ['class' => 'form-control select2', 'multiple', 'id' => 'product_locations', 'required']); !!}
            </div>
        </div>
        
        <div class="col-sm-6">
            <div class="form-group">
                <br>
                <label>
                    {!! Form::checkbox('enable_stock', 1, !empty($duplicate_product) ? $duplicate_product->enable_stock : true, ['class' => 'input-icheck', 'id' => 'enable_stock']); !!} <strong>@lang('product.manage_stock')</strong>
                </label>@show_tooltip(__('tooltip.enable_stock')) <p class="help-block"><i>@lang('product.enable_stock_help')</i></p>
            </div>
        </div>
<div class="col-sm-6 @if(!empty($duplicate_product) && $duplicate_product->enable_stock == 0) hide @endif" id="alert_quantity_div">
            <div class="form-group">
                {!! Form::label('alert_quantity', __('product.alert_quantity') . ':') !!} @show_tooltip(__('tooltip.alert_quantity'))
                {!! Form::text('alert_quantity', !empty($duplicate_product->alert_quantity) ? @format_quantity($duplicate_product->alert_quantity) : null , ['class' => 'form-control input_number',
                'placeholder' => __('product.alert_quantity'), 'min' => '0']); !!}
            </div>
        </div>
        
        <style>
            #commission_allowed {
                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
                width: 30px;
                height: 30px;
                border: 2px solid #888;
                border-radius: 5px;
                position: relative;
                cursor: pointer;
                outline: none;
                margin-top: 5px;
                transition: background-color 0.3s ease, border-color 0.3s ease;
            }

            #commission_allowed:checked {
                background-color: blue;
                border-color: blue;
            }

            #commission_allowed:checked::before {
                content: '\2713';
                position: absolute;
                top: 2px;
                left: 6px;
                font-size: 20px;
                color: white;
            }
        </style>


        <div class="col-sm-3">
            <div class="form-group">
                <label for="commission_allowed">Commission Allowed</label>
                <br>
                <input type="checkbox" name="product_custom_field19" id="commission_allowed">
            </div>
        </div>

        <div class="col-sm-3">
            <div class="form-group" id="fixed_commission_div" style="display: none;">
                <label for="fixed_commission">Fixed Commission</label>
                <input type="number" name="product_custom_field20" id="fixed_commission" class="form-control">
            </div>
        </div>

        

    </div>
    
    </div>
    </div>
        

        <div class="col-sm-6">
        <div class="form-group">
            {!! Form::label('product_description', __('lang_v1.product_description') . ':') !!}
            {!! Form::textarea(
                'product_description',
                !empty($duplicate_product->product_description) ? $duplicate_product->product_description : null,
                [
                    'class' => 'form-control',
                    'id' => 'product_description' // 👈 important
                ]
            ); !!}
        </div>
    </div>
    
           
               
        
        @if(!empty($common_settings['enable_product_warranty']))
        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('warranty_id', __('lang_v1.warranty') . ':') !!}
                {!! Form::select('warranty_id', $warranties, null, ['class' => 'form-control select2', 'placeholder' => __('messages.please_select')]); !!}
            </div>
        </div>
        @endif
        
       

        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('image', __('lang_v1.product_image') . ':') !!}
                {!! Form::file('image', ['id' => 'upload_image', 'accept' => 'image/*',
                'required' => $is_image_required, 'class' => 'upload-element']); !!}
                <small>
                    <p class="help-block">@lang('purchase.max_file_size', ['size' => (config('constants.document_size_limit') / 1000000)]) <br> @lang('lang_v1.aspect_ratio_should_be_1_1')</p>
                </small>
            </div>
        </div>
    
    <script>
document.addEventListener("DOMContentLoaded", function () {
    tinymce.init({
        selector: '#product_description',
        height: 100,          // 👈 set your preferred height
        menubar: false,
        plugins: 'lists link image table code',
        toolbar: 'undo redo | formatselect | bold italic | \
                  alignleft aligncenter alignright alignjustify | \
                  bullist numlist outdent indent | link image | code',
        branding: false
    });
});
</script>
        
        
        
    @endcomponent

    <!-- Rest of the form sections remain the same -->
    @component('components.widget', ['class' => 'box-primary'])
    <div class="row">
        @if(session('business.enable_product_expiry'))
        @if(session('business.expiry_type') == 'add_expiry')
        @php
        $expiry_period = 12;
        $hide = true;
        @endphp
        @else
        @php
        $expiry_period = null;
        $hide = false;
        @endphp
        @endif
        <div class="col-sm-3 @if($hide) hide @endif">
            <div class="form-group">
                <div class="multi-input">
                    {!! Form::label('expiry_period', __('product.expires_in') . ':') !!}<br>
                    {!! Form::text('expiry_period', !empty($duplicate_product->expiry_period) ? @num_format($duplicate_product->expiry_period) : $expiry_period, ['class' => 'form-control pull-left input_number',
                    'placeholder' => __('product.expiry_period'), 'style' => 'width:60%;']); !!}
                    {!! Form::select('expiry_period_type', ['months'=>__('product.months'), 'days'=>__('product.days'), '' =>__('product.not_applicable') ], !empty($duplicate_product->expiry_period_type) ? $duplicate_product->expiry_period_type : 'months', ['class' => 'form-control select2 pull-left', 'style' => 'width:40%;', 'id' => 'expiry_period_type']); !!}
                </div>
            </div>
        </div>
        @endif

        <div class="col-sm-3">
            <div class="form-group">
                <br>
                <label>
                    {!! Form::checkbox('enable_sr_no', 1, !(empty($duplicate_product)) ? $duplicate_product->enable_sr_no : false, ['class' => 'input-icheck']); !!} <strong>@lang('lang_v1.enable_imei_or_sr_no')</strong>
                </label> @show_tooltip(__('lang_v1.tooltip_sr_no'))
            </div>
        </div>

        <div class="col-sm-3">
            <div class="form-group">
                <br>
                <label>
                    {!! Form::checkbox('not_for_selling', 1, !(empty($duplicate_product)) ? $duplicate_product->not_for_selling : false, ['class' => 'input-icheck']); !!} <strong>@lang('lang_v1.not_for_selling')</strong>
                </label> @show_tooltip(__('lang_v1.tooltip_not_for_selling'))
            </div>
        </div>
        
         <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('weight', __('lang_v1.weight') . ':') !!}
                {!! Form::text('weight', !empty($duplicate_product->weight) ? $duplicate_product->weight : null, ['class' => 'form-control', 'placeholder' => __('lang_v1.weight')]); !!}
            </div>
        </div>
        
        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('preparation_time_in_minutes', __('lang_v1.preparation_time_in_minutes') . ':') !!}
                {!! Form::number('preparation_time_in_minutes', !empty($duplicate_product->preparation_time_in_minutes) ? $duplicate_product->preparation_time_in_minutes : null, ['class' => 'form-control', 'placeholder' => __('lang_v1.preparation_time_in_minutes')]); !!}
            </div>
        </div>
        

        <!-- Rack, Row & position number -->
        @if(session('business.enable_racks') || session('business.enable_row') || session('business.enable_position'))
        <div class="col-md-12">
            <h4>@lang('lang_v1.rack_details'):
                @show_tooltip(__('lang_v1.tooltip_rack_details'))
            </h4>
        </div>
        @foreach($business_locations as $id => $location)
        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('rack_' . $id, $location . ':') !!}
                @if(session('business.enable_racks'))
                {!! Form::text('product_racks[' . $id . '][rack]', !empty($rack_details[$id]['rack']) ? $rack_details[$id]['rack'] : null, ['class' => 'form-control', 'id' => 'rack_' . $id,
                'placeholder' => __('lang_v1.rack')]); !!}
                @endif
                @if(session('business.enable_row'))
                {!! Form::text('product_racks[' . $id . '][row]', !empty($rack_details[$id]['row']) ? $rack_details[$id]['row'] : null, ['class' => 'form-control', 'placeholder' => __('lang_v1.row')]); !!}
                @endif
                @if(session('business.enable_position'))
                {!! Form::text('product_racks[' . $id . '][position]', !empty($rack_details[$id]['position']) ? $rack_details[$id]['position'] : null, ['class' => 'form-control', 'placeholder' => __('lang_v1.position')]); !!}
                @endif
            </div>
        </div>
        @endforeach
        @endif

       
        
        @php
        $custom_labels = json_decode(session('business.custom_labels'), true);
        $product_custom_fields = !empty($custom_labels['product']) ? $custom_labels['product'] : [];
        $product_cf_details = !empty($custom_labels['product_cf_details']) ? $custom_labels['product_cf_details'] : [];
        @endphp

        @foreach($product_custom_fields as $index => $cf)
            @if(!empty($cf))
                @php
                    $db_field_name = 'product_custom_field' . $loop->iteration;
                    $cf_type = !empty($product_cf_details[$loop->iteration]['type']) ? $product_cf_details[$loop->iteration]['type'] : 'text';
                    $dropdown = !empty($product_cf_details[$loop->iteration]['dropdown_options']) ? explode(PHP_EOL, $product_cf_details[$loop->iteration]['dropdown_options']) : [];
                @endphp
                <div class="col-sm-3">
                    <div class="form-group">
                        {!! Form::label($db_field_name, $cf . ':') !!}
                        @if(in_array($cf_type, ['text', 'date']))
                            <input type="{{$cf_type}}" name="{{$db_field_name}}" id="{{$db_field_name}}" value="{{!empty($duplicate_product->$db_field_name) ? $duplicate_product->$db_field_name : null}}" class="form-control" placeholder="{{$cf}}">
                        @elseif($cf_type == 'dropdown')
                            {!! Form::select($db_field_name, $dropdown, !empty($duplicate_product->$db_field_name) ? $duplicate_product->$db_field_name : null, ['placeholder' => $cf, 'class' => 'form-control select2']); !!}
                        @endif
                    </div>
                </div>
            @endif
        @endforeach

        
        
        <div class="clearfix"></div>
        @include('layouts.partials.module_form_part')
    </div>
    @endcomponent

    @component('components.widget', ['class' => 'box-primary'])
    <div class="row">
        <div class="col-sm-3 @if(!session('business.enable_price_tax')) hide @endif">
            <div class="form-group">
                {!! Form::label('tax', __('product.applicable_tax') . ':') !!}
                {!! Form::select(
                    'tax',
                    $taxes,
                    !empty($duplicate_product->tax) ? $duplicate_product->tax : null,
                    [
                        'placeholder' => __('messages.please_select'),
                        'class' => 'form-control select2',
                        'id' => 'tax'
                    ],
                    $tax_attributes
                ); !!}
            </div>
        </div>

        <div class="col-sm-3 @if(!session('business.enable_price_tax')) hide @endif">
            <div class="form-group">
                {!! Form::label('tax_type', __('product.selling_price_tax_type') . ':*') !!}
                {!! Form::select(
                    'tax_type',
                    ['inclusive' => __('product.inclusive'), 'exclusive' => __('product.exclusive')],
                    !empty($duplicate_product->tax_type) ? $duplicate_product->tax_type : 'exclusive',
                    [
                        'class' => 'form-control select2',
                        'required',
                        'id' => 'tax_type'
                    ]
                ); !!}
            </div>
        </div>

        <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('type', __('product.product_type') . ':*') !!} @show_tooltip(__('tooltip.product_type'))
                {!! Form::select('type', $product_types, !empty($duplicate_product->type) ? $duplicate_product->type : null, ['class' => 'form-control select2',
                'required', 'data-action' => !empty($duplicate_product) ? 'duplicate' : 'add', 'data-product_id' => !empty($duplicate_product) ? $duplicate_product->id : '0']); !!}
            </div>
        </div>

        <div class="form-group col-sm-12" id="product_form_part">
            @include('product.partials.single_product_form_part', ['profit_percent' => $default_profit_percent])
        </div>

        <input type="hidden" id="variation_counter" value="1">
        <input type="hidden" id="default_profit_percent" value="{{ $default_profit_percent }}">
    </div>
    @endcomponent
    
    <div class="row">
        <div class="col-sm-12">
            <input type="hidden" name="submit_type" id="submit_type">
            <div class="text-center">
                <div class="btn-group">
                    @if($selling_price_group_count)
                    <button type="submit" value="submit_n_add_selling_prices" class="tw-dw-btn tw-dw-btn-warning tw-dw-btn-lg tw-text-white submit_product_form">@lang('lang_v1.save_n_add_selling_price_group_prices')</button>
                    @endif

                    @can('product.opening_stock')
                    <button id="opening_stock_button" @if(!empty($duplicate_product) && $duplicate_product->enable_stock == 0) disabled @endif type="submit" value="submit_n_add_opening_stock" class="tw-dw-btn tw-dw-btn-lg tw-text-white bg-purple submit_product_form">@lang('lang_v1.save_n_add_opening_stock')</button>
                    @endcan

                    <button type="submit" value="save_n_add_another" class="tw-dw-btn tw-dw-btn-lg bg-maroon submit_product_form">@lang('lang_v1.save_n_add_another')</button>

                    <button type="submit" value="submit" class="tw-dw-btn tw-dw-btn-primary tw-dw-btn-lg tw-text-white submit_product_form">@lang('messages.save')</button>
                </div>
            </div>
        </div>
    </div>
    {!! Form::close() !!}
</section>
<!-- /.content -->

@endsection

@section('javascript')

<script src="{{ asset('js/product.js?v=' . $asset_v) }}"></script>

<script type="text/javascript">
$(document).ready(function() {
    __page_leave_confirmation('#product_add_form');
    
    onScan.attachTo(document, {
        suffixKeyCodes: [13],
        reactToPaste: true,
        onScan: function(sCode, iQty) {
            $('input#sku').val(sCode);
        },
        onScanError: function(oDebug) {
            console.log(oDebug);
        },
        minLength: 2,
        ignoreIfFocusOn: ['input', '.form-control']
    });

    // Initialize commission checkbox
    $('#commission_allowed').change(function() {
        if ($(this).is(':checked')) {
            $('#fixed_commission_div').show();
        } else {
            $('#fixed_commission_div').hide();
        }
    });

    if ($('#commission_allowed').is(':checked')) {
        $('#fixed_commission_div').show();
    }

    // Tax change handler - just trigger tax_type to inclusive if tax selected
    $('#tax').on('change', function () {
        let taxValue = $(this).val();
        if (taxValue) {
            $('#tax_type').val('inclusive').trigger('change');
        }
    });

// =============================================
// UNIT MANAGEMENT - FULL DETAILS VERSION
// =============================================

let unitRowCounter = 1;
let pageBatchId = $('#page_batch_id').val();
let addedUnits = {};

// Function to add a unit directly from row
function addUnitFromRow(button) {
    let row = button.closest('tr');
    let unitNameInput = row.find('.unit-name-input');
    let unitShortNameInput = row.find('.unit-short-name-input');
    let unitAllowDecimal = row.find('.unit-allow-decimal');
    let unitIdHidden = row.find('.unit-id-hidden');
    
    let unitName = unitNameInput.val().trim();
    let shortName = unitShortNameInput.val().trim();
    let allowDecimal = unitAllowDecimal.val();
    
    if (!unitName) {
        toastr.warning('@lang("unit.name") is required');
        unitNameInput.focus();
        return;
    }
    
    if (!shortName) {
        toastr.warning('@lang("unit.short_name") is required');
        unitShortNameInput.focus();
        return;
    }
    
    button.prop('disabled', true);
    button.html('<i class="fa fa-spinner fa-spin"></i>');
    
    $.ajax({
        url: '{{ route("units.create_from_product") }}',
        type: 'POST',
        data: {
            actual_name: unitName,
            short_name: shortName,
            allow_decimal: allowDecimal,
            batch_id: pageBatchId,
            _token: $('meta[name="csrf-token"]').attr('content')
        },
        success: function(response) {
            if (response.success) {
                let unitId = response.unit.id;
                
                addedUnits[unitId] = {
                    id: unitId,
                    actual_name: response.unit.actual_name,
                    short_name: response.unit.short_name,
                    allow_decimal: response.unit.allow_decimal,
                    is_new: response.exists ? false : true
                };
                
                unitIdHidden.val(unitId);
                unitNameInput.prop('readonly', true);
                unitNameInput.addClass('bg-gray');
                unitShortNameInput.prop('readonly', true);
                unitShortNameInput.addClass('bg-gray');
                unitAllowDecimal.prop('disabled', true);
                
                refreshUnitDropdowns();
                
                if (response.exists) {
                    toastr.info('Unit "' + unitName + '" already exists, using existing');
                } else {
                    toastr.success('Unit "' + unitName + '" added successfully');
                }
            } else {
                toastr.error(response.msg || 'Failed to add unit');
            }
        },
        error: function(xhr) {
            let errorMsg = 'Failed to add unit';
            if (xhr.responseJSON && xhr.responseJSON.msg) {
                errorMsg = xhr.responseJSON.msg;
            }
            toastr.error(errorMsg);
            console.error('AJAX Error:', xhr);
        },
        complete: function() {
            button.prop('disabled', false);
            button.html('<i class="fa fa-plus"></i>');
        }
    });
}

// Create a new unit row HTML
function createUnitRowHTML(rowIndex) {
    let html = `
        <tr class="unit-row" data-row-index="${rowIndex}">
            <td>
                <div class="input-group">
                    <input type="text" name="units[${rowIndex}][actual_name]" class="form-control unit-name-input" placeholder="@lang('unit.name')" required>
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-primary btn-sm add-unit-from-row" title="@lang('unit.add_unit')">
                            <i class="fa fa-plus"></i>
                        </button>
                    </span>
                </div>
                <input type="hidden" name="units[${rowIndex}][unit_id]" class="unit-id-hidden" value="">
            </td>
            <td>
                <input type="text" name="units[${rowIndex}][short_name]" class="form-control unit-short-name-input" placeholder="@lang('unit.short_name')" required>
            </td>
            <td>
                <select name="units[${rowIndex}][allow_decimal]" class="form-control unit-allow-decimal">
                    <option value="1">@lang('messages.yes')</option>
                    <option value="0">@lang('messages.no')</option>
                </select>
            </td>
            <td>
                <select name="units[${rowIndex}][relation_unit_id]" class="form-control relation-unit-select" required>
                    <option value="">@lang('messages.please_select')</option>
                </select>
            </td>
            <td>
                <input type="number" name="units[${rowIndex}][relation_qty]" class="form-control relation-qty" step="any" placeholder="1" required>
            </td>
            <td>
                <input type="number" name="units[${rowIndex}][price]" class="form-control price-input" step="any" placeholder="0.00" required>
            </td>
            <td>
                <button type="button" class="btn btn-danger btn-sm remove-unit-row">
                    <i class="fa fa-trash"></i>
                </button>
            </td>
        </tr>
    `;
    return html;
}

// Refresh all unit dropdowns with available units
function refreshUnitDropdowns() {
    let unitOptions = [];
    $('#unit_management_table tbody .unit-name-input').each(function() {
        let name = $(this).val().trim();
        if (name) {
            let row = $(this).closest('tr');
            let unitId = row.find('.unit-id-hidden').val();
            let shortName = row.find('.unit-short-name-input').val().trim();
            unitOptions.push({
                id: unitId || name,
                text: name + (shortName ? ' (' + shortName + ')' : '')
            });
        }
    });
    
    $('.relation-unit-select').each(function() {
        let select = $(this);
        let currentVal = select.val();
        let row = select.closest('tr');
        let currentUnitId = row.find('.unit-id-hidden').val();
        let currentUnitName = row.find('.unit-name-input').val().trim();
        
        select.empty();
        select.append('<option value="">@lang("messages.please_select")</option>');
        
        for (let i = 0; i < unitOptions.length; i++) {
            let unit = unitOptions[i];
            if (unit.id === currentUnitId || unit.text.split(' ')[0] === currentUnitName) {
                continue;
            }
            let selected = (unit.id === currentVal || unit.text.split(' ')[0] === currentVal) ? ' selected' : '';
            select.append('<option value="' + unit.id + '"' + selected + '>' + unit.text + '</option>');
        }
    });
}

// Event: Add unit from row
$(document).on('click', '.add-unit-from-row', function(e) {
    e.preventDefault();
    addUnitFromRow($(this));
});

// Event: Add unit on Enter key
$(document).on('keypress', '.unit-name-input, .unit-short-name-input', function(e) {
    if (e.which === 13) {
        e.preventDefault();
        let button = $(this).closest('tr').find('.add-unit-from-row');
        addUnitFromRow(button);
    }
});

// Event: Add new unit row
$('#add_unit_row').click(function() {
    let newRowIndex = unitRowCounter;
    let newRow = createUnitRowHTML(newRowIndex);
    $('#unit_management_table tbody').append(newRow);
    refreshUnitDropdowns();
    unitRowCounter++;
});

// Event: Remove unit row
$(document).on('click', '.remove-unit-row', function() {
    let row = $(this).closest('tr');
    
    if (row.hasClass('base-unit-row')) {
        toastr.warning('@lang("lang_v1.base_unit_cannot_be_removed")');
        return;
    }
    
    let unitName = row.find('.unit-name-input').val().trim();
    let unitId = row.find('.unit-id-hidden').val();
    
    if (unitId && addedUnits[unitId]) {
        delete addedUnits[unitId];
    }
    
    row.remove();
    refreshUnitDropdowns();
    
    if (unitName) {
        toastr.info('Unit "' + unitName + '" removed');
    } else {
        toastr.info('Unit row removed');
    }
});

// Event: Validate that unit and relation unit are different
$(document).on('change', '.relation-unit-select', function() {
    let row = $(this).closest('tr');
    if (row.hasClass('base-unit-row')) {
        return;
    }
    
    let relationValue = $(this).val();
    let unitId = row.find('.unit-id-hidden').val();
    let unitName = row.find('.unit-name-input').val().trim();
    
    if (relationValue === unitId || relationValue === unitName) {
        toastr.warning('@lang("lang_v1.relation_unit_cannot_be_same_as_unit")');
        $(this).val('');
    }
});

// Form validation
$('#product_add_form').on('submit', function(e) {
    let isValid = true;
    let baseUnitSet = false;
    
    let baseUnitRow = $('#unit_management_table tbody tr.base-unit-row');
    let baseUnitInput = baseUnitRow.find('.unit-name-input');
    let baseUnitShort = baseUnitRow.find('.unit-short-name-input');
    let baseUnitId = baseUnitRow.find('.unit-id-hidden').val();
    let baseUnitName = baseUnitInput.val().trim();
    let baseUnitShortName = baseUnitShort.val().trim();
    
    if (baseUnitName && baseUnitShortName && baseUnitId) {
        baseUnitSet = true;
    } else if (baseUnitName && baseUnitShortName && !baseUnitId) {
        toastr.error('Please add the base unit by clicking the + button');
        e.preventDefault();
        return false;
    } else if (baseUnitName && !baseUnitShortName) {
        toastr.error('Please enter the short name for the base unit');
        e.preventDefault();
        return false;
    } else if (!baseUnitName) {
        toastr.error('@lang("lang_v1.please_select_base_unit")');
        e.preventDefault();
        return false;
    }
    
    if (!baseUnitSet) {
        toastr.error('@lang("lang_v1.please_select_base_unit")');
        e.preventDefault();
        return false;
    }
    
    $('#unit_management_table tbody tr:not(.base-unit-row)').each(function() {
        let unitName = $(this).find('.unit-name-input').val().trim();
        let shortName = $(this).find('.unit-short-name-input').val().trim();
        let unitId = $(this).find('.unit-id-hidden').val();
        let relationUnit = $(this).find('.relation-unit-select').val();
        let qty = $(this).find('.relation-qty').val();
        let price = $(this).find('.price-input').val();
        
        if (unitName || shortName) {
            if (!unitName || !shortName) {
                toastr.error('Please enter both name and short name for all units');
                isValid = false;
                return false;
            }
            
            if (!unitId) {
                toastr.error('Please add the unit "' + unitName + '" by clicking the + button');
                isValid = false;
                return false;
            }
            
            if (!relationUnit || !qty || !price) {
                toastr.error('@lang("lang_v1.please_fill_all_unit_fields") for "' + unitName + '"');
                isValid = false;
                return false;
            }
            
            if (relationUnit === unitId || relationUnit === unitName) {
                toastr.error('@lang("lang_v1.relation_unit_cannot_be_same_as_unit") for "' + unitName + '"');
                isValid = false;
                return false;
            }
        }
    });
    
    if (!isValid) {
        e.preventDefault();
        return false;
    }
    
    return true;
});


// =============================================
// PRICE SYNC LOGIC
// =============================================
//
// Rules:
// 1. When unit price changes -> it sets the SELLING PRICE (inclusive by default).
//    - single_dsp_inc_tax = unit price (inclusive)
//    - single_dsp = exclusive (derived from inclusive / tax rate)
//    - profit_percent is calculated from purchase price (single_dpp) if set
//    - The selling price is LOCKED so purchase price changes don't overwrite it.
//
// 2. When purchase price (single_dpp) changes -> ONLY profit_percent updates.
//    Selling price stays locked.
//
// 3. When tax changes -> if selling price is locked and tax_type is inclusive,
//    recalculate exclusive price. Otherwise normal behavior.
//
// 4. When tax_type changes -> toggle visibility only (no recalculation of locked prices).
//
// =============================================

// Flag to indicate selling price was set from the unit table
window.unitPriceLocked = false;

// Core function: sync unit price -> selling price (single product type)
function syncUnitPriceToSellingPrice(unitPrice) {
    if (unitPrice === undefined || unitPrice === null || isNaN(unitPrice) || unitPrice <= 0) {
        return;
    }
    
    // Lock the selling price so purchase price changes don't overwrite it
    window.unitPriceLocked = true;
    
    var tax_rate = $('select#tax').find(':selected').data('rate');
    tax_rate = tax_rate == undefined ? 0 : tax_rate;
    
    var tax_type = $('#tax_type').val();
    
    // ----- Single product type -----
    if ($('select#type').val() == 'single') {
        if (tax_type == 'inclusive') {
            // Unit price is INCLUSIVE of tax
            __write_number($('input#single_dsp_inc_tax'), unitPrice);
            
            var selling_price_exc = __get_principle(unitPrice, tax_rate);
            __write_number($('input#single_dsp'), selling_price_exc);
            
            // Recalculate profit % based on purchase price
            var purchase_exc_tax = __read_number($('input#single_dpp'));
            if (purchase_exc_tax > 0) {
                var profit_percent = __get_rate(purchase_exc_tax, selling_price_exc);
                __write_number($('input#profit_percent'), profit_percent);
            }
        } else {
            // Unit price is EXCLUSIVE of tax
            __write_number($('input#single_dsp'), unitPrice);
            
            var selling_price_inc = __add_percent(unitPrice, tax_rate);
            __write_number($('input#single_dsp_inc_tax'), selling_price_inc);
            
            var purchase_exc_tax2 = __read_number($('input#single_dpp'));
            if (purchase_exc_tax2 > 0) {
                var profit_percent2 = __get_rate(purchase_exc_tax2, unitPrice);
                __write_number($('input#profit_percent'), profit_percent2);
            }
        }
    }
    
    // ----- Variable product type -----
    if ($('select#type').val() == 'variable') {
        $('table.variation_value_table > tbody tr').each(function() {
            var tr_obj = $(this);
            
            if (tax_type == 'inclusive') {
                __write_number(tr_obj.find('input.variable_dsp_inc_tax'), unitPrice);
                var selling_price_exc = __get_principle(unitPrice, tax_rate);
                __write_number(tr_obj.find('input.variable_dsp'), selling_price_exc);
                
                var purchase_exc_tax = __read_number(tr_obj.find('input.variable_dpp'));
                if (purchase_exc_tax > 0) {
                    var profit_percent = __get_rate(purchase_exc_tax, selling_price_exc);
                    __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent);
                }
            } else {
                __write_number(tr_obj.find('input.variable_dsp'), unitPrice);
                var selling_price_inc = __add_percent(unitPrice, tax_rate);
                __write_number(tr_obj.find('input.variable_dsp_inc_tax'), selling_price_inc);
                
                var purchase_exc_tax2 = __read_number(tr_obj.find('input.variable_dpp'));
                if (purchase_exc_tax2 > 0) {
                    var profit_percent2 = __get_rate(purchase_exc_tax2, unitPrice);
                    __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent2);
                }
            }
        });
    }
}

// Expose globally so it can be reused
window.syncUnitPriceToSellingPrice = syncUnitPriceToSellingPrice;

// -------- Trigger: unit price change in base unit row --------
$(document).on('change', '.base-unit-row .price-input', function() {
    var unitPrice = __read_number($(this));
    if (unitPrice > 0) {
        syncUnitPriceToSellingPrice(unitPrice);
    } else {
        // Reset lock when unit price cleared
        window.unitPriceLocked = false;
    }
});

// -------- Trigger: unit price change in ANY unit row (optional) --------
// If the user also changes price on additional unit rows, we do NOT auto-sync
// because additional units have their own price logic (relation qty).
// Only base unit drives the default selling price.
// (Leave this commented - uncomment if you want all rows to sync)
// $(document).on('change', '.unit-row .price-input', function() {
//     var unitPrice = __read_number($(this));
//     if (unitPrice > 0) syncUnitPriceToSellingPrice(unitPrice);
// });


// =============================================
// OVERRIDE: single_dpp change handler
// When unit price lock is active, only profit % recalculates.
// =============================================

$(document).off('change', 'input#single_dpp').on('change', 'input#single_dpp', function(e) {
    var purchase_exc_tax = __read_number($('input#single_dpp'));
    purchase_exc_tax = purchase_exc_tax == undefined ? 0 : purchase_exc_tax;

    var tax_rate = $('select#tax').find(':selected').data('rate');
    tax_rate = tax_rate == undefined ? 0 : tax_rate;

    // Update purchase price inclusive
    var purchase_inc_tax = __add_percent(purchase_exc_tax, tax_rate);
    __write_number($('input#single_dpp_inc_tax'), purchase_inc_tax);

    if (window.unitPriceLocked) {
        // Selling price was set from unit table — do NOT overwrite it.
        // Only recalculate profit percentage.
        var selling_price = __read_number($('input#single_dsp'));
        
        if (purchase_exc_tax > 0 && selling_price > 0) {
            var profit_percent = __get_rate(purchase_exc_tax, selling_price);
            __write_number($('input#profit_percent'), profit_percent);
        } else {
            __write_number($('input#profit_percent'), 0);
        }
    } else {
        // Normal behavior — recalculate selling price from profit %
        var profit_percent = __read_number($('#profit_percent'));
        var selling_price = __add_percent(purchase_exc_tax, profit_percent);
        __write_number($('input#single_dsp'), selling_price);

        var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
        __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax);
    }
});


// =============================================
// OVERRIDE: single_dpp_inc_tax change handler
// =============================================

$(document).off('change', 'input#single_dpp_inc_tax').on('change', 'input#single_dpp_inc_tax', function(e) {
    var purchase_inc_tax = __read_number($('input#single_dpp_inc_tax'));
    purchase_inc_tax = purchase_inc_tax == undefined ? 0 : purchase_inc_tax;

    var tax_rate = $('select#tax').find(':selected').data('rate');
    tax_rate = tax_rate == undefined ? 0 : tax_rate;

    var purchase_exc_tax = __get_principle(purchase_inc_tax, tax_rate);
    __write_number($('input#single_dpp'), purchase_exc_tax);

    if (window.unitPriceLocked) {
        // Only recalculate profit % — do not touch selling price
        var selling_price = __read_number($('input#single_dsp'));
        if (purchase_exc_tax > 0 && selling_price > 0) {
            var profit_percent = __get_rate(purchase_exc_tax, selling_price);
            __write_number($('input#profit_percent'), profit_percent);
        } else {
            __write_number($('input#profit_percent'), 0);
        }
    } else {
        var profit_percent = __read_number($('#profit_percent'));
        profit_percent = profit_percent == undefined ? 0 : profit_percent;
        var selling_price = __add_percent(purchase_exc_tax, profit_percent);
        __write_number($('input#single_dsp'), selling_price);

        var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
        __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax);
    }
});


// =============================================
// OVERRIDE: tax change handler
// If selling price is locked and tax_type is inclusive,
// recalculate exclusive price only.
// =============================================

$(document).off('change', 'select#tax').on('change', 'select#tax', function() {
    var tax_rate = $('select#tax').find(':selected').data('rate');
    tax_rate = tax_rate == undefined ? 0 : tax_rate;

    // ---- Single product ----
    if ($('select#type').val() == 'single') {
        // Update purchase inclusive
        var purchase_exc_tax = __read_number($('input#single_dpp'));
        purchase_exc_tax = purchase_exc_tax == undefined ? 0 : purchase_exc_tax;

        var purchase_inc_tax = __add_percent(purchase_exc_tax, tax_rate);
        __write_number($('input#single_dpp_inc_tax'), purchase_inc_tax);

        var tax_type = $('#tax_type').val();

        if (window.unitPriceLocked) {
            // Selling price is locked from unit price
            if (tax_type == 'inclusive') {
                // Recalculate exclusive from inclusive
                var selling_price_inc_tax = __read_number($('input#single_dsp_inc_tax'));
                var selling_price_exc = __get_principle(selling_price_inc_tax, tax_rate);
                __write_number($('input#single_dsp'), selling_price_exc);
                
                if (purchase_exc_tax > 0) {
                    var profit_percent = __get_rate(purchase_exc_tax, selling_price_exc);
                    __write_number($('input#profit_percent'), profit_percent);
                }
            } else {
                // Exclusive — recalculate inclusive
                var selling_price_exc2 = __read_number($('input#single_dsp'));
                var selling_price_inc_tax2 = __add_percent(selling_price_exc2, tax_rate);
                __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax2);
                
                if (purchase_exc_tax > 0) {
                    var profit_percent2 = __get_rate(purchase_exc_tax, selling_price_exc2);
                    __write_number($('input#profit_percent'), profit_percent2);
                }
            }
        } else {
            // Normal behavior
            var selling_price = __read_number($('input#single_dsp'));
            var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
            __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax);
        }
    }

    // ---- Variable product ----
    if ($('select#type').val() == 'variable') {
        $('table.variation_value_table > tbody').each(function() {
            $(this).find('tr').each(function() {
                var tr_obj = $(this);
                var purchase_exc_tax = __read_number(tr_obj.find('input.variable_dpp'));
                purchase_exc_tax = purchase_exc_tax == undefined ? 0 : purchase_exc_tax;

                var purchase_inc_tax = __add_percent(purchase_exc_tax, tax_rate);
                __write_number(tr_obj.find('input.variable_dpp_inc_tax'), purchase_inc_tax);

                var tax_type = $('#tax_type').val();
                
                if (window.unitPriceLocked) {
                    if (tax_type == 'inclusive') {
                        var selling_price_inc = __read_number(tr_obj.find('input.variable_dsp_inc_tax'));
                        var selling_price_exc = __get_principle(selling_price_inc, tax_rate);
                        __write_number(tr_obj.find('input.variable_dsp'), selling_price_exc);
                        
                        if (purchase_exc_tax > 0) {
                            var profit_percent = __get_rate(purchase_exc_tax, selling_price_exc);
                            __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent);
                        }
                    } else {
                        var selling_price_exc2 = __read_number(tr_obj.find('input.variable_dsp'));
                        var selling_price_inc2 = __add_percent(selling_price_exc2, tax_rate);
                        __write_number(tr_obj.find('input.variable_dsp_inc_tax'), selling_price_inc2);
                        
                        if (purchase_exc_tax > 0) {
                            var profit_percent2 = __get_rate(purchase_exc_tax, selling_price_exc2);
                            __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent2);
                        }
                    }
                } else {
                    var selling_price = __read_number(tr_obj.find('input.variable_dsp'));
                    var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
                    __write_number(tr_obj.find('input.variable_dsp_inc_tax'), selling_price_inc_tax);
                }
            });
        });
    }
});



$(document).off('change', '#tax_type').on('change', '#tax_type', function(e) {
    // Toggle visibility (uses existing toggle_dsp_input if available)
    if (typeof toggle_dsp_input === 'function') {
        toggle_dsp_input();
    }
    
    var tax_type = $(this).val();
    var tax_rate = $('select#tax').find(':selected').data('rate');
    tax_rate = tax_rate == undefined ? 0 : tax_rate;

    // =========================================================
    // PART 1: SINGLE PRODUCT TYPE
    // =========================================================
    if ($('select#type').val() == 'single') {
        
        // ---- Purchase Price Sync ----
        if (tax_type == 'inclusive') {
            // single_dpp_inc_tax is authoritative
            // Derive exclusive single_dpp from inclusive
            var purchase_inc_tax = __read_number($('input#single_dpp_inc_tax'));
            purchase_inc_tax = purchase_inc_tax == undefined ? 0 : purchase_inc_tax;
            
            var purchase_exc_tax = __get_principle(purchase_inc_tax, tax_rate);
            __write_number($('input#single_dpp'), purchase_exc_tax);
        } else {
            // single_dpp is authoritative
            // Derive inclusive single_dpp_inc_tax from exclusive
            var purchase_exc_tax = __read_number($('input#single_dpp'));
            purchase_exc_tax = purchase_exc_tax == undefined ? 0 : purchase_exc_tax;
            
            var purchase_inc_tax = __add_percent(purchase_exc_tax, tax_rate);
            __write_number($('input#single_dpp_inc_tax'), purchase_inc_tax);
        }

        // ---- Selling Price Sync ----
        var purchase_exc_tax_for_profit = __read_number($('input#single_dpp'));
        purchase_exc_tax_for_profit = purchase_exc_tax_for_profit == undefined ? 0 : purchase_exc_tax_for_profit;

        if (window.unitPriceLocked) {
            // Selling price is locked from unit price
            if (tax_type == 'inclusive') {
                // single_dsp_inc_tax is authoritative (it was set from unit price)
                // Derive exclusive single_dsp
                var selling_price_inc_tax = __read_number($('input#single_dsp_inc_tax'));
                var selling_price_exc = __get_principle(selling_price_inc_tax, tax_rate);
                __write_number($('input#single_dsp'), selling_price_exc);
                
                if (purchase_exc_tax_for_profit > 0) {
                    var profit_percent = __get_rate(purchase_exc_tax_for_profit, selling_price_exc);
                    __write_number($('input#profit_percent'), profit_percent);
                }
            } else {
                // Exclusive — single_dsp is authoritative
                // Derive inclusive single_dsp_inc_tax
                var selling_price_exc2 = __read_number($('input#single_dsp'));
                var selling_price_inc_tax2 = __add_percent(selling_price_exc2, tax_rate);
                __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax2);
                
                if (purchase_exc_tax_for_profit > 0) {
                    var profit_percent2 = __get_rate(purchase_exc_tax_for_profit, selling_price_exc2);
                    __write_number($('input#profit_percent'), profit_percent2);
                }
            }
        } else {
            // Normal behavior — recalculate inclusive from exclusive selling price
            var selling_price = __read_number($('input#single_dsp'));
            var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
            __write_number($('input#single_dsp_inc_tax'), selling_price_inc_tax);
        }
    }

    // =========================================================
    // PART 2: VARIABLE PRODUCT TYPE
    // =========================================================
    if ($('select#type').val() == 'variable') {
        $('table.variation_value_table > tbody').each(function() {
            $(this).find('tr').each(function() {
                var tr_obj = $(this);
                
                // ---- Purchase Price Sync ----
                if (tax_type == 'inclusive') {
                    // variable_dpp_inc_tax is authoritative
                    var purchase_inc_tax = __read_number(tr_obj.find('input.variable_dpp_inc_tax'));
                    purchase_inc_tax = purchase_inc_tax == undefined ? 0 : purchase_inc_tax;
                    
                    var purchase_exc_tax = __get_principle(purchase_inc_tax, tax_rate);
                    __write_number(tr_obj.find('input.variable_dpp'), purchase_exc_tax);
                } else {
                    // variable_dpp is authoritative
                    var purchase_exc_tax = __read_number(tr_obj.find('input.variable_dpp'));
                    purchase_exc_tax = purchase_exc_tax == undefined ? 0 : purchase_exc_tax;
                    
                    var purchase_inc_tax = __add_percent(purchase_exc_tax, tax_rate);
                    __write_number(tr_obj.find('input.variable_dpp_inc_tax'), purchase_inc_tax);
                }

                // ---- Selling Price Sync ----
                var purchase_exc_tax_for_profit = __read_number(tr_obj.find('input.variable_dpp'));
                purchase_exc_tax_for_profit = purchase_exc_tax_for_profit == undefined ? 0 : purchase_exc_tax_for_profit;

                if (window.unitPriceLocked) {
                    if (tax_type == 'inclusive') {
                        // variable_dsp_inc_tax is authoritative
                        var selling_price_inc = __read_number(tr_obj.find('input.variable_dsp_inc_tax'));
                        var selling_price_exc = __get_principle(selling_price_inc, tax_rate);
                        __write_number(tr_obj.find('input.variable_dsp'), selling_price_exc);
                        
                        if (purchase_exc_tax_for_profit > 0) {
                            var profit_percent = __get_rate(purchase_exc_tax_for_profit, selling_price_exc);
                            __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent);
                        }
                    } else {
                        // variable_dsp is authoritative
                        var selling_price_exc2 = __read_number(tr_obj.find('input.variable_dsp'));
                        var selling_price_inc2 = __add_percent(selling_price_exc2, tax_rate);
                        __write_number(tr_obj.find('input.variable_dsp_inc_tax'), selling_price_inc2);
                        
                        if (purchase_exc_tax_for_profit > 0) {
                            var profit_percent2 = __get_rate(purchase_exc_tax_for_profit, selling_price_exc2);
                            __write_number(tr_obj.find('input.variable_profit_percent'), profit_percent2);
                        }
                    }
                } else {
                    // Normal — recalculate inclusive from exclusive selling price
                    var selling_price = __read_number(tr_obj.find('input.variable_dsp'));
                    var selling_price_inc_tax = __add_percent(selling_price, tax_rate);
                    __write_number(tr_obj.find('input.variable_dsp_inc_tax'), selling_price_inc_tax);
                }
            });
        });
    }
});

// =============================================
// Reset lock when product type changes (fresh form)
// =============================================
$(document).on('change', 'select#type', function() {
    window.unitPriceLocked = false;
});


// =============================================
// Initialize
// =============================================
refreshUnitDropdowns();

console.log('Page Batch ID:', pageBatchId);
console.log('Unit Management initialized with full details');
console.log('Unit price lock sync initialized');

});
</script>

<style>
    #unit_management_table tbody tr td {
        vertical-align: middle;
    }
    .base-unit-row td {
        background-color: #f9f9f9;
    }
    .unit-management-container {
        margin-bottom: 20px;
    }
    .unit-management-container .box {
        border-top: 3px solid #3c8dbc;
    }
    .unit-management-container .box-header {
        padding: 10px 15px;
        background-color: #f5f5f5;
        border-bottom: 1px solid #ddd;
    }
    #unit_management_table .base-unit-row .label-info {
        font-size: 12px;
        padding: 5px 10px;
    }
    #unit_management_table .unit-select,
    #unit_management_table .relation-unit-select {
        width: 100%;
    }
    #unit_management_table .relation-qty,
    #unit_management_table .price-input {
        width: 100%;
    }
</style>


@endsection