@extends("layout.base")

@section("styles")
    <title>ARB | Inicio</title>
@endsection

@section("header")
    <div class="subheader py-2 py-lg-4 subheader-solid" id="kt_subheader">
        <div class="container-fluid d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
            <div class="d-flex align-items-center flex-wrap mr-2">
                <h5 class="text-dark font-weight-bold mt-2 mb-2 mr-5">ARB</h5>
                <div class="subheader-separator subheader-separator-ver mt-2 mb-2 mr-4 bg-gray-200"></div>
                <span class="font-weight-bold mr-4">Inicio</span>
            </div>
            <div class="d-flex align-items-center">
                <a href="javascript:;" class="btn btn-sm btn-light font-weight-bold mr-2" id="kt_dashboard_daterangepicker" data-toggle="tooltip" title="Calendario" data-placement="left">
                    <span class="text-muted font-size-base font-weight-bold mr-2" id="kt_dashboard_daterangepicker_title">Hoy</span>
                    <span class="text-primary font-size-base font-weight-bolder" id="kt_dashboard_daterangepicker_date">{{date('d-m-Y')}}</span>
                </a>
            </div>
        </div>
    </div>
@endsection

@section("content")

    <div class="row">
        <div class="col-xl-4 col-xs-12">
            <div class="card card-custom card-stretch gutter-b" style="background-color: rgb(0,153,153);">
                <div class="card-body">
                    <span class="svg-icon svg-icon-2x"><i class="fas fa-toolbox mr-2 fa-3x text-white"></i></span>
                    <span class="card-title font-weight-bolder text-white font-size-h1 mb-0 mt-6 d-block">{{  $otAbiertas }}</span>
                    <span class="font-weight-bold text-white font-size-sm">Total de OT abiertas</span>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-xs-12">
            <div class="card card-custom bg-warning card-stretch gutter-b">
                <div class="card-body">
                    <span class="svg-icon svg-icon-2x"><i class="fas fa-cart-arrow-down mr-2 fa-3x text-white"></i></span>
                    <span class="card-title font-weight-bolder text-white font-size-h1 mb-0 mt-6 d-block">{{ $ocPendientes }}</span>
                    <span class="font-weight-bold text-white font-size-sm">Total de OC pendientes</span>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-xs-12">
            <div class="card card-custom bg-info card-stretch gutter-b">
                <div class="card-body">
                    <span class="svg-icon svg-icon-2x"><i class="fas fa-inbox mr-2 fa-3x text-white"></i></span>
                    <span class="card-title font-weight-bolder text-white font-size-h1 mb-0 mt-6 d-block">{{ $cotAbiertas }}</span>
                    <span class="font-weight-bold text-white font-size-sm">Total de cotizaciones abiertas</span>
                </div>
            </div>
        </div>
    </div>
@endsection


@section("scripts")

    <script>
    </script>

@endsection