@extends("admin.template.layout")

@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="card" id="FormDiv">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">{{$mode." " ?? $page_heading.' '}}<span class="specificTest"></span></h5>

            </div>
            <form id="admin_form" method="post" action="{{route('venues.update',encrypt($venue->id))}}"
                  enctype="multipart/form-data">
                <div class="card-body">
                    @csrf()

                    <div class="row">
                        <div class="col-md-12">
                            <div class="mb-3">
                                <label class="form-label" for="bs-validation-name">Name<span
                                        class="text-danger">*</span> <small>(Max 16 characters)</small></label>
                                <input
                                    type="text"
                                    class="form-control jqv-input" data-jqv-required="true"
                                    id="name"
                                    name="name"
                                    maxlength="16"
                                    value="{{$venue->name}}"
                                />

                            </div>
                            <div class="mb-3 row">
                                <div class="col-md-6">
                                    <label class="form-label" for="bs-validation-name">Venue Type<span
                                            class="text-danger">*</span></label>
                                    <select class="form-control jqv-input"
                                            name="type_id">
                                        <option value="">Venue Type</option>
                                        @if(!empty($venue_type))
                                            @foreach($venue_type as $type)
                                                <option
                                                    value="{{$type->id}}" {{$type->id==$venue->type_id?'selected':''}}>{{$type->name}}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-label" for="bs-validation-name">Select Location</label>
                                    <select class="form-control jqv-input"
                                            name="location_id">
                                        <option value="">Select Location</option>
                                        @if(!empty($locations))
                                            @foreach($locations as $location)
                                                <option
                                                    value="{{$location->id}}" {{$location->id==$venue->location_id?'selected':''}}>{{$location->name}}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>

                            <div class="mb-3">
                                <label class="form-label" for="bs-validation-name">Image<span
                                        class="text-danger">*</span></label>
                                <input
                                    type="file"
                                    class="form-control jqv-input form-control-file" data-jqv-required="true"
                                    id="event_image"
                                    name="image"
                                    accept="image/*"
                                />
                                <div id="image_preview" class="text-center">
                                    <img src="{{$venue->image}}" style="max-height: 250px"
                                         class="img-fluid">
                                </div>
                            </div>

                        </div>


                        <div class="col-xs-12 col-sm-12">
                            <div class="mb-3 row">
                                <div class="col-md-6">
                                    <label for="" class="form-label">Address<span class="text-danger">*</span></label>
                                    <input type="text" class="form-control jqv-input" data-jqv-required="true"
                                           name="address" value="{{$venue->address}}">
                                </div>
                                <div class="col-md-6">
                                    <label for="" class="form-label">Phone<span class="text-danger">*</span></label>
                                    <input type="number" class="form-control jqv-input phone" data-jqv-required="true"
                                           name="phone" value="{{$venue->phone}}">
                                </div>

                            </div>
                            <div class="mb-3 row">
                                <div class="col-md-6">
                                    <label class="form-label" for="bs-validation-name">Country<span class="text-danger">*</span></label>
                                    <select class="form-control jqv-select" data-jqv-required="true" id="country"
                                            name="venue_country_id">
                                        <option value="">Select Country</option>
                                        @foreach($countries as $country)
                                            <option value="{{$country->country_id}}"
                                                    @if($country->country_id == $venue->country_id) selected @endif>{{$country->country_name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-label" for="bs-validation-name">City<span
                                            class="text-danger">*</span></label>
                                    <input type="text"
                                           class="form-control jqv-input" data-jqv-required="true"
                                           id="city"
                                           name="city"
                                           value="{{$venue->city}}"
                                    />
                                </div>
                            </div>
                            <div class="mb-3">
                                <label class="form-label" for="bs-validation-name">Overview<span
                                        class="text-danger">*</span></label>
                                <input type="text" name="food_or_service" class="form-control jqv-input"
                                       value="{{$venue->food_or_service}}">
                            </div>
                            <div class="mb-3">
                                <label class="form-label" for="bs-validation-name">Details<span
                                        class="text-danger">*</span></label>
                                <textarea
                                    id="about"
                                    name="description"
                                    rows="4"
                                    class="form-control jqv-input" data-jqv-required="true"
                                >{{$venue->description}}</textarea>
                            </div>
                            <div class="storeSpecific">
                                <div class="mb-2 ml-3">
                                    <label for="giftCheck" class="form-label">Enable Gifting</label>
                                    <input type="hidden" name="is_gifting_enabled"
                                           value="{{$venue->is_gifting_enabled}}">
                                    <div class="form-check form-switch">
                                        <label
                                            class="form-check-label switch s-icons s-outline s-outline-warning mb-4 mr-2"
                                            for="giftCheck">
                                            <input {{$venue->is_gifting_enabled?'checked':''}} type="checkbox"
                                                   class="form-check-input" id="giftCheck" data-role="active-switch">
                                            <span class="slider round"></span>
                                            <span class="switch-text"></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="enableGift" style="display: none;">
                                    <div class="row">
                                        <div class="col-md-12 card-body">
                                            <div class="card">
                                                <div class="card-body">
                                                    <div class="mb-3 row">

                                                        <div class="col-md-12">
                                                            <label for="venue-code" class="form-label">Venue Code<span
                                                                    class="text-danger">*</span></label>
                                                            <input type="text" name="venue_code"
                                                                   class="form-control jqv-input"
                                                                   value="{{$venue->venue_code}}" readonly>
                                                        </div>
                                                    </div>
                                                    <div class="row mb-3">
                                                        <div class="col-xs-12 col-sm-6">
                                                            <label class="form-label" for="bs-validation-name">Commission
                                                                (%)<span class="text-danger">*</span></label>
                                                            <input type="number" id="commission" step="any"
                                                                   class="form-control jqv-input"
                                                                   data-jqv-required="true" name="commission_percentage"
                                                                   value="{{$venue->commission_percentage}}">
                                                        </div>
                                                    </div>
                                                    <h3>Bank Information</h3>
                                                    <div class="mb-3 mt-3">
                                                        <label for="bankName" class="form-label">Country<span
                                                                class="text-danger">*</span></label>
                                                        <select name="country_id" class="form-control country select2">
                                                            <option value="">Select Country</option>
                                                            @if(!empty($countries))
                                                                @foreach($countries as $country)
                                                                    <option
                                                                        value="{{$country->country_id}}">{{$country->country_name}}</option>
                                                                @endforeach
                                                            @endif
                                                        </select>
                                                    </div>
                                                    <div class="mb-3 mt-3">
                                                        <label for="bankName" class="form-label">Bank<span
                                                                class="text-danger">*</span></label>
                                                        <div id="banks">
                                                            <select name="bank_id" class="form-control">
                                                                <option value="">Select Bank</option>
                                                                @if(!empty($bank))
                                                                    <option
                                                                        value="{{$bank->id}}" {{$bank->id == $venue->bank_id ? 'selected' : ''}}>{{$bank->name}}</option>
                                                                @endif
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="mb-3 mt-3">
                                                        <label for="bankHolderName" class="form-label">Account Holder
                                                            Name<span class="text-danger">*</span></label>
                                                        <input type="text" class="form-control" id="bankHolderName"
                                                               name="account_holder_name"
                                                               value="{{$venue->account_holder_name}}">
                                                    </div>
                                                    <div class="mb-3 mt-3">
                                                        <label for="ibanNo" class="form-label">Account Number<span
                                                                class="text-danger">*</span></label>
                                                        <input type="number" class="form-control" id="account_number"
                                                               name="account_number" value="{{$venue->account_number}}">
                                                    </div>
                                                    <div class="mb-3 mt-3">
                                                        <label for="ibanNo" class="form-label">IBAN<span
                                                                class="text-danger">*</span></label>
                                                        <input type="number" class="form-control" id="ibanNo"
                                                               name="iban_no" value="{{$venue->iban_no}}">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-lg-12 card-body product-form">
                                            <div class="card">
                                                <div class="card-body">
                                                    <h3>Add Products</h3>
                                                    <div id="productForm">
                                                        <div class="product-forms">
                                                            <div class="mb-2">
                                                                <div class="row mb-1">
                                                                    <div class="col-md-6">
                                                                        <label for="category" class="form-label">Category<span
                                                                                class="text-danger">*</span></label>
                                                                        <select class="form-control"
                                                                                id="product_category">
                                                                            <option value="">Select a category</option>
                                                                            @if(!empty($categories))
                                                                                @foreach($categories as $category)
                                                                                    <option
                                                                                        value="{{$category->category_id}}">{{$category->category_name}}</option>
                                                                                @endforeach
                                                                            @endif
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-md-6">
                                                                        <label for="name" class="form-label">Product
                                                                            Name<span
                                                                                class="text-danger">*</span></label>
                                                                        <input type="text" class="form-control"
                                                                               id="product_name">
                                                                    </div>
                                                                </div>
                                                                <div class="row mb-3">
                                                                    <div class="col-md-5">
                                                                        <label for="price" class="form-label">Product
                                                                            Price<span
                                                                                class="text-danger">*</span></label>
                                                                        <input type="number" class="form-control"
                                                                               id="product_price">
                                                                    </div>
                                                                    <div class="col-md-5 d-none">
                                                                        <label for="image" class="form-label">Product
                                                                            Image<span
                                                                                class="text-danger">*</span></label>
                                                                        <input type="file"
                                                                               class="form-control form-control-file"
                                                                               id="product_image" accept="image/*">
                                                                    </div>
                                                                    <div class="col-md-5">
                                                                        <label for="status" class="form-label">Product
                                                                            Status<span
                                                                                class="text-danger">*</span></label>
                                                                        <select class="form-control"
                                                                                id="product_status">
                                                                            <option value="1">Active</option>
                                                                            <option value="0">Inactive</option>
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-md-2">
                                                                        <label for="allowmembers"
                                                                               class="form-label mt-2">Is
                                                                            Trending?</label>
                                                                        <input type="hidden" id="is_trendings"
                                                                               name="is_trendings[]">
                                                                        <div class="form-check form-switch">
                                                                            <label
                                                                                class="form-check-label switch s-icons s-outline s-outline-warning mb-4 mr-2"
                                                                                for="allowmembers">
                                                                                <input type="checkbox"
                                                                                       class="form-check-input"
                                                                                       id="allowmembers"
                                                                                       data-role="active-switch">
                                                                                <span class="slider round"></span>
                                                                                <span class="switch-text"></span>
                                                                            </label>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="mb-3 row">
                                                                    <div class="col-md-12">
                                                                        <label for="description" class="form-label">Product
                                                                            Description<span
                                                                                class="text-danger">*</span></label>
                                                                        <textarea class="form-control"
                                                                                  id="product_description"
                                                                                  name="product_description"
                                                                                  rows="3"></textarea>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div id="hiddenInputs">
                                                            <input type="hidden" name="product_count" value="0">
                                                        </div>
                                                        <a type="button" class="btn btn-sm btn-primary mt-3"
                                                           id="addProductBtn">Save Product</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-12 card-body">
                                            <div class="card">
                                                <div class="card-body">

                                                    <table class="table table-striped table-hover">
                                                        <thead>
                                                        <tr>
                                                            <th>Category</th>
                                                            <th>Name</th>
                                                            <th>Price</th>
                                                            <th>Description</th>
                                                            <th>Image</th>
                                                            <th>Status</th>
                                                            <th>Action</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="productTable">
                                                        @if($venue->products->count()>0)
                                                            @foreach($venue->products as $product)
                                                                <tr>
                                                                    <td>{{$product->Category->category_name}}</td>
                                                                    <td>{{$product->name}}</td>
                                                                    <td>{{$product->price}}</td>
                                                                    <td>{{$product->description}}</td>
                                                                    <td><img src="{{asset($product->image)}}" width="35"
                                                                             height="35"></td>
                                                                    <td>{{$product->status?'Active':'InActive'}}</td>
                                                                    <td>
                                                                        <a href="{{route('venues.product.delete',encrypt($product->id) )}}"
                                                                           onclick="return confirm('Are you sure you want to delete this item?');"><i
                                                                                class='bx bx-trash'></i></a></td>
                                                                </tr>
                                                            @endforeach
                                                        @endif
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>

                                    </div>


                                </div>
                            </div><!--gift end-->


                            @php
                                $map_address = 'map_address';
                                $latitude = $venue->latitude;
                                $longitude = $venue->longitude;
                                $map_address = $venue->map_address;
                            @endphp
                            <div class="mb-3">
                                <x-elements.map-location
                                    mapHeight="400px"
                                    :includeCdn="false"
                                    addressFieldName="map_address"
                                    :address="$map_address"
                                    :lat="$latitude"
                                    :lng="$longitude"
                                />
                            </div>
                        </div>


                    </div>
                    <div class="col-xs-12 col-sm-6 mt-3">
                        <div class="row">
                            <div class="col-12">
                                <button type="submit" class="main-btn primary-btn btn-hover" disabled>
                                    Submit
                                </button>
                            </div>
                        </div>

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

    </div>

    <!-- Modal -->
    <div class="modal fade" id="ZoneInsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Zone Setup Instruction</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <x-elements.map-polygon-instruction/>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

@stop

@section('script')

    <script>
        document.addEventListener("DOMContentLoaded", function () {
            $('.country').on('change', function () {
                var countryId = $(this).val();
                $.ajax({
                    url: "{{ route('venues.fetch_banks') }}",
                    method: 'GET',
                    data: {country_id: countryId},
                    success: function (response) {
                        $('#banks').html(response);
                    },
                    error: function (xhr) {
                        // handle the error here
                    }
                });
            });
            $('#product_price,.phone, #commission, #account_number, #ibanNo').on('keydown', function (event) {
                if (event.keyCode === 69 || event.keyCode === 189 || event.keyCode === 190) {
                    event.preventDefault();
                }
            });
            $('.form-control').on('input', function () {
                $(this).siblings('.error').hide();
            });
            let products = [];

            document.getElementById("addProductBtn").addEventListener("click", function () {
                const productForm = document.getElementById("productForm");
                const category = document.getElementById("product_category");
                const name = document.getElementById("product_name");
                const price = document.getElementById("product_price");
                //const image = document.getElementById("product_image");
                const description = document.getElementById("product_description");
                const status = document.getElementById("product_status");
                const is_trending = document.getElementById("is_trendings");

                let isValid = true;
                if (!category.value) {
                    category.classList.add("is-invalid");
                    isValid = false;
                } else {
                    category.classList.remove("is-invalid");
                }
                if (!name.value) {
                    name.classList.add("is-invalid");
                    isValid = false;
                } else {
                    name.classList.remove("is-invalid");
                }
                if (!price.value) {
                    price.classList.add("is-invalid");
                    isValid = false;
                } else {
                    price.classList.remove("is-invalid");
                }
                if (!description.value) {
                    description.classList.add("is-invalid");
                    isValid = false;
                } else {
                    description.classList.remove("is-invalid");
                }
                // if (!image.value) {
                //     image.classList.add("is-invalid");
                //     isValid = false;
                // } else {
                //     image.classList.remove("is-invalid");
                // }
                if (!status.value) {
                    status.classList.add("is-invalid");
                    isValid = false;
                } else {
                    status.classList.remove("is-invalid");
                }

                if (isValid) {

                    const categoryName = category.options[category.selectedIndex].text;
                    const product = {
                        category: category.value,
                        name: name.value,
                        price: price.value,
                        description: description.value,
                        //image: image.value,
                        status: status.value,
                        is_trending: is_trending.value,
                    };

                    products.push(product);

                    category.value = "";
                    name.value = "";
                    price.value = "";
                    description.value = "";
                    //image.value = "";
                    status.value = "1";

                    const productTable = document.getElementById("productTable");
                    const productRow = productTable.insertRow(-1);

                    const categoryCell = productRow.insertCell(0);
                    const nameCell = productRow.insertCell(1);
                    const priceCell = productRow.insertCell(2);
                    const descriptionCell = productRow.insertCell(3);

                    const imageCell = productRow.insertCell(4);

                    const statusCell = productRow.insertCell(5);
                    const removeCell = productRow.insertCell(6);

                    const categoryInput = document.createElement("input");
                    categoryInput.type = "hidden";
                    categoryInput.name = "product_category[]";
                    categoryInput.value = product.category;

                    const nameInput = document.createElement("input");
                    nameInput.type = "hidden";
                    nameInput.name = "product_name[]";
                    nameInput.value = product.name;

                    const priceInput = document.createElement("input");
                    priceInput.type = "hidden";
                    priceInput.name = "product_price[]";
                    priceInput.value = product.price;

                    const descriptionInput = document.createElement("input");
                    descriptionInput.type = "hidden";
                    descriptionInput.name = "product_description[]";
                    descriptionInput.value = product.description;

                    const statusInput = document.createElement("input");
                    statusInput.type = "hidden";
                    statusInput.name = "product_status[]";
                    statusInput.value = product.status;

                    const isTrendingInput = document.createElement("input");
                    isTrendingInput.type = "hidden";
                    isTrendingInput.name = "is_trending[]";
                    isTrendingInput.value = product.is_trending;

                    categoryCell.textContent = categoryName;
                    categoryCell.appendChild(categoryInput);

                    nameCell.textContent = product.name;
                    nameCell.appendChild(nameInput);

                    priceCell.textContent = product.price;
                    priceCell.appendChild(priceInput);

                    descriptionCell.textContent = product.description;
                    descriptionCell.appendChild(descriptionInput);

                    statusCell.textContent = ((product.status == 1) ? 'Active' : 'Inactive');
                    statusCell.appendChild(statusInput);

                    //imageCell.textContent = product.image;

                    //to be fixed
                    const imageInput = document.getElementById("product_image").cloneNode(true);
                    imageInput.name = "product_image[]";
                    imageInput.setAttribute('required', 'true');
                    //imageInput.value = imageInput.files[0];//URL.createObjectURL(imageInput.files[0]);
                    imageCell.appendChild(imageInput);

                    //const imagePreview = document.createElement("img");
                    // imagePreview.setAttribute("src", URL.createObjectURL(imageInput.files[0]));
                    // imagePreview.style.maxHeight = "100px";
                    // imagePreview.style.maxWidth = "100px";
                    // imageCell.appendChild(imagePreview);

                    const removeButton = document.createElement("a");
                    removeButton.type = "a";
                    removeButton.innerHTML = "<i class='bx bx-trash'></i>";
                    removeButton.setAttribute('href', 'javascript:;');
                    removeButton.addEventListener("click", () => {
                        productTable.deleteRow(productRow.rowIndex);
                    });
                    removeCell.appendChild(removeButton);
                    removeButton.addEventListener("click", () => {
                        const rowIndex = productRow.rowIndex;
                        productTable.deleteRow(productRow.rowIndex - 1);

                    });

                }
            });
        });

    </script>



    <script>


        $('.storeSpecific').show();


        const fileInput = document.getElementById("event_image");
        const preview = document.getElementById("image_preview");

        fileInput.addEventListener("change", () => {
            const file = fileInput.files[0];
            if (file) {
                const reader = new FileReader();
                reader.readAsDataURL(file);
                reader.onload = () => {
                    preview.innerHTML = `<img src="${reader.result}"  style="max-height: 250px" class="img-fluid" alt="File preview">`;
                };
            } else {
                preview.innerHTML = "No file selected";
            }
        });

        $('.all-select').click(function () {
            $(this).siblings('.crud-items').prop('checked', this.checked);
        });
        $('.crud-items').click(function () {
            $(this).siblings('.all-select').prop('checked', false);
        });
        $('.all-p').click(function () {
            $(this).siblings('.reader').prop('checked', true);
        });
        App.initFormView();
        let form_in_progress = 0;

        $('body').off('submit', '#admin_form');
        $('body').on('submit', '#admin_form', function (e) {
            e.preventDefault();
            var validation = $.Deferred();
            var $form = $(this);
            var formData = new FormData(this);

            $form.validate({
                rules: {},
                errorElement: 'div',
                errorPlacement: function (error, element) {
                    element.addClass('is-invalid');
                    error.addClass('error');
                    error.insertAfter(element);
                }
            });

            // Bind extra rules. This must be called after .validate()
            App.setJQueryValidationRules('#admin_form');

            if ($form.valid()) {
                validation.resolve();
            } else {
                var error = $form.find('.is-invalid').eq(0);
                $('html, body').animate({
                    scrollTop: (error.offset().top - 100),
                }, 500);
                validation.reject();
            }

            validation.done(function () {
                $form.find('.is-invalid').removeClass('is-invalid');
                $form.find('div.error').remove();


                App.button_loading(true);


                form_in_progress = 1;
                $.ajax({
                    type: "POST",
                    enctype: 'multipart/form-data',
                    url: $form.attr('action'),
                    data: formData,
                    processData: false,
                    contentType: false,
                    cache: false,
                    timeout: 600000,
                    dataType: 'html',
                    success: function (res) {
                        res = JSON.parse(res);
                        console.log(res['status']);
                        form_in_progress = 0;
                        App.button_loading(false);
                        if (res['status'] == 0) {
                            if (typeof res['errors'] !== 'undefined') {
                                var error_def = $.Deferred();
                                var error_index = 0;
                                jQuery.each(res['errors'], function (e_field, e_message) {
                                    if (e_message != '') {
                                        var $input = $('[name="' + e_field + '"]').eq(0);
                                        $input.addClass('is-invalid');
                                        var $errorDiv = $('<div class="error">' + e_message + '</div>');
                                        if ($input.hasClass('select2')) {
                                            $input.next('.select2-container').after($errorDiv);
                                        } else {
                                            $errorDiv.insertAfter($input);
                                        }
                                        if (error_index == 0) {
                                            error_def.resolve();
                                        }
                                        error_index++;
                                    }
                                });
                                error_def.done(function () {
                                    var error = $form.find('.is-invalid').eq(0);
                                    $('html, body').animate({
                                        scrollTop: (error.offset().top - 100),
                                    }, 500);
                                });

                            } else {
                                var m = res['message'] || 'Unable to save variation. Please try again later.';
                                App.alert(m, 'Oops!', 'error');
                            }
                        } else {
                            App.alert(res['message'] || 'Record saved successfully', 'Success!', 'success');
                            setTimeout(function () {
                                window.location.href = res['oData']['redirect'];
                            }, 2500);

                        }

                    },
                    error: function (e) {
                        form_in_progress = 0;
                        App.button_loading(false);
                        console.log(e);
                        App.alert("Network error please try again", 'Oops!', 'error');
                    }
                });
            });
        });
        $(document).ready(function () {
            $(window).keydown(function (event) {
                if (event.keyCode == 13) {
                    event.preventDefault();
                    return false;
                }
            });

            // for hide and show gifting
            @php if($venue->is_gifting_enabled=='1'):@endphp
            $(".enableGift").show(300);
            @php else:
            @endphp
            $(".enableGift").hide();
            @php endif; @endphp

            $('#giftCheck').change(function () {
                if ($(this).is(":checked")) {
                    $(".enableGift").show(300);
                    const isGiftingEnabledInput = document.querySelector('input[name="is_gifting_enabled"]');
                    isGiftingEnabledInput.value = '1';
                } else {
                    $(".enableGift").hide(200);
                    const isGiftingEnabledInput = document.querySelector('input[name="is_gifting_enabled"]');
                    isGiftingEnabledInput.value = '0';
                }

            });
        });
    </script>
@stop

@section('header')
    <style>
        .is-invalid {
            border-color: #dc3545 !important;
            padding-right: calc(1.5em + .75rem);
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23dc3545' d='M7.354 0l.353.354-7 7-.354.353-.354-.353-7-7 .354-.353 7 7 7-7z'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: center right calc(.375em + .1875rem);
            background-size: calc(.75em + .375rem) calc(.75em + .375rem);
        }
    </style>

@stop