@if (!Permit::isPermit(Route::current()->uri(),'create'))
<div class="alert alert-danger">You are not allowed to access this section.</div>
@else
<!-- Error display container -->

<script src="https://cdn.jsdelivr.net/npm/@yaireo/tagify"></script>
<script src="https://cdn.jsdelivr.net/npm/@yaireo/tagify/dist/tagify.polyfills.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/@yaireo/tagify/dist/tagify.css" rel="stylesheet" type="text/css" />
<div id="error-messages" class="alert alert-danger d-none"></div>
<!-- Basic Horizontal form layout section start -->
<form id="trendingForm" action="{{ route('vehicle-manufacturer.store') }}" class="form-horizontal" method="POST" autocomplete="off" enctype="multipart/form-data">
    @csrf
    <section>
        <div class="card">
            <div class="card-header">
                <h4 class="card-title">Add Manufacturer</h4>
            </div>
            <div class="card-content">
                <div class="card-body">
                    <div class="form-body">
                        <div class="row">
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Manufacturer Name')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="manufacturer_name" class="form-control"
                                                    name="manufacturer_name" value="{{ old('manufacturer_name') }}"
                                                    required autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Manufacturer Name(Arabic)')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="name_arabic" class="form-control"
                                                    name="name_arabic" value="{{ old('name_arabic') }}"
                                                    required autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Manufacturer Name(Tags)')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                            <input type="text" id="tags" class="tag-input"
                                                    name="tags" value="{{ old('tags') }}"
                                                    required autocomplete="off">
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Logo')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <fieldset class="form-group">
                                            <div class="custom-file">
                                                <input type="file" class="custom-file-input" id="make_logo" name="make_logo">
                                                <label class="custom-file-label" for="make_logo">Choose file</label>
                                            </div>
                                        </fieldset>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Tawuniya Id')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="vendor_make_id" class="form-control"
                                                    name="vendor_make_id" value="{{ old('vendor_make_id') }}"
                                                    autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Tawuniya Title')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="vendor_title" class="form-control"
                                                    name="vendor_title" value="{{ old('vendor_title') }}"
                                                    autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Tawuniya Title(Arabic)')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="vendor_title_arabic" class="form-control"
                                                    name="vendor_title_arabic" value="{{ old('vendor_title_arabic') }}"
                                                    autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Elm Id')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" id="elm_id" class="form-control"
                                                    name="elm_id" value="{{ old('elm_id') }}"
                                                    autocomplete="off">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Elm Title')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                            <input type="text" id="elm_title" class="tag-input"
                                                    name="elm_title" value="{{ old('elm_title') }}"
                                                    autocomplete="off">
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Sort #')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="number" id="sort" class="form-control"
                                                    name="sort" value="{{ old('sort') }}"
                                                    autocomplete="off" min="1">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Stock Life Time')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="number" id="stock_life_time" class="form-control"
                                                    name="stock_life_time" value="{{ old('stock_life_time') }}"
                                                    autocomplete="off" min="1">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Trend Price Percentage')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="number" id="trend_price_percentage" class="form-control"
                                                    name="trend_price_percentage" value="{{ old('trend_price_percentage') }}"
                                                    autocomplete="off" min="1">
                                            <div class="form-control-position">
                                                <i class="feather icon-info"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-12 mb-4">
                                <div class="block-content block-content-full text-right border-top pt-1">
                                    <button type="submit" class="btn btn-primary"><i
                                                class="fa fa-check mr-1"></i>{{__('Save')}}</button>
                                    <button class="btn btn-secondary" data-bs-dismiss="offcanvas" aria-label="Close">{{__('Cancel & Back')}}</button>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</form>
<script>
    // Select all elements with the class "tag-input"
    document.querySelectorAll('.tag-input').forEach(function (input) {
        var tagify = new Tagify(input);
    });
</script>
@endif