@extends('panel.page')

@section('titulo-cabecera')
<h4 class="title float-left fsTitulo fs-4 text-white">Mis Certificados </h4>
@endsection

@section('contenido')
<nav class="breadcrumb_widgets boxPanels mt-2 mb-0" aria-label="breadcrumb mb30">
    <h4 class="title float-left fs-4 text-white">Tiene {{ Auth::user()->certificados->count() }} certificado(s) en total </h4>
    {{-- <h4 class="title float-left fs-4 text-white">Tiene {{ Auth::user()->certificados }} certificados en total </h4> --}}
    {{-- <ol class="breadcrumb float-right">
        <li class="breadcrumb-item active" aria-current="page">

            <select class="form-select selectpicker" aria-label="-- Todos">
                <option selected>-- Todos</option>
                <option value="1">Por empezar</option>
                <option value="2">En progreso</option>
                <option value="3">Completados</option>
                <option value="3">Ocultos</option>
            </select>


        </li>
    </ol> --}}
    <div class="clearfix"></div>
</nav>
<div class="ff_one mt-4 boxPanels">
    {{-- {{$certificados}} --}}

    @foreach($certificados as $certificado)
    <div class="col-md-6 col-lg-6 col-xl-6">
        <div class="row">
            <div class="top_courses p-4 hvr-shrink">
                <div class="row">
                    <div class="col-md-3 text-center d-block">
                        <img class="img-fluid" src="/images/icons/icons-certificate-2.png" />
                    </div>
                    <div class="col-md-9" style="display:grid; align-content: center">
                        @foreach($cursos as $curso)
                        {{-- {{$curso}} --}}
                        <h3 style="font-size:22px">{{$curso->titulo}}</h3><br>
                        <a href="{{ $certificado->url_pdf }}" target="_blank" class="text-white" style="font-size:14px">Descargar PDF <i class="fa fa-download"></i></a>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endforeach

</div>
@endsection