@charset "UTF-8";
/* Element Chalk Variables */
/* 肯纳品牌主题：设计 token 与原型（src/html）保持一致。
Element Plus 主色已在 styles/element/index.scss 通过 SCSS 变量覆盖，
这里只补充原型里的中性色阶、语义色、排版规则，以及把 Element Plus
常用组件（按钮/输入/表格/分页/弹窗/标签/卡片/Tabs）全局对齐到原型的
`.btn` / `.fi` / `.lst` / `.pagi` / `.modal` / `.badge` / `.panel` / `.tab`。 */
:root {
  /* 品牌（对齐线上原型 --y/--yd/--yl） */
  --km-yellow: #f5c400;
  --km-yellow-dark: #d4a800;
  --km-yellow-light: #fff8d6;
  /* 中性色阶（对齐线上原型 --g50 ~ --g700） */
  --g50: #fafafa;
  --g100: #f4f4f4;
  --g200: #e8e8e8;
  --g300: #d0d0d0;
  --g400: #aaaaaa;
  --g500: #777777;
  --g600: #555555;
  --g700: #333333;
  --black: #111111;
  /* 语义色（徽标 / 状态） */
  --blue-bg: #e8f0fe;
  --blue-tx: #1a56b0;
  --green-bg: #e8f5e9;
  --green-tx: #2e7d32;
  --red-bg: #fce8e8;
  --red-tx: #c62828;
  --pink-bg: #fce4ec;
  --pink-tx: #ad1457;
  --amber-bg: #fff8d6;
  --amber-tx: #8a6d00;
  /* 布局 */
  --app-bg: var(--g100);
  --sidebar-w: 224px;
  --topbar-h: 52px;
  /* 侧栏背景对齐线上原型 .sidebar：#0E0E0E */
  --app-sidebar-bg: #0e0e0e;
  --app-sidebar-fg: #b8b8b8;
  --app-sidebar-active-bg: var(--km-yellow);
  --app-sidebar-active-fg: #000000;
  /* Element Plus 尺寸对齐原型（34px 控件 / 13px 正文 / 10px 卡片 / 12px 弹窗） */
  --el-component-size: 34px;
  --el-component-size-small: 30px;
  --el-card-border-radius: 10px;
  --el-dialog-border-radius: 12px;
  --el-messagebox-border-radius: 12px;
  --font-mono: 'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
}

html,
body,
#app {
  height: 100%;
  margin: 0;
}

