/**
 * 導覽列樣式 - CSS 驅動顯示邏輯
 * 核心理念：根據 data-role 屬性自動顯示/隱藏元素
 * 無需 JavaScript 操作 classList，完全由 CSS 選擇器控制
 */

/* ========================================
   權限控制 - 預設隱藏所有需要權限的元素
   ======================================== */

/* 預設隱藏所有帶 data-navbar-role 屬性的連結 */
[data-navbar-role] {
  display: none !important;
}

/* ========================================
   股東頁面 - 所有登入用戶可見
   ======================================== */

[data-navbar][data-role="shareholder"] [data-navbar-role~="shareholder"],
[data-navbar][data-role="accountant"] [data-navbar-role~="shareholder"],
[data-navbar][data-role="admin"] [data-navbar-role~="shareholder"] {
  display: block !important;
}

/* ========================================
   管理頁面 - accountant 和 admin 可見
   ======================================== */

[data-navbar][data-role="accountant"] [data-navbar-role~="accountant"],
[data-navbar][data-role="admin"] [data-navbar-role~="accountant"] {
  display: block !important;
}

/* ========================================
   會計頁面 - admin 和 accountant 可見
   ======================================== */

[data-navbar][data-role="admin"] [data-navbar-role~="admin"],
[data-navbar][data-role="accountant"] [data-navbar-role~="admin"] {
  display: block !important;
}

/* ========================================
   使用者認證狀態控制
   ======================================== */

/* 預設隱藏登入和未登入區域 */
[data-navbar-auth="loggedin"],
[data-navbar-auth="loggedout"] {
  display: none !important;
}

/* 已登入狀態：顯示使用者信箱和登出按鈕 */
[data-navbar][data-role="shareholder"] [data-navbar-auth="loggedin"],
[data-navbar][data-role="accountant"] [data-navbar-auth="loggedin"],
[data-navbar][data-role="admin"] [data-navbar-auth="loggedin"] {
  display: flex !important;
}

/* 未登入狀態：顯示登入/註冊按鈕 */
[data-navbar][data-role="guest"] [data-navbar-auth="loggedout"] {
  display: flex !important;
}

/* ========================================
   Active 連結高亮樣式
   ======================================== */

.active-link {
  background-color: rgb(37 99 235) !important; /* Tailwind bg-blue-600 */
}

/* 確保 active-link 在連結可見時生效 */
[data-navbar-link].active-link {
  background-color: rgb(37 99 235) !important;
}