@extends('padre.padre')
@section('contenido')

<div class="tituloGen d-flex justify-content-center">
    <img class="logoPosnet" src="{{ asset('img/psntbutonhome2.jpg')}}" alt="Gestion de ventas">
</div>

@if (session()->get("perfil")==1)
<div class="minicard d-flex" style="justify-content: center; align-content: center;">
    <a href="contabilidad" class="btn bg-warning col-md-3" role="button">CONTABILIDAD <p class="liteicon">📑</p></a>
</div>
@endif

<div style="width:20%;"><a href="salir" class="btn salirApp" role="button" title="Cerrar Sesion"></a></div>

<div class="d-flex justify-content-center">
    @include('../menu.bodegas')
    @include('../modales.editarPorcentageVentas')
    @include('../modales.modalSaldoFacturas')
</div>

<style>
    span{
        zoom: 130%
    }
.dashboard-container {
    padding: 20px;
    max-width: 1600px;
    margin: 0 auto;
    background: linear-gradient(135deg, #E6F3FF 0%, #B3D9FF 25%, #87CEEB 50%, #5DADE2 75%, #3498DB 100%);
    min-height: 100vh;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 24px;
    align-items: start;
}

.dashboard-card {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(31, 38, 135, 0.37);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    overflow: hidden;
    transition: all 0.3s ease;
    height: fit-content;
}

.dashboard-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 40px rgba(31, 38, 135, 0.5);
}

.card-header {
    padding: 20px 24px;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    border-bottom: none;
}

.card-header h3 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: white;
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.card-header img {
    width: 28px;
    height: 28px;
    filter: brightness(0) invert(1) drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}

.card-header .config-btn {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    padding: 0;
    font-size: 0.9rem;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

.card-header .config-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-50%) scale(1.1);
}

.card-body {
    padding: 0;
}

.btn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    padding: 24px;
}

.dashboard-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 56px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.8) 100%);
    color: #2c3e50;
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    position: relative;
    overflow: hidden;
}

.dashboard-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s;
}

.dashboard-btn:hover::before {
    left: 100%;
}

.dashboard-btn:hover {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: white;
    border-color: #2c3e50;
    text-decoration: none;
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 12px 28px rgba(44, 62, 80, 0.3);
}

.dashboard-btn .liteicon {
    font-size: 1.4rem;
    margin: 0;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));
    transition: all 0.3s ease;
}

.dashboard-btn:hover .liteicon {
    transform: scale(1.2) rotate(5deg);
    filter: drop-shadow(0 4px 8px rgba(255,255,255,0.3));
}

@media (max-width: 1200px) {
    .dashboard-grid {
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    }
}

@media (max-width: 768px) {
    .dashboard-container {
        padding: 16px;
    }
    
    .dashboard-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .btn-grid {
        grid-template-columns: 1fr;
        padding: 16px;
        gap: 8px;
    }
    
    .card-header {
        padding: 12px 16px;
    }
    
    .card-header h3 {
        font-size: 1rem;
    }
    
    .dashboard-btn {
        font-size: 0.8rem;
        padding: 10px 14px;
        min-height: 44px;
    }
}

.single-btn-section .btn-grid {
    padding: 20px 24px;
}

.accordion-style {
    border: none !important;
}

.accordion-button {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-weight: 600;
    font-size: 1.1rem;
}

.accordion-body {
    padding: 0 !important;
}
</style>

