@extends('layouts.app')

@section('title') Welcome to Suzuki UAE - Get A Quote  @endsection
@section('meta')
<meta name="title" content="Get A Quote | Vehicle Prices & Offers | Suzuki"/>
<meta name="description" content="Request a quote for Suzuki vehicles in UAE. Explore pricing, offers, and financing options on sedans, hatchbacks, SUVs, and more. Get your personalized quote today."/>
@endsection
<link rel="stylesheet" href="css/custom.css">

@section('content')

    <section class="vehicle-info section space-y-16 xxl:space-y-24">

        <div class="md:max-w-screen-xl mx-auto px-5 xxl:px-0 text-gray-800 mt-16 lg:mt-12">

            <div class="flex flex-wrap lg:flex-no-wrap">
                {{-- <div class="w-full lg:w-auto whitespace-no-wrap bg-gray-200 rounded-xl lg:flex items-center lg:py-64 overflow-x-auto lg:overflow-x-visible scrollbar-none mb-5 lg:mb-0">
                    <x-forms-side-nav />
                </div> --}}
                <div class="w-full flex items-center">
                    <div class="lg:px-12 w-full">
                        {{-- <get-quote></get-quote> --}}
                        <!-- Note :
                        - You can modify the font style and form style to suit your website.
                        - Code lines with comments Do not remove this code are required for the form to work properly, make sure that you do not remove these lines of code.
                        - The Mandatory check script can modified as to suit your business needs.
                        - It is important that you test the modified form before going live.-->
                        <div id='crmWebToEntityForm' class='zcwf_lblLeft crmWebToEntityForm zoho-form-style'>
                            <meta name='viewport' content='width=device-width, initial-scale=1.0'>
                            <META HTTP-EQUIV='content-type' CONTENT='text/html;charset=UTF-8'>
                            <form id='webform6605568000000527843' action='https://crm.zoho.com/crm/WebToLeadForm' name=WebToLeads6605568000000527843 method='POST' onSubmit='javascript:document.charset="UTF-8"; return checkMandatory6605568000000527843()' accept-charset='UTF-8'>
                                <input type='text' style='display:none;' name='xnQsjsdp' value='f07e0dc2510b099f3ea316f619e047fe8a04b96c6a32656fa40471f95da8c14c'>
                                </input>
                                <input type='hidden' name='zc_gad' id='zc_gad' value=''>
                                </input>
                                <input type='text' style='display:none;' name='xmIwtLD' value='8fe81c62824a15f83512893777dd514abaaaeb7b6809ea18f93fd93e744d1a72cf6e7061537b1916fec06a54b0416444'>
                                </input>
                                <input type='text' style='display:none;' name='actionType' value='TGVhZHM='>
                                </input>
                                <input type='text' style='display:none;' name='returnURL' value='{{ url()->full() }}'>
                                </input>

                                <h1 class="text-xl md:text-3xl suzuki-bold text-gray-900 mb-5">Get a Quote</h1>

                                <div class='zcwf_row form-inner'>

                                    <div class="input-field full-width">
                                        <div class='zcwf_col_lab'>
                                            <label class="label" for='LEADCF13'>Selected Model <span style='color:red;'>*</span></label>
                                        </div>
                                        <div class='zcwf_col_fld'>
                                            <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF13' onChange='addAriaSelected6605568000000527843()' aria-required='true' aria-label='LEADCF13' name='LEADCF13' multiple >
                                                <option value='Fronk'>
                                                    Fronk
                                                </option>
                                                <option value='Jimny&#x20;5-door'>
                                                    Jimny 5-door
                                                </option>
                                                <option value='Baleno'>
                                                    Baleno
                                                </option>
                                                <option value='Swift'>
                                                    Swift
                                                </option>
                                                <option value='Jimny'>
                                                    Jimny
                                                </option>
                                                <option value='Vitara'>
                                                    Vitara
                                                </option>
                                                <option value='Dzire'>
                                                    Dzire
                                                </option>
                                                <option value='Ertiga'>
                                                    Ertiga
                                                </option>
                                                <option value='Ciaz'>
                                                    Ciaz
                                                </option>
                                                <option value='Grand&#x20;Vitara'>
                                                    Grand Vitara
                                                </option>
                                            </select>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='Salutation'>Salutation <span style='color:red;'> * </span></label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='Salutation' onChange='addAriaSelected6605568000000527843()' aria-required='true' aria-label='Salutation' name='Salutation'>
                                                    <option value='Select option'>
                                                        Select option
                                                    </option>
                                                    <option value='Mr.'>
                                                        Mr.
                                                    </option>
                                                    <option value='Mrs.'>
                                                        Mrs.
                                                    </option>
                                                    <option value='Ms.'>
                                                        Ms.
                                                    </option>
                                                    <option value='Dr.'>
                                                        Dr.
                                                    </option>
                                                    <option value='Prof.'>
                                                        Prof.
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='LEADCF6'>Sale Type </label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF6' onChange='addAriaSelected6605568000000527843()' aria-required='false' aria-label='LEADCF6' name='LEADCF6'>
                                                    <option value='Sale Type'>
                                                        Sale Type *
                                                    </option>
                                                    <option value='Individual'>
                                                        Individual
                                                    </option>
                                                    <option value='Company'>
                                                        Company
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='First_Name'> First Name <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' id='First_Name' aria-required='true' aria-label='First Name' name='First Name' aria-valuemax='40' maxlength='40' placeholder="First Name *">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='Last_Name'> Last Name <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' id='Last_Name' aria-required='true' aria-label='Last Name' name='Last Name' aria-valuemax='80' maxlength='80' placeholder="Last Name *">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='Email'> Email </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' ftype='email' autocomplete='false' id='Email' aria-required='false' aria-label='Email' name='Email' aria-valuemax='100' crmlabel='' maxlength='100' placeholder="Email">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='Mobile'> Mobile Number <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' id='Mobile' aria-required='true' aria-label='Mobile' name='Mobile' aria-valuemax='30' maxlength='30' placeholder="Mobile Number *">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='Phone'> Phone <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' id='Phone' aria-required='true' aria-label='Phone' name='Phone' aria-valuemax='30' maxlength='30' placeholder="Phone Number *">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='LEADCF7'> Age <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <input type='text' id='LEADCF7' aria-required='true' aria-label='LEADCF7' name='LEADCF7' aria-valuemax='255' maxlength='255' placeholder="Age *">
                                            </input>
                                            <div class='zcwf_col_help'></div>
                                        </div>
                                    </div>


                                    <div class="input-field">
                                        <label class="label hide" for='LEADCF3'> Emirate <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF3' onChange='addAriaSelected6605568000000527843()' aria-required='true' aria-label='LEADCF3' name='LEADCF3'>
                                                    <option value='Emirate *'>
                                                        Select Emirate *
                                                    </option>
                                                    <option value='Dubai'>
                                                        Dubai
                                                    </option>
                                                    <option value='Abu&#x20;Dhabi'>
                                                        Abu Dhabi
                                                    </option>
                                                    <option value='Sharjah'>
                                                        Sharjah
                                                    </option>
                                                    <option value='Ras&#x20;Al&#x20;Khaimah'>
                                                        Ras Al Khaimah
                                                    </option>
                                                    <option value='Ajman'>
                                                        Ajman
                                                    </option>
                                                    <option value='Fujairah'>
                                                        Fujairah
                                                    </option>
                                                    <option value='Umm&#x20;Al&#x20;Quwain'>
                                                        Umm Al Quwain
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label hide" for='LEADCF5'>Nearest branch <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF5' onChange='addAriaSelected6605568000000527843()' aria-required='true' aria-label='LEADCF5' name='LEADCF5'>
                                                    <option value='Branch Name *'>
                                                        Nearest showroom you can visit *
                                                    </option>
                                                    <option value='Abu&#x20;Dhabi'>
                                                        Abu Dhabi
                                                    </option>
                                                    <option value='Al&#x20;Ain'>
                                                        Al Ain
                                                    </option>
                                                    <option value='Deira'>
                                                        Deira
                                                    </option>
                                                    <option value='Ras&#x20;Al&#x20;Khaimah'>
                                                        Ras Al Khaimah
                                                    </option>
                                                    <option value='Sharjah'>
                                                        Sharjah
                                                    </option>
                                                    <option value='Sheikh&#x20;Zayed&#x20;Road'>
                                                        Sheikh Zayed Road
                                                    </option>
                                                    <option value='Fujairah'>
                                                        Fujairah
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field">
                                        <label class="label" for='LEADCF2'> How did you hear about us? <span style='color:red;'> * </span> </label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF2' onChange='addAriaSelected6605568000000527843()' aria-required='true' aria-label='LEADCF2' name='LEADCF2'>
                                                    <option value='Select option'>
                                                        Select option
                                                    </option>
                                                    <option value='Email'>
                                                        Email
                                                    </option>
                                                    <option value='Friends&#x20;&amp;&#x20;Relatives'>
                                                        Friends &amp; Relatives
                                                    </option>
                                                    <option value='Google'>
                                                        Google
                                                    </option>
                                                    <option value='Magazine'>
                                                        Magazine
                                                    </option>
                                                    <option value='Newspaper&#x20;-&#x20;Digital'>
                                                        Newspaper - Digital
                                                    </option>
                                                    <option value='Newspaper&#x20;-&#x20;Print'>
                                                        Newspaper - Print
                                                    </option>
                                                    <option value='Outdoor&#x20;-&#x20;Ads'>
                                                        Outdoor - Ads
                                                    </option>
                                                    <option value='Radio'>
                                                        Radio
                                                    </option>
                                                    <option value='Showrooms'>
                                                        Showrooms
                                                    </option>
                                                    <option value='SMS'>
                                                        SMS
                                                    </option>
                                                    <option value='Social&#x20;Media&#x20;&#x28;Facebook&#x20;Instagram&#x20;Tiktok&#x20;Youtube&#x29;'>
                                                        Social Media &#x28;Facebook Instagram Tiktok Youtube&#x29;
                                                    </option>
                                                    <option value='Suzuki&#x20;User'>
                                                        Suzuki User
                                                    </option>
                                                    <option value='Web&#x20;-&#x20;Internet'>
                                                        Web - Internet
                                                    </option>
                                                    <option value='Other&#x20;Social&#x20;Media'>
                                                        Other Social Media
                                                    </option>
                                                    <option value='Other'>
                                                        Other
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field hide">
                                        <label class="label" for='LEADCF1'> Landing Page Name </label>
                                        <div class='zcwf_col_fld'>
                                            <div class="selectbox">
                                                <select class='zcwf_col_fld_slt' role='combobox' aria-expanded='false' aria-haspopup='listbox' id='LEADCF1' onChange='addAriaSelected6605568000000527843()' aria-required='false' aria-label='LEADCF1' name='LEADCF1'>
                                                    <option value='-None-'>
                                                        -None-
                                                    </option>
                                                    <option value='Brochure&#x20;download'>
                                                        Brochure download
                                                    </option>
                                                    <option selected value= 'Request&#x20;a&#x20;Quote'>
                                                        Request a Quote
                                                    </option>
                                                    <option value='Book&#x20;a&#x20;test&#x20;drive'>
                                                        Book a test drive
                                                    </option>
                                                    <option value='Request&#x20;a&#x20;Quote-&#x20;Genuine&#x20;parts'>
                                                        Request a Quote- Genuine parts
                                                    </option>
                                                    <option value='Contact&#x20;us'>
                                                        Contact us
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Register&#x20;as&#x20;a&#x20;suzuki&#x20;customer'>
                                                        After sales - Register as a suzuki customer
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;A&#x20;Service'>
                                                        After sales - Book A Service
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Baleno'>
                                                        After sales - Book Accessories- Baleno
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Grand&#x20;Vitara'>
                                                        After sales - Book Accessories- Grand Vitara
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Ciaz'>
                                                        After sales - Book Accessories- Ciaz
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Dzire'>
                                                        After sales - Book Accessories- Dzire
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Ertiga'>
                                                        After sales - Book Accessories- Ertiga
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Jimny'>
                                                        After sales - Book Accessories- Jimny
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Swift'>
                                                        After sales - Book Accessories- Swift
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Fronx'>
                                                        After sales - Book Accessories- Fronx
                                                    </option>
                                                    <option value='After&#x20;sales&#x20;-&#x20;Book&#x20;Accessories-&#x20;Jimny&#x20;5&#x20;Door'>
                                                        After sales - Book Accessories- Jimny 5 Door
                                                    </option>
                                                </select>
                                            </div>
                                            <div class='zcwf_col_help'> </div>
                                        </div>
                                    </div>

                                    <div class="input-field full-width">
                                        <div class="input-check">
                                            <label class="checkbox" for='LEADCF109'>
                                                <input type='checkbox' aria-checked='false' class='zcwf_ckbox' id='LEADCF109' aria-required='true' aria-label='LEADCF109' name='LEADCF109' aria-valuemax='3' maxlength='3' onclick='addAriaChecked6605568000000527843()'>
                                                </input>
                                                <span class="checkmark"></span>
                                                Term and Conditions <span style='color:red;'> * </span>
                                            </label>
                                        </div>
                                        <div class="input-check">
                                            <label class="checkbox" for='LEADCF102'>
                                                <input type='checkbox' aria-checked='false' class='zcwf_ckbox' id='LEADCF102' aria-required='false' aria-label='LEADCF102' name='LEADCF102' aria-valuemax='3' maxlength='3' onclick='addAriaChecked6605568000000527843()'>
                                                </input>
                                                <span class="checkmark"></span>
                                                Latest offers, deals and updates
                                            </label>
                                        </div>
                                    </div>

                                    <div class="input-field full-width form-btnbox">
                                        <input type='reset' class='zcwf_button' role='button' name='reset' value='Reset' aria-label='Reset' title='Reset'>
                                        <input type='submit' id='formsubmit' role='button' class='formsubmit zcwf_button' value='Submit' aria-label='Submit' title='Submit'>
                                    </div>

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

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


        </div>

    </section>

