@extends('layout.app')
@section('title', 'Create Freight Entry')

@push('header_script')
    <style>
        .form-section-title {
            font-size: 0.95rem;
            font-weight: 600;
            color: #495057;
            margin-bottom: 1rem;
            padding-bottom: 0.5rem;
            border-bottom: 1px solid #e9ecef;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .form-section-title i {
            color: #0d6efd;
        }

        .bg-light-input {
            background-color: #f8f9fa;
        }

        .total-card {
            background: #f0f4f8;
            border: 1px dashed #cbd5e1;
        }

        /* Table Styles for Multi-Add */
        .goods-table th {
            background-color: #f1f5f9;
            font-size: 0.85rem;
            font-weight: 600;
            text-transform: uppercase;
            color: #475569;
        }

        .goods-table td {
            vertical-align: middle;
        }

        .goods-table input,
        .goods-table select {
            border: 1px solid #e2e8f0;
            font-size: 0.9rem;
        }

        .input-currency {
            text-align: right;
            font-weight: 600;
        }
    </style>
    <link rel="stylesheet" href="{{ asset('theme/assets/vendor/daterange/daterange.css') }}">
@endpush

@section('content')
    <div class="app-hero-header d-flex align-items-center">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="javascript:void(0);">Operations</a>
            </li>
            <li class="breadcrumb-item active" aria-current="page">Freight (GR) Entry</li>
        </ol>
        <div class="ms-auto d-lg-flex flex-row">
            <a href="{{ route('freight-entry.index') }}" class="btn btn-sm btn-outline-secondary">
                <i class="ri-arrow-left-circle-line"></i> Back to List
            </a>
        </div>
    </div>

    <div class="app-body">
        {!! Form::open([
            'route' => ['freight-entry.store'],
            'class' => 'needs-validation',
            'method' => 'post',
            'autocomplete' => 'off',
            'id' => 'freightForm',
        ]) !!}

        <div class="row gx-3">
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="form-section-title"><i class="ri-file-list-3-line"></i> Basic Information</div>
                        <div class="row g-3">
                            <div class="col-md-3 col-12">
                                <label class="form-label" for="lr_no">GR / LR Number<span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="lr_no" name="lr_no" required
                                    value="{{ old('lr_no') }}">
                                <div class="text-danger">{{ $errors->first('lr_no') }}</div>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="date">GR Date<span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" class="form-control datepicker" id="date" name="date"
                                        required value="{{ old('date', date('d-m-Y')) }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('date') }}</div>
                            </div>

                            @php
                                $taxSettings = \App\Http\Helpers\CommonHelper::checkTaxSetting('enable_gst');
                            @endphp

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="paid_by">
                                    Freight Paid By <span class="text-danger">*</span>
                                </label>

                                @if (optional($taxSettings)->enable_gst == 'yes' && optional($taxSettings)->enable_gst_type == 'fcm')
                                    {{-- FCM case: Only Transporter --}}
                                    {!! Form::select('paid_by', ['Transporter' => 'Transporter'], old('paid_by'), [
                                        'class' => 'form-control select2',
                                        'id' => 'paid_by',
                                        'required',
                                    ]) !!}
                                @else
                                    {{-- Normal case --}}
                                    {!! Form::select(
                                        'paid_by',
                                        [
                                            '' => '--Select--',
                                            'Consignor' => 'Consignor',
                                            'Consignee' => 'Consignee',
                                            'Transporter' => 'Transporter',
                                        ],
                                        old('paid_by'),
                                        ['class' => 'form-control select2', 'id' => 'paid_by', 'required'],
                                    ) !!}
                                @endif

                                <div class="text-danger">{{ $errors->first('paid_by') }}</div>
                            </div>


                            <div class="col-md-3">
                                <label class="form-label">Payment Status</label>
                                <div class="btn-group w-100" role="group">
                                    <input type="radio" class="btn-check" name="payment_status" id="ps1"
                                        value="To Pay" checked>
                                    <label class="btn btn-outline-primary btn-sm" for="ps1">To Pay</label>

                                    <input type="radio" class="btn-check" name="payment_status" id="ps2"
                                        value="Paid">
                                    <label class="btn btn-outline-success btn-sm" for="ps2">Paid</label>

                                    <input type="radio" class="btn-check" name="payment_status" id="ps3"
                                        value="TBB">
                                    <label class="btn btn-outline-warning btn-sm" for="ps3">To be billed
                                    </label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row gx-3">
            {{-- CONSIGNOR --}}
            <div class="col-md-6">
                <div class="card mb-3 h-100">
                    <div class="card-header bg-primary text-white py-2">
                        <small class="fw-bold">CONSIGNOR / SENDER</small>
                    </div>
                    <div class="card-body">
                        <div class="row g-2">
                            <div class="col-md-12 col-12">
                                <label class="form-label" for="consignor_id">Consignor<span class="text-danger">*</span>
                                    <button type="button" style="border-radius: 15px;height: 20px; width: 20px;"
                                        data-bs-toggle="modal" data_type="consignor" data-bs-target="#partyModal"
                                        class="btn btn-sm btn-primary">
                                        <i class="ri-add-line ri-sm"
                                            style="position: relative; bottom: 6px; right: 4px;"></i>
                                    </button></label>
                                {!! Form::select('consignor_id', ['' => '--Select--'] + $party, old('consignor_id'), [
                                    'class' => 'form-control select2',
                                    'id' => 'consignor_id',
                                    'required',
                                ]) !!}
                                <div class="text-danger">{{ $errors->first('consignor_id') }}</div>
                            </div>
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="party_gst_no">
                                    GST No
                                </label>
                                <input type="text" id="consignor_gst_no" class="form-control readonly" readonly>
                            </div>

                            <div class="col-md-6 col-12">
                                <label class="form-label" for="party_mobile">
                                    Mobile
                                </label>
                                <input type="text" id="consignor_mobile" class="form-control readonly" readonly>
                            </div>

                            <div class="col-12">
                                <label class="form-label" for="party_address">
                                    Address
                                </label>
                                <textarea id="consignor_address" class="form-control readonly" readonly></textarea>
                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_city">
                                    City
                                </label>
                                <input type="text" id="consignor_city" class="form-control readonly" readonly>
                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_state">
                                    State
                                </label>
                                <input type="text" id="consignor_state" class="form-control readonly" readonly>

                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_pan">
                                    PAN No
                                </label>
                                <input type="text" id="consignor_pan" class="form-control readonly" readonly>
                            </div>

                            <div class="col-12">
                                <label class="form-label" for="party_email">
                                    Email ID
                                </label>
                                <input type="text" id="consignor_email" class="form-control readonly" readonly>
                            </div>

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

            {{-- CONSIGNEE --}}
            <div class="col-md-6">
                <div class="card mb-3 h-100">
                    <div class="card-header bg-success text-white py-2">
                        <small class="fw-bold">CONSIGNEE / RECEIVER</small>
                    </div>
                    <div class="card-body">
                        <div class="row g-2">
                            <div class="col-md-12 col-12">
                                <label class="form-label" for="consignee_id">Consignee<span class="text-danger">*</span>
                                    <button type="button" style="border-radius: 15px;height: 20px; width: 20px; "
                                        data-bs-toggle="modal" data_type="consignee" data-bs-target="#partyModal"
                                        class="btn btn-sm btn-primary">
                                        <i class="ri-add-line ri-sm"
                                            style="position: relative; bottom: 6px; right: 4px;"></i>
                                    </button></label>
                                {!! Form::select('consignee_id', ['' => '--Select--'] + $party, old('consignee_id'), [
                                    'class' => 'form-control select2',
                                    'id' => 'consignee_id',
                                    'required',
                                ]) !!}
                                <div class="text-danger">{{ $errors->first('consignee_id') }}</div>
                            </div>
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="party_gst_no">
                                    GST No
                                </label>
                                <input type="text" id="consignee_gst_no" class="form-control readonly" readonly>
                            </div>

                            <div class="col-md-6 col-12">
                                <label class="form-label" for="party_mobile">
                                    Mobile
                                </label>
                                <input type="text" id="consignee_mobile" class="form-control readonly" readonly>

                            </div>

                            <div class="col-12">
                                <label class="form-label" for="party_address">
                                    Address
                                </label>
                                <textarea id="consignee_address" class="form-control readonly" readonly></textarea>
                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_city">
                                    City
                                </label>
                                <input type="text" id="consignee_city" class="form-control readonly" readonly>

                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_state">
                                    State
                                </label>
                                <input type="text" id="consignee_state" class="form-control readonly" readonly>
                            </div>

                            <div class="col-md-4 col-12">
                                <label class="form-label" for="party_pan">
                                    PAN No
                                </label>
                                <input type="text" id="consignee_pan" class="form-control readonly" readonly>
                            </div>

                            <div class="col-12">
                                <label class="form-label" for="party_email">
                                    Email ID
                                </label>
                                <input type="text" id="consignee_email" class="form-control readonly" readonly>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <br>
        <div class="row gx-3">
            {{-- TRUCK DETAILS --}}
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="form-section-title"><i class="ri-truck-line"></i> Truck Details</div>
                        <div class="row g-3">
                            <div class="col-md-3">
                                <label class="form-label">From <span class="text-danger">*</span></label>
                                <input type="text" name="from_location" class="form-control"
                                    placeholder="From Location">
                            </div>
                            <div class="col-md-3">
                                <label class="form-label">To <span class="text-danger">*</span></label>
                                <input type="text" name="to_location" class="form-control" placeholder="To Location">
                            </div>
                            <div class="col-md-4 col-12">
                                <input type="hidden" name="freight_type" value="Party">

                                <label class="form-label" for="vehicle_id">
                                    Vehicle No <span class="text-danger">*</span> <button type="button"
                                        style="border-radius: 15px;height: 20px; width: 20px;" data-bs-toggle="modal"
                                        data-bs-target="#vehicleModel" class="btn btn-sm btn-primary">
                                        <i class="ri-add-line ri-sm"
                                            style="position: relative; bottom: 6px; right: 4px;"></i>
                                    </button>
                                </label>

                                <select name="vehicle_id" id="vehicle_id" class="form-control select2" required>
                                    <option value="">--Select--</option>
                                    @foreach ($vehicle as $v)
                                        <option value="{{ $v->id }}" data-vehicle-type="{{ $v->vehicle_type }}">
                                            {{ $v->vehicle_no }}
                                        </option>
                                    @endforeach
                                </select>


                                <div class="text-danger">{{ $errors->first('vehicle_id') }}</div>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="vehicle_type">
                                    Vehicle Type
                                </label>
                                <input type="text" class="form-control" id="vehicle_type" name="vehicle_type"
                                    placeholder="Vehicle Type" readonly>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label">Weight Guarantee</label>
                                <input type="text" name="weight_guarantee" class="form-control"
                                    placeholder="Weight Guarantee">
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label">
                                    Select Company Employee
                                    <button type="button" style="border-radius: 15px;height: 20px; width: 20px;"
                                        data-bs-toggle="modal" data-bs-target="#driverModel"
                                        class="btn btn-sm btn-primary">
                                        <i class="ri-add-line ri-sm"
                                            style="position: relative; bottom: 6px; right: 4px;"></i>
                                    </button>
                                </label>
                                <select name="employee_id" id="company_driver" class="form-control select2">
                                    <option value="">Select</option>
                                    @foreach ($employee as $id => $name)
                                        <option value="{{ $id }}">{{ $name }}</option>
                                    @endforeach
                                </select>
                                <div class="text-danger">{{ $errors->first('employee_id') }}</div>
                            </div>
                            <div class="col-12 mt-2" style="padding-left:40px !important;">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="showDriverDetails">
                                    <label class="form-check-label" for="showDriverDetails">Show Driver Details</label>
                                </div>
                            </div>
                            <div class="col-12 driver-info-box"
                                style="display:none; background:#f8f9fa; padding:15px; border-radius:5px;">
                                <div class="row g-3">
                                    <div class="col-md-3">
                                        <label class="form-label text-muted small">Driver Name</label>
                                        <input type="text" id="driver_name" name="driver_name" class="form-control"
                                            readonly>
                                        <div class="text-danger">{{ $errors->first('driver_name') }}</div>

                                    </div>
                                    <div class="col-md-3">
                                        <label class="form-label text-muted small">Driver Mobile Number</label>
                                        <input type="text" id="driver_mobile" name="driver_mobile"
                                            class="form-control number" value="{{ old('driver_mobile_no') }}" readonly>
                                        <div class="text-danger">{{ $errors->first('driver_mobile_no') }}</div>
                                    </div>
                                    <div class="col-md-3">
                                        <label class="form-label text-muted small">License Number</label>
                                        <input type="text" id="driver_license_no" name="driver_license_no"
                                            class="form-control" value="{{ old('driver_license_no') }}" readonly>
                                        <div class="text-danger">{{ $errors->first('driver_license_no') }}</div>
                                    </div>
                                    <div class="col-md-3">
                                        <label class="form-label text-muted small">License Valid Upto</label>
                                        <input type="text" id="driver_license_valid_upto"
                                            name="driver_license_valid_upto" class="form-control datepicker" readonly>
                                        <div class="text-danger">{{ $errors->first('driver_license_valid_upto') }}</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card mb-3">
                <div class="card-body">

                    <h6 class="form-section-title">
                        <i class="ri-shield-check-line"></i> Logistics, Risk & Insurance
                    </h6>

                    <div class="row g-4">

                        {{-- MODE OF TRANSPORT --}}
                        <div class="col-md-6 col-12">
                            <label class="form-label" for="transport_mode">
                                Mode of Transport
                            </label>
                            {!! Form::select(
                                'transport_mode',
                                [
                                    '' => '--Select--',
                                    'Road' => 'By Road',
                                    'Rail' => 'By Rail',
                                    'Air' => 'By Air',
                                    'Express' => 'Express',
                                ],
                                old('transport_mode'),
                                ['class' => 'form-control select2', 'id' => 'transport_mode'],
                            ) !!}
                            <div class="text-danger">{{ $errors->first('transport_mode') }}</div>
                        </div>

                        {{-- RISK TYPE (RADIO - NOT CHANGED) --}}
                        <div class="col-md-4" style="padding-left:40px !important;">
                            <label class="form-label fw-bold d-block">Risk Type</label>

                            <div class="form-check mt-2">
                                <input class="form-check-input" type="radio" name="risk_type" id="rk_owner"
                                    value="Owner" {{ old('risk_type', 'Owner') == 'Owner' ? 'checked' : '' }}>
                                <label class="form-check-label fw-bold text-warning" for="rk_owner">
                                    Owner's Risk
                                </label>
                            </div>

                            <div class="form-check mt-1">
                                <input class="form-check-input" type="radio" name="risk_type" id="rk_carrier"
                                    value="Carrier" {{ old('risk_type') == 'Carrier' ? 'checked' : '' }}>
                                <label class="form-check-label fw-bold text-danger" for="rk_carrier">
                                    Carrier's Risk
                                </label>
                            </div>

                            <div class="text-danger">{{ $errors->first('risk_type') }}</div>
                        </div>

                        <div class="col-12">
                            <hr class="my-1">
                        </div>

                        {{-- HAS INSURANCE (Checkbox unchanged) --}}
                        <div class="col-6" style="padding-left:40px !important;">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="hasInsuranceToggle"
                                    {{ old('has_insurance') ? 'checked' : '' }}>
                                <label class="form-check-label fw-bold" for="hasInsuranceToggle">
                                    Has Insurance?
                                </label>
                            </div>
                        </div>

                        {{-- INSURANCE FIELDS --}}
                        <div class="col-12" id="insuranceBox" style="display:none;">
                            <div class="row g-3 mt-1">

                                <div class="col-md-4 col-12">
                                    <label class="form-label" for="insurance_company">
                                        Insurance Company
                                    </label>
                                    <input type="text" class="form-control" id="insurance_company"
                                        name="insurance_company" value="{{ old('insurance_company') }}">
                                    <div class="text-danger">{{ $errors->first('insurance_company') }}</div>
                                </div>

                                <div class="col-md-4 col-12">
                                    <label class="form-label" for="policy_number">
                                        Policy Number
                                    </label>
                                    <input type="text" class="form-control" id="policy_number" name="policy_number"
                                        value="{{ old('policy_number') }}">
                                    <div class="text-danger">{{ $errors->first('policy_number') }}</div>
                                </div>

                                <div class="col-md-4 col-12">
                                    <label class="form-label" for="insured_amount">
                                        Insured Amount
                                    </label>
                                    <input type="text" class="form-control number" id="insured_amount"
                                        name="insured_amount" value="{{ old('insured_amount') }}">
                                    <div class="text-danger">{{ $errors->first('insured_amount') }}</div>
                                </div>

                            </div>
                        </div>

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


            {{-- GOODS DETAILS --}}
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-header py-2 d-flex justify-content-between align-items-center bg-light">
                        <span class="fw-bold text-dark"><i class="ri-box-3-line text-primary"></i> Material / Goods
                            Details</span>
                        <button type="button" class="btn btn-sm btn-primary" id="addMoreMaterialBtn">
                            <i class="ri-add-line"></i> Add Item
                        </button>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-bordered mb-0 goods-table text-center align-middle">
                                <thead>
                                    <tr>
                                        <th style="width:18%;">Material Name / Desc</th>
                                        <th style="width:8%;">HSN Code</th>
                                        <th style="width:13%;">Packing Type</th>
                                        <th style="width:8%;">No. of Units</th>
                                        <th style="width:8%;">Actual Weight</th>
                                        <th style="width:11%;">Unit</th>
                                        <th style="width:8%;">Charge Weight</th>
                                        <th style="width:8%;">Rate</th>
                                        {{-- <th style="width:6%;">Per</th> --}}
                                        <th style="width:12%;">Freight Amount</th>
                                        <th style="width:6%;">Act</th>
                                    </tr>
                                </thead>
                                <tbody id="goodsTableBody">
                                    <tr>
                                        <td><input type="text" name="items[0][material_name]" class="form-control"
                                                placeholder="e.g. Iron Scrap"></td>
                                        <td><input type="text" name="items[0][hsn_code]" class="form-control"
                                                placeholder="HSN"></td>
                                        <td>
                                            <select name="items[0][packing_type]" class="form-select">
                                                <option value="">--Select--</option>
                                                <option>BOX</option>
                                                <option>BAG</option>
                                                <option>CARTON</option>
                                                <option>POUCH</option>
                                                <option>BOTTLE</option>
                                                <option>CAN</option>
                                                <option>DRUM</option>
                                                <option>CRATE</option>
                                                <option>BUNDLE</option>
                                                <option>ROLL</option>
                                                <option>LOOSE</option>
                                                <option>BULK</option>
                                                <option>WRAPPED</option>
                                                <option>PALLET</option>
                                            </select>

                                        </td>
                                        <td><input type="number" name="items[0][qty]" class="form-control"
                                                placeholder="0"></td>
                                        <td><input type="number" step="0.01" name="items[0][actual_weight]"
                                                class="form-control" placeholder="0.00"></td>
                                        <td>
                                            <select name="items[0][weight_unit]" class="form-select">
                                                <option value="">--Select Unit--</option>

                                                <!-- Weight -->
                                                <option value="KG">KG (Kilogram)</option>
                                                <option value="G">G (Gram)</option>
                                                <option value="MT">MT (Metric Ton)</option>
                                                <option value="TON">TON (Ton)</option>
                                                <option value="LB">LB (Pound)</option>
                                                <option value="OZ">OZ (Ounce)</option>

                                                <!-- Volume -->
                                                <option value="CBM">CBM (Cubic Meter)</option>
                                                <option value="CFT">CFT (Cubic Feet)</option>

                                                <!-- Liquid -->
                                                <option value="LTR">LTR (Litre)</option>
                                                <option value="ML">ML (Millilitre)</option>

                                                <!-- Count / Packages -->
                                                <option value="NOS">NOS (Numbers)</option>
                                                <option value="PCS">PCS (Pieces)</option>
                                                <option value="PKT">PKT (Packet)</option>
                                                <option value="BOX">BOX</option>
                                                <option value="BAG">BAG</option>
                                                <option value="DRUM">DRUM</option>
                                                <option value="CAN">CAN</option>
                                                <option value="BOTTLE">BOTTLE</option>
                                                <option value="ROLL">ROLL</option>
                                                <option value="CRATE">CRATE</option>
                                                <option value="BUNDLE">BUNDLE</option>
                                                <option value="PALLET">PALLET</option>
                                                <option value="CARTON">CARTON</option>
                                                <option value="BALE">BALE</option>
                                                <option value="LOOSE">LOOSE</option>
                                                <option value="BULK">BULK</option>
                                            </select>
                                        </td>

                                        <td><input type="number" step="0.01" name="items[0][charge_weight]"
                                                class="form-control" placeholder="0.00"></td>
                                        <td><input type="number" step="0.01" name="items[0][rate]"
                                                class="form-control rate-input" placeholder="0.00"></td>
                                        {{-- <td>
                                            <select name="items[0][rate_per_unit]" class="form-select">
                                                <option>MT</option>
                                                <option>KG</option>
                                                <option>NOS</option>
                                                <option>FIX</option>
                                            </select>
                                        </td> --}}
                                        <td><input type="text" name="items[0][amount]"
                                                class="form-control bg-light-input amount-input" readonly
                                                placeholder="0.00"></td>
                                        <td><button type="button" class="btn btn-sm btn-outline-danger"><i
                                                    class="ri-delete-bin-line"></i></button></td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr class="fw-bold bg-light">
                                        <td colspan="4" class="text-end">Total:</td>
                                        <td><span id="totalActualWeight">0.00</span></td>
                                        <td></td>
                                        <td><span id="totalChargeWeight">0.00</span></td>
                                        <td colspan="2"></td>
                                        <td><span id="totalBasicFreight">0.00</span></td>
                                        <td></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row gx-3">
            {{-- LEFT COLUMN: Invoice, Risk, Demurrage, Remarks --}}
            <div class="col-md-8">
                <div class="card mb-3">
                    <div class="card-body">
                        <h6 class="form-section-title">
                            <i class="ri-file-text-line"></i> E-Way Bill & Invoice Details
                        </h6>

                        <div class="row g-3">

                            {{-- Invoice No --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="invoice_no">
                                    Party Invoice No
                                </label>
                                <input type="text" class="form-control" id="invoice_no" name="invoice_no"
                                    value="{{ old('invoice_no') }}">
                                <div class="text-danger">{{ $errors->first('invoice_no') }}</div>
                            </div>

                            {{-- Invoice Date --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="invoice_date">
                                    Party Invoice Date
                                </label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" class="form-control datepicker" id="invoice_date"
                                        name="invoice_date" value="{{ old('invoice_date') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('invoice_date') }}</div>
                            </div>

                            {{-- Invoice Amount --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="invoice_amount">
                                    Invoice Value
                                </label>
                                <input type="text" class="form-control number" id="invoice_amount"
                                    name="invoice_amount" value="{{ old('invoice_amount') }}">
                                <div class="text-danger">{{ $errors->first('invoice_amount') }}</div>
                            </div>

                            {{-- E-Way Bill No --}}
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="eway_bil_no">
                                    E-Way Bill No
                                </label>
                                <input type="text" class="form-control" id="eway_bil_no" name="eway_bil_no"
                                    value="{{ old('eway_bil_no') }}">
                                <div class="text-danger">{{ $errors->first('eway_bil_no') }}</div>
                            </div>

                            {{-- E-Way Bill Validity --}}
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="eway_bil_validity">
                                    E-Way Valid Upto
                                </label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" class="form-control datepicker" id="eway_bil_validity"
                                        name="eway_bil_validity" value="{{ old('eway_bil_validity') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('eway_bil_validity') }}</div>
                            </div>

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

                <div class="card mb-3">
                    <div class="card-body">
                        <div class="form-section-title">
                            <i class="ri-time-line"></i> Demurrage Charge
                        </div>

                        <div class="row g-3">

                            {{-- Demurrage Charge --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="demurrage_charge">
                                    Demurrage Charge (₹)
                                </label>
                                <input type="text" class="form-control number" id="demurrage_charge"
                                    name="demurrage_charge" value="{{ old('demurrage_charge') }}">
                                <div class="text-danger">{{ $errors->first('demurrage_charge') }}</div>
                            </div>

                            {{-- Demurrage Per --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="demurrage_per">
                                    Per
                                </label>
                                {!! Form::select(
                                    'demurrage_per',
                                    ['' => '--Select--', 'Hour' => 'Per Hour', 'Day' => 'Per Day'],
                                    old('demurrage_per'),
                                    ['class' => 'form-control select2', 'id' => 'demurrage_per'],
                                ) !!}
                                <div class="text-danger">{{ $errors->first('demurrage_per') }}</div>
                            </div>

                            {{-- Applicable After --}}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="demurrage_after">
                                    Applicable After
                                </label>
                                {!! Form::select(
                                    'demurrage_after',
                                    [
                                        '' => '--Select--',
                                        '1 Hour' => '1 Hour',
                                        '2 Hour' => '2 Hour',
                                        '4 Hour' => '4 Hour',
                                        '8 Hour' => '8 Hour',
                                        '1 Day' => '1 Day',
                                        '2 Days' => '2 Days',
                                    ],
                                    old('demurrage_after'),
                                    ['class' => 'form-control select2', 'id' => 'demurrage_after'],
                                ) !!}
                                <div class="text-danger">{{ $errors->first('demurrage_after') }}</div>
                            </div>

                            {{-- Loading Date --}}
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="loading_date">
                                    Loading Date
                                </label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" class="form-control datepicker" id="loading_date"
                                        name="loading_date" value="{{ old('loading_date') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('loading_date') }}</div>
                            </div>

                            {{-- Reporting Date --}}
                            <div class="col-md-6 col-12">
                                <label class="form-label" for="reporting_date">
                                    Reporting Date
                                </label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" class="form-control datepicker" id="reporting_date"
                                        name="reporting_date" value="{{ old('reporting_date') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('reporting_date') }}</div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="mt-3">
                    <label class="form-label fw-bold">Remarks / Narration</label>
                    <textarea name="remark" class="form-control" rows="2" placeholder="Any special instructions..."></textarea>
                </div>
            </div>

            {{-- RIGHT COLUMN: Freight Calculation & Submit --}}
            <div class="col-md-4">
                <div class="card total-card mb-3">
                    <div class="card-body">
                        <h5 class="card-title fw-bold mb-3 text-dark">Freight Calculation</h5>

                        <!-- BASIC FREIGHT -->
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted">Basic Freight</span>
                            <input type="text"
                                class="form-control form-control-sm text-end w-50 fw-bold input-currency" readonly
                                value="0.00" id="Freight" name="freight">
                        </div>

                        <!-- CHARGES -->
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Loading Charge</span>
                            <input type="number" class="form-control form-control-sm text-end w-50"
                                name="loading_charge" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Unloading Charge</span>
                            <input type="number" class="form-control form-control-sm text-end w-50"
                                name="unloading_charge" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Holding Charge</span>
                            <input type="number" class="form-control form-control-sm text-end w-50"
                                name="holding_charge" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Vasuli</span>
                            <input type="number" class="form-control form-control-sm text-end w-50" name="vasuli_charge"
                                placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Kata Charge</span>
                            <input type="number" class="form-control form-control-sm text-end w-50" name="kata_charge"
                                placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Challan / Permission</span>
                            <input type="number" class="form-control form-control-sm text-end w-50"
                                name="challan_charge" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Overload</span>
                            <input type="number" class="form-control form-control-sm text-end w-50"
                                name="overload_charge" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Other Charges</span>
                            <input type="number" class="form-control form-control-sm text-end w-50" name="other_charge"
                                placeholder="0">
                        </div>

                        <hr>

                        <!-- SUB TOTAL -->
                        <div class="d-flex justify-content-between mb-2">
                            <span class="fw-bold">Sub Total</span>
                            <input type="text" id="subTotal" name="sub_total" step="0.001"
                                class="form-control form-control-sm text-end w-50" readonly value="0.00">
                        </div>

                        <!-- GST PAY BY (MISSING EARLIER) -->
                        <div class="mb-2">
                            <label class="form-label small fw-bold">GST Payable By</label>
                            <div class="btn-group w-100" role="group">

                                <input type="radio" class="btn-check" name="gst_pay_by" id="gst_consignor"
                                    value="Consignor" {{ old('gst_pay_by') == 'Consignor' ? 'checked' : '' }}>
                                <label class="btn btn-outline-primary btn-sm" for="gst_consignor">
                                    Consignor
                                </label>

                                <input type="radio" class="btn-check" name="gst_pay_by" id="gst_consignee"
                                    value="Consignee"
                                    {{ old('gst_pay_by', 'Consignee') == 'Consignee' ? 'checked' : '' }}>
                                <label class="btn btn-outline-success btn-sm" for="gst_consignee">
                                    Consignee
                                </label>

                                <input type="radio" class="btn-check" name="gst_pay_by" id="gst_transporter"
                                    value="Transporter" {{ old('gst_pay_by') == 'Transporter' ? 'checked' : '' }}>
                                <label class="btn btn-outline-warning btn-sm" for="gst_transporter">
                                    Transporter
                                </label>

                                <input type="radio" class="btn-check" name="gst_pay_by" id="gst_exempt"
                                    value="Exempt" {{ old('gst_pay_by') == 'Exempt' ? 'checked' : '' }}>
                                <label class="btn btn-outline-primary btn-sm" for="gst_exempt">
                                    Exempt
                                </label>

                            </div>
                        </div>



                        <!-- GST TYPE -->
                        <div class="mb-2">
                            <label class="form-label small fw-bold">GST Type</label>
                            <select class="form-select form-select-sm" name="gst_percent" id="gst_percent">
                                @foreach ($gstSlabs as $slab)
                                    <option value="{{ $slab }}">
                                        @if ($slab == 0)
                                            Nil / Exempt
                                        @else
                                            GST ({{ $slab }}%)
                                        @endif
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="small text-success fw-bold mt-2" id="gstBreakup"></div>
                        <input type="hidden" name="gst_type" id="gst_type">

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted fw-bold">GST Amount</span>
                            <input type="text" id="gstAmount" name="gst_amount" step="0.001"
                                class="form-control form-control-sm text-end w-50" readonly value="0.00">
                        </div>

                        <hr>

                        <!-- ROUND OFF -->
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Round Off (+/-)</span>
                            <input type="number" name="round_off" class="form-control form-control-sm text-end w-50"
                                placeholder="0">
                        </div>

                        <!-- GRAND TOTAL -->
                        <div class="d-flex justify-content-between align-items-center">
                            <h5 class="fw-bold text-primary m-0">Grand Total</h5>
                            <h4 class="fw-bold m-0" step="0.001" id="grandTotal">₹ 0.00</h4>
                            <input type="hidden" name="grand_total" value="0">
                        </div>

                        <!-- COMMISSION -->
                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Commission %</span>
                            <input type="number" name="commission_percent"
                                class="form-control form-control-sm text-end w-50" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Commission Amount</span>
                            <input type="number" name="commission_amount" step="0.001"
                                class="form-control form-control-sm text-end w-50" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Other Deduction</span>
                            <input type="number" name="other_deduction"
                                class="form-control form-control-sm text-end w-50" placeholder="0">
                        </div>

                        <div class="d-flex justify-content-between mb-2">
                            <span class="text-muted small">Net Payable (Truck Owner)</span>
                            <input type="number" name="net_total" step="0.001"
                                class="form-control form-control-sm text-end w-50" placeholder="0" readonly>
                        </div>

                        <!-- HIDE FREIGHT -->
                        <div class="form-check mt-2" style="margin-right: 10px;">
                            <input class="form-check-input" type="checkbox" name="hide_freight" id="hide_freight">
                            <label class="form-check-label small" for="hide_freight">
                                Hide Freight in Final Builty PDF
                            </label>
                        </div>

                    </div>

                    <div class="d-grid gap-2">
                        <button type="submit" class="btn btn-primary btn-lg">
                            <i class="ri-save-line"></i> Save Freight Entry
                        </button>
                    </div>
                </div>
            </div>

            {!! Form::close() !!}
        </div>
    </div>
@endsection

@push('footer_script')
    @include('common.modal.party')
    @include('common.modal.vehicle')
    {{-- @include('common.modal.branch') --}}
    @include('common.modal.driver')
    @include('common.modal.driver-mobile')

    <script src="{{ asset('theme/assets/vendor/daterange/daterange.js') }}"></script>
    <script>
        $('.number').on('keyup', function() {
            this.value = this.value.replace(/\D/g, '');
        });

        // Alphanumeric only
        $('.alphaNum').on('input', function() {
            this.value = this.value.replace(/[^a-zA-Z0-9]/g, '');
        });

        // Float numbers
        $('.floatnumber').on('input', function() {
            this.value = this.value
                .replace(/[^0-9.]/g, '')
                .replace(/(\..*)\./g, '$1');
        });
        // auto-dropdown.js

        $(document).ready(function() {
            let consigneeOptions = $('#consignee_id').html();

            $('#consignor_id').on('change', function() {
                let selected = $(this).val();
                $('#consignee_id').html(consigneeOptions);

                if (selected) {
                    $('#consignee_id option[value="' + selected + '"]').remove();
                }
            });
        });

        function n(val) {
            val = parseFloat(val);
            return isNaN(val) ? 0 : val;
        }

        function f(val) {
            return n(val).toFixed(2);
        }
        // datepicker
        $('.datepicker').daterangepicker({
            singleDatePicker: true,
            locale: {
                format: 'DD-MMMM-YYYY'
            }
        });

        // SHOW / HIDE DRIVER DETAILS
        $('#showDriverDetails').on('change', function() {
            $('.driver-info-box').slideToggle(this.checked);
        });

        $('#hasInsuranceToggle').on('change', function() {
            $('#insuranceBox')
                .toggle(this.checked)
                .find('input').prop('disabled', !this.checked);
        });

        // SET VEHICLE TYPE ON VEHICLE CHANGE
        $('#vehicle_id').on('change', function() {
            $('#vehicle_type').val($(this).find(':selected').data('vehicle-type') || '');
        });

        function calcRow(row) {
            let amount = n(row.find('[name*="[charge_weight]"]').val()) *
                n(row.find('[name*="[rate]"]').val());
            row.find('[name*="[amount]"]').val(f(amount));
            return amount;
        }

        //total of all goods
        function calcGoodsTotals() {

            let totalActual = 0,
                totalCharge = 0,
                basicFreight = 0;

            $('#goodsTableBody tr').each(function() {
                let r = $(this);
                totalActual += n(r.find('[name*="[actual_weight]"]').val());
                totalCharge += n(r.find('[name*="[charge_weight]"]').val());
                basicFreight += n(r.find('[name*="[amount]"]').val());
            });

            $('#totalActualWeight').text(f(totalActual));
            $('#totalChargeWeight').text(f(totalCharge));
            $('#totalBasicFreight').text(f(basicFreight));
            $('#Freight').val(f(basicFreight));

            calcGrandTotal();
        }

        //GRAND TOTAL

        function calcGrandTotal() {

            let freight = n($('#Freight').val());

            let charges =
                n($('[name="loading_charge"]').val()) +
                n($('[name="unloading_charge"]').val()) +
                n($('[name="holding_charge"]').val()) +
                n($('[name="vasuli_charge"]').val()) +
                n($('[name="kata_charge"]').val()) +
                n($('[name="challan_charge"]').val()) +
                n($('[name="overload_charge"]').val()) +
                n($('[name="other_charge"]').val());

            let subTotal = freight + charges;
            $('#subTotal').val(f(subTotal));

            let gstPercent = n($('[name="gst_percent"]').val());
            let gstAmount = (subTotal * gstPercent) / 100;
            $('#gstAmount').val(f(gstAmount));

            let roundOff = n($('[name="round_off"]').val());
            let grandTotal = subTotal + gstAmount + roundOff;

            $('#grandTotal').text('₹ ' + f(grandTotal));
            $('[name="grand_total"]').val(f(grandTotal));

            let commission = n($('[name="commission_amount"]').val());
            let deduction = n($('[name="other_deduction"]').val());

            $('[name="net_total"]').val(f(grandTotal - commission - deduction));
        }

        // COMMISSION CALCULATION
        $('[name="commission_percent"]').on('input', function() {
            let percent = n(this.value);
            let base = n($('#subTotal').val());
            $('[name="commission_amount"]').val(f((base * percent) / 100));
            calcGrandTotal();
        });

        $('[name="commission_amount"]').on('input', calcGrandTotal);


        $(document).on('input',
            '[name*="[charge_weight]"], .rate-input',
            function() {
                calcRow($(this).closest('tr'));
                calcGoodsTotals();
            }
        );

        $(document).on('input',
            '[name="loading_charge"],[name="unloading_charge"],[name="holding_charge"],' +
            '[name="vasuli_charge"],[name="kata_charge"],[name="challan_charge"],' +
            '[name="overload_charge"],[name="other_charge"],[name="round_off"],[name="other_deduction"]',
            calcGrandTotal
        );

        $('[name="gst_percent"]').on('change', calcGrandTotal);

        //MULTIPLE   ROWS ADDING
        let itemIndex = 1;

        $('#addMoreMaterialBtn').on('click', function() {

            $('#goodsTableBody').append(`
        <tr>
            <td><input name="items[${itemIndex}][material_name]" class="form-control"></td>
            <td><input name="items[${itemIndex}][hsn_code]" class="form-control"></td>
            <td>
                <select name="items[${itemIndex}][packing_type]" class="form-select">
                    <option>BOX</option><option>BAG</option><option>BULK</option>
                </select>
            </td>
            <td><input type="number" name="items[${itemIndex}][qty]" class="form-control"></td>
            <td><input type="number" step="0.01" name="items[${itemIndex}][actual_weight]" class="form-control"></td>
            <td>
        <select name="items[${itemIndex}][weight_unit]" class="form-select">
            <option value="">--Unit--</option>
              <!-- Weight -->
            <option value="KG">KG (Kilogram)</option>
           <option value="G">G (Gram)</option>
            <option value="MT">MT (Metric Ton)</option>
            <option value="TON">TON (Ton)</option>
            <option value="LB">LB (Pound)</option>
            <option value="OZ">OZ (Ounce)<
            <!-- Volume -->
            <option value="CBM">CBM (Cubic Meter)</option>
            <option value="CFT">CFT (Cubic Feet)<
            <!-- Liquid -->
            <option value="LTR">LTR (Litre)</option>
            <option value="ML">ML (Millilitre)<
            <!-- Count / Packages -->
            <option value="NOS">NOS (Numbers)</option>
            <option value="PCS">PCS (Pieces)</option>
            <option value="PKT">PKT (Packet)</option>
            <option value="BOX">BOX</option>
            <option value="BAG">BAG</option>
            <option value="DRUM">DRUM</option>
            <option value="CAN">CAN</option>
            <option value="BOTTLE">BOTTLE</option>
            <option value="ROLL">ROLL</option>
            <option value="CRATE">CRATE</option>
            <option value="BUNDLE">BUNDLE</option>
            <option value="PALLET">PALLET</option>
            <option value="CARTON">CARTON</option>
            <option value="BALE">BALE</option>
            <option value="LOOSE">LOOSE</option>
            <option value="BULK">BULK</option>
         </select>
         </td>
            <td><input type="number" step="0.01" name="items[${itemIndex}][charge_weight]" class="form-control"></td>
            <td><input type="number" step="0.01" name="items[${itemIndex}][rate]" class="form-control rate-input"></td>
            <td><input name="items[${itemIndex}][amount]" class="form-control bg-light-input" readonly></td>
            <td><button type="button" class="btn btn-sm btn-danger removeRow">X</button></td>
        </tr>
    `);
            itemIndex++;
        });

        $(document).on('click', '.removeRow', function() {
            $(this).closest('tr').remove();
            calcGoodsTotals();
        });

        $(document).ready(calcGoodsTotals);
    </script>

    <script>
        $(document).ready(function() {

            $('#company_driver').on('change', function() {
                let driverId = $(this).val();

                if (!driverId) {
                    $('.driver-info-box').slideUp();
                    return;
                }

                $.ajax({
                    url: "{{ route('employee.driver.details', '') }}/" + driverId,
                    type: "GET",
                    success: function(data) {


                        $('#driver_name').val(data.employee_name);
                        $('#driver_mobile').val(data.mobile_no);
                        $('#driver_license_no').val(data.driving_licence_no);

                        if (data.driving_licence_valid_upto) {
                            let formattedDate = moment(
                                data.driving_licence_valid_upto,
                                "YYYY-MM-DD"
                            ).format("DD-MMMM-YYYY");

                            $('#driver_license_valid_upto').val(formattedDate);
                        }

                        // $('#showDriverDetails').prop('checked', true);
                        $('.driver-info-box').slideDown();
                    }
                });
            });

        });
    </script>
    {{-- Party Details Auto Fill --}}
    <script>
        $(document).ready(function() {

            function fillParty(prefix, data) {
                $('#' + prefix + '_gst_no').val(data.gst_no ?? '');
                $('#' + prefix + '_mobile').val(data.mobile ?? '');
                $('#' + prefix + '_address').val(data.address ?? '');
                $('#' + prefix + '_city').val(data.city ?? '');
                $('#' + prefix + '_state').val(data.state ?? '');
                $('#' + prefix + '_pan').val(data.pan ?? '');
                $('#' + prefix + '_email').val(data.email ?? '');
            }

            // CONSIGNOR AUTO FILL
            $('#consignor_id').on('change', function() {

                let id = $(this).val();
                if (!id) return;

                $.ajax({
                    url: "{{ route('party.details', '') }}/" + id,
                    type: 'GET',
                    success: function(data) {
                        fillParty('consignor', data);
                    }
                });
            });

            // CONSIGNEE AUTO FILL
            $('#consignee_id').on('change', function() {

                let id = $(this).val();
                if (!id) return;

                $.ajax({
                    url: "{{ route('party.details', '') }}/" + id,
                    type: 'GET',
                    success: function(data) {
                        fillParty('consignee', data);
                    }
                });
            });

        });
        //gst breakup calculation
        function showGstBreakup() {

            let gstMode = "{{ optional($taxSettings)->enable_gst_type }}";

            if (gstMode === 'rcm') {
                $('#gst_type').val('RCM');
                $('#gstBreakup').html('Nil (On Reverse Charge)');
                return;
            }

            let gstPercent = parseFloat($('#gst_percent').val()) || 0;
            let subTotal = parseFloat($('#subTotal').val()) || 0;

            let consignorState = $('#consignor_state').val();
            let consigneeState = $('#consignee_state').val();

            if (!consignorState || !consigneeState) return;

            let gstAmount = (subTotal * gstPercent) / 100;
            let html = '';

            if (consignorState === consigneeState) {

                $('#gst_type').val('CGST_SGST');

                let half = gstAmount / 2;

                html = `
            SGST (${gstPercent/2}%): ${half.toFixed(2)} ₹<br>
            CGST (${gstPercent/2}%): ${half.toFixed(2)} ₹<br>
            Total: ${gstAmount.toFixed(2)} ₹
        `;
            } else {

                $('#gst_type').val('IGST');

                html = `
            IGST (${gstPercent}%): ${gstAmount.toFixed(2)} ₹<br>
            Total: ${gstAmount.toFixed(2)} ₹
        `;
            }

            $('#gstBreakup').html(html);
        }
        $('#gst_percent').on('change', showGstBreakup);
        $('#consignor_id, #consignee_id').on('change', function() {
            setTimeout(showGstBreakup, 300);
        });

        $(document).ready(showGstBreakup);
    </script>
@endpush