<div>
    @if(Auth::user()->rol_id_rol != 5)
        <div class="row m-0 p-2 position-absolute" style="width: calc(100% - 14rem)">
            <div style="display: flex; width: 100%; flex-direction: row; justify-content: space-between">
                <img style="width: 15rem;object-fit:contain;" src="{{ asset($imagen_cliente) }}" alt="Imagen asociada al cliente">
                <div class="flex-column" style="display: flex">
                    <h5 class="text text-center"><strong>Usuarios: </strong> {{$numero_usuarios-1}} de {{$total_usuarios}}
                    </h5>
                    <h5 class="text text-center"><strong>Proyectos: </strong> {{$numero_proyectos}}
                        de {{$total_proyectos}}</h5>
                </div>
                @switch($tipo_de_suscripcion)
                    @case(1)
                        <img style="width: 12rem; border-radius: 50%" src="{{ asset('/img/bronce_subs.png') }}" alt="Imagen bronce">
                        @break
                    @case(2)
                        <img style="width: 12rem; border-radius: 50%" src="{{ asset('/img/silver_subs.png') }}" alt="Imagen bronce">
                        @break
                    @case(3)
                        <img style="width: 12rem; border-radius: 50%" src="{{ asset('/img/golden_subs.png') }}" alt="Imagen golden">
                        @break
                    @case(4)
                        <img style="width: 12rem; border-radius: 50%" src="{{ asset('/img/platinum_subs.png') }}" alt="Imagen bronce">
                        @break
                @endswitch
            </div>
        </div>
    @endif
    <div class="row m-0 p-0 row-presentacion">
        <style>
            .row-presentacion {
                display: flex;
                flex-direction: column;
                align-items: center;
                align-content: center;
                justify-content: center;
                min-height: 100%;
                height: calc(100vh - 130px);
            }

            .row-presentacion img {
                width: 50%;
                max-width: 300px;
                border-radius: 15px;
                overflow: hidden;
                box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
            }

            .row-presentacion h3 {
                text-shadow: 0 0 2px #FFF;
                font-size: 1.8rem;
            }

            .row-presentacion h5 {
                text-shadow: 0 0 2px #FFF;
                font-weight: bolder;
                color: #222;
                font-size: 1.5rem;
            }
        </style>

        <h3 class="font-weight-bold text-primary">Bienvenido a V2M</h3>
        <h5 class="text-center mb-4">La aplicación de software para la validación y verificación de métodos</h5>

        <div class="d-flex">
            <a class="btn btn-primary btn-icon-split mb-4 btnEvent btn-shadow-per" data-event="click"
               data-route="SeeSection_CorridaArea">
            <span class="icon text-white">
                <i class="fas fa-external-link-alt"></i>
            </span>
                <!--<span class="text text-white">Ir al módulo EP09</span>-->
                <span class="text text-white">Ir al módulo de comparación de métodos (EP09c)</span>
            </a>
            <a class="btn btn-dark btn-icon-split mb-4 btnEvent ml-2 btn-shadow-per" data-event="click"
               data-route="SeeSection_ProyectoEP15">
            <span class="icon text-white">
                <i class="fas fa-external-link-alt"></i>
            </span>
                <!--<span class="text text-white">Ir al módulo EP15</span>-->
                <span class="text text-white">Ir al módulo de verificación de métodos (EP15-A3)</span>
            </a>
            <a class="btn btn-primary btn-icon-split mb-4 btnEvent ml-2 btn-shadow-per" data-event="click"
               data-route="SeeSection_ProyectoEP17">
            <span class="icon text-white">
                <i class="fas fa-external-link-alt"></i>
            </span>
                <!--<span class="text text-white">Ir al módulo EP15</span>-->
                <span class="text text-white">Ir al módulo de LoB, LoD, LoQ.  Basado en la guía CLSI EP17</span>
            </a>
        </div>

    </div>
</div>
