<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Al Rahma Sunday School</title>

    <!-- Favicon -->
    <link rel="icon" href="<?= base_url('assets/images/favicon.ico') ?>">

    <!-- Bootstrap 5 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Select2 CSS with Bootstrap 5 theme -->
    <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" />

    <!-- Custom CSS -->
    <link rel="stylesheet" href="<?= base_url('assets/css/custom.css') ?>">
</head>

<body>
    <!-- Navbar -->
    <?php include(__DIR__ . '/../partials/navbar.php'); ?>
    <?php
      $mainSchoolYearSelectorData = [];
      if (!isset($schoolYearContext, $schoolYearOptions) && session()->get('user_id')) {
        try {
          $mainSchoolYearSelectorData = service('schoolYearViewData')->forCurrentRequest(service('request'));
          $mainSchoolYearSelectorData['schoolYearSelectorEnabled'] = true;
        } catch (\Throwable $e) {
          log_message('warning', 'Unable to load main school-year selector: {message}', [
            'message' => $e->getMessage(),
          ]);
        }
      }
    ?>
    <?= view('partials/school_year_selector', $mainSchoolYearSelectorData) ?>

    <div class="container my-4">
        <?= $this->renderSection('content') ?>
    </div>

    <!-- Footer -->
    <?php include(__DIR__ . '/../partials/footer.php'); ?>

    <!-- ✅ JS Scripts (correct order) -->

    <!-- jQuery (must come first) -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>

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

    <!-- Bootstrap Bundle JS (for modal, tooltips, etc.) -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
    <!-- ✅ Your validation logic (depends on jQuery & Select2) -->
    <script type="module" src="/public/assets/js/validate_student.js"></script>
    <script src="<?= base_url('assets/js/modal_validation.js') ?>"></script>
    

</body>

</html>
