@extends('layouts.app')
@section('content')
    @include('layouts.navbar')
    @include('layouts.sidebar')
    <style>
        .form-outline input::placeholder {
            font-size: 0.7em;
            /* Adjust the font size as needed */
        }

        .valuesty {
            font-size: 15px;
        }
    </style>
    <main id="" class="side_user">
        <!-- Hero -->
        <!-- <div class="bg-body-light ">
                <div class="content content-full">
                    <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center">
                        <h1 class="flex-sm-fill h3 my-2">
                            Customers<small class="d-block d-sm-inline-block mt-2 mt-sm-0 font-size-base font-w400 text-muted"></small>
                        </h1>
                        <nav class="flex-sm-00-auto ml-sm-3" aria-label="breadcrumb">
                            <ol class="breadcrumb breadcrumb-alt">
                                <li class="breadcrumb-item">View Customer</li>
                                <li class="breadcrumb-item" aria-current="page">
                                    <a style="color:black" href="{{ route('customers.index') }}">Customers</a>
                                </li>
                            </ol>
                        </nav>
                    </div>
                </div>
              </div> -->

        <!-- END Hero -->
        <div class="analyse">
            <div class="sales">
                <h1>Total QR Scans</h1>
            </div>
            <div class="sales">
                <h1>Total QR project</h1>
            </div>
            <div class="sales">
                <h1>Total Registered QR's</h1>
            </div>
        </div>
        <div class="analyse">
            <div class="sales">
                <h1>Name</h1>
            </div>
            <div class="sales">
                <h1>Email</h1>
            </div>
            <div class="sales">
                <h1>Acounts Credited date</h1>
            </div>
        </div>
        <table class="table js-dataTable-full dataTable no-footer" id="DataTables_Table_0" role="grid"
            aria-describedby="DataTables_Table_0_info">
            <thead>
                <tr role="row">
                    <th class="sorting" style="text-align: center;" tabindex="0" aria-controls="DataTables_Table_0"
                        rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">S.No</th>

                    <th class="text-center sorting_asc" style="text-align: center; width: 30%" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending"
                        aria-label="ID: activate to sort column descending">
                        Qr Unique Nmae</th>
                    <th class="sorting" style="text-align: center;" tabindex="0" aria-controls="DataTables_Table_0"
                        rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">Product Id</th>
                    <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 30%;" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                        aria-label="Email: activate to sort column ascending">Product associated To</th>
                    <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 30%;" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                        aria-label="Email: activate to sort column ascending">current Functionallity</th>
                    <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 30%;" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                        aria-label="Email: activate to sort column ascending">Total Scans</th>
                    <th style="text-align: center; width: 15%;" class="sorting" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                        aria-label="Registered: activate to sort column ascending">Latest Scans</th>
                    <th style="text-align: center; width: 15%;" class="sorting" tabindex="0"
                        aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                        aria-label="Registered: activate to sort column ascending">Status</th>
                </tr>
            </thead>
            <tbody>
                {{-- <tr>
                                      <td class="text-center font-size-sm sorting_1" style="width: 5%;">
                                          {{ 1 }}</td>
                                      <td class="font-w600 font-size-sm" style="width: 15%;">
                                          {{ 'CMHQ001' }}
                                      </td>
                                      <td class="font-w600 font-size-sm" style="width: 15%;">
                                          {{ 'Charles' }}
                                      </td>
                                      <td class="d-none d-sm-table-cell font-size-sm" style="width: 15%;">
                                          {{ 'kunda' }}
                                      </td>
                                      <td class="d-none d-sm-table-cell font-size-sm" style="width: 20%;">
                                          {{ 'charles@ninosit.com' }}
                                      </td>
                                      <td class="d-none d-sm-table-cell" style="width: 15%;"><label class="switch">
                                              <input type="checkbox" checked>
                                              <span class="slider round"></span>
                                          </label></td>
                                      <td style="width: 10%;">
                                          <div class="btn-group">
                                              <div class="btn-group">
                                                  <a href="