@extends('backend.master')
@section('title', 'Dashboard')

@section('backend_content')
    <!-- Page Title Area -->
    <div class="container-fluid">
        <div class="row page-title clearfix">
            <div class="page-title-left">
                <h6 class="page-title-heading mr-0 mr-r-5">Dashboard</h6>
                <p class="page-title-description mr-0 d-none d-md-inline-block">System statistics and overview</p>
            </div>
            <div class="page-title-right d-none d-sm-inline-flex">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item active">Home</li>
                </ol>
            </div>
        </div>
    </div>

    <!-- Data Widgets -->
    <div class="container-fluid">
        <div class="widget-list row">

            <!-- Active Users Widget -->
            <div class="widget-holder widget-sm col-lg-4 col-md-6 widget-full-height">
                <div class="widget-bg bg-primary text-inverse">
                    <div class="widget-body">
                        <div class="counter-w-info media">
                            <div class="media-body w-50">
                                <p class="text-white mr-b-5 fw-600 opacity-75">Active Users</p>
                                <span class="counter-title d-block fs-30">
                                    <span class="counter">{{ $activeUsersCount }}</span>
                                </span>
                            </div>
                            <div class="pull-right align-self-center">
                                <i class="list-icon material-icons fs-50 opacity-50">group</i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Active Editorial Categories Widget -->
            <div class="widget-holder widget-sm col-lg-4 col-md-6 widget-full-height">
                <div class="widget-bg bg-success text-inverse">
                    <div class="widget-body">
                        <div class="counter-w-info media">
                            <div class="media-body w-50">
                                <p class="text-white mr-b-5 fw-600 opacity-75">Active Categories</p>
                                <span class="counter-title d-block fs-30">
                                    <span class="counter">{{ $activeCategoriesCount }}</span>
                                </span>
                            </div>
                            <div class="pull-right align-self-center">
                                <i class="list-icon material-icons fs-50 opacity-50">category</i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Active Editorial Board Widget -->
            <div class="widget-holder widget-sm col-lg-4 col-md-6 widget-full-height">
                <div class="widget-bg bg-info text-inverse">
                    <div class="widget-body">
                        <div class="counter-w-info media">
                            <div class="media-body w-50">
                                <p class="text-white mr-b-5 fw-600 opacity-75">Active Board Members</p>
                                <span class="counter-title d-block fs-30">
                                    <span class="counter">{{ $activeBoardMembersCount }}</span>
                                </span>
                            </div>
                            <div class="pull-right align-self-center">
                                <i class="list-icon material-icons fs-50 opacity-50">assignment_ind</i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection