(function(){
  function renderHeader(){
    const h = document.getElementById('pwa_header');
    if (!h) return;
    const role = localStorage.getItem('role') || 'Guest';
    const user = localStorage.getItem('user_id') || '';
    h.innerHTML = '<div class="logo">A</div><div style="margin-left:8px">AtulyaSolar</div><div style="margin-left:auto">Role: <strong>'+role+'</strong> <small>['+user+']</small> <button id="btn_devices" style="margin-left:12px">Devices</button></div>';
    document.getElementById('btn_devices').addEventListener('click', function(){ location.hash = '#devices'; });
  }
  document.addEventListener('DOMContentLoaded', renderHeader);
})();