/* 开单君 · 深色交易终端主题
   全站唯一的设计令牌来源：各页 <style> 只留结构样式，颜色一律引用
   这里的令牌；Element Plus 组件层通过覆盖官方 CSS 变量整体切暗
   （vendored index.css 不含官方 dark 包，故在此手工给全）。 */
:root {
  color-scheme: dark;

  /* ---- 设计令牌（页面结构样式引用的语义色） ---- */
  --bg: #0b101d;
  --surface: #131a2b;
  --line: #1f2a40;
  --text: #e8edf7;
  --muted: #9aa6bd;
  --dim: #67748f;
  --accent: #4c8dff;
  --accent-bg: #14213a;
  --good: #0ecb81;
  --good-bg: #0d2b22;
  --bad: #f6465d;
  --bad-bg: #351721;
  --warn: #f0b90b;
  --warn-bg: #2e2410;
  --danger: #f6465d;
  --shadow-color: #f0b90b;
  --shadow-bg: #2e2410;
  --radius: 12px;
  --radius-sm: 8px;
  --card-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 6px 18px rgba(0, 0, 0, 0.28);
  --shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
  --mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;

  /* ---- Element Plus 暗色变量 ---- */
  --el-color-primary: #4c8dff;
  --el-color-primary-light-3: #6fa3ff;
  --el-color-primary-light-5: #33538f;
  --el-color-primary-light-7: #223a66;
  --el-color-primary-light-8: #1b2f52;
  --el-color-primary-light-9: #16253f;
  --el-color-primary-dark-2: #82b1ff;
  --el-color-success: #0ecb81;
  --el-color-success-light-3: #3edba0;
  --el-color-success-light-5: #0d7a52;
  --el-color-success-light-7: #0c4c36;
  --el-color-success-light-8: #0d3b2c;
  --el-color-success-light-9: #0d2b22;
  --el-color-success-dark-2: #35d996;
  --el-color-warning: #f0b90b;
  --el-color-warning-light-3: #f4ca47;
  --el-color-warning-light-5: #8a6d10;
  --el-color-warning-light-7: #574508;
  --el-color-warning-light-8: #40340c;
  --el-color-warning-light-9: #2e2410;
  --el-color-warning-dark-2: #ffce3d;
  --el-color-danger: #f6465d;
  --el-color-danger-light-3: #f8788a;
  --el-color-danger-light-5: #7c2937;
  --el-color-danger-light-7: #542028;
  --el-color-danger-light-8: #431b23;
  --el-color-danger-light-9: #351721;
  --el-color-danger-dark-2: #ff6b7e;
  --el-color-error: #f6465d;
  --el-color-error-light-3: #f8788a;
  --el-color-error-light-5: #7c2937;
  --el-color-error-light-7: #542028;
  --el-color-error-light-8: #431b23;
  --el-color-error-light-9: #351721;
  --el-color-error-dark-2: #ff6b7e;
  --el-color-info: #7e8aa3;
  --el-color-info-light-3: #9aa6bd;
  --el-color-info-light-5: #3d4a66;
  --el-color-info-light-7: #2b3650;
  --el-color-info-light-8: #222c44;
  --el-color-info-light-9: #1a2234;
  --el-color-info-dark-2: #a6b2c9;
  --el-bg-color: #131a2b;
  --el-bg-color-page: #0b101d;
  --el-bg-color-overlay: #182136;
  --el-text-color-primary: #e8edf7;
  --el-text-color-regular: #c3cbdd;
  --el-text-color-secondary: #9aa6bd;
  --el-text-color-placeholder: #5b6880;
  --el-text-color-disabled: #49556e;
  --el-border-color: #263450;
  --el-border-color-light: #1f2a40;
  --el-border-color-lighter: #1b2438;
  --el-border-color-extra-light: #172030;
  --el-border-color-dark: #2f3f61;
  --el-border-color-darker: #3a4c75;
  --el-fill-color: #1c2539;
  --el-fill-color-light: #182136;
  --el-fill-color-lighter: #151d30;
  --el-fill-color-extra-light: #111a2c;
  --el-fill-color-dark: #212c45;
  --el-fill-color-darker: #273353;
  --el-fill-color-blank: #131a2b;
  --el-mask-color: rgba(3, 7, 15, 0.72);
  --el-mask-color-extra-light: rgba(3, 7, 15, 0.45);
  --el-box-shadow: 0 12px 32px 4px rgba(0, 0, 0, 0.36), 0 8px 20px rgba(0, 0, 0, 0.5);
  --el-box-shadow-light: 0 0 12px rgba(0, 0, 0, 0.5);
  --el-box-shadow-lighter: 0 0 6px rgba(0, 0, 0, 0.45);
  --el-box-shadow-dark: 0 16px 48px 16px rgba(0, 0, 0, 0.5), 0 12px 32px rgba(0, 0, 0, 0.6);
}

