/* 側邊欄樣式 */
#side-menu.cm--sidemenuwithcategories {
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(10px);
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

#side-menu.cm--sidemenuwithcategories a,
#side-menu.cm--sidemenuwithcategories span {
  color: white !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}

.cm-category-title {
  font-weight: bold;
  font-size: 1.1rem;
  color: #ff80ab !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9);
}

#side-menu.cm--sidemenuwithcategories img.cm-app-icon {
  filter: brightness(0) invert(1) !important;
}

#side-menu.cm--sidemenuwithcategories button.cm-opener {
  color: white !important;
}

#side-menu.cm--sidemenuwithcategories button.cm-opener svg {
  filter: brightness(0) invert(1) !important;
}

/* Header cm-opener 按鈕 - 針對 background-image 的處理 */
#header .header-start .cm-opener {
  filter: brightness(0) invert(1) !important;
  padding: 3px !important;
}

/* 或者使用更具體的方法重新定義背景 */
#header .header-start button.cm-opener {
  background-image: none !important;
  position: relative;
  filter: brightness(0) invert(1) !important;
}

/* 如果需要自定義圖示，可以使用 ::before 偽元素 */
#header .header-start button.cm-opener::before {
  content: "☰"; /* 使用 Unicode 漢堡選單符號 */
  font-size: 22px;
  color: white !important;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* Header 其他圖示樣式修正 */
#header .header-end .header-menu__trigger .material-design-icon svg,
#header .header-start .button-vue svg,
#header .unified-search-menu .button-vue__icon svg,
#header .contactsmenu svg,
#header #assistant svg {
  filter: brightness(0) invert(1) !important;
}

/* 只修改通知按鈕SVG中的第一個path */
#header .notifications-button svg path:nth-of-type(1) {
  filter: brightness(0) invert(1) !important;
}

/* Header 按鈕文字顏色 */
#header .button-vue__text,
#header .button-vue {
  color: white !important;
}

/* Header 背景樣式 (可選) */
#header {
  background: rgba(0, 0, 0, 0.2) !important;
  backdrop-filter: blur(5px) !important;
}
