{{-- <div class="row">
    <div class="col-lg-4">
        <div class="form-group">
            <label for="">Marketplace Country</label>
            <select name="marketplace_country" id="marketplace_country" class="form-control">
                <option value="ATVPDKIKX0DER-https://sellercentral.amazon.com" @if(env('AMAZON_MARKETPLACE_ID') == 'ATVPDKIKX0DER') selected @endif>United States of America</option>
                <option value="A2EUQ1WTGCTBG2-https://sellercentral.amazon.ca" @if(env('AMAZON_MARKETPLACE_ID') == 'A2EUQ1WTGCTBG2') selected @endif>Canada</option>
                <option value="A1AM78C64UM0Y8-https://sellercentral.amazon.com.mx" @if(env('AMAZON_MARKETPLACE_ID') == 'A1AM78C64UM0Y8') selected @endif>Mexico</option>
            </select>
        </div>
    </div>
    <div class="col-lg-4">
        <button class="btn btn-danger" style="margin-top: 30px" onclick="setMarketplaceCountry(event)">Set Marketplace Country</button>
    </div>
</div> --}}
@if (!empty($amazon_sellers->toArray()))
<div class="pos-tab-content active">
    <div class="row">
        {{-- <div class="col-sm-3">
            <div class="form-group">
                {!! Form::label('amazon_enable', __('business.enable-disable') . ':') !!}
                <div class="checkbox">                    
                    <label>
                    {!! Form::radio('amazon_enable', '1',  $marketplace_settings['amazon_enable'] == 1 ? true : false, 
                        [ 'class' => 'input-iradio', 'onchange' => 'get_input(this.value, "amazon")']); !!} {{ __( 'business.enable' ) }}
        {!! Form::radio('amazon_enable', '0', $marketplace_settings['amazon_enable'] == 0 ? true : false,
        [ 'class' => 'input-iradio', 'onchange' => 'get_input(this.value, "amazon")']); !!} {{ __( 'business.disable' ) }}

        </label>
    </div>
</div>
</div> --}}
{{-- <div class="col-sm-4">
            <div class="form-group">
                {!! Form::label('amazon_api_url', __('business.api_url') . ':') !!}
                {!! Form::text('amazon_api_url', $marketplace_settings['amazon_api_url'] ?? null, ['class' => 'form-control']); !!}
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group">
                {!! Form::label('amazon_api_access_token', __('business.api_access_token') . ':') !!}
                {!! Form::text('amazon_api_access_token', $marketplace_settings['amazon_api_access_token'] ?? null, ['class' => 'form-control']); !!}
            </div>
        </div> --}}
{{-- <div id="amazon_space" class="col-sm-12">&nbsp;</div> --}}
{{-- <div class="col-sm-4" id="location_amazon">
    <div class="form-group" style="display: flex">
        {!! Form::label('product_locations_amazon', __('business.amazon_store') . ':', ['style' => 'width: 75%; margin-top: 6px;']) !!}
        {!! Form::select('product_locations_amazon[]', $amazon_sellers_dropdown, null, ['class' => 'form-control select2', 'id' => 'product_locations_amazon', 'style' => 'width: 100%', 'onchange' => 'getSellerPerformanceReport(this.value)']) !!}
    </div>
</div> 
<div class="col-lg-8" style="display: flex">
    <button type="button" class="btn btn-primary no-print" id="amazon-dashboard-button" onclick="updateSellerPerformanceReport($('#product_locations_amazon').val())"><i class="fa fa-microchip"></i> Update Dashboard</button>&nbsp;&nbsp; <h4 style="margin-left: 10px;" id="updated_at_dashboard" class="red-cross-table-detail">Updated at : </h4>
</div> --}}
{{-- <div class="col-sm-4">
            <div class="form-group">
                {!! Form::label('amazon_api_key', __('business.api_key') . ':') !!}
                {!! Form::text('amazon_api_key', $marketplace_settings['amazon_api_key'] ?? null, ['class' => 'form-control']); !!}
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group">
                {!! Form::label('amazon_api_secret', __('business.api_secret') . ':') !!}
                {!! Form::text('amazon_api_secret', $marketplace_settings['amazon_api_secret'] ?? null, ['class' => 'form-control']); !!}
            </div>
        </div> --}}
