<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="favicon-32x32.png" sizes="32x32">
    <title>Dashboard</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <!-- nhạc -->
    <audio id="audioPlayer" loop>
        <source src="" type="audio/mpeg">
        Trình duyệt của bạn không hỗ trợ phát nhạc.
    </audio>
    <div id="notification" class="hidden"></div>
    <!-- Tuyết rơi -->
    <div class="snowflakes" aria-hidden="true">
        <div class="snowflake">❅</div>
        <div class="snowflake">❅</div>
        <div class="snowflake">❆</div>
        <div class="snowflake">❅</div>
        <div class="snowflake">❆</div>
        <div class="snowflake">❅</div>
        <div class="snowflake">❆</div>
        <div class="snowflake">❅</div>
        <div class="snowflake">❆</div>
        <div class="snowflake">❆</div>
    </div>
    <!-- User -->
    <div class="showUser">
        <div id="userInfo"></div>
    </div>
    <!-- Sidebar -->
    <div class="sidebar">
        <h2>MENU ©𝕫𝕖𝕨𝕜</h2>
        <ul id="menuList">
        <li class="menu-item" data-role="AD,QL,NV"><a href="#" id="openScheduleRegistration">Đăng Ký Lịch Làm</a></li>
        <li class="menu-item" data-role="AD,QL"><a href="#">Xếp Lịch Làm</a></li>
        <li class="menu-item" data-role="AD,QL,NV"><a href="#">Lịch Làm Chính Thức</a></li>
        <li class="menu-item" data-role="AD,QL"><a href="#">Info Cửa Hàng</a></li>
        <li class="menu-item" data-role="AD,AM"><a href="#">Info Cửa Hàng ZONE</a></li>
        <li class="menu-item" data-role="AD,NV"><a href="#">Gửi Yêu Cầu</a></li>
        <li class="menu-item" data-role="AD,QL"><a href="#">Xử Lý Yêu Cầu</a></li>
        <li class="menu-item" data-role="AD"><a href="#">Phân Quyền</a></li>
        <li class="menu-item" data-role="AD,QL,AM,NV"><a href="#">Thông Tin Cá Nhân</a></li>
    </ul>
        <button id="logout" class="logout-btn">Đăng xuất</button>
    </div>

    <!-- Main Content -->
    <div class="main">
        <div id="notification" class="hidden"></div>
        <button id="backButton" class="btn hidden">Quay lại</button>
        <div id="content">
          <h1>Dashboard</h1>
    </div>
    </div>

    <script type="module" src="script.js"></script>
</body>
</html>