@extends('../layouts/partials/header')
{{-- @extends('layouts.app') --}}

@section('content')
<br>
<div class="container mt-4">
    <div class="row justify-content-center">
        <div class="col-md-10">
            <div class="card">
                <div class="card-header"><strong>Bienvenido</strong></div>
                <div class="card-body">
                    <div class="col-lg-10">
                        <div class="card shadow-sm border-0">
                            <div class="card-body p-4">
                            <h1 class="h3 mb-3">Plataforma web para control y seguimiento logístico</h1>
                            <p class="mb-4">
                                Nuestra plataforma web está diseñada para ofrecer una visión clara, precisa y en tiempo real del estatus de tus embarques y contenedores pendientes por atender. 
                                A través de una interfaz moderna e intuitiva, permite monitorear información clave como <strong>BL</strong>, <strong>contenedor</strong>, <strong>aduana</strong>, 
                                <strong>ETA</strong>, <strong>recinto</strong>, <strong>tipo de mercancía</strong>, <strong>costos de almacenaje</strong>, <strong>demoras</strong>, 
                                <strong>depósitos en garantía</strong> y <strong>gastos locales</strong>, asegurando una gestión logística más eficiente y proactiva.
                            </p>

                            <h2 class="h5 mb-3">Principales beneficios</h2>
                            <div class="row g-3">
                                <div class="col-md-6">
                                <div class="p-3 border rounded-3 h-100">
                                    <h3 class="h6 mb-2">Visibilidad total de los embarques</h3>
                                    <p class="mb-0">Consulta toda la información relevante de cada embarque de forma centralizada, facilitando el control operativo y la toma de decisiones.</p>
                                </div>
                                </div>
                                <div class="col-md-6">
                                <div class="p-3 border rounded-3 h-100">
                                    <h3 class="h6 mb-2">Alertas de tiempos críticos</h3>
                                    <p class="mb-0">Identificación temprana de riesgos como almacenajes, demoras y fechas próximas a vencimiento, evitando costos innecesarios.</p>
                                </div>
                                </div>
                                <div class="col-md-6">
                                <div class="p-3 border rounded-3 h-100">
                                    <h3 class="h6 mb-2">Control financiero logístico</h3>
                                    <p class="mb-0">Monitoreo detallado de conceptos como gastos locales, depósitos navieros y costos asociados al movimiento y liberación del contenedor.</p>
                                </div>
                                </div>
                                <div class="col-md-6">
                                <div class="p-3 border rounded-3 h-100">
                                    <h3 class="h6 mb-2">Optimización del flujo operativo</h3>
                                    <p class="mb-0">Mejora la coordinación entre áreas operativas, administrativas y de tráfico mediante información actualizada y accesible.</p>
                                </div>
                                </div>
                            </div>

                            <!-- Opcional: lista de campos visibles en el tablero -->
                            <hr class="my-4">
                            <h2 class="h6 text-muted">Campos visibles en el tablero</h2>
                            <ul class="small mb-0">
                                <li>BL</li>
                                <li>Contenedor</li>
                                <li>Aduana</li>
                                <li>ETA</li>
                                <li>Recinto</li>
                                <li>Tipo de mercancía</li>
                                <li>Costos de almacenaje</li>
                                <li>Demoras</li>
                                <li>Depósitos en garantía de navieras</li>
                                <li>Gastos locales</li>
                                <li>Otros...</li>
                            </ul>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@extends('../layouts/partials/footer')