/* ============================================================
   theme-win11.css — Windows 11 / Fluent (WinUI 3)
   特征：4px 圆角、无投影、底部一层深色内描边、按下时文字转灰。
   ============================================================ */

[data-theme="win11"] {
  --ui-surface: #f3f3f3;
  --ui-text: #1a1a1a;
  --ui-text-2: rgba(0, 0, 0, 0.61);
  --ui-text-disabled: rgba(0, 0, 0, 0.36);

  --ui-font: "Segoe UI Variable Text", "Segoe UI", "Selawik", -apple-system,
    "Helvetica Neue", Arial, sans-serif;
  --ui-font-size: 14px;
  --ui-control-h: 32px;

  --ui-accent: #005fb8;
  --ui-accent-text: #ffffff;
  --ui-accent-hover: #1969b8;
  --ui-accent-active: #0f5ca8;

  --ui-duration: 83ms;
  --ui-ease: cubic-bezier(0, 0, 0, 1);

  /* 焦点是 2px 硬描边，外扩 1px */
  --focus-ring: 0 0 0 0 transparent;
  --focus-outline: 2px solid #000000;
  --focus-outline-offset: 1px;

  --btn-bg: #fbfbfb;
  --btn-bg-hover: #f6f6f6;
  --btn-bg-active: #f2f2f2;
  --btn-fg: #1a1a1a;
  --btn-fg-active: rgba(0, 0, 0, 0.61);
  --btn-border: rgba(0, 0, 0, 0.06);
  --btn-border-hover: rgba(0, 0, 0, 0.06);
  --btn-border-w: 1px;
  --btn-radius: 4px;
  --btn-h: 32px;
  --btn-px: 12px;
  --btn-font-size: 14px;
  --btn-font-weight: 400;
  --btn-shadow: none;
  --btn-bottom-stroke: rgba(0, 0, 0, 0.16);

  --primary-bg: #005fb8;
  --primary-bg-hover: #1969b8;
  --primary-bg-active: #0f5ca8;
  --primary-fg: #ffffff;
  --primary-border: transparent;
  --primary-shadow: none;
  --primary-bottom-stroke: rgba(0, 0, 0, 0.12);

  --disabled-bg: #f4f4f4;
  --disabled-fg: rgba(0, 0, 0, 0.36);
  --disabled-border: rgba(0, 0, 0, 0.06);

  --field-bg: #fbfbfb;
  --field-border: rgba(0, 0, 0, 0.08);
  --field-border-w: 1px;
  --field-radius: 4px;
  --field-h: 32px;
  --field-px: 11px;
  --field-font-size: 14px;
  --field-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.18);
  --field-placeholder: rgba(0, 0, 0, 0.42);
  --field-focus-border: rgba(0, 0, 0, 0.08);
  --field-focus-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.18);
  --field-underline-w: 2px;
  /* WinUI 的输入框聚焦只画强调色下划线，不画焦点矩形 */
  --field-focus-outline: none;
  --field-label-size: 12px;

  --check-size: 20px;
  --check-radius: 4px;
  --check-bg: #fbfbfb;
  --check-border: rgba(0, 0, 0, 0.45);
  --check-border-hover: rgba(0, 0, 0, 0.72);
  --check-border-w: 1px;
  --check-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  --check-bg-checked: #005fb8;
  --check-border-checked: #005fb8;
  --check-mark: #ffffff;
  --check-stroke: 2.2;

  --radio-size: 20px;
  --radio-bg: #fbfbfb;
  --radio-border: rgba(0, 0, 0, 0.45);
  --radio-border-hover: rgba(0, 0, 0, 0.72);
  --radio-border-w: 1px;
  --radio-bg-checked: transparent;
  --radio-border-checked: #005fb8;
  --radio-dot: 10px;
  --radio-dot-color: #005fb8;

  --switch-w: 40px;
  --switch-h: 20px;
  --switch-knob: 12px;
  --switch-pad: 3px;
  --switch-border-w: 1px;
  --switch-bg: transparent;
  --switch-border: rgba(0, 0, 0, 0.45);
  --switch-bg-on: #005fb8;
  --switch-border-on: #005fb8;
  --switch-knob-bg: rgba(0, 0, 0, 0.45);
  --switch-knob-on-bg: #ffffff;
  --switch-knob-shadow: none;
  --select-h: 32px;
  --select-radius: 4px;
  --select-bg: #fbfbfb;
  --select-border: rgba(0, 0, 0, 0.06);
  --select-border-w: 1px;
  --select-px: 11px;
  --select-chevron: #1a1a1a;

  --slider-track-h: 4px;
  --slider-track: rgba(0, 0, 0, 0.25);
  --slider-fill: #005fb8;
  --slider-thumb-bg: #ffffff;
  --slider-thumb-border: #005fb8;
  --slider-thumb-border-w: 1.5px;
  --slider-thumb-shadow: none;
  /* Fluent 的焦点框画在控件外侧，滑块也保持外扩 */
  --slider-focus-outline-offset: 1px;

  --menu-bg: #fbfbfb;
  --menu-border: rgba(0, 0, 0, 0.06);
  --menu-border-w: 1px;
  --menu-radius: 8px;
  --menu-shadow: 0 8px 16px rgba(0, 0, 0, 0.14);
  --menu-pad: 4px;
  --menu-item-h: 32px;
  --menu-item-radius: 4px;
  --menu-item-pad-x: 11px;
  --menu-item-hover-bg: rgba(0, 0, 0, 0.04);
  --menu-item-selected-bg: rgba(0, 0, 0, 0.03);
  --menu-item-selected-fg: #1a1a1a;
  --menu-item-marker: #005fb8;
  --menu-item-font-size: 14px;
  /* 分隔线内缩 12px、禁用文字 36% 黑、快捷键弱一档。
     这几项没有单独做过像素实测，按 Fluent 的 TextFillColorDisabled 推，标估计。 */
  --menu-sep-margin: 4px 12px;
  --menu-sep-color: rgba(0, 0, 0, 0.08); /* 估计 */
  --menu-item-disabled-fg: rgba(0, 0, 0, 0.36); /* 估计 */
  --menu-shortcut-opacity: 0.6; /* 估计 */

  --textarea-py: 6px;
  --switch-duration: 167ms;
  --switch-ease: cubic-bezier(0, 0, 0, 1);
  /* 分段控件：WinUI 3 系统控件集里没有分段控件。这组取值来自 CommunityToolkit 的
     Segmented 扩展控件（4px 圆角、12px 内边距、强调色填充、167ms），不是系统原生像素。 */
  --seg-h: 32px;
  --seg-radius: 4px;
  --seg-pad: 3px;
  --seg-bg: rgba(0, 0, 0, 0.04);
  --seg-fg: #1a1a1a;
  --seg-font-size: 14px;
  --seg-item-pad-x: 12px;
  --seg-item-radius: 4px;
  --seg-selected-bg: #005fb8;
  --seg-selected-fg: #ffffff;
  --seg-hover-bg: rgba(0, 0, 0, 0.04);
  --seg-active-bg: rgba(0, 0, 0, 0.06);
  --seg-sep-w: 0px;
  --seg-focus-outline: 2px solid var(--ui-text);
  --seg-focus-offset: -3px;
  --seg-duration: 167ms;
  /* 标签页：WinUI 3 TabView（贴边标签）。条上方留 8px、标签 32 高、上圆角 8；
     选中是 #F9F9F9 实底 + 1px 描边，没有下划线。底部 4px 反向肩膀没做。 */
  --tabs-h: 32px;
  --tabs-gap: 0px;
  --tabs-list-pad-top: 8px;
  --tabs-tab-radius: 8px 8px 0 0;
  --tabs-pad-x: 8px;
  --tabs-font-size: 12px;
  --tabs-fg: rgba(0, 0, 0, 0.62);
  --tabs-hover-bg: rgba(0, 0, 0, 0.04);
  --tabs-hover-fg: rgba(0, 0, 0, 0.89);
  --tabs-selected-bg: #f9f9f9;
  --tabs-selected-fg: rgba(0, 0, 0, 0.89);
  --tabs-selected-border: rgba(0, 0, 0, 0.06);
  --tabs-tab-border-w: 1px;
  --tabs-tab-border: transparent;
  --tabs-strip-border-w: 1px;
  --tabs-strip-border: rgba(0, 0, 0, 0.06);
  --tabs-list-overlap: -1px;
  --tabs-indicator-h: 0px;
  --tabs-panel-pad: 12px;
  --tabs-arrow-mode: focus;
  --tabs-focus-outline: 2px solid #000000;
  --tabs-focus-offset: 1px;
  --tabs-duration: 167ms;
  /* 进度条：WinUI 3 ProgressBar 源码值：3 高、1.5 圆角，底下只有 1px 轨道；
     不确定态是两条 40% / 60% 的 pill 扫过（2s 循环），这里简化成一条光带。 */
  --progress-h: 3px;
  --progress-radius: 1.5px;
  --progress-track: transparent;
  --progress-track-image: linear-gradient(
    to bottom,
    transparent calc(50% - 0.5px),
    rgba(0, 0, 0, 0.45) calc(50% - 0.5px) calc(50% + 0.5px),
    transparent calc(50% + 0.5px)
  );
  --progress-fill: var(--ui-accent);
  --progress-fill-radius: 1.5px;
  --progress-indeterminate-duration: 2000ms;
  /* 提示气泡：WinUI 3 ToolTip 令牌：底色 #F9F9F9、89% 黑字、1px 边、圆角 4、
     内边距 9×6、最大宽 320。跟随指针和 Ctrl 关闭没做。 */
  --tooltip-bg: #f9f9f9;
  --tooltip-fg: rgba(0, 0, 0, 0.89);
  --tooltip-border: rgba(0, 0, 0, 0.06);
  --tooltip-border-w: 1px;
  --tooltip-radius: 4px;
  --tooltip-pad-y: 6px;
  --tooltip-pad-x: 9px;
  --tooltip-font-size: 12px;
  --tooltip-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
  --tooltip-show-delay: 400ms;
  --tooltip-focus-show: 1;
}

