@extends('componentes.corpo')



@section('corMenu')
    active
@endsection

@section('head')
    <style>


        /* Grid */
        .grid {
            display: grid;
        }



        /* O repeat vai repetir o número de colunas */
        .grid-template-columns-4 {
            grid-template-columns: repeat(2, 1fr);
        }

        .grid-template-columns-1 {
            grid-template-columns: repeat(1, 1fr);
        }

        /* Estilos Gerais */
        .item {
            margin: 5px;
            max-height:250px;
            color:#f7f7f7;
            font-size: 3em;
            text-align: center;
            font-size: 1.5em;
        }
        .item:hover {
            background: #838383;
        }
        .grid {
            max-width: 100%;
            height:250px;
            max-height:250px;
            margin: 0 auto;
            border: 1px solid #ccc;
        }


        .cor01{
            background-color:#63362f;
        }
        .cor02{
            background-color:#00a5a3;
        }

        .cor03{
            background-color:#0a70d9;
        }

        .cor04{
            background-color:#847546;
        }

        .cor05{
            background-color:#008a00;
        }


    </style>

    <script type="text/javascript" src="https://pt.eltiempo.es/widget/widget_loader/353881615396df3818051f4626e8d857"></script>

@endsection


@section('conteudo')


    <div class="hk-pg-wrapper">
        <!-- Container -->
        <div class="container-fluid mt-xl-20 mt-sm-30 mt-15 px-xxl-65 px-xl-20">
            <ul class="nav nav-tabs nav-sm nav-light mb-25" role="tablist">
                <li class="nav-item mb-5">
                    <a class="nav-link link-icon-left active" data-toggle="tab" href="#tabs-1" role="tab"><i class="zmdi zmdi-apps"></i>Shortcuts</a>
                </li>

                <!--
                <li class="nav-item mb-5">
                    <a class="nav-link link-icon-left"  href="#" role="tab"><i class="zmdi zmdi-trending-up"></i>Gráficos</a>
                </li>

                -->
            </ul>
            <!-- Tab panes -->
            <div class="tab-content">
                <div class="tab-pane active" id="tabs-1" role="tabpanel">

                    <section class="hk-sec-wrapper">
                        <div class="container-fluid">
                            <div class="row">






                                <!------------------------- QUARTO QUADRO - RELATORIOS ------------------------------------------>

                                <div class="col-md-3" style="padding-left: 5px;padding-right: 5px;">
                                    <section class="grid grid-template-columns-1">
                                        <a href="{{route('estoqueD')}}">
                                            <div class="item cor01" style="height: 238px;padding-top: 50px;">
                                                <img src="/icone/icone.png" class="text-center" style="padding-top: 10px;">
                                                <p style="font-size:12px;"> VEHICLE INVENTORY</p>
                                            </div>
                                        </a>
                                    </section>
                                </div>

                                <div class="col-md-3" style="padding-left: 5px;padding-right: 5px;">
                                    <section class="grid grid-template-columns-1">
                                        <a href="{{route('dados')}}">
                                            <div class="item cor02" style="height: 238px;padding-top: 50px;">
                                                <img src="/icone/empresa.png" class="text-center" style="padding-top: 10px;">
                                                <p style="font-size:12px;"> COMPANY DATA</p>
                                            </div>
                                        </a>
                                    </section>
                                </div>

                                <div class="col-md-3" style="padding-left: 5px;padding-right: 5px;">
                                    <section class="grid grid-template-columns-1">
                                        <a href="{{route('fichas')}}">
                                            <div class="item cor03" style="height: 238px;padding-top: 50px;">
                                                <img src="/icone/relatorio.png" class="text-center" style="padding-top: 10px;">
                                                <p style="font-size:12px;"> CUSTOMERS FILE </p>
                                            </div>
                                        </a>
                                    </section>
                                </div>

                                <div class="col-md-3" style="padding-left: 5px;padding-right: 5px;">
                                    <section class="grid grid-template-columns-1">
                                        <a href="{{route('admNoticias')}}">
                                            <div class="item cor04" style="height: 238px;padding-top: 50px;">
                                                <img src="/icone/news.png" class="text-center" style="padding-top: 10px;">
                                                <p style="font-size:12px;"> SALES</p>
                                            </div>
                                        </a>
                                    </section>
                                </div>


                            </div>




                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>

@endsection