/*
 * 全站样式。
 * 配色取自机加工车间：石墨（侧栏）、铝材（底色）、阳极氧化蓝（主色）。
 * 红色只留给"逾期 / 临近交期 / 出错"，不要拿红色做装饰。
 */
:root {
  --erp-graphite: #1c242c;
  --erp-graphite-2: #27323d;
  --erp-rail-text: #c3ccd5;
  --erp-ink: #1f2a33;
  --erp-steel: #5f6d7a;
  --erp-aluminum: #eceff2;
  --erp-line: #d3d9df;
  --erp-anodize: #1d4f91;
  --erp-anodize-hover: #173f75;
  --erp-anodize-light: #8fb2e3;
  --erp-anodize-tint: #e8eef7;
  --erp-overdue: #b42318;
  --erp-due-soon: #fde8e7;
  --erp-done: #2f7d32;
  --erp-font: "HarmonyOS Sans SC", "MiSans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", system-ui, sans-serif;
  /* 只用于图号、订单号、版本号：等宽字体能分清 0 和 O、1 和 l */
  --erp-code: "JetBrains Mono", "SF Mono", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --erp-rail-width: 228px;

  --bs-body-font-family: var(--erp-font);
  --bs-body-font-size: 0.9375rem;
  --bs-body-line-height: 1.6;
  --bs-body-color: var(--erp-ink);
  --bs-body-bg: var(--erp-aluminum);
  --bs-border-color: var(--erp-line);
  --bs-border-radius: 4px;
  --bs-border-radius-sm: 3px;
  --bs-border-radius-lg: 6px;
  --bs-primary: #1d4f91;
  --bs-primary-rgb: 29, 79, 145;
  --bs-link-color: #1d4f91;
  --bs-link-color-rgb: 29, 79, 145;
  --bs-link-hover-color: #173f75;
  --bs-link-hover-color-rgb: 23, 63, 117;
  --bs-secondary-color: var(--erp-steel);
  --bs-focus-ring-color: rgba(29, 79, 145, 0.3);
}

body { font-variant-numeric: tabular-nums; -webkit-text-size-adjust: 100%; }
h1, h2, h3 { color: var(--erp-ink); letter-spacing: 0.01em; }
.erp-code { font-family: var(--erp-code); font-size: 0.92em; letter-spacing: 0; }

/* ---------- 按钮和表单 ---------- */
.btn-primary {
  --bs-btn-bg: var(--erp-anodize);
  --bs-btn-border-color: var(--erp-anodize);
  --bs-btn-hover-bg: var(--erp-anodize-hover);
  --bs-btn-hover-border-color: var(--erp-anodize-hover);
  --bs-btn-active-bg: #12345f;
  --bs-btn-active-border-color: #12345f;
  --bs-btn-disabled-bg: var(--erp-anodize);
  --bs-btn-disabled-border-color: var(--erp-anodize);
  --bs-btn-focus-shadow-rgb: 29, 79, 145;
}
.btn-outline-primary {
  --bs-btn-color: var(--erp-anodize);
  --bs-btn-border-color: var(--erp-anodize);
  --bs-btn-hover-bg: var(--erp-anodize);
  --bs-btn-hover-border-color: var(--erp-anodize);
  --bs-btn-active-bg: var(--erp-anodize-hover);
  --bs-btn-active-border-color: var(--erp-anodize-hover);
  --bs-btn-focus-shadow-rgb: 29, 79, 145;
}
.btn { min-height: 2.5rem; }
.form-control, .form-select { min-height: 2.5rem; background-color: #fff; }
.erp-narrow { max-width: 11rem; }
.form-control:focus, .form-select:focus {
  background-color: #fff;
  border-color: #6f93c4;
  box-shadow: 0 0 0 0.2rem rgba(29, 79, 145, 0.16);
}
.form-check-input:checked { background-color: var(--erp-anodize); border-color: var(--erp-anodize); }
.form-label { font-weight: 500; margin-bottom: 0.3rem; }
.form-text { color: var(--erp-steel); }
.invalid-feedback { display: block; }

/* 休息日这类"多选小方块" */
.erp-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.erp-chips .btn { min-width: 3.4rem; min-height: 2.25rem; }
.erp-chips .btn-check:checked + .btn {
  background: var(--erp-anodize);
  border-color: var(--erp-anodize);
  color: #fff;
}

/* ---------- 整体框架：电脑左侧菜单，手机顶部按钮 ---------- */
.erp-shell { display: flex; min-height: 100vh; }
.erp-main {
  flex: 1 1 auto;
  min-width: 0;
  padding: 1.5rem 1rem 2rem;
}
@media (min-width: 992px) {
  .erp-main { padding: 2rem 2.5rem 3rem; }
  .erp-rail-slot {
    flex: 0 0 var(--erp-rail-width);
    width: var(--erp-rail-width);
    position: sticky;
    top: 0;
    height: 100vh;
  }
  .erp-rail-slot .offcanvas-lg { height: 100%; }
}
.erp-rail {
  --bs-offcanvas-width: 264px;
  --bs-offcanvas-bg: var(--erp-graphite);
  --bs-offcanvas-color: var(--erp-rail-text);
}
.erp-rail-inner {
  background: var(--erp-graphite);
  color: var(--erp-rail-text);
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 1.1rem 0.9rem 1rem;
  overflow-y: auto;
}

/* 手机顶部栏 */
.erp-topbar {
  position: sticky;
  top: 0;
  z-index: 1020;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.75rem;
  padding-top: calc(0.55rem + env(safe-area-inset-top));
  background: var(--erp-graphite);
  color: #fff;
}
.erp-topbar .erp-menu-btn {
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.25);
  min-height: 2.5rem;
  min-width: 2.75rem;
  font-size: 1.25rem;
  line-height: 1;
}
.erp-topbar-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 图纸标题栏：系统的标识 */
.erp-titleblock {
  border: 1px solid rgba(255, 255, 255, 0.3);
  margin-bottom: 1.25rem;
}
.erp-titleblock-name {
  padding: 0.55rem 0.7rem;
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.35;
  word-break: break-all;
}
.erp-titleblock-row {
  display: grid;
  grid-template-columns: 1fr auto;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  font-size: 0.75rem;
}
.erp-titleblock-row > span { padding: 0.25rem 0.7rem; }
.erp-titleblock-row > span + span { border-left: 1px solid rgba(255, 255, 255, 0.3); }
.erp-titleblock.is-light { border-color: var(--erp-ink); }
.erp-titleblock.is-light .erp-titleblock-name { color: var(--erp-ink); font-size: 1.15rem; }
.erp-titleblock.is-light .erp-titleblock-row { border-top-color: var(--erp-ink); color: var(--erp-steel); }
.erp-titleblock.is-light .erp-titleblock-row > span + span { border-left-color: var(--erp-ink); }

