/* ───────────────────────────────────────────────────────────────────────────
   theme.css — 全局 UI 风格统一
   注入到所有页面，提供：字体、标题栏、加载遮罩、表格、按钮、表单的基础规范。
   各页面专属样式 (lingxing-sales.css / mes-output.css 等) 仍可在此之后覆盖。
   ──────────────────────────────────────────────────────────────────────────── */

/* ── 基础 ── */
body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", sans-serif;
    color: #222;
    background: #ffffff;
    overflow-x: hidden; /* 配合 .header 的 vw 负边距，避免水平滚动条 */
}

/* ── 统一标题栏：用 vw 负边距让灰底延伸到视口边缘，
   与任意 body/container 横向 padding 自适应 ── */
h2.header,
.title-bar {
    background-color: #f1f1f1;
    padding: 13px 0;
    margin: 0 calc(50% - 50vw) 18px;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #2c3e50;
}

/* 旧版的 .title 文本块统一升级（保留向后兼容，但视觉对齐 .header） */
.title.width-100 {
    background-color: #f1f1f1;
    padding: 13px 0;
    margin: 0 0 18px;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #2c3e50;
    /* 旧版可能依赖宽度类，保留宽度 */
    width: 100%;
}

/* ── 加载遮罩（全屏悬浮 + 居中 + 背景模糊）── */
.loading-wrap {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(8px) saturate(120%);
    -webkit-backdrop-filter: blur(8px) saturate(120%);
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 14px;
    animation: loading-fade-in 0.2s ease-out;
}
.loading-wrap.is-active {
    display: flex;
}
@keyframes loading-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* 卡片化 spinner 容器 */
.loading-wrap .spinner-border {
    width: 3rem;
    height: 3rem;
    border-width: 0.35em;
    color: #dc3545;
    filter: drop-shadow(0 4px 12px rgba(220, 53, 69, 0.25));
}
.loading-text {
    font-size: 14px;
    color: #2c3e50;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

/* 旧版的 .loading（裸 spinner-border + center-float / width-100 center） 视觉统一
   注意：Bootstrap 的 .spinner-border 默认是 inline-block，会覆盖页面 CSS 的 display:none，
   这里显式 hidden，由 JS 的 .show()/.hide() 控制可见性 */
.loading.spinner-border {
    display: none;
    color: #dc3545 !important;
    width: 2.5rem;
    height: 2.5rem;
}

/* ── 加载失败提示 统一红色风格 ── */
.loading-fail {
    display: none;
    margin: 16px 30px 0;
}
.loading-fail.alert-primary {
    /* 把旧版 alert-primary 视觉对齐到 alert-danger */
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
}

/* ── 通用表格美化 (不破坏 bootstrap .table) ── */
.table {
    font-size: 13px;
}
.table thead th {
    background-color: #2c3e50;
    color: #fff;
    border-color: #4a6278;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
}
.table tbody td {
    vertical-align: middle;
}

/* ── 按钮微调 ── */
.btn {
    font-size: 13px;
}

/* ── 表单元素微调 ── */
.form-select, .form-control {
    font-size: 13px;
}
.input-group-text {
    font-size: 13px;
    background-color: #f8f9fa;
    color: #495057;
}

/* ── 内容容器（统一外边距，方便老页面包裹） ── */
.app-container {
    padding: 0 30px 40px;
}