body {
  background: var(--app-bg);
  color: var(--g700);
  font-size: 14px;
  line-height: 1.5;
  font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* 单号 / 金额等使用等宽字体，和原型一致 */
.mono {
  font-family: var(--font-mono);
}

/* ══════════════ Element Plus 全局对齐原型 ══════════════ */
/* ── 按钮：原型 .btn（34px / 6px / 白底 g200 描边 / 13px） ── */
.el-button {
  height: 34px;
  padding: 0 16px;
  border-radius: 6px;
  font-size: 13px;
  border: 1px solid var(--g200);
  background: var(--white, #fff);
  color: var(--g600);
  font-weight: 400;
}
.el-button:hover, .el-button:focus {
  border-color: var(--g300);
  background: var(--g50);
  color: var(--g600);
}

/* 主按钮：原型 .btn.primary（黄底黑字 / 600）
 * EP 组件样式后注入会以 color: var(--el-button-text-color) 覆盖直接 color，
 * 故此处覆盖 EP 的 CSS 变量而非 color 属性。 */
.el-button--primary {
  background: var(--km-yellow);
  border-color: var(--km-yellow);
  font-weight: 600;
}
.el-button--primary:not(.is-plain) {
  --el-button-text-color: #000;
  --el-button-hover-text-color: #000;
  --el-button-active-text-color: #000;
}
.el-button--primary:hover, .el-button--primary:focus {
  background: var(--km-yellow-dark);
  border-color: var(--km-yellow-dark);
}
.el-button--primary.is-plain {
  background: var(--km-yellow-light);
  border-color: #efd96a;
  --el-button-text-color: #8a6d00;
  --el-button-hover-text-color: #000;
  --el-button-active-text-color: #000;
}
.el-button--primary.is-plain:hover, .el-button--primary.is-plain:focus {
  background: var(--km-yellow);
  border-color: var(--km-yellow);
}

/* 小按钮：原型 .btn.sm（30px / 12px） */
.el-button--small {
  height: 30px;
  padding: 0 10px;
  font-size: 12px;
  border-radius: 6px;
}

/* 危险按钮：原型 .btn.danger（红字 / 淡红描边） */
.el-button--danger.is-plain,
.el-button--danger {
  color: var(--red-tx);
  border-color: #f0c0c0;
  background: #fff;
}
.el-button--danger.is-plain:hover, .el-button--danger.is-plain:focus,
.el-button--danger:hover,
.el-button--danger:focus {
  background: var(--red-bg);
  border-color: #f0c0c0;
  color: var(--red-tx);
}

/* 成功按钮：原型 .btn.ok（绿字 / 淡绿描边） */
.el-button--success.is-plain,
.el-button--success {
  color: var(--green-tx);
  border-color: #b9e0bd;
  background: #fff;
}
.el-button--success.is-plain:hover, .el-button--success.is-plain:focus,
.el-button--success:hover,
.el-button--success:focus {
  background: var(--green-bg);
  border-color: #b9e0bd;
  color: var(--green-tx);
}

/* 文字链接：原型 .btn.gh（透明 / 仅文字） */
.el-button.is-link {
  border-color: transparent;
  background: transparent;
  color: var(--g500);
  padding: 0 8px;
  height: 30px;
}
.el-button.is-link:hover, .el-button.is-link:focus {
  background: var(--g100);
  color: var(--black);
}
.el-button.is-link.el-button--primary {
  color: var(--g600);
  font-weight: 400;
}
.el-button.is-link.el-button--primary:hover, .el-button.is-link.el-button--primary:focus {
  background: var(--g100);
  color: var(--black);
}

/* ── 输入框 / 选择器：原型 .fi / .inp（g200 描边 / 6px / 13px） ── */
.el-input,
.el-select,
.el-date-editor,
.el-input-number {
  --el-input-height: 34px;
}

.el-input__wrapper,
.el-select__wrapper {
  border-radius: 6px;
  box-shadow: 0 0 0 1px var(--g200) inset;
  padding: 1px 12px;
  transition: box-shadow 0.15s, border-color 0.15s;
}

.el-input__inner,
.el-select__selected-item {
  font-size: 13px;
  color: var(--g700);
}

.el-input__wrapper:hover,
.el-select__wrapper:hover {
  box-shadow: 0 0 0 1px var(--g300) inset;
}

.el-input__wrapper.is-focus,
.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px var(--km-yellow) inset, 0 0 0 3px var(--km-yellow-light);
}

.el-input.is-disabled .el-input__wrapper {
  background: var(--g100);
}

/* ── 表格：原型 .lst（浅灰大写表头 / 细分隔线 / 行悬浮） ── */
.el-table {
  --el-table-header-bg-color: var(--g50);
  --el-table-header-text-color: var(--g400);
  --el-table-border-color: var(--g200);
  --el-table-row-hover-bg-color: var(--g50);
  --el-table-bg-color: #fff;
  --el-table-tr-bg-color: #fff;
  font-size: 13px;
  color: var(--g700);
}
.el-table th.el-table__cell {
  background: var(--g50);
  color: var(--g400);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--g200);
  padding: 10px 0;
}
.el-table td.el-table__cell {
  padding: 13px 0;
  border-bottom: 1px solid #f5f5f5;
}
.el-table .cell {
  padding: 0 22px;
  line-height: 1.45;
}
.el-table {
  /* 去除斑马纹（原型是纯白底 + 悬浮 g50） */
}
.el-table.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: #fff;
}
.el-table::before {
  height: 0;
}