@endsection

@section('scripts')
<script>
	function addAriaChecked6605568000000527843(){
		var checkboxElem=event.target;
		if( checkboxElem != undefined && checkboxElem.checked ){
			checkboxElem.ariaChecked='true';
		}
		else if( checkboxElem != undefined && !checkboxElem.checked ){
			checkboxElem.ariaChecked='false';
		}
	}
	function addAriaSelected6605568000000527843(){
		var optionElem=event.target;
		var previousSelectedOption=optionElem.querySelector( '[aria-selected=true]' );
		if( previousSelectedOption ){
			previousSelectedOption.removeAttribute( 'aria-selected' );
		}
		optionElem.querySelectorAll( 'option' )[ optionElem.selectedIndex ].ariaSelected='true';
	}
	function validateEmail6605568000000527843(){
		var form=document.forms[ 'WebToLeads6605568000000527843' ];
		var emailFld=form.querySelectorAll( '[ftype=email]' );
		var i;
		for( i=0; i < emailFld.length; i++ ){
			var emailVal=emailFld[ i ].value;
			if(( emailVal.replace( /^\s+|\s+$/g,'' )).length != 0 ){
				var atpos=emailVal.indexOf( '@' );
				var dotpos=emailVal.lastIndexOf( '.' );
				if( atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailVal.length ){
					alert( 'Please enter a valid email address. ' );
					emailFld[ i ].focus();
					return false;
				}
			}
		}
		return true;
	}
	function checkMandatory6605568000000527843(){
		var mndFileds=new Array( 'First Name', 'Last Name', 'Phone', 'Mobile', 'Salutation', 'LEADCF2', 'LEADCF3', 'LEADCF5', 'LEADCF7', 'LEADCF109', 'LEADCF13' );
		var fldLangVal=new Array( 'First\x20Name', 'Last\x20Name', 'Phone', 'Mobile', 'Salutation', 'How\x20did\x20you\x20hear\x20about\x20us\x3F', 'Emirate', 'Branch\x20Name', 'Age', 'Term\x20and\x20Conditions', 'Selected\x20Model' );
		for( i=0; i < mndFileds.length; i++ ){
			var fieldObj=document.forms[ 'WebToLeads6605568000000527843' ][ mndFileds[ i ]];
			if( fieldObj ){
				if((( fieldObj.value ).replace( /^\s+|\s+$/g,'' )).length == 0 ){
					if( fieldObj.type == 'file' ){
						alert( 'Please select a file to upload.' );
						fieldObj.focus();
						return false;
					}
					alert( fldLangVal[ i ] + ' cannot be empty.' );
					fieldObj.focus();
					return false;
				}
				else if( fieldObj.nodeName == 'SELECT' ){
					if( fieldObj.options[fieldObj.selectedIndex].value == '-None-' ){
						alert( fldLangVal[ i ] + ' cannot be none.' );
						fieldObj.focus();
						return false;
					}
				}
				else if( fieldObj.type == 'checkbox' ){
					if( fieldObj.checked == false ){
						alert( 'Please accept  ' + fldLangVal[ i ]);
						fieldObj.focus();
						return false;
					}
				}
				try{
					if( fieldObj.name == 'Last Name' ){
						name=fieldObj.value;
					}
				}
				catch( e ){}
			}
		}
		if( !validateEmail6605568000000527843()){
			return false;
		}
		var urlparams=new URLSearchParams( window.location.search );
		if( urlparams.has( 'service' ) && ( urlparams.get( 'service' ) === 'smarturl' )){
			var webform=document.getElementById( 'webform6605568000000527843' );
			var service=urlparams.get( 'service' );
			var smarturlfield=document.createElement( 'input' );
			smarturlfield.setAttribute( 'type', 'hidden' );
			smarturlfield.setAttribute( 'value', service );
			smarturlfield.setAttribute( 'name', 'service' );
			webform.appendChild( smarturlfield );
		}
		document.querySelector( '.crmWebToEntityForm .formsubmit' ).setAttribute( 'disabled', true );
	}
	function tooltipShow6605568000000527843( el ){
		var tooltip=el.nextElementSibling;
		var tooltipDisplay=tooltip.style.display;
		if( tooltipDisplay == 'none' ){
			var allTooltip=document.getElementsByClassName( 'zcwf_tooltip_over' );
			for( i=0; i < allTooltip.length; i++ ){
				allTooltip[ i ].style.display='none';
			}
			tooltip.style.display='block';
		}
		else{
			tooltip.style.display='none';
		}
	}
</script>
<!-- Do not remove this --- Analytics Tracking code starts -->
<script id='wf_anal' src='https://crm.zohopublic.com/crm/WebFormAnalyticsServeServlet?rid=ba905855947f09645e3c943fb2e1761db8ed9fd90f763410161dea9f8e446de47824fae1828849083bf6106d024b71c6gidd3ad64300a5a06008c26a9c3ee4a2de0d66b39c754144ca825d96d9f4e524a78gid7fc83b8e105510ddea5065e95d621534a96f6863d38c3d990a6b57f3b6336f6bgiddced3848c35e6a5869beba3300c2e021b0d389860dbac36f2d8b91ca1c073259&tw=d2c7f0d8d9a4744f06aa4ca57572b52311f17e64305a6acf0cd2cd18ed545c6e'></script>
<!-- Do not remove this --- Analytics Tracking code ends. -->
@endsection