<?php
// Incluimos helpers y topbar
require_once __DIR__ . '/../includes/version.php';
include_once __DIR__ . '/../includes/topbar.php';
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dashboard - Sistema de Horarios</title>
    
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    
    <!-- Custom CSS (con cache busting) -->
    <link href="<?= asset('/frontend/assets/css/dashboard/dashboard.css') ?>" rel="stylesheet">
    <link href="<?= asset('/frontend/assets/css/includes/topbar.css') ?>" rel="stylesheet">
    <link href="<?= asset('/frontend/assets/css/styles.css') ?>" rel="stylesheet">
</head>
<body class="d-flex flex-column min-vh-100">
    <!-- Topbar se incluye aquí -->
    <?php include_once __DIR__ . '/../includes/topbar.php'; ?>

    <style>
    .topbar-navbar {
        width: 100vw !important;
        left: 0;
        position: relative;
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
        border-radius: 0 !important;
    }
    </style>
    
    <div class="container-fluid mt-4 flex-grow-1">
        <div class="row">
            <div class="col-12">
                <div class="card shadow-sm">
                    <div class="card-header bg-white">
                        <h5 class="card-title mb-0">
                            <i class="fas fa-tachometer-alt me-2"></i>Panel de Control
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="alert alert-info">
                            <h6 class="alert-heading">Bienvenido, <?php echo htmlspecialchars($_SESSION['user_name']); ?></h6>
                            <p class="mb-0">Has iniciado sesión correctamente en el Sistema de Horarios.</p>
                        </div>
                        
                        <div class="row">
                            <div class="col-md-6 mb-4">
                                <div class="card h-100 border-primary">
                                    <div class="card-body">
                                        <h6 class="card-subtitle mb-2 text-muted">Tu información</h6>
                                        <ul class="list-group list-group-flush">
                                            <li class="list-group-item d-flex justify-content-between">
                                                <span>ATTUID:</span>
                                                <strong><?php echo htmlspecialchars($_SESSION['user_attuid']); ?></strong>
                                            </li>
                                            <li class="list-group-item d-flex justify-content-between">
                                                <span>Puesto:</span>
                                                <strong><?php echo htmlspecialchars($_SESSION['user_puesto']); ?></strong>
                                            </li>
                                            <li class="list-group-item d-flex justify-content-between">
                                                <span>PDV:</span>
                                                <strong><?php echo htmlspecialchars($_SESSION['user_pdv']); ?></strong>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-md-6 mb-4">
                                <div class="card h-100 border-success">
                                    <div class="card-body">
                                        <h6 class="card-subtitle mb-2 text-muted">Acciones rápidas</h6>
                                        <div class="d-grid gap-2">
                                            <button class="btn btn-outline-primary" onclick="window.location.href='../views/horarios/crear.php'">
                                            <i class="fas fa-calendar-plus me-1"></i> Crear horario
                                        </button>
                                        <script>
                                        document.addEventListener('DOMContentLoaded', function() {
                                            const btnCrear = document.querySelector('button.btn-outline-primary[onclick*="crear.php"]');
                                            fetch('../../backend/api/horario_edicion_flag.php')
                                                .then(r => r.json())
                                                .then(data => {
                                                    if (!data.activar_crear_horario) {
                                                        btnCrear.disabled = true;
                                                        btnCrear.classList.add('btn-secondary');
                                                        btnCrear.classList.remove('btn-outline-primary');
                                                        btnCrear.title = 'Desactivado por el administrador';
                                                    } else {
                                                        btnCrear.disabled = false;
                                                        btnCrear.classList.remove('btn-secondary');
                                                        btnCrear.classList.add('btn-outline-primary');
                                                        btnCrear.title = '';
                                                    }
                                                });
                                        });
                                        </script>
                                            <button class="btn btn-outline-success" onclick="window.location.href='../views/equipo/gestionar.php'">
                                                <i class="fas fa-users me-1"></i> Gestionar nuevos colaboradores
                                            </button>
                                            <button class="btn btn-outline-info" onclick="window.location.href='../views/horarios/ver_generados.php'">
                                                <i class="fas fa-calendar-alt me-1"></i> Ver horarios
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Bootstrap JS Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>