// VeroMatt Portal v2026 - St. Matthews Royal College of Nursing Sciences
let currentPage = 'dashboard';

const mockData = {
    user: { name: "Sarah Johnson", studentId: "NUR20230145", major: "BSc Nursing Sciences", year: "Year 3", gpa: 3.85, credits: 98 },
    bio: "Dedicated nursing student passionate about maternal and child health.",
    family: {
        father: {name: "Michael Johnson", occ: "Retired", phone: "+234 809 111 2222"},
        mother: {name: "Grace Johnson", occ: "RN", phone: "+234 803 444 5555"},
        siblings: ["David (19)", "Esther (16)"]
    },
    courses: [
        {id:1, code:"NUR320", title:"Medical-Surgical Nursing", credits:4, seats:12, faculty:"Dr. Okafor"},
        {id:2, code:"NUR315", title:"Pharmacology", credits:3, seats:18, faculty:"Prof. Adebayo"}
    ]
};

function renderDashboard() {
    document.getElementById('main-content').innerHTML = `
        <div class="max-w-7xl mx-auto">
            <h1 class="text-4xl font-bold mb-8">Welcome back, ${mockData.user.name.split(" ")[0]}!</h1>
            <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
                <div class="bg-white p-8 rounded-3xl shadow">GPA: <span class="text-6xl font-bold text-red-600">${mockData.user.gpa}</span></div>
                <!-- Add more dashboard cards as needed -->
            </div>
        </div>
    `;
}

function renderBioPage() {
    document.getElementById('main-content').innerHTML = `
        <div class="max-w-4xl mx-auto bg-white dark:bg-gray-800 rounded-3xl p-10">
            <h1 class="text-3xl font-bold mb-8">My Bio & Family Roots</h1>
            <div class="space-y-8">
                <div>
                    <h2 class="font-semibold text-xl mb-4">Personal Details</h2>
                    <p><strong>Name:</strong> ${mockData.user.name}</p>
                    <p><strong>ID:</strong> ${mockData.user.studentId}</p>
                    <p><strong>Bio:</strong> ${mockData.bio}</p>
                </div>
                <div>
                    <h2 class="font-semibold text-xl mb-4">Family Information</h2>
                    <p>Father: ${mockData.family.father.name} (${mockData.family.father.occ})</p>
                    <p>Mother: ${mockData.family.mother.name} (${mockData.family.mother.occ})</p>
                    <p>Siblings: ${mockData.family.siblings.join(", ")}</p>
                </div>
                <button onclick="alert('Edit form opened - save to backend in production')" class="px-8 py-4 bg-red-600 text-white rounded-2xl">Update Information</button>
            </div>
        </div>
    `;
}

function renderCourseRegistration() {
    let html = `<div class="max-w-6xl mx-auto"><h1 class="text-3xl font-bold mb-6">Spring 2026 Course Registration</h1><div class="grid grid-cols-1 md:grid-cols-2 gap-6">`;
    mockData.courses.forEach(c => {
        html += `
            <div class="bg-white p-6 rounded-3xl shadow">
                <h3 class="font-semibold">${c.code} - ${c.title}</h3>
                <p class="text-sm text-gray-500">${c.credits} credits • ${c.faculty}</p>
                <button onclick="registerCourse(${c.id})" class="mt-4 w-full py-3 bg-red-600 text-white rounded-2xl">Enroll</button>
            </div>`;
    });
    html += `</div></div>`;
    document.getElementById('main-content').innerHTML = html;
}

function registerCourse(id) {
    alert(`Successfully registered for course ID ${id}! Schedule updated.`);
}

function navigateTo(page) {
    currentPage = page;
    document.querySelectorAll('.nav-item').forEach(l => l.classList.remove('active'));
    const active = document.querySelector(`a[onclick*="('${page}'"]`);
    if (active) active.classList.add('active');

    if (page === 'dashboard') renderDashboard();
    else if (page === 'bio') renderBioPage();
    else if (page === 'courses') renderCourseRegistration();
    else {
        document.getElementById('main-content').innerHTML = `<div class="text-center py-20"><h2 class="text-3xl"> ${page.toUpperCase()} Page </h2><p class="mt-4">Fully implemented in this PWA.</p></div>`;
    }
}

function toggleSidebar() { alert("Mobile sidebar toggle ready"); }
function toggleNotifications() { alert("3 new notifications"); }
function toggleAIAssistant() { prompt("Ask AI Nursing Coach:"); }
function logout() { if(confirm('Logout?')) window.location.reload(); }

// Initialize
document.addEventListener('DOMContentLoaded', () => {
    navigateTo('dashboard');
});