<?php
$direction = is_rtl() ? 'rtl' : 'ltr';
$langCode = current_lang();
$clubName = Config::get('club_name_en', 'Club Management');
$pageTitle = ($title ?? 'Dashboard') . ' | ' . $clubName;
?>
<!DOCTYPE html>
<html lang="<?= $langCode ?>" dir="<?= $direction ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="<?= csrf_token() ?>">
    <title><?= e($pageTitle) ?></title>

    <!-- Bootstrap 5.3 -->
    <?php if (is_rtl()): ?>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.rtl.min.css" rel="stylesheet">
    <?php else: ?>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <?php endif; ?>

    <!-- Font Awesome 6 -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet">

    <!-- DataTables -->
    <link href="https://cdn.datatables.net/1.13.8/css/dataTables.bootstrap5.min.css" rel="stylesheet">

    <!-- Select2 -->
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet">

    <!-- Flatpickr -->
    <link href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" rel="stylesheet">

    <!-- SweetAlert2 -->
    <link href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css" rel="stylesheet">

    <!-- App CSS -->
    <link href="/assets/css/app.css" rel="stylesheet">
    <?php if (is_rtl()): ?>
    <link href="/assets/css/rtl.css" rel="stylesheet">
    <?php endif; ?>

    <!-- Module CSS -->
    <?php foreach (ModuleRegistry::getCssFiles() as $css): ?>
    <link href="<?= $css ?>" rel="stylesheet">
    <?php endforeach; ?>

    <?= $__view->getStack('styles') ?? '' ?>
</head>
<body class="cms-body">
    <!-- Sidebar -->
    <nav id="sidebar" class="cms-sidebar">
        <div class="sidebar-header">
            <a href="/dashboard" class="sidebar-brand">
                <i class="fas fa-shield-alt me-2"></i>
                <span class="sidebar-brand-text"><?= e(Config::get('club_name_' . $langCode, 'CMS')) ?></span>
            </a>
            <button class="btn btn-sm sidebar-close d-lg-none" id="sidebarClose">
                <i class="fas fa-times"></i>
            </button>
        </div>
        <div class="sidebar-body">
            <ul class="nav flex-column">
                <li class="nav-item">
                    <a class="nav-link sidebar-link <?= active_class('/dashboard') ?>" href="/dashboard">
                        <i class="fas fa-tachometer-alt me-2"></i>
                        <span><?= lang('dashboard.title') ?></span>
                    </a>
                </li>
                <?= MenuBuilder::render() ?>
            </ul>
        </div>
        <div class="sidebar-footer">
            <small class="text-muted">&copy; <?= date('Y') ?> <?= e(Config::get('club_name_en', 'CMS')) ?></small>
        </div>
    </nav>

    <!-- Overlay -->
    <div class="sidebar-overlay" id="sidebarOverlay"></div>

    <!-- Main Content -->
    <div id="mainContent" class="cms-main">
        <!-- Header -->
        <header class="cms-header">
            <div class="d-flex align-items-center">
                <button class="btn btn-sm me-3 sidebar-toggle" id="sidebarToggle">
                    <i class="fas fa-bars fa-lg"></i>
                </button>
                <?php if (!empty($breadcrumbs)): ?>
                <nav aria-label="breadcrumb" class="d-none d-md-block">
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item"><a href="/dashboard"><i class="fas fa-home"></i></a></li>
                        <?php foreach ($breadcrumbs as $i => $crumb): ?>
                        <?php if (isset($crumb['url']) && $i < count($breadcrumbs) - 1): ?>
                        <li class="breadcrumb-item"><a href="<?= e($crumb['url']) ?>"><?= e($crumb['label']) ?></a></li>
                        <?php else: ?>
                        <li class="breadcrumb-item active"><?= e($crumb['label']) ?></li>
                        <?php endif; ?>
                        <?php endforeach; ?>
                    </ol>
                </nav>
                <?php endif; ?>
            </div>
            <div class="d-flex align-items-center gap-2">
                <!-- Language Switcher -->
                <div class="dropdown">
                    <button class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown">
                        <i class="fas fa-globe me-1"></i><?= strtoupper(current_lang()) ?>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-end">
                        <li><a class="dropdown-item" href="/lang/en">🇬🇧 English</a></li>
                        <li><a class="dropdown-item" href="/lang/ar">🇪🇬 العربية</a></li>
                    </ul>
                </div>
                <!-- User Dropdown -->
                <div class="dropdown">
                    <button class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown">
                        <i class="fas fa-user-circle me-1"></i>
                        <span class="d-none d-md-inline"><?= e(auth_user('full_name_en') ?? 'User') ?></span>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-end">
                        <li><a class="dropdown-item" href="/profile"><i class="fas fa-user me-2"></i><?= lang('auth.profile') ?></a></li>
                        <li><a class="dropdown-item" href="/change-password"><i class="fas fa-key me-2"></i><?= lang('auth.change_password') ?></a></li>
                        <li><hr class="dropdown-divider"></li>
                        <li>
                            <form method="POST" action="/logout" class="d-inline">
                                <?= csrf_field() ?>
                                <button type="submit" class="dropdown-item text-danger"><i class="fas fa-sign-out-alt me-2"></i><?= lang('auth.logout') ?></button>
                            </form>
                        </li>
                    </ul>
                </div>
            </div>
        </header>

        <!-- Alerts -->
        <div class="cms-content">
            <?php
            $alerts = Session::getFlash('alerts') ?? [];
            $error = Session::getFlash('error');
            $success = Session::getFlash('success');
            if ($error) $alerts[] = ['type' => 'danger', 'message' => $error];
            if ($success) $alerts[] = ['type' => 'success', 'message' => $success];
            ?>
            <?php foreach ($alerts as $alert): ?>
            <div class="alert alert-<?= e($alert['type']) ?> alert-dismissible fade show" role="alert">
                <?= e($alert['message']) ?>
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
            <?php endforeach; ?>

            <!-- Page Content -->
            <?= $content ?>
        </div>

        <!-- Footer -->
        <footer class="cms-footer">
            <span>&copy; <?= date('Y') ?> <?= e(Config::get('club_name_en', 'Club Management System')) ?>. All rights reserved.</span>
        </footer>
    </div>

    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

    <!-- Bootstrap 5.3 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>

    <!-- DataTables -->
    <script src="https://cdn.datatables.net/1.13.8/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.8/js/dataTables.bootstrap5.min.js"></script>

    <!-- Select2 -->
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

    <!-- Flatpickr -->
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>

    <!-- SweetAlert2 -->
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <!-- Chart.js -->
    <script src="https://cdn.jsdelivr.net/npm/chart.js@4"></script>

    <!-- Core JS -->
    <script src="/assets/js/app.js"></script>
    <script src="/assets/js/datatable-helper.js"></script>
    <script src="/assets/js/form-helper.js"></script>
    <script src="/assets/js/modal-helper.js"></script>

    <!-- Module JS -->
    <?php foreach (ModuleRegistry::getJsFiles() as $js): ?>
    <script src="<?= $js ?>"></script>
    <?php endforeach; ?>

    <?= $__view->getStack('scripts') ?? '' ?>
</body>
</html>