@extends('aulavirtual.layout.master')

@section('title', 'Educa Auge - Accede a los mejores cursos online para docentes')
@section('styles')
    <link rel="stylesheet" href="{{ asset('assets/css/aulavirtual/miscursos.css') }}" />
    <style>
        .titulo-curso {
            --lines: 2;
        }
    </style>
@endsection
@section('content')
    <main class="page-main">

        <!-- NAV PESTAÑAS (tipo ventana) -->
        <div class="uk-container header-ventana">
            <ul class="uk-subnav uk-subnav-pill subventana"
                uk-switcher="connect: #tabs-content; animation: uk-animation-fade">
                <li class="uk-active">
                    <a href="#">
                        Beneficios Exclusivos
                        <span class="uk-badge rounded pill-count">3</span>
                    </a>
                </li>
            </ul>
        </div>


        <!-- CONTENIDO DE LAS PESTAÑAS -->
        <div class="uk-container uk-margin">
            <ul id="tabs-content" class="uk-switcher">

                <!-- TAB: Cursos -->
                <li>
                    <div class="uk-grid-small uk-child-width-1-1 uk-child-width-1-2@m uk-child-width-1-4@l" uk-grid>
                        <!-- Tarjeta de curso -->



                        @if ($curso->modalidad == 2)
                            <div>
                                <a href="{{ url('aulavirtual/contenido/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/envivo.png') }}" alt="Curso"
                                                class="uk-border-rounded">
                                        </div>

                                        <div class="card-body">
                                            <p class="titulo-curso">Clases virtuales EN VIVO </p>

                                            <!-- Progreso -->
                                            <div class="uk-margin-small" style="display: none;">
                                                <div class="uk-grid-small uk-flex-middle" uk-grid>
                                                    <div class="uk-width-expand">
                                                        <progress class="uk-progress uk-margin-remove progress-red"
                                                            value="0" max="100"></progress>
                                                    </div>
                                                    <div class="uk-width-auto">
                                                        <span class="progress-label">40%</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>


                                    </div>
                                </a>
                            </div>
                        @endif


                        <div>
                            <a href="{{ url('sesionesgrabadas/' . $curso->titulo_rewrite) }}">
                                <div class="card-curso">
                                    <div class="uk-card-media-top">
                                        <img src="{{ asset('assets/img/aulavirtual/grabadas.png') }}" alt="Curso"
                                            class="uk-border-rounded">
                                    </div>

                                    <div class="card-body">
                                        <p class="titulo-curso">Sesiones Grabadas</p>

                                        <!-- Progreso -->
                                        <div class="uk-margin-small" style="display: none;">
                                            <div class="uk-grid-small uk-flex-middle" uk-grid>
                                                <div class="uk-width-expand">
                                                    <progress class="uk-progress uk-margin-remove progress-red"
                                                        value="60" max="100"></progress>
                                                </div>
                                                <div class="uk-width-auto">
                                                    <span class="progress-label">40%</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>


                                </div>
                            </a>
                        </div>


                        @if ($tieneGuias)
                            <div>
                                <a href="{{ url('aulavirtual/guias/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/guias.png') }}" alt="Curso"
                                                class="uk-border-rounded">
                                        </div>
                                        <div class="card-body">
                                            <p class="titulo-curso">Guías Descargables y Resúmenes</p>

                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endif

                        @if ($tieneExamenes)
                            <div>
                                <a href="{{ url('aulavirtual/simulacros/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/simulacro.png') }}" alt="Curso"
                                                class="uk-border-rounded">
                                        </div>
                                        <div class="card-body">
                                            <p class="titulo-curso">Exámenes Simulacros</p>

                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endif

                        @if (!empty($curso->link_whatsapp_interno))
                            <div>
                                <a href="{{ url('aulavirtual/whatsapp/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/fotowhatsapp.png') }}"
                                                alt="Curso" class="uk-border-rounded">
                                        </div>
                                        <div class="card-body">
                                            <p class="titulo-curso">Grupo Exclusivo de WhatsApp</p>

                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endif

                        @if ($tieneTelegram)
                            <div>
                                <a href="{{ url('aulavirtual/telegram/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/imagentelegram.jpeg') }}"
                                                alt="Curso" class="uk-border-rounded">
                                        </div>
                                        <div class="card-body">
                                            <p class="titulo-curso">Grupo Exclusivo de Telegram</p>

                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endif

                        @if ($tieneCertificados)
                            <div>
                                <a href="{{ url('aulavirtual/certificado/' . $curso->titulo_rewrite) }}">
                                    <div class="card-curso">
                                        <div class="uk-card-media-top">
                                            <img src="{{ asset('assets/img/aulavirtual/certificado.png') }}" alt="Curso"
                                                class="uk-border-rounded">
                                        </div>
                                        <div class="card-body">
                                            <p class="titulo-curso">Certificado</p>
                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endif

                        <div>
                            <a href="{{ url('aulavirtual/soporte/' . $curso->titulo_rewrite) }}">
                                <div class="card-curso">
                                    <div class="uk-card-media-top">
                                        <img src="{{ asset('assets/img/aulavirtual/soporte.png') }}" alt="Curso"
                                            class="uk-border-rounded">
                                    </div>
                                    <div class="card-body">
                                        <p class="titulo-curso">Soporte Técnico Plataforma</p>

                                    </div>
                                </div>
                            </a>
                        </div>





                    </div>
                </li>



            </ul>
        </div>
    </main>
@endsection