<div class="clearfix"></div>
<div class="row">
    {{-- <div class="col-lg-3">
        <h5 style="text-align: center;"><strong>{{ __('business.performance_metrics') }}</strong></h5>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-yellow" style="margin-top: 20px; width: 44px; height: 44px;"><i class="fa fa-truck"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important; text-align: center;">
                    <span class="info-box-text-amazon">{{ __('business.late_shipment_rate') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 12px; text-align: left;">
                        Target&nbsp;&nbsp;: <span id="lateShipmentTarget">0%</span><br>
                        Rate&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <span id="lateShipmentRate">0%</span>
                    </span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-orange" style="margin-top: 30px; width: 44px; height: 44px;"><i class="fas fa-minus-circle"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important; text-align: center;">
                    <span class="info-box-text-amazon">{{ __('business.order_defect_rate') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 12px; text-align: left;">
                        <table style="text-align: center; width: 100%;">
                            <tr>
                                <td style="width: 5%">&nbsp;</td>
                                <td>AFN</td>
                                <td>MFN</td>
                            </tr>
                            <tr>
                                <td style="text-align: left;">Target&nbsp;&nbsp;:</td>
                                <td id="orderDefectTargetAFN">0%</td>
                                <td id="orderDefectTargetMFN">0%</td>
                            </tr>
                            <tr>
                                <td style="text-align: left;">Rate&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</td>
                                <td id="orderDefectRateAFN">0%</td>
                                <td id="orderDefectRateMFN">0%</td>
                            </tr>
                        </table>
                    </span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-green" style="margin-top: 20px; width: 44px; height: 44px;"><i class="fa fa-truck"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important; text-align: center;">
                    <span class="info-box-text-amazon">{{ __('business.on_time_delivery_rate') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 12px; text-align: left;">
                        Target&nbsp;&nbsp;: <span id="onTimeDeliveryTarget">0%</span><br>
                        Rate&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: <span id="onTimeDeliveryRate">0%</span>
                    </span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>

    </div>
    <div class="col-lg-3">
        <h5 style="text-align: center"><strong>{{ __('business.inventory_metrics') }}</strong></h5>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-aqua" style="margin-top: 10px; width: 44px; height: 44px;"><i class="ion ion-ios-list-outline"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important;">
                    <span class="info-box-text-amazon">{{ __('business.total_product') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 15px;">-</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-aqua" style="margin-top: 10px; width: 44px; height: 44px;"><i class="ion ion-document"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important;">
                    <span class="info-box-text-amazon">{{ __('business.active_product') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 15px;">-</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <div class="col-xs-12 col-custom" style="padding-left: 0;">
            <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                <span class="info-box-icon bg-aqua" style="margin-top: 10px; width: 44px; height: 44px;"><i class="ion ion-ios-folder-outline"></i></span>

                <div class="info-box-content" style="margin-left: 40px !important;">
                    <span class="info-box-text-amazon">{{ __('business.category_count') }}</span>
                    <span class="info-box-number total_sell" style="font-size: 15px;">-</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
    </div> --}}
    <div class="col-lg-6">
        <div class="form-group">
            {{-- {!! Form::label('ir_filter_date', 'Filter Date' . ':') !!}
            {!! Form::text('ir_filter_date', null, ['placeholder' => __('lang_v1.select_a_date_range'), 'class' => 'form-control', 'readonly', 'style' => 'width: 80% !important;']); !!} --}}
            {{-- {!! Form::label('product_locations_amazon', __('business.amazon_store') . ':', ['style' => 'width: 75%; margin-top: 6px;']) !!}
            {!! Form::select('product_locations_amazon[]', $amazon_sellers_dropdown, null, ['class' => 'form-control select2', 'id' => 'product_locations_amazon', 'style' => 'width: 100%', 'onchange' => 'getSalesTrafficReport(this.value)']) !!} --}}
        </div>
        <!-- <h5><strong>Top 5 Categories</strong></h5>
                <div class="box box-warning">
                    <div class="box-body">
                        <table class="table table-borderless w-100">
                            <thead>
                                <tr>
                                    <th style="font-size: medium"><strong>Category</strong></th>
                                    <th style="font-size: medium"><strong>Product Count</strong></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td style="font-size: small">Books</td>
                                    <td style="font-size: small">24,345</td>
                                </tr>
                                <tr>
                                    <td style="font-size: small">CDs & Vinyl</td>
                                    <td style="font-size: small">18,876</td>
                                </tr>
                                <tr>
                                    <td style="font-size: small">Movies & TV</td>
                                    <td style="font-size: small">2,654</td>
                                </tr>
                                <tr>
                                    <td style="font-size: small">Software</td>
                                    <td style="font-size: small">432</td>
                                </tr>
                                <tr>
                                    <td style="font-size: small">Sports & Outdoors</td>
                                    <td style="font-size: small">210</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>  -->
        {{-- <input type="hidden" id="aggregate_by" value="{{ $aggregateBy ?? 'MONTH' }}">
        <input type="hidden" id="first_date_sales_traffic" value="{{ $firstDate ?? date('Y-m-01') }}">
        <input type="hidden" id="today_sales_traffic" value="{{ $lastDate ?? date('Y-m-d') }}">
        <div class="container">
            <div class="row">
                <div class="col-xs-6 col-custom" style="padding-left: 0;">
                    <span style="text-align: center; display:block;">📊 Sales Summary ({{ $firstDate }} - <span id="last_date_updated_at_sales">{{$lastDate}}</span>)</span>
                    <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                        <div class="info-box-content" style="margin-left: 40px !important;">
                            <p><strong>💰 Ordered Product Sales:</strong> $<span id="sales_order_product_amount"></span></p>
                            <p><strong>📦 Orders Shipped:</strong> <span id="sales_order_shipped"></span></p>
                            <p><strong>📊 Average Sales Per Order:</strong> $ <span id="sales_average_sales_per_order"></span></p>
                            <p><strong>📈 Average Selling Price:</strong> $<span id="sales_average_selling_price"></span></p>
                            <p><strong>🔄 Refund Rate:</strong> <span id="sales_refund_rate"></span>%</p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row" style="display: none;">
                <div class="col-xs-6 col-custom" style="padding-left: 0;">
                    <span style="text-align: center; display:block;">📈 Traffic Summary ({{ $firstDate }} - <span id="last_date_updated_at_traffic">{{$lastDate}}</span>)</span>
                    <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                        <div class="info-box-content" style="margin-left: 40px !important;">
                            <p><strong>🖥️ Browser Page Views:</strong> <span id="sales_browser_page_views"></span></p>
                            <p><strong>📱 Mobile App Page Views:</strong> <span id="sales_mobile_app_page_views"></span></p>
                            <p><strong>🏆 Buy Box Percentage:</strong> <span id="sales_buy_box_percentage"></span>%</p>
                            <p><strong>💬 Feedback Received:</strong> <span id="sales_feedback_received"></span></p>
                            <p><strong>❌ Negative Feedback:</strong> <span id="sales_negative_feedback"></span></p>
                        </div>
                    </div>
                </div>
            </div>
        </div> --}}
        @if(auth()->user()->can('view.amazon_total_sells') && auth()->user()->hasAnyRole(['Admin Site#1']))
        <div class="col-lg-6">
            <div class="container">
                <div class="row">
                    <div class="col-xs-6 col-custom" style="padding-left: 0;">
                        <span style="text-align: center; display:block;">📊 Today's Sell Numbers:</span>
                        <div class="info-box info-box-new-style" style="box-shadow: 4px 4px 0px rgb(19 103 199 / 15%) !important; margin-bottom: 20px !important; min-height: 60px;">
                            {{-- <div class="info-box-content" style="margin-left: 40px !important;">
                                @foreach ($amazon_sellers as $seller)                           
                                <div class="row">
                                    <div class="col-lg-6">                                    
                                        <p><strong>📈 {{$seller->seller_name ?? $seller->seller_id}} :</strong> <span id="order_total{{$seller->seller_id}}"></span></p>
                                    </div>
                                    <div class="col-lg-6">
                                        <button  type="button"  class="btn btn-primary pull-right" onclick="getSellToday('{{$seller->seller_id}}')">Update</button>
                                    </div>
                                </div>     
                                @endforeach
                            </div> --}}
                            <table class="table table-borderless">
                                <tbody>
                                    @foreach ($amazon_sellers as $seller)  
                                    <tr>
                                        <td><strong>📈 {{$seller->seller_name ?? $seller->seller_id}} :</strong></td>
                                        <td><span id="order_total{{$seller->seller_id}}"></span></td>
                                        <td><span id="order_total_amount{{$seller->seller_id}}"></span></td>
                                        <td><button  type="button"  class="btn btn-primary pull-right" onclick="getSellToday('{{$seller->seller_id}}')">Update</button></td>
                                    </tr>
                                    @endforeach
                                    <tr>
                                        <td>Total: </td>
                                        <td><span id="summary_order_total_qty"></span></td>
                                        <td colspan="2"><span id="summary_order_total_amount"></span></td>
                                    </tr>
                                </tbody>
                            </table>
                            <button  type="button"  class="btn btn-primary" style="margin-left: 40px !important;" onclick="getSellToday('all')">Update All</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @endif
    </div>
</div>
<div class="clearfix"></div>
<div class="col-sm-12 mb-10">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapseFilterAmazon"><i class="fa fas fa-cog"></i><i class="fa fa-caret-down"></i> Amazon Sync Settings</a>
</div>
</div>
</div>
@else
<div class="text-center active" style="margin-bottom: 20px">
    <h2>Connect Your Amazon Seller Account</h2>
    <p>Click the button below to authorize our app to access your Amazon seller data.</p>
    <a href="{{ route('amazon.auth.redirect') }}" class="btn-amazon btn-primary-amazon btn-lg-amazon">
        Authorize with Amazon
    </a>
</div>
@endif