            <h1>Správa uživatelů a rolí</h1>
            <div class="glass" style="padding: 20px; margin-bottom: 20px;">
                <form id="form-users" class="form-group" style="flex-wrap: wrap;">
                    <input type="hidden" id="userId">
                    <input type="text" id="userUsername" placeholder="Přihlašovací login" required style="width:30%;">
                    <div style="width:30%;"><div class="pwd-wrapper"><input type="password" id="userPassword" placeholder="Heslo (nechte prázdné)"><button type="button" class="pwd-toggle" onclick="togglePwd('userPassword', this)">👁️</button></div></div>
                    <input type="text" id="userName" placeholder="Zobrazované jméno" required style="width:30%;">
                    <select id="userRole" style="width:100%; margin-top: 10px;" onchange="document.getElementById('userModules').style.display = this.value === 'admin' ? 'none' : 'flex';">
                        <option value="admin">Administrátor (Plný přístup)</option><option value="moderator">Moderátor</option><option value="sales">Obchodník</option><option value="customer">Zákazník</option>
                    </select>
                    <div id="userModules" style="width:100%; margin-top: 10px; display:none; flex-wrap:wrap; gap:10px;">
                        <label><input type="checkbox" value="pages"> Stránky</label> <label><input type="checkbox" value="podcasts"> Podcasty</label> <label><input type="checkbox" value="requests"> Přání</label> <label><input type="checkbox" value="moderators"> Moderátoři</label> <label><input type="checkbox" value="calendar"> Kalendář</label> <label><input type="checkbox" value="ads"> Reklama a Obchod</label> <label><input type="checkbox" value="songs"> Historie songů</label> <label><input type="checkbox" value="stats"> Statistiky</label> <label><input type="checkbox" value="template"> Vzhled webu</label> <label><input type="checkbox" value="settings"> Nastavení (SMTP...)</label>
                    </div>
                    <button type="submit" style="margin-top:10px;">Uložit uživatele</button>
                    <button type="button" onclick="document.getElementById('form-users').reset(); document.getElementById('userId').value='';" style="margin-top:10px; background: rgba(255,255,255,0.2);">Zrušit</button>
                </form>
            </div>
            <div class="glass" style="padding: 20px;">
                <table><thead><tr><th>Login</th><th>Jméno</th><th>Role</th><th>Akce</th></tr></thead><tbody id="tbody-users"></tbody></table>
            </div>
            <script>
                let allUsersData = [];
                async function loadUsers() { const res = await fetch('/admin/api/users'); const json = await res.json(); allUsersData = json.data || []; document.getElementById('tbody-users').innerHTML = allUsersData.map((u, i) => `<tr><td>${u.username}</td><td>${u.name}</td><td>${u.role}</td><td><button class="action-btn" onclick="editUser(${i})">Upravit</button> ${u.username!=='admin' ? `<button class="action-btn btn-delete" onclick="delUser('${u.id}')">Smazat</button>`:''}</td></tr>`).join(''); }
                function editUser(i) { const u = allUsersData[i]; document.getElementById('userId').value = u.id; document.getElementById('userUsername').value = u.username; document.getElementById('userName').value = u.name; document.getElementById('userRole').value = u.role; document.getElementById('userModules').style.display = u.role === 'admin' ? 'none' : 'flex'; document.querySelectorAll('#userModules input').forEach(cb => cb.checked = (u.modules || []).includes(cb.value)); }
                async function delUser(id) { customConfirm('Smazat tohoto uživatele?', async () => { await fetch('/admin/api/users', { method: 'DELETE', headers: {'Content-Type':'application/json'}, body: JSON.stringify({id}) }); loadUsers(); }); }
                document.getElementById('form-users').addEventListener('submit', async (e) => { e.preventDefault(); const modules = Array.from(document.querySelectorAll('#userModules input:checked')).map(cb => cb.value); const payload = { id: document.getElementById('userId').value, username: document.getElementById('userUsername').value, name: document.getElementById('userName').value, role: document.getElementById('userRole').value, modules: JSON.stringify(modules) }; const pass = document.getElementById('userPassword').value; if(pass) payload.password = pass; await fetch('/admin/api/users', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); document.getElementById('form-users').reset(); document.getElementById('userId').value=''; loadUsers(); customAlert('Uživatel úspěšně uložen.', 'Uloženo'); });
                loadUsers();
            </script>