[data-theme="win11"][data-mode="dark"] {
  --ui-surface: #202020;
  --ui-text: rgba(255, 255, 255, 0.9);
  --ui-text-2: rgba(255, 255, 255, 0.61);
  --ui-text-disabled: rgba(255, 255, 255, 0.36);

  --ui-accent: #60cdff;
  --ui-accent-text: #000000;
  --ui-accent-hover: #57c8f5;
  --ui-accent-active: #4ab8e8;

  --focus-outline: 2px solid #ffffff;

  --btn-bg: #2c2c2c;
  --btn-bg-hover: #2e2e2e;
  --btn-bg-active: #292929;
  --btn-fg: rgba(255, 255, 255, 0.9);
  --btn-fg-active: rgba(255, 255, 255, 0.61);
  --btn-border: rgba(255, 255, 255, 0.07);
  --btn-border-hover: rgba(255, 255, 255, 0.07);
  --btn-shadow: none;
  --btn-bottom-stroke: rgba(255, 255, 255, 0.09);

  --primary-bg: #60cdff;
  --primary-bg-hover: #57c8f5;
  --primary-bg-active: #4ab8e8;
  --primary-fg: #000000;
  --primary-border: transparent;
  --primary-bottom-stroke: rgba(0, 0, 0, 0.16);

  --disabled-bg: #262626;
  --disabled-fg: rgba(255, 255, 255, 0.36);
  --disabled-border: rgba(255, 255, 255, 0.07);

  --field-bg: #2c2c2c;
  --field-border: rgba(255, 255, 255, 0.07);
  --field-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.09);
  --field-placeholder: rgba(255, 255, 255, 0.42);
  --field-focus-border: rgba(255, 255, 255, 0.07);
  --field-focus-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.09);

  --check-bg: #2c2c2c;
  --check-border: rgba(255, 255, 255, 0.55);
  --check-border-hover: rgba(255, 255, 255, 0.8);
  --check-shadow: none;
  --check-bg-checked: #60cdff;
  --check-border-checked: #60cdff;
  --check-mark: #000000;

  --radio-bg: #2c2c2c;
  --radio-border: rgba(255, 255, 255, 0.55);
  --radio-border-hover: rgba(255, 255, 255, 0.8);
  --radio-border-checked: #60cdff;
  --radio-dot-color: #60cdff;

  --switch-border: rgba(255, 255, 255, 0.55);
  --switch-bg-on: #60cdff;
  --switch-border-on: #60cdff;
  --switch-knob-bg: rgba(255, 255, 255, 0.55);
  --switch-knob-on-bg: #000000;

  --select-bg: #2c2c2c;
  --select-border: rgba(255, 255, 255, 0.07);
  --select-chevron: rgba(255, 255, 255, 0.9);

  --slider-track: rgba(255, 255, 255, 0.25);
  --slider-fill: #60cdff;
  --slider-thumb-bg: #1e1e1e;
  --slider-thumb-border: #60cdff;

  --menu-bg: #2c2c2c;
  --menu-border: rgba(255, 255, 255, 0.07);
  --menu-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
  --menu-item-hover-bg: rgba(255, 255, 255, 0.06);
  --menu-item-selected-bg: rgba(255, 255, 255, 0.04);
  --menu-item-selected-fg: #ffffff;
  --menu-item-marker: #60cdff;
  --menu-sep-color: rgba(255, 255, 255, 0.10); /* 估计 */
  --menu-item-disabled-fg: rgba(255, 255, 255, 0.36); /* 估计 */
  --seg-bg: rgba(255, 255, 255, 0.06);
  --seg-fg: #ffffff;
  --seg-selected-bg: #60cdff;
  --seg-selected-fg: #1a1a1a;
  --seg-hover-bg: rgba(255, 255, 255, 0.06);
  --seg-active-bg: rgba(255, 255, 255, 0.08);
  --seg-focus-outline: 2px solid #ffffff;
  --tabs-fg: rgba(255, 255, 255, 0.77);
  --tabs-hover-bg: rgba(255, 255, 255, 0.06);
  --tabs-hover-fg: #ffffff;
  --tabs-selected-bg: #282828;
  --tabs-selected-fg: #ffffff;
  --tabs-selected-border: rgba(255, 255, 255, 0.08);
  --tabs-strip-border: rgba(255, 255, 255, 0.08);
  --tabs-focus-outline: 2px solid #ffffff;
  --progress-track-image: linear-gradient(
    to bottom,
    transparent calc(50% - 0.5px),
    rgba(255, 255, 255, 0.55) calc(50% - 0.5px) calc(50% + 0.5px),
    transparent calc(50% + 0.5px)
  );
  --tooltip-bg: #2c2c2c;
  --tooltip-fg: #ffffff;
  --tooltip-border: rgba(0, 0, 0, 0.2);
}

/* 滚动条：窗口内容区用，避免默认浏览器滚动条破坏平台观感 */
[data-theme="win11"] {
  --scrollbar-size: 12px;
  --scrollbar-width: thin;
  --scrollbar-track: transparent;
  --scrollbar-thumb: rgba(0, 0, 0, 0.35);
  --scrollbar-thumb-hover: rgba(0, 0, 0, 0.5);
  --scrollbar-radius: 6px;
  --scrollbar-border: 3px;
}

[data-theme="win11"][data-mode="dark"] {
  --scrollbar-thumb: rgba(255, 255, 255, 0.35);
  --scrollbar-thumb-hover: rgba(255, 255, 255, 0.5);
}
