/* koozhen-enh18.css — 深色主题一致性 + 顶栏间距 + 未主题化控件
   D = 非 light/day 主题（dark/midnight/forest/sunset/slate/rose...） */

/* ---------- 1. 顶栏三按钮间距统一（语言块多出的 margin-right 去掉，统一由 gap:8px 控制） ---------- */
.topbar-right .koozhen-language-switch { margin: 0 !important; }

/* ---------- 2. 设置弹窗 Header：深色主题下不再是白条 ---------- */
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .modal-header.settings-header,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header {
  background: rgba(12, 15, 30, .72) !important;
  border-bottom: 1px solid rgba(196, 219, 218, .14) !important;
  color: #E8ECF6 !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header h3,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header h3 span {
  color: #E8ECF6 !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header-actions .modal-close {
  color: rgba(232, 236, 246, .75) !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header-actions .modal-close:hover {
  background: rgba(255, 255, 255, .10) !important;
  color: #fff !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-header-actions .btn-signout {
  color: #F0A6A0 !important;
  background: rgba(220, 38, 38, .12) !important;
  border-color: rgba(220, 38, 38, .32) !important;
}

/* ---------- 3. 未主题化的原生按钮（全选/清除/浏览…）统一成 ghost 样式 ---------- */
#settingsModal .sf-btn.ghost,
#settingsModal .persona-mini-btn {
  appearance: none !important;
  height: 28px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  background: rgba(15, 95, 92, .07) !important;
  color: #0F5F5C !important;
  border: 1px solid rgba(15, 95, 92, .22) !important;
  box-shadow: none !important;
  transition: background .15s ease, border-color .15s ease;
}
#settingsModal .sf-btn.ghost:hover,
#settingsModal .persona-mini-btn:hover {
  background: rgba(15, 95, 92, .14) !important;
  border-color: rgba(15, 95, 92, .38) !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .sf-btn.ghost,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .persona-mini-btn {
  background: rgba(255, 255, 255, .06) !important;
  color: #CFE4E3 !important;
  border-color: rgba(196, 219, 218, .22) !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .sf-btn.ghost:hover,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .persona-mini-btn:hover {
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(196, 219, 218, .38) !important;
}

/* ---------- 4. 发布页平台切换 tabs：深色主题下不再是白底 ---------- */
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .wx-platform-tabs,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .publish-tab-list {
  background: rgba(255, 255, 255, .06) !important;
  border: 1px solid rgba(196, 219, 218, .14) !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .wx-platform-tab-btn,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .publish-tab-item {
  color: rgba(232, 236, 246, .62) !important;
  background: transparent !important;
}
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .wx-platform-tab-btn.active,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .wx-platform-tab-btn.is-active,
html[data-theme]:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .publish-tab-item.active {
  background: rgba(71, 180, 176, .22) !important;
  color: #9FE7E3 !important;
  box-shadow: none !important;
}


/* ============ 3. 深色主题下 设置弹窗内部彻底深色化 ============ */
/* 病灶：卡片/表单控件多为浏览器默认或浅色硬编码，深色主题下变成白色岛屿 */
html[data-theme]:not([data-theme="light"]) #settingsModal .model-card,
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-card,
html[data-theme]:not([data-theme="light"]) #settingsModal .settings-card,
html[data-theme]:not([data-theme="light"]) #settingsModal .studio-card {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: none !important;
}
/* 卡片内文字 */
html[data-theme]:not([data-theme="light"]) #settingsModal .model-card-title,
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-field > label,
html[data-theme]:not([data-theme="light"]) #settingsModal label,
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-label {
  color: rgba(255,255,255,.92) !important;
}
html[data-theme]:not([data-theme="light"]) #settingsModal .model-card-sub,
html[data-theme]:not([data-theme="light"]) #settingsModal .field-hint,
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-hint {
  color: rgba(255,255,255,.52) !important;
}
/* 表单控件（input/select/textarea 默认白底是浏览器 UA 样式，必须显式覆盖） */
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-control,
html[data-theme]:not([data-theme="light"]) #settingsModal input[type="text"],
html[data-theme]:not([data-theme="light"]) #settingsModal input[type="password"],
html[data-theme]:not([data-theme="light"]) #settingsModal input[type="number"],
html[data-theme]:not([data-theme="light"]) #settingsModal input[type="url"],
html[data-theme]:not([data-theme="light"]) #settingsModal select,
html[data-theme]:not([data-theme="light"]) #settingsModal textarea {
  background: rgba(255,255,255,.06) !important;
  color: #E6EDF7 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-control::placeholder,
html[data-theme]:not([data-theme="light"]) #settingsModal textarea::placeholder {
  color: rgba(255,255,255,.35) !important;
}
html[data-theme]:not([data-theme="light"]) #settingsModal select option { background: #131A2B; color: #E6EDF7; }
html[data-theme]:not([data-theme="light"]) #settingsModal .sf-control:focus,
html[data-theme]:not([data-theme="light"]) #settingsModal textarea:focus,
html[data-theme]:not([data-theme="light"]) #settingsModal select:focus {
  border-color: rgba(71,180,176,.65) !important;
  box-shadow: 0 0 0 3px rgba(71,180,176,.14) !important;
  outline: none !important;
}

