@extends('admin.layouts.master')

@section('title', 'Dashboard - Lash Vanshy')

@section('page-title', 'Dashboard')

@section('content')
<!-- Stats Cards -->
<div class="row g-4 mb-4">
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon primary">
                <i class="fas fa-envelope"></i>
            </div>
            <div class="stat-info">
                <h3>{{ $stats['mensajes_no_leidos'] }}</h3>
                <p>Mensajes nuevos</p>
            </div>
        </div>
    </div>
    
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon success">
                <i class="fas fa-images"></i>
            </div>
            <div class="stat-info">
                <h3>{{ $stats['total_modelos'] }}</h3>
                <p>Total Modelos</p>
            </div>
        </div>
    </div>
    
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon warning">
                <i class="fas fa-spa"></i>
            </div>
            <div class="stat-info">
                <h3>{{ $stats['total_productos'] }}</h3>
                <p>Total Servicios</p>
            </div>
        </div>
    </div>
    
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon info">
                <i class="fas fa-star"></i>
            </div>
            <div class="stat-info">
                <h3>{{ $stats['productos_destacados'] }}</h3>
                <p>Servicios Destacados</p>
            </div>
        </div>
    </div>
</div>

<!-- Quick Actions & Recent Messages -->
<div class="row g-4">
    <!-- Quick Actions -->
    <div class="col-lg-4">
        <div class="card-admin">
            <div class="card-header">
                <i class="fas fa-bolt me-2"></i>Accesos Rápidos
            </div>
            <div class="card-body">
                <div class="d-flex flex-column gap-3">
                    <a href="{{ route('admin.galeria.create') }}" class="btn btn-primary-admin">
                        <i class="fas fa-plus me-2"></i>Nuevo Modelo
                    </a>
                    <a href="{{ route('admin.productos.create') }}" class="btn btn-secondary-admin">
                        <i class="fas fa-plus me-2"></i>Nuevo Servicio
                    </a>
                    <a href="{{ route('admin.mensajes.index') }}" class="btn btn-secondary-admin">
                        <i class="fas fa-envelope me-2"></i>Ver Mensajes
                        @if($stats['mensajes_no_leidos'] > 0)
                        <span class="badge bg-danger ms-2">{{ $stats['mensajes_no_leidos'] }}</span>
                        @endif
                    </a>
                    <a href="{{ route('home') }}" target="_blank" class="btn btn-secondary-admin">
                        <i class="fas fa-external-link-alt me-2"></i>Ver Sitio Web
                    </a>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Recent Messages -->
    <div class="col-lg-8">
        <div class="card-admin">
            <div class="card-header d-flex justify-content-between align-items-center">
                <span>
                    <i class="fas fa-envelope-open-text me-2"></i>Mensajes Recientes
                </span>
                <a href="{{ route('admin.mensajes.index') }}" class="btn btn-sm btn-primary-admin">
                    Ver Todos
                </a>
            </div>
            <div class="card-body p-0">
                @if($mensajes_recientes->isNotEmpty())
                <div class="table-responsive">
                    <table class="table table-admin mb-0">
                        <thead>
                            <tr>
                                <th>Nombre</th>
                                <th>Asunto</th>
                                <th>Fecha</th>
                                <th>Estado</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($mensajes_recientes as $mensaje)
                            <tr>
                                <td>
                                    <strong>{{ $mensaje->nombre }}</strong>
                                    <br>
                                    <small class="text-muted">{{ $mensaje->email }}</small>
                                </td>
                                <td>{{ Str::limit($mensaje->mensaje, 40) }}</td>
                                <td>{{ $mensaje->created_at->format('d/m/Y') }}</td>
                                <td>
                                    @if($mensaje->leido)
                                    <span class="badge-admin bg-success">Leído</span>
                                    @else
                                    <span class="badge-admin bg-warning">Nuevo</span>
                                    @endif
                                </td>
                                <td>
                                    <a href="{{ route('admin.mensajes.show', $mensaje) }}" class="btn btn-sm btn-primary-admin">
                                        <i class="fas fa-eye"></i>
                                    </a>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
                @else
                <div class="empty-state">
                    <i class="fas fa-inbox"></i>
                    <h4>No hay mensajes</h4>
                    <p>Los mensajes de contacto aparecerán aquí</p>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Site Preview -->
<div class="row g-4 mt-2">
    <div class="col-12">
        <div class="card-admin">
            <div class="card-header">
                <i class="fas fa-eye me-2"></i>Vista Previa del Sitio
            </div>
            <div class="card-body text-center">
                <p class="mb-3">Accede al sitio público y revisa los cambios realizados</p>
                <a href="{{ route('home') }}" target="_blank" class="btn btn-primary-admin">
                    <i class="fas fa-external-link-alt me-2"></i>Ver Sitio Web
                </a>
            </div>
        </div>
    </div>
</div>
@endsection