/* 温和的浏览器主题保护样式 */
/* 只保护关键元素，不干扰正常的CSS，并且根据 data-theme 动态切换 */

/* 全局颜色方案声明：移动端优先遵循 data-theme，其次才用系统色 */
:root {
  color-scheme: light dark;
}

/* 深色主题时，显式声明 color-scheme = dark，解决 iOS / Chrome 移动端原生控件浅色的问题 */
:root[data-theme='dark'],
:root[data-theme='MidnightDark'],
:root[data-theme='ModernDark'],
:root[data-theme='ClassicDark'] {
  color-scheme: dark;
}

/* 浅色主题时，显式声明 color-scheme = light */
:root[data-theme='light'],
:root[data-theme='ClassicLight'],
:root[data-theme='ModernLight'] {
  color-scheme: light;
}

/* ===== 前台页面强制浅色 color-scheme（防止系统深色干扰）===== */
body[data-frontend="true"]:not(.admin-body),
body[data-frontend="true"]:not(.admin-body) input,
body[data-frontend="true"]:not(.admin-body) textarea,
body[data-frontend="true"]:not(.admin-body) select,
body[data-frontend="true"]:not(.admin-body) button {
  color-scheme: light;
}

/* 保护表单元素外观，但不强锁 color-scheme = none（none 会导致控件 fallback 到浅色） */
input[type='text'],
input[type='email'],
input[type='password'],
input[type='search'],
input[type='url'],
input[type='tel'],
input[type='number'],
input[type='date'],
input[type='time'],
input[type='datetime-local'],
input[type='month'],
input[type='week'],
textarea,
select {
  /* 禁用浏览器默认样式（保留我们自定义的背景色与文字颜色） */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* 在移动端根据主题继承 color-scheme，使原生滚动条/弹出控件正确变深色或浅色 */
  color-scheme: inherit;
}

/* 深色主题下专门修复表单控件与浏览器原生 UI 的颜色方案 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']):not([data-theme='ClassicLight']):not([data-theme='ModernLight']) {
    color-scheme: dark;
  }
  input[type='text'],
  input[type='email'],
  input[type='password'],
  input[type='search'],
  input[type='url'],
  input[type='tel'],
  input[type='number'],
  input[type='date'],
  input[type='time'],
  input[type='datetime-local'],
  input[type='month'],
  input[type='week'],
  textarea,
  select {
    color-scheme: dark;
  }
}

/* 保护按钮外观 */
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* 保护选中文本颜色 */
::selection {
  background-color: rgba(79, 70, 229, 0.3);
  color: inherit;
}

::-moz-selection {
  background-color: rgba(79, 70, 229, 0.3);
  color: inherit;
}

/* 保护占位符颜色 */
::placeholder {
  opacity: 0.6;
}

/* 高对比度模式下的调整 */
@media (prefers-contrast: high) {
  input,
  textarea,
  select,
  button {
    border-width: 2px;
  }
}