/* 自定义模型按钮：深色主题下默认黑字不可读 */
html[data-theme]:not([data-theme="light"]) #settingsModal .cm-add-btn,
html[data-theme]:not([data-theme="light"]) #settingsModal .cm-del {
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}
html[data-theme]:not([data-theme="light"]) #settingsModal .cm-del:hover { background: rgba(239,68,68,.18) !important; color:#fecaca !important; border-color: rgba(239,68,68,.35) !important; }
html[data-theme]:not([data-theme="light"]) #settingsModal .cm-add-btn:hover { background: rgba(71,180,176,.20) !important; border-color: rgba(71,180,176,.42) !important; }

/* ============ 4. 顶栏三按钮：跨主题完全统一 ============ */
/* 病灶：midnight 下 #btnSettings 仍是 rgba(255,255,255,.6) 白胶囊+阴影，另两者是 .05 玻璃；
   light 下 .koozhen-language-option 文字为白色，落在白底上不可读。 */
.topbar-right .koozhen-language-switch,
.topbar-right .btn-settings,
.topbar-right #btnSettings {
  height: 32px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background .18s ease, border-color .18s ease !important;
}
/* 浅色主题 */
html[data-theme="light"] .topbar-right .koozhen-language-switch,
html[data-theme="light"] .topbar-right .koozhen-language-option,
html[data-theme="light"] .topbar-right #btnSettings {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  color: #1B1A34 !important;
}
html[data-theme="light"] .topbar-right .koozhen-language-option { background: transparent !important; border: 0 !important; }
html[data-theme="light"] .topbar-right .koozhen-language-switch:hover,
html[data-theme="light"] .topbar-right #btnSettings:hover {
  background: #FFFFFF !important; border-color: rgba(71,180,176,.45) !important;
}
/* 深色主题 */
html[data-theme]:not([data-theme="light"]) .topbar-right .koozhen-language-switch,
html[data-theme]:not([data-theme="light"]) .topbar-right #btnSettings {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #E8EAF6 !important;
}
html[data-theme]:not([data-theme="light"]) .topbar-right .koozhen-language-option {
  background: transparent !important; border: 0 !important; color: #E8EAF6 !important;
}
html[data-theme]:not([data-theme="light"]) .topbar-right .koozhen-language-switch:hover,
html[data-theme]:not([data-theme="light"]) .topbar-right #btnSettings:hover {
  background: rgba(71,180,176,.20) !important; border-color: rgba(71,180,176,.45) !important;
}
.topbar-right #btnSettings svg { stroke: currentColor; }

/* ============ 5. 登录浮层 auth-gate：深色主题下不再是白卡片 ============ */
html[data-theme]:not([data-theme="light"]) #authGate .auth-mask { background: rgba(8,11,24,.92) !important; }
html[data-theme]:not([data-theme="light"]) #authGate .card {
  background: #131A2B !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: #E6EDF7 !important;
}
html[data-theme]:not([data-theme="light"]) #authGate .card h2,
html[data-theme]:not([data-theme="light"]) #authGate .card label,
html[data-theme]:not([data-theme="light"]) #authGate .social-btn span,
html[data-theme]:not([data-theme="light"]) #authGate .remember-row { color: #E6EDF7 !important; }
html[data-theme]:not([data-theme="light"]) #authGate .card .sub,
html[data-theme]:not([data-theme="light"]) #authGate .hint-new,
html[data-theme]:not([data-theme="light"]) #authGate .divider { color: rgba(230,237,247,.62) !important; }
html[data-theme]:not([data-theme="light"]) #authGate input,
html[data-theme]:not([data-theme="light"]) #authGate .input-wrap,
html[data-theme]:not([data-theme="light"]) #authGate .social-btn,
html[data-theme]:not([data-theme="light"]) #authGate .code-btn,
html[data-theme]:not([data-theme="light"]) #authGate .clear-remember {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #E6EDF7 !important;
}
html[data-theme]:not([data-theme="light"]) #authGate input { border: 0 !important; }
html[data-theme]:not([data-theme="light"]) #authGate .auth-x { color: rgba(230,237,247,.75) !important; }

/* ============ 6. 提高特异性：覆盖 ID 级 !important 旧规则 ============ */
header.topbar .topbar-right #btnSettings,
header.topbar .topbar-right .koozhen-language-switch {
  height: 32px !important; min-height: 32px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  padding: 0 10px !important;
}
html[data-theme="light"] header.topbar .topbar-right #btnSettings,
html[data-theme="light"] header.topbar .topbar-right .koozhen-language-switch {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  color: #1B1A34 !important;
}
html[data-theme]:not([data-theme="light"]) header.topbar .topbar-right #btnSettings,
html[data-theme]:not([data-theme="light"]) header.topbar .topbar-right .koozhen-language-switch {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #E8EAF6 !important;
}

/* 7. 覆盖 light-mode-consistency.css 给深色态语言框的独有阴影/底色（同 :not 链 + 更高特异性） */
html:not([data-theme="light"]):not([data-theme="day"]) header.topbar .topbar-right .koozhen-language-switch,
html:not([data-theme="light"]):not([data-theme="day"]) header.topbar .topbar-right #btnSettings {
  box-shadow: none !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #E8EAF6 !important;
}

/* 8. 深色下未激活的设置 tab 图标文字过暗 */
html:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-tab .settings-tab-icon {
  color: rgba(230,237,247,.72) !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
html:not([data-theme="light"]):not([data-theme="day"]) #settingsModal .settings-tab.active .settings-tab-icon {
  color: #E8F6F5 !important;
  background: rgba(71,180,176,.22) !important;
  border-color: rgba(71,180,176,.42) !important;
}