<div class="dashboard-container">
    <div class="dashboard-grid">
        
        <!-- GESTIÓN DE VENTAS -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/ventas1admin.svg')}}" alt="Gestion de ventas">
                <h3>GESTIÓN DE VENTAS</h3>
                @if(session()->get("perfil")==1)
                <button type="button" class="btn btn-dark config-btn" data-bs-toggle="modal" data-bs-target="#configvents" id="carteracliente">C</button>
                @endif
            </div>
            
            @if (session()->get("perfil")==1 || session()->get("usuarioNam") !="cajamil")
            <div class="card-body">
                <div class="btn-grid">
                    @if (session()->get("perfil")==1)
                    
                    
                    <a href="permisos" class="dashboard-btn" {{session()->get("VerPermisos")}}>
                        <span>PERMISOS</span>
                        <span class="liteicon">🧑🏼‍🦰</span>
                    </a>
                    
                    <a href="vendedores" class="dashboard-btn">
                        <span>VENDEDORES</span>
                        <span class="liteicon">🧑🏼‍🦰</span>
                    </a>
                    
                    <a href="gastos" class="dashboard-btn">
                        <span>DETALLE DE GASTOS</span>
                        <span class="liteicon">📝</span>
                    </a>
                    
                    <a href="devolu" class="dashboard-btn">
                        <span>INFORME DEVOLUCIONES</span>
                        <span class="liteicon">📑</span>
                    </a>
                    
                    <a href="ventas" class="dashboard-btn" {{session()->get("BloqValoresAdmin")}}>
                        <span>INFORME DE VENTAS</span>
                        <span class="liteicon">📊</span>
                    </a>
                    
                    <a href="rotacionP" class="dashboard-btn">
                        <span>ROTACION PRODUCTOS</span>
                        <span class="liteicon">📊</span>
                    </a>
                    
                    <a href="facturas" class="dashboard-btn">
                        <span>FACTURAS</span>
                        <span class="liteicon">📑</span>
                    </a>
                    
                    <a href="ventacateMarca" class="dashboard-btn" {{session()->get("BloqValoresAdmin")}}>
                        <span>VENTAS MARCA CATEGO</span>
                        <span class="liteicon">⚖️</span>
                    </a>
                    @endif
                    
                    @if (session()->get("usuarioNam") !="cajamil"  )
                    <a href="comisiones" class="dashboard-btn" {{session()->get("mostrarPagoComisiones")}}>
                        <span>PAGO DE COMISIONES</span>
                        <span class="liteicon">💵</span>
                    </a>
                    @endif
                </div>
            </div>
            @endif
        </div>

        <!-- GESTIÓN DE INVENTARIO -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/inventario1admin.svg')}}" alt="Gestion del inventario">
                <h3>GESTIÓN DE INVENTARIO</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    @if (session()->get("perfil")==1)
                    <a href="#" id="Exportarcatalo" class="dashboard-btn">
                        <span>EXPORTAR CATALOGO</span>
                        <span class="liteicon">⬆️</span>
                    </a>
                    
                    <a href="vistacostoInventario" class="dashboard-btn">
                        <span>COSTOS DE INVENTARIO</span>
                        <span class="liteicon">💰</span>
                    </a>
                    
                    <a href="vistaActulizarProd" class="dashboard-btn">
                        <span>ACTUALIZAR PRODUCTOS</span>
                        <span class="liteicon">⬆️</span>
                    </a>
                    @else
                        @if (session()->get("vercontolInventario")=="")
                        <a href="vistacostoInventario" class="dashboard-btn">
                            <span>COSTOS DE INVENTARIO</span>
                            <span class="liteicon">💰</span>
                        </a>
                        
                        <a href="#" id="Exportarcatalo" class="dashboard-btn">
                            <span>EXPORTAR CATALOGO</span>
                            <span class="liteicon">⬆️</span>
                        </a>
                        @endif
                    @endif
                    
                    <a href="plano" class="dashboard-btn">
                        <span>CARGUE PLANO</span>
                        <span class="liteicon">📉</span>
                    </a>
                    
                    <a href="compras" class="dashboard-btn">
                        <span>COMPRA FACTURAS</span>
                        <span class="liteicon">📜</span>
                    </a>
                    
                    <a href="vistaProductosCompra" class="dashboard-btn">
                        <span>COMPRA PRODUCTOS</span>
                        <span class="liteicon">📜</span>
                    </a>
                    
                    <a href="vencimientos" class="dashboard-btn">
                        <span>VENCIMIENTOS</span>
                        <span class="liteicon">📜</span>
                    </a>
                    
                    <a href="sugeridoVista" class="dashboard-btn">
                        <span>SUGERIDO COMPRA</span>
                        <span class="liteicon">🛒</span>
                    </a>
                    
                    <a href="vistacambiarcodigo" class="dashboard-btn">
                        <span>CAMBIAR CODIGO</span>
                        <span class="liteicon">🔧</span>
                    </a>
                </div>
            </div>
        </div>

        <!-- GESTIÓN DE CLIENTES -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/clientes1.svg')}}" alt="Gestion De Clientes">
                <h3>GESTIÓN DE CLIENTES</h3>
                @if (session()->get("perfil")==1)
                <button type="button" class="btn btn-dark config-btn" data-bs-toggle="modal" data-bs-target="#modlafacturaSal">SF</button>
                @endif
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    <a href="reagenda" class="dashboard-btn">
                        <span>REAGENDAMIENTO</span>
                        <span class="liteicon">🗓</span>
                    </a>
                    
                    <a href="ventasClientes" class="dashboard-btn">
                        <span>VENTAS POR CLIENTE</span>
                        <span class="liteicon">🗂</span>
                    </a>
                    
                    @if (session()->get("perfil")==1)
                    <a href="exportarClientes" class="dashboard-btn">
                        <span>CATALOGO CLIENTES</span>
                        <span class="liteicon">📗</span>
                    </a>
                    
                    <a href="puntos" class="dashboard-btn">
                        <span>PUNTOS CLIENTES</span>
                        <span class="liteicon">📜</span>
                    </a>
                    @endif
                    
                    <a href="participantes" class="dashboard-btn">
                        <span>PARTICIPANTES</span>
                        <span class="liteicon">📗</span>
                    </a>
                    <a href="asignarDomicilio" class="dashboard-btn">
                        <span>ASIGNAR DOMICILIARIO</span>
                        <span class="liteicon">🚚</span>
                    </a>
                </div>
            </div>
        </div>

        <!-- INVENTARIO AVANZADO -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/inventario1admin2.svg')}}" alt="Gestion del inventario 2">
                <h3>INVENTARIO AVANZADO</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    @if (session()->get("perfil")==1)
                    <a href="vistacaptura" class="dashboard-btn">
                        <span>TOMA INVENTARIO</span>
                        <span class="liteicon">📋</span>
                    </a>
                    
                    <a href="ubicaciones" class="dashboard-btn">
                        <span>UBICACIONES</span>
                        <span class="liteicon">📜</span>
                    </a>
                    
                    <a href="marcacate" class="dashboard-btn">
                        <span>MARCAS Y CATEGORIAS</span>
                        <span class="liteicon">📖</span>
                    </a>
                    @else
                        @if (session()->get("vercontolInventario")=="")
                        <a href="vistacaptura" class="dashboard-btn">
                            <span>TOMA INVENTARIO</span>
                            <span class="liteicon">📋</span>
                        </a>
                        @endif
                    @endif
                    
                    <a href="traslados" class="dashboard-btn">
                        <span>TRASLADOS</span>
                        <span class="liteicon">🚚</span>
                    </a>
                    
                    <a href="inftraslados" class="dashboard-btn">
                        <span>INFORME TRASLADOS</span>
                        <span class="liteicon">📈</span>
                    </a>


                    @if (session()->get("perfil")==1)
                    <a href="vistadomicilio" class="dashboard-btn">
                        <span>DOMICILIOS</span>
                        <span class="liteicon">📋</span>
                    </a>

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

        <!-- DROGUERÍA -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/drogueria1.svg')}}" alt="Gestion Drogueria">
                <h3>GESTIÓN DROGUERÍA</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    <a href="temperatura" class="dashboard-btn">
                        <span>TEMPERATURAS</span>
                        <span class="liteicon">🌡</span>
                    </a>
                    
                    <a href="vercuadre" class="dashboard-btn">
                        <span>CUADRE CAJA</span>
                        <span class="liteicon">📜</span>
                    </a>
                    
                    <a href="recepcion" class="dashboard-btn">
                        <span>ACTA RECEPCION</span>
                        <span class="liteicon">📋</span>
                    </a>
                    
                    @if (session()->get("perfil")==1)
                    <a href="actulizaciones" class="dashboard-btn">
                        <span>ACTUALIZACIONES</span>
                        <span class="liteicon">📈</span>
                    </a>
                    
                    <a href="vistapresupuesto" class="dashboard-btn">
                        <span>PRESUPUESTO</span>
                        <span class="liteicon">🧮</span>
                    </a>
                    
                    <a href="vistacumplimiento" class="dashboard-btn">
                        <span>CUMPLIMIENTOS</span>
                        <span class="liteicon">✅</span>
                    </a>
                    @endif
                </div>
            </div>
        </div>

        <!-- GESTIÓN DE ENTRADAS -->
        <div class="dashboard-card">
            <div class="card-header">
                <img src="{{ asset('img/inventario1admin2.svg')}}" alt="Gestion del inventario 3">
                <h3>GESTIÓN DE ENTRADAS</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    @if (session()->get("perfil")==1)
                    <a href="producDescuto" class="dashboard-btn">
                        <span>PRODUCTOS DTO</span>
                        <span class="liteicon">📇</span>
                    </a>
                    @endif
                    
                    <a href="aleatorios" class="dashboard-btn">
                        <span>ALEATORIOS</span>
                        <span class="liteicon">🔄</span>
                    </a>
                    
                    <a href="confirmartraslados" class="dashboard-btn">
                        <span>CONFIRMAR TRASLADOS</span>
                        <span class="liteicon">📇</span>
                    </a>
                    
                    <a href="informemoviminetos" class="dashboard-btn">
                        <span>SALIDAS Y ENTRADAS</span>
                        <span class="liteicon">➕/➖</span>
                    </a>
                    
                    <a href="revisionEscaneo" class="dashboard-btn">
                        <span>VERIFICAR MERCANCIA</span>
                        <span class="liteicon">✏️</span>
                    </a>


                      <a href="consulta-cajamayor" class="dashboard-btn">
                        <span>MOVIMIENTOS CAJA</span>
                        <span class="liteicon">✏️</span>
                    </a>

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

        <!-- GESTIÓN DE COCINAS -->
        <div class="dashboard-card single-btn-section">
            <div class="card-header">
                <h3>GESTIÓN COCINAS</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    <a href="vistacocina" class="dashboard-btn">
                        <span>COCINA</span>
                        <span class="liteicon">🍳</span>
                    </a>
                </div>
            </div>
        </div>

        <!-- GESTIÓN VENTAS 2 -->
        <div class="dashboard-card single-btn-section">
            <div class="card-header">
                <h3>GESTIÓN VENTAS 2</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    <a href="vistaparticipante" class="dashboard-btn">
                        <span>VENTAS POR PARTICIPANTE</span>
                        <span class="liteicon">🟰</span>
                    </a>
                </div>
            </div>
        </div>


         <!-- GESTIÓN VENTAS 2 -->
        <div class="dashboard-card single-btn-section">
            <div class="card-header">
                <h3>OTROS</h3>
            </div>
            
            <div class="card-body">
                <div class="btn-grid">
                    <a href="infoguiasvista" class="dashboard-btn">
                        <span>INFORME GUIAS</span>
                        <span class="liteicon">🟰</span>
                    </a>
                </div>
            </div>
        </div>

    </div>
</div>









@endsection

@section("pie")
<script src="{{ asset('js/generales.js') }}"></script>
@endsection