@php(
    $headerOption = \App\Http\Controllers\Controller::getHeaderOptions(
        $title ?? '',
        $subTitle ?? '',
        isset($filters) ? $filters : [],
        isset($advancedFilters) ? $advancedFilters : []
    )
)
@extends('admin.layouts.layout', $headerOption)
@section('content')
    <h1 class="top-head">Proposal Generator</h1>
    <div class="row">
        <div class="col-lg-6 col-md-6 col-12">
            <div class="project-box mobile-mb-15">
                <div class="d-flex justify-content-between resp-i gap-3">
                    <div class="resp-i d-flex mb-0">
                        <div class="info-heading text-nowrap align-items-center">
                            <div class="info-heading-icon"><i class="bx bx-info-circle"></i></div>
                            <div class="info-heading-text"><h3>Step 1:</h3><p>Application Information</p></div>
                        </div>
                    </div>
                    <div class="d-flex align-items-center gap-3 w-100">
                        <div class="project-form mb-0 w-100">
                            <label>Type:</label>
                            <select class="form-select form-control" aria-label="Default select example" style="">
                                <option class="select-op">Tiered toInterchange (Estimated)</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>                            
                            </select>                          
                        </div>
                        <div class="project-form mb-0 w-100">
                            <label>Industry:</label>
                            <select class="form-select form-control" aria-label="Default select example" style="">
                                <option class="select-op">Retail</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>                            
                            </select>                          
                        </div>                        
                    </div>
                </div>
                <div class="table-responsive project-table mt-3">
                    <table id="datatable" class="table mb-0 dt-responsive nowrap">
                        <thead class="thead-light ">
                            <tr>
                                <th></th>
                                <th>Credit</th>
                                <th>Debit</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>Visa</td>
                                <td class="text-dark">1.70%</td>
                                <td class="text-dark">0.20%</td>
                            </tr>
                            <tr>
                                <td>Master Card</td>
                                <td class="text-dark">1.70%</td>
                                <td class="text-dark">0.20%</td>
                            </tr>
                            <tr>
                                <td>Discover</td>
                                <td class="text-dark">1.70%</td>
                                <td class="text-dark">0.20%</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="project-checkbox mt-3">
                    <label>Show Tiers :</label>
                    <input type="checkbox" class="custom-control-input input-mini ">
                    <label>(Check this box if you require tiered fields)</label>
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-6 col-12">
            <div class="project-box">
                <div class="info-heading text-nowrap align-items-center">
                    <div class="info-heading-icon"><i class="bx bx-file-blank"></i></div>
                    <div class="info-heading-text"><h3>Proposal Preview</h3></div>
                </div>
                <div class="table-responsive project-table mt-3">
                    <table id="datatable" class="table mb-0 dt-responsive nowrap">
                        <thead class="thead-light ">
                            <tr>
                                <th>Type</th>
                                <th>Volume</th>
                                <th>Current</th>
                                <th>Proposed</th>
                                <th>Savings</th>
                                <th>Profit</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td colspan="6" class="pb-0">
                                    <div class="text-center">
                                        <a href="#" class="green-btn-inner waves-effect">Refresh</a>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="heading-btn mt-3">
                    <a href="#" class="green-btn-inner waves-effect show-modal d-flex align-items-center gap-2"><i class="bx bx-download"></i> Save & Generate Proposal</a>
                    <a href="#" class="green-btn-inner waves-effect show-modal d-flex align-items-center gap-2"><i class="bx bx-envelope"></i> Send Proposal Email</a>
                </div>
            </div>
        </div>
    </div>
    <p class="fill-txt my-3">Fill in the Business Information for who the proposal is being made for . Include the date of the statement that you are analyzing.</p>
    <div class="row">
        <div class="col-lg-6 col-md-6 col-12">
            <div class="project-box mobile-mb-15">
                <div class="info-heading text-nowrap align-items-center mb-3">
                    <div class="info-heading-icon"><i class="bx bx-info-circle"></i></div>
                    <div class="info-heading-text"><h3>Step 2:</h3><p>Business Information</p></div>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="project-form">
                            <label>Contact Name</label>
                            <input class="form-control" type="text" placeholder="Name" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-12">
                        <div class="project-form">
                            <label>Business Name</label>
                            <input class="form-control" type="text" placeholder="Business Name" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-12">
                        <div class="link-add-txt">
                            <div class="project-form">
                            <label>Link to Existing </label>
                            <input class="form-control" type="text" placeholder="Type in DBA" style="">
                            </div>
                            <div class="project-form">
                            <label></label>
                            <input class="form-control" type="text" placeholder="Type in DBA" style="">
                            </div>
                            <p>Or</p>
                            <a href="#" class="green-btn-inner waves-effect show-modal d-flex align-items-center"><i class="bx bx-plus"></i></a>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-12">
                        <div class="project-form">
                            <label>Business Address</label>
                            <input class="form-control" type="text" placeholder="Business Address" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-12">
                        <div class="project-form">
                            <label>City</label>
                            <input class="form-control" type="text" placeholder="City" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-12">
                        <div class="project-form">
                            <label>State</label>
                            <select class="form-select form-control" aria-label="Default select example" style="">
                                <option class="select-op">Alabama</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>                            
                            </select>                          
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-12">
                        <div class="project-form">
                            <label>Zip</label>
                            <input class="form-control" type="text" placeholder="Zip" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-12">
                        <div class="project-form">
                            <label>Business Phone Number</label>
                            <input class="form-control" type="text" placeholder="Number" style="">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-12">
                        <div class="project-form">
                            <label>Cell Phone</label>
                            <input class="form-control" type="text" placeholder="Number" style="">
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12 col-12">
                        <div class="project-form">
                            <label>Email</label>
                            <input class="form-control" type="text" placeholder="demo@yopmail.com" style="">
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12 col-12">
                        <div class="project-form">
                            <label>Statement Date</label>
                            <input class="form-control" type="text" placeholder="1/25" style="">
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12 col-12">
                        <div class="project-form">
                            <label>Current Processor</label>
                            <input class="form-control" type="text" style="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-6 col-12">
            <div class="project-box">
                <div class="info-heading text-nowrap align-items-center mb-3">
                    <div class="info-heading-icon"><i class="bx bx-plus"></i></div>
                    <div class="info-heading-text"><h3>Pennies to Percentage Converter</h3></div>
                </div>
                <div class="chart-box-line">
                    <div class="chart-box-line-inner">Chart</div>
                    <div class="box-chart-txt">
                        <span>With the Average Ticket of</span>
                        <input type="text" class="form-control mt-1" placeholder="10.00">
                        <span class="mt-4">Is the equivalent of</span>
                    </div>
                    <div class="chart-box-line-inner">Chart</div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('page_script')
@endpush