/* theme-switcher.css - 更新版 */

/* 定義亮色模式變量 (默認) */
:root {
  --background-primary: #000000;
  --background-secondary: #151515;
  --text-primary: #ffffff;
  --text-secondary: #929292;
  --text-muted: #909090;     /* 調整為更亮的顏色，提高可讀性 */
  --text-details: #fff;      /* 詳情頁文字顏色 */
  --text-details-muted: #5f5f5f; /* 詳情頁次要文字顏色 */
  --border-color: #1b1b1b;
  --element-bg: #212121;
  --element-bg-hover: #333333;
  --element-bg-active: #276fdb;
  --container-bg: #151515;
  --header-bg: #000000;
  --footer-bg: #000000;
  --box-shadow: -1px 1px 5px rgba(33, 33, 33, 0.65);
  --dropdown-bg: #212121;
  --search-bg: #ffffff;
  --search-text: #000000;
  --form-bg: #2e2e2e;
  --autocomplete-bg: #000;
  --autocomplete-selected: #151515;
  --sidebar-text: #fff;
  --sidebar-text-hover: #276fdb;
  --sidebar-rating: #929292;
}

/* 暗色模式變量 */
body.black {
  --background-primary: #ffffff;
  --background-secondary: #f9f9f9;
  --text-primary: #212121;
  --text-secondary: #9f9f9f;
  --text-muted: #5f5f5f;     /* 調整為原始的顏色值 */
  --text-details: #212121;   /* 新增詳情頁文字顏色 */
  --text-details-muted: #bcbcbc; /* 新增詳情頁次要文字顏色 */
  --border-color: #e0dfdf;
  --element-bg: #e0dfdf;
  --element-bg-hover: #d0d0d0;
  --element-bg-active: #276fdb;
  --container-bg: #f9f9f9;
  --header-bg: #ffffff;
  --footer-bg: #ffffff;
  --box-shadow: -1px 1px 5px rgba(207, 207, 207, 0.65);
  --dropdown-bg: #e0dfdf;
  --search-bg: #212121;
  --search-text: #ffffff;
  --form-bg: #ffffff;
  --autocomplete-bg: #fff;
  --autocomplete-selected: #f0f0f0;
  --sidebar-text: #212121;
  --sidebar-text-hover: #276fdb;
  --sidebar-rating: #bcbcbc;
}

/* 應用顏色變量 */

/* 基礎元素 */
body {
  background-color: var(--background-primary);
  color: var(--text-primary);
}

.container {
  background-color: var(--container-bg);
}

/* 標題和文字 */
h1, h2, h3, h4, h5, h6, p.text {
  color: var(--text-primary);
}

/* 鏈接 */
a {
  color: var(--text-primary);
}
.no-touch a:hover {
  color: #276fdb;
}

/* 表單元素 */
form label {
  color: var(--text-primary);
}
form .textfield, form .textarea, form .selectbox, form .file {
  color: var(--text-primary);
  background-color: var(--form-bg);
  border-color: var(--border-color);
}

/* 自動完成樣式 */
.autocomplete-suggestions {
  border-color: var(--border-color);
  background: var(--autocomplete-bg);
}
.autocomplete-selected {
  background: var(--autocomplete-selected);
}

/* 頭部和導航 */
.header {
  background-color: var(--header-bg);
}
.header + nav {
  background-color: var(--header-bg);
  border-color: var(--border-color);
  -webkit-box-shadow: 0 1px 0 var(--header-bg);
  box-shadow: 0 1px 0 var(--header-bg);
}
.navigation .button .ico-bar {
  background-color: var(--text-primary);   
}
.navigation .primary {
  background-color: var(--header-bg);
}
.navigation .primary a {
  color: var(--text-primary);
}
.navigation .primary .drop > a {
  background-color: var(--element-bg);
}
.navigation .primary ul li a {
  background-color: var(--element-bg);
  color: var(--text-primary);
}

/* 搜索框 */
.search .search-text input {
  background-color: var(--search-bg);
  color: var(--search-text);
}
.search-text input::placeholder {
  color: var(--search-text);
}

/* 排序和下拉菜單 */
.sort {
  background-color: var(--element-bg);
  color: var(--text-primary);
}
.sort ul {
  background-color: var(--dropdown-bg);
}

/* 頁面內容元素 */
.sidebar, .block-channel, .block-model, 
.block-album .album-holder, .block-video .video-holder,
.table, .list-playlists .item, .list-models .item,
.list-sponsors .item, .list-channels .item,
.list-categories .item, .list-albums .item,
.list-albums-images .item, .list-videos .item,
.list-videos-screenshots .item {
  background-color: var(--background-primary);
  box-shadow: var(--box-shadow);
}

/* 分割線和邊界 */
.info-buttons, .member-menu .block-additional,
.block-comments .list-comments, .item-control {
  border-color: var(--border-color);
}

/* 按鈕和交互元素 */
.toggle-button {
  background-color: var(--background-primary);
  color: var(--text-primary);
  border-color: var(--border-color);
}
.toggle-button.active {
  background-color: var(--element-bg-active);
  color: #ffffff;
}
.tabs-menu .toggle-button {
  background-color: var(--element-bg);
  color: var(--text-primary);
}
.tabs-menu .toggle-button.active {
  background-color: var(--element-bg-active);
  color: #ffffff;
}

/* 頁腳 */
.footer {
  background-color: var(--footer-bg);
}
.footer .nav a {
  color: var(--text-primary);
}
.footer-margin {
  background-color: var(--background-secondary);
}

/* 項目樣式 */
.item .img {
  background-color: var(--element-bg);
}
.item .title {
  color: var(--text-primary);
}

/* 修復 item wrap 的顏色問題，保留原始樣式的同時更新顏色 */
.item .wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 10px 8px;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.2;
}

/* 列表項目 */
.list-comments .item {
  color: var(--text-primary);
}
.list-comments .comment-info {
  color: var(--text-muted);
}

/* 詳情頁元素調整 */
.block-details .item {
  color: var(--text-details);
}

.block-details .item em {
  color: var(--text-details);
}

.block-details .item span {
  color: var(--text-details-muted);
}

.block-details .item span em {
  color: var(--text-details);
}

.rating-container .voters {
  color: var(--text-details);
}

.block-model .model-list li span {
  color: var(--text-details);
}

/* 側邊欄調整 */
.sidebar .list a {
  color: var(--sidebar-text);
}

.sidebar .list .rating {
  color: var(--sidebar-rating);
}

.no-touch .sidebar .list a:hover {
  color: var(--sidebar-text-hover);
}

.no-touch .sidebar .list a:hover .rating {
  color: var(--text-primary);
}

/* 彈窗 */
.popup-holder {
  background-color: var(--background-secondary);
}
.popup-title {
  color: var(--text-primary);
}
.fancybox-opened .fancybox-skin {
  background-color: var(--background-primary);
}

/* 其他可能需要調整的元素 */
.block-channel .channel-list .name {
  color: var(--text-details-muted);
}

.block-channel .desc,
.block-model .desc,
.block-model .website {
  color: var(--text-primary);
}

.list-comments .username {
  color: var(--text-primary);
}

.list-comments .comment-text {
  color: var(--text-primary);
}

.list-messages .message-text {
  color: var(--text-primary);
}

.list-messages .added {
  color: var(--text-muted);
}

.sidebar .comments .comment-text {
  color: var(--text-primary);
}

.sidebar .comments .username a {
  color: var(--text-primary);
}

.sidebar .comments .added {
  color: var(--text-muted);
}

.block-album .images .message,
.block-video .no-player .message {
  color: var(--text-primary);
}