/* ---- Element Plus 组件级微调 ---- */
.el-empty {
  --el-empty-fill-color-0: #131a2b;
  --el-empty-fill-color-1: #1b2333;
  --el-empty-fill-color-2: #222c40;
  --el-empty-fill-color-3: #18202f;
  --el-empty-fill-color-4: #141b29;
  --el-empty-fill-color-5: #1e2839;
  --el-empty-fill-color-6: #25304a;
  --el-empty-fill-color-7: #2b3755;
  --el-empty-fill-color-8: #323f61;
  --el-empty-fill-color-9: #3a486e;
}
.el-table {
  --el-table-border-color: var(--line);
  --el-table-header-bg-color: #161e30;
  --el-table-bg-color: transparent;
  --el-table-tr-bg-color: transparent;
  --el-table-row-hover-bg-color: #1a2338;
  --el-table-header-text-color: var(--muted);
  --el-table-text-color: #c3cbdd;
}
.el-switch {
  --el-switch-off-color: #33405e;
}
/* 分段切换：内凹暗槽 + 渐变高亮滑块，未选项悬停有淡蓝反馈 */
.el-segmented {
  --el-segmented-color: var(--muted);
  --el-segmented-bg-color: #0d1424;
  --el-segmented-item-selected-color: #ffffff;
  --el-segmented-item-selected-bg-color: var(--accent);
  --el-segmented-item-hover-color: var(--text);
  --el-segmented-item-hover-bg-color: rgba(76, 141, 255, 0.1);
  --el-segmented-item-active-bg-color: rgba(76, 141, 255, 0.18);
  --el-segmented-item-disabled-color: var(--el-text-color-disabled);
  --el-segmented-padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-weight: 700;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.35);
}
/* 尺寸变体（--small/--large）自带两级选择器的圆角规则，这里用同级
   选择器压制，保证任何尺寸都是胶囊形 */
.el-segmented .el-segmented__item {
  border-radius: 999px;
  transition: color 0.15s;
}
.el-segmented .el-segmented__item-selected {
  background: linear-gradient(180deg, #5b97ff, #3d7cf0);
  border-radius: 999px;
  box-shadow: 0 1px 5px rgba(76, 141, 255, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.el-segmented__item.is-selected .el-segmented__item-label {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.el-pagination {
  --el-pagination-button-bg-color: #182136;
  --el-pagination-hover-color: var(--accent);
}

/* ---- 日期选择面板：与终端主题协调 ---- */
.el-picker-panel {
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  /* 区间内日期的浸润底色：EP 默认映射到近似面板底色，选区几乎不可见，
     换成明显的主题蓝色调 */
  --el-datepicker-inrange-bg-color: rgba(76, 141, 255, 0.16);
  --el-datepicker-inrange-hover-bg-color: rgba(76, 141, 255, 0.28);
}
.el-picker-panel [slot=sidebar],
.el-picker-panel__sidebar {
  border-right: 1px solid var(--line);
  background: transparent;
  padding: 8px 6px;
  width: 96px;
}
.el-picker-panel [slot=sidebar] + .el-picker-panel__body,
.el-picker-panel__sidebar + .el-picker-panel__body {
  margin-left: 96px;
}
.el-picker-panel__shortcut {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 24px;
  border-radius: 6px;
  padding: 0 8px;
  margin: 1px 0;
  width: auto;
  display: block;
}
.el-picker-panel__shortcut:hover {
  color: var(--accent);
  background: rgba(76, 141, 255, 0.1);
}
.el-date-picker__header-label {
  color: var(--text);
  font-weight: 700;
}
.el-date-picker__header-label:hover,
.el-picker-panel__icon-btn:hover {
  color: var(--accent);
}
.el-picker-panel__icon-btn {
  color: #67748f;
}
.el-date-table th {
  color: #67748f;
  font-weight: 700;
  border-bottom: 1px solid var(--line);
}
.el-date-table-cell__text {
  border-radius: 8px;
  transition: background 0.12s, color 0.12s;
}
.el-date-table td.available:hover .el-date-table-cell__text {
  color: var(--accent);
  background: rgba(76, 141, 255, 0.14);
}
.el-date-table td.today .el-date-table-cell__text {
  color: var(--accent);
  font-weight: 800;
}
.el-date-table td.current:not(.disabled) .el-date-table-cell__text {
  background: var(--accent);
  color: #ffffff;
  box-shadow: 0 1px 6px rgba(76, 141, 255, 0.45);
}
.el-date-table td.prev-month .el-date-table-cell__text,
.el-date-table td.next-month .el-date-table-cell__text {
  color: #3d4a66;
}
.el-date-table td.disabled .el-date-table-cell__text {
  background: transparent;
  color: #33405e;
}

/* 防泄漏隔离：部分页面写了全局 table/th/td/button 元素样式（如
   source 页 table{min-width:900px}、button{height:36px;border:...}），
   而日期弹层传送到 body 后同样会命中，导致双月日历被撑到近两千像素、
   快捷项变成高按钮。这里按 EP 默认值就地复位。 */
.el-picker-panel table {
  width: auto;
  min-width: 0;
  margin: 0;
  table-layout: auto;
}
.el-picker-panel th,
.el-picker-panel td {
  background: transparent;
  border: 0;
  text-align: center;
  vertical-align: middle;
  white-space: normal;
}
.el-date-table th {
  border-bottom: 1px solid var(--line);
  padding: 5px;
}
.el-date-table td { padding: 4px 0; }
.el-month-table td,
.el-year-table td { padding: 8px 0; }
.el-picker-panel button {
  height: auto;
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  font: inherit;
}

/* ---- 终端质感：细滚动条 / 选区高亮 ---- */
* {
  scrollbar-width: thin;
  scrollbar-color: #263450 transparent;
}
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background: #263450;
  border-radius: 99px;
}
::-webkit-scrollbar-thumb:hover {
  background: #33436a;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::selection {
  background: rgba(76, 141, 255, 0.35);
}
