<?php $modId = $routeParts[1] ?? ''; ?>
            <a href="/admin/moderators" style="color:var(--accent); text-decoration:none;">&larr; Zpět na seznam moderátorů</a>
            <h1>Karta moderátora</h1>
            <div class="glass" style="padding: 20px; margin-bottom: 20px;" id="profileHeader"><h2>Načítám...</h2></div>
            <div class="glass" style="padding: 20px;">
                <h3>Naplánované / Odehrané směny</h3>
                <table><thead><tr><th>Datum</th><th>Čas</th><th>Stav</th></tr></thead><tbody id="profileShiftsTable"><tr><td colspan="3">Načítám data...</td></tr></tbody></table>
            </div>
            <script>
                async function loadProfile() {
                    const modId = '<?php echo htmlspecialchars($modId); ?>'; if (!modId) return document.getElementById('profileHeader').innerHTML = '<h2>Chyba: Nebyl zadán moderátor</h2>';
                    const res = await fetch(`/admin/api/moderator-profile?id=${modId}`); const json = await res.json();
                    if (json.status === 'error') return document.getElementById('profileHeader').innerHTML = `<h2>${json.message}</h2>`;
                    const mod = json.data.moderator; document.getElementById('profileHeader').innerHTML = `<h2>${mod.name}</h2><p><strong>E-mail:</strong> ${mod.email || '-'}</p><p><strong>Stav:</strong> ${mod.active ? '🟢 Aktivní' : '🔴 Neaktivní'}</p>`;
                    const tbody = document.getElementById('profileShiftsTable'); if (json.data.shifts.length === 0) return tbody.innerHTML = '<tr><td colspan="3">Žádné směny v kalendáři.</td></tr>';
                    tbody.innerHTML = ''; const nowStr = new Date().toISOString().split('T')[0] + ' ' + new Date().getHours().toString().padStart(2, '0');
                    json.data.shifts.forEach(shift => {
                        const shiftStr = shift.date + ' ' + shift.hour.toString().padStart(2, '0'); const state = shiftStr < nowStr ? 'Odehráno' : (shiftStr === nowStr ? '🔴 ON-AIR' : 'Čeká'); const color = shiftStr < nowStr ? '#aaa' : (shiftStr === nowStr ? 'var(--accent)' : 'white');
                        tbody.innerHTML += `<tr style="color: ${color}"><td>${shift.date}</td><td>${shift.hour.toString().padStart(2, '0')}:00 - ${(parseInt(shift.hour)+1).toString().padStart(2, '0')}:00</td><td>${state}</td></tr>`;
                    });
                }
                loadProfile();
            </script>