/* 菜单 */
.erp-nav { display: flex; flex-direction: column; gap: 2px; }
.erp-nav-link {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.6rem 0.7rem;
  border-left: 3px solid transparent;
  color: var(--erp-rail-text);
  text-decoration: none;
  border-radius: 0 3px 3px 0;
}
.erp-nav-link .bi { font-size: 1.05rem; width: 1.2rem; text-align: center; }
.erp-nav-link:hover { background: var(--erp-graphite-2); color: #fff; }
.erp-nav-link:focus-visible { outline: 2px solid var(--erp-anodize-light); outline-offset: -2px; }
.erp-nav-link.is-active {
  background: var(--erp-graphite-2);
  border-left-color: var(--erp-anodize-light);
  color: #fff;
  font-weight: 600;
}
.erp-nav-tag {
  margin-left: auto;
  font-size: 0.7rem;
  color: #8796a5;
  border: 1px solid #44515e;
  padding: 0 0.35rem;
  border-radius: 2px;
}
.erp-rail-foot {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid #34404b;
  font-size: 0.85rem;
}
.erp-rail-foot a, .erp-rail-foot button {
  color: var(--erp-rail-text);
  text-decoration: none;
  background: none;
  border: 0;
  padding: 0.3rem 0;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.erp-rail-foot a:hover, .erp-rail-foot button:hover { color: #fff; }
.erp-rail-user { color: #fff; font-weight: 500; margin-bottom: 0.25rem; }

/* ---------- 页面标题 ---------- */
.erp-pagehead {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 1.25rem;
  max-width: 64rem;
}
.erp-title { font-size: 1.5rem; font-weight: 700; margin: 0; }
.erp-subtitle { color: var(--erp-steel); margin: 0.2rem 0 0; }
.erp-page { max-width: 64rem; }
.erp-page.is-narrow { max-width: 46rem; }

/* ---------- 内容分区 ---------- */
.erp-section {
  background: #fff;
  border: 1px solid var(--erp-line);
  border-radius: 4px;
  margin-bottom: 1.25rem;
}
.erp-section-head {
  padding: 0.8rem 1.1rem;
  border-bottom: 1px solid var(--erp-line);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.75rem;
}
.erp-section-head h2 { font-size: 1rem; font-weight: 600; margin: 0; }
.erp-section-head p { margin: 0; color: var(--erp-steel); font-size: 0.85rem; }
.erp-section-body { padding: 1.1rem; }

/* 保存按钮栏：手机上固定在屏幕底部，长表单不用滑到底才能保存 */
.erp-form-actions {
  position: sticky;
  bottom: 0;
  z-index: 5;
  display: flex;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem 0;
  padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
  background: rgba(236, 239, 242, 0.95);
  border-top: 1px solid var(--erp-line);
}
.erp-form-actions .btn-primary { min-width: 8rem; }

/* Logo 预览 */
.erp-logo-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 7.5rem;
  height: 4.5rem;
  border: 1px dashed var(--erp-line);
  background: #fafbfc;
  color: var(--erp-steel);
  font-size: 0.8rem;
}
.erp-logo-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.erp-logo-input { min-width: 14rem; }

/* ---------- 操作记录 ---------- */
.erp-history { list-style: none; margin: 0; padding: 0; }
.erp-history > li { padding: 0.75rem 1.1rem; border-top: 1px solid #edf0f3; }
.erp-history > li:first-child { border-top: 0; }
.erp-history-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.9rem;
  align-items: center;
  font-size: 0.85rem;
  color: var(--erp-steel);
}
.erp-history-action {
  font-size: 0.75rem;
  padding: 0 0.4rem;
  border: 1px solid var(--erp-line);
  border-radius: 2px;
  color: var(--erp-ink);
}
.erp-history-action.is-void { border-color: var(--erp-overdue); color: var(--erp-overdue); }
.erp-history-changes { list-style: none; margin: 0.35rem 0 0; padding: 0; }
.erp-history-changes li { padding: 0.1rem 0; word-break: break-all; }
.erp-history-field { color: var(--erp-steel); }
.erp-history-changes del { color: #8a96a2; }
.erp-history-changes ins { text-decoration: none; font-weight: 500; }

.erp-empty { color: var(--erp-steel); margin: 0; padding: 1rem 1.1rem; }

/* ---------- 进度表、提示 ---------- */
.erp-table { width: 100%; border-collapse: collapse; }
.erp-table th, .erp-table td { padding: 0.65rem 1.1rem; border-top: 1px solid #edf0f3; text-align: left; }
.erp-table thead th { border-top: 0; color: var(--erp-steel); font-weight: 500; font-size: 0.85rem; }
.erp-status { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.85rem; }
.erp-status.is-ready { color: var(--erp-done); }
.erp-status.is-pending { color: var(--erp-steel); }

.erp-callout {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.9rem 1.1rem;
  border: 1px solid #b9cbe6;
  background: var(--erp-anodize-tint);
  border-radius: 4px;
  margin-bottom: 1.25rem;
}
.erp-callout .bi { color: var(--erp-anodize); font-size: 1.15rem; line-height: 1.4; }
.erp-callout p { margin: 0; }

.erp-placeholder { padding: 2.5rem 1.25rem; text-align: center; }
.erp-placeholder .bi { font-size: 2.25rem; color: var(--erp-steel); }
.erp-placeholder h2 { font-size: 1.15rem; margin: 0.75rem 0 0.4rem; }
.erp-placeholder p { color: var(--erp-steel); max-width: 30rem; margin: 0 auto 0.4rem; }

.alert { border-radius: 4px; }
.erp-messages { max-width: 64rem; }

/* ---------- 登录页：左边是一张零件图纸 ---------- */
.erp-login { min-height: 100vh; background: var(--erp-aluminum); }
.erp-login-wrap {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
}
.erp-login-sheet {
  margin: 0.75rem 0.75rem 0;
  height: 11rem;
}
.erp-login-sheet svg { width: 100%; height: 100%; display: block; }
.erp-login-panel {
  padding: 1.5rem 1.25rem 2rem;
  width: 100%;
  max-width: 26rem;
  justify-self: center;
}
.erp-login-panel h1 { font-size: 1.35rem; font-weight: 700; margin: 0 0 1rem; }
@media (min-width: 992px) {
  .erp-login-wrap { grid-template-columns: minmax(0, 1fr) 28rem; align-content: stretch; }
  .erp-login-sheet { margin: 1.5rem 0 1.5rem 1.5rem; height: auto; }
  .erp-login-panel { align-self: center; padding: 2rem 2.5rem; max-width: none; }
}

/* 图纸线条 */
.dwg-line { fill: none; stroke: var(--erp-anodize); stroke-width: 1.6; }
.dwg-section { stroke: var(--erp-anodize); stroke-width: 1.6; }  /* 填充用元素上的 fill="url(#hatch)" 剖面线 */
.dwg-hidden { fill: none; stroke: var(--erp-anodize); stroke-width: 1; stroke-dasharray: 6 4; }
.dwg-thin { fill: none; stroke: #5d7ea8; stroke-width: 0.9; }
.dwg-center { fill: none; stroke: #7c94b3; stroke-width: 0.9; stroke-dasharray: 22 4 3 4; }
.dwg-text { fill: #3d5878; font-family: var(--erp-code); font-size: 13px; }
.dwg-zone { fill: #8d9cad; font-family: var(--erp-code); font-size: 11px; }
.dwg-frame { fill: none; stroke: #a9b7c6; stroke-width: 1; }
.dwg-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: dwg-draw 1.4s ease-out forwards; }
.dwg-draw.d2 { animation-delay: 0.25s; }
.dwg-draw.d3 { animation-delay: 0.5s; }
@keyframes dwg-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) {
  .dwg-draw { animation: none; stroke-dashoffset: 0; }
}

/* ---------- 出错页 ---------- */
.erp-error { max-width: 32rem; margin: 15vh auto 0; padding: 0 1.25rem; }
.erp-error h1 { font-size: 1.4rem; font-weight: 700; }
.erp-error p { color: var(--erp-steel); }