@extends('layouts.master')
<style>
    .card.bg-info{
        background-image: linear-gradient(to right, #171a2b , #ffc106)!important;
        border-color: #fff;
    }
    .icon{
        color: #545454;
        line-height: 2;
    }
</style>

@section('page-content')
    <div class="title-bar">
        <h1 class="title-bar-title">
            <span class="d-ib">Quick Overview</span>
        </h1>
    </div>
    <div class="row gutter-xs">
        <div class="col-md-6 col-lg-3">
            <div class="card bg-info">
                <div class="card-body">
                    <div class="media">
                        <div class="media-middle media-left">
                            <span class="bg-primary-inverse circle sq-48">
                                <span class="icon icon-user"></span>
                            </span>
                        </div>
                        <div class="media-middle media-body">
                            <h6 class="media-heading">Regions</h6>

                            <h3 class="media-heading">
                            <span class="fw-l">{{$regions_count}}</span>


                        </h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="card bg-info">
                <div class="card-body">
                    <div class="media">
                        <div class="media-middle media-left">
                            <span class="bg-info-inverse circle sq-48">
                                <span class="icon icon-shopping-bag"></span>
                            </span>
                        </div>
                        <div class="media-middle media-body">
                            <h6 class="media-heading">Registered Members</h6>

                            <h3 class="media-heading">
     <span class="fw-l">{{$members_count}}</span>
                        </h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="card bg-info">
                <div class="card-body">
                    <div class="media">
                        <div class="media-middle media-left">
                            <span class="bg-warning-inverse circle sq-48">
                                <span class="icon icon-users"></span>
                                <!-- <span class="icon icon-inr"></span> -->
                               {{-- <img src="http://mumbaimaheshwari.com/img/samiti.jpeg" style="height: 33px;
                        width:33px;"> --}}
                        </div>
                        <div class="media-middle media-body">
                            <h6 class="media-heading">Samiti</h6>

                            <h3 class="media-heading">
                            <span class="fw-l"> {{$samiti_count}}</span>
                        </h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="card bg-info">
                <div class="card-body">
                    <div class="media">
                        <div class="media-middle media-left">
                            <span class="bg-info-inverse circle sq-48">
                                <span class="icon icon-clock-o"></span>
                            </span>
                        </div>
                        <div class="media-middle media-body">
                            <h6 class="media-heading">Events</h6>

                            <h3 class="media-heading">
                                <span class="fw-l">{{$events}}</span>
                            </h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <hr class="no_line" style="margin: 0 auto 20px auto"> 
    
            <div class="col-xs-12">
                <table id="demo-datatables-111" class="table table-striped table-nowrap table-bordered dataTable" cellspacing="0" width="100%">
                    <thead>
                    <tr>
                        <th style="text-align: center">Kshetra</th>
                        <th style="text-align: center">Total Members</th>
                        <th style="text-align: center">Pending With Regional</th>
                        <th style="text-align: center">Pending With Superadmin</th>
                        <th style="text-align: center">Approved Updates</th>
                        <th style="text-align: center">New Registration Count </th>

                    </tr>
                    </thead>
                    <tbody>
                   
                    @foreach($membercollect as $mcount)
                        <tr>
                        <td>{{$mcount[0]['region_name']}}</td>
                        <td style="text-align: center">{{$mcount[0]['region_members_number']}}</td>

                            <td style="text-align: center">{{$mcount[0]['pending_with_regional']}}</td>
                            <td style="text-align: center">{{$mcount[0]['pending_with_superadmin']}}</td>
                            <td style="text-align: center">{{$mcount[0]['approved_updates']}}</td>
                            <td style="text-align: center">{{$mcount[0]['new_registration_count']}}</td>



                           
                        </tr>
                    @endforeach
                    </tbody>
                    <!-- <tfoot>
                    <tr>
                      
                    </tr>
                    </tfoot> -->
                </table>
            </div>
    
@endsection