/* 表内操作列：文字按钮上下居中 */
.el-table .el-button.is-link {
  height: auto;
  padding: 2px 6px;
  font-size: 12px;
}

/* ── 分页：原型 .pagi（g50 底 / 30px 方钮 / 黄色激活） ── */
.el-pagination {
  --el-pagination-button-bg-color: #fff;
  --el-pagination-hover-color: var(--km-yellow-dark);
  font-size: 12px;
  color: var(--g400);
}
.el-pagination .el-pager li,
.el-pagination .btn-prev,
.el-pagination .btn-next {
  width: 30px;
  height: 30px;
  border: 1px solid var(--g200);
  border-radius: 6px;
  background: #fff;
  color: var(--g500);
  font-size: 12px;
}
.el-pagination .el-pager li:hover,
.el-pagination .btn-prev:hover,
.el-pagination .btn-next:hover {
  border-color: var(--g300);
  color: var(--g600);
}
.el-pagination .el-pager li.is-active {
  background: var(--km-yellow);
  border-color: var(--km-yellow);
  color: #000;
  font-weight: 700;
}

/* ── 标签：原型 .badge（4px / 3px 10px / 11px 600） ── */
.el-tag {
  --el-tag-border-radius: 4px;
  height: auto;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  border: none;
}
.el-tag.el-tag--primary {
  background: var(--km-yellow-light);
  color: #8a6d00;
}
.el-tag.el-tag--success {
  background: var(--green-bg);
  color: var(--green-tx);
}
.el-tag.el-tag--info {
  background: var(--g100);
  color: var(--g500);
}
.el-tag.el-tag--warning {
  background: #fff3e0;
  color: #b26a00;
}
.el-tag.el-tag--danger {
  background: var(--red-bg);
  color: var(--red-tx);
}

/* ── 卡片：原型 .panel（10px / 1px g200 / 头部 16px 22px） ── */
.el-card {
  border-color: var(--g200);
}
.el-card.is-never-shadow {
  box-shadow: none;
}
.el-card__header {
  padding: 16px 22px;
  border-bottom: 1px solid var(--g200);
  font-size: 15px;
  font-weight: 600;
  color: var(--black);
}
.el-card__body {
  padding: 0;
}

/* ── Tabs：原型 .tab（13px / 激活黑色 + 2px 黄下划线） ── */
.el-tabs .el-tabs__item {
  font-size: 13px;
  color: var(--g500);
  height: 44px;
  line-height: 44px;
  padding: 0 18px;
}
.el-tabs .el-tabs__item:hover {
  color: var(--g700);
}
.el-tabs .el-tabs__item.is-active {
  color: var(--black);
  font-weight: 600;
}
.el-tabs .el-tabs__active-bar {
  height: 2px;
  background: var(--km-yellow);
}
.el-tabs .el-tabs__nav-wrap::after {
  height: 1px;
  background: var(--g200);
}

/* ── 表单 ── */
.el-form-item__label {
  font-size: 12px;
  color: var(--g600);
  font-weight: 600;
}

.el-form-item__label::before {
  color: var(--red-tx);
}

.el-form-item__content .el-input__inner,
.el-form-item__content .el-select__selected-item {
  font-size: 13px;
}

/* ── 面包屑（顶栏） ── */
.el-breadcrumb .el-breadcrumb__inner,
.el-breadcrumb .el-breadcrumb__separator {
  font-size: 13px;
  color: var(--g400);
}
.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner,
.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner a {
  color: var(--g700);
  font-weight: 500;
}

/* ── 描述列表（详情信息行） ── */
.el-descriptions .el-descriptions__label {
  font-size: 13px;
  color: var(--g500);
}
.el-descriptions .el-descriptions__content {
  font-size: 13px;
  color: var(--black);
  font-weight: 500;
}

/* ── 步骤条 ── */
.el-step__title {
  font-size: 13px;
}

/* 表单校验错误文案（红） */
.el-form-item__error {
  font-size: 11px;
}