@import url("element-ui.css?spike_theme_v=1.6.0");

/* ===== Plus Jakarta Sans 本地字体（方案 3D 占位）=====
 * 把 plus-jakarta-sans-variable.woff2 放入 ./fonts/ 目录即生效；
 * 文件缺失时浏览器自动降级到下方 --font-family 链中的系统字体，不报错。
 */
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-variable.woff2") format("woff2-variations");
}

/* ===== cany_spike — Spike Admin Theme ===== */
:root[theme="default"],
:root {
  /* ===== 主题色系 ===== */
  --spike-primary: #FA896B;
  --spike-primary-rgb: 250, 137, 107;
  --spike-primary-text: #FFFFFF;
  --spike-primary-contrast: var(--spike-primary-text);
  --spike-radius: 8px;
  --spike-circle: 50%;
  --spike-checkbox-radius: 2px;
  --color-primary: var(--spike-primary);
  --color-primary-rgb: var(--spike-primary-rgb);
  --color-secondary: #0074ba;
  --color-success: #4bd08b;
  --color-warning: #f8c076;
  --color-danger: #fb977d;
  --color-info: #46caeb;
  --color-indigo: #8763da;

  /* ===== 轻色背景（badge/chip/tag 背景）===== */
  --color-primary-light: rgba(var(--spike-primary-rgb), 0.12);
  --color-success-light: #dffff3;
  --color-warning-light: #fff6ea;
  --color-danger-light: #ffede9;
  --color-info-light: #e1f5fa;
  --color-indigo-light: #f1ebff;
  --color-secondary-light: #e7ecf0;

  /* ===== 文字色 ===== */
  --color-text-primary: #2a3547;
  --color-text-secondary: #707a82;
  --color-text-tips: #707a82;
  --color-text-disabled: #a0aec0;

  /* ===== 背景/容器色 =====
   * 页面底色改为与 sidebar 一致的浅米白，卡片白底靠阴影区分
   * sidebar 保持纯白（与 card 同色，通过 box-shadow 形成浮卡感）
   */
  --color-page-bg: #f5f6fa;
  --color-card-bg: #ffffff;
  --color-sidebar-bg: #ffffff;
  --color-topbar-bg: #ffffff;
  --color-hover: #f6f9fc;
  --color-bg-light: #f5f8fb;

  /* ===== 边框 / 输入框 ===== */
  --color-border: #e5eaef;
  --color-input-border: #dfe5ef;

  /* ===== 菜单（Spike 白色侧边栏）===== */
  --color-menu-bg: #ffffff;
  --color-menu-active-bg: rgba(var(--spike-primary-rgb), 0.12);
  --color-menu-hover-bg: #f6f9fc;
  --color-menu-text: #2a3547;
  --color-menu-text-active: var(--spike-primary);
  --color-menu-group-text: #707a82;

  /* ===== 阴影 ===== */
  --shadow-card: 0 9px 17.5px rgba(0, 0, 0, 0.05);
  --shadow-dropdown: 0 2px 12px rgba(0, 0, 0, 0.1);
  --shadow-topbar: 0 1px 7px rgba(0, 0, 0, 0.05);
  --shadow-sidebar: 1px 0 8px rgba(0, 0, 0, 0.07);

  /* ===== 圆角 ===== */
  --radius-card: var(--spike-radius);
  --radius-button-pill: var(--spike-radius);
  --radius-button: var(--spike-radius);
  --radius-input: var(--spike-radius);
  --radius-menu-item: var(--spike-radius);
  --radius-tag: var(--spike-radius);

  /* ===== 布局尺寸 ===== */
  --sidebar-width: 270px;
  --sidebar-width-mini: 80px;
  --topbar-height: 64px;
  --input-height: 51px;
}

/* 折叠态：覆盖 --sidebar-width；hover 浮出由 spike-layout.css 处理 */
:root[data-aside-collapsed="1"] {
  --sidebar-width: var(--sidebar-width-mini);
}

:root[theme="default"],
:root {
  /* ===== 字体 ===== */
  --font-family:
    "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "Microsoft YaHei", sans-serif;

  /* ===== 兼容旧变量 ===== */
  --color-price-text: var(--spike-primary);
  --color-discount-num: var(--spike-primary);
  --color-cash-num: var(--spike-primary);

  /* ===== popover / badge / avatar (topMenu) ===== */
  --color-badge-blue-bg: var(--color-secondary);
  --color-badge-blue-text: #ffffff;
  --popover-radius: var(--spike-radius);
  --popover-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
  --avatar-size-msg: 48px;
  --avatar-size-flag: 38px;
}