/* 普通表单/详情/进度 Modal 的公共居中外壳。
 * 统一备货工作台的白色、不透明、卡片式基础；业务专用头部仍可保留信息层级。
 */

/* Bootstrap 5 默认弹窗贴顶；Modal.show() 会写 inline display:block，叠层时再写 padding 造成左右偏移。
 * 全站统一相对视口水平+垂直居中，覆盖未加 modal-dialog-centered 的页面。
 * hide() 会先去掉 .show，过渡期内仍是 display:block；居中只绑 .show 时关窗会先跳回贴顶再淡出。
 */
.modal.show,
.modal[style*="display: block"],
.modal[style*="display:block"] {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
}

.modal.show .modal-dialog,
.modal[style*="display: block"] .modal-dialog,
.modal[style*="display:block"] .modal-dialog {
    margin-left: auto;
    margin-right: auto;
}

.modal.show .modal-dialog-scrollable,
.modal[style*="display: block"] .modal-dialog-scrollable,
.modal[style*="display:block"] .modal-dialog-scrollable {
    height: auto;
    max-height: calc(100vh - 3.5rem);
}

.modal.show .modal-dialog-scrollable .modal-content,
.modal[style*="display: block"] .modal-dialog-scrollable .modal-content,
.modal[style*="display:block"] .modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 3.5rem);
}

/* 关窗时 Bootstrap fade 会对 dialog 做 translate(0,-50px)。叠层下看起来像跳回贴顶。原地淡出即可。
 * 不用 !important，让后加载的 .update-notice-dialog scale 动画继续生效。
 */
.modal.fade .modal-dialog {
    transform: none;
}

.app-modal-shell .modal-content {
    overflow: hidden;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 20px 60px rgba(15, 23, 42, .20);
}
.app-modal-shell .modal-header {
    min-height: 56px;
    padding: 14px 20px;
    color: #1e293b;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}
.app-modal-shell .modal-title { font-size: 15px; font-weight: 650; }
.app-modal-shell .modal-body { background: #fff; }
.app-modal-shell .modal-footer {
    gap: 10px;
    padding: 12px 20px;
    background: #fff;
    border-top: 1px solid #e5e7eb;
}
.app-modal-shell .modal-footer .btn { min-height: 38px; }
.app-modal-shell .modal-dialog-scrollable .modal-body,
.app-modal-shell .modal-body.is-scrollable { overflow-y: auto; }

/* 页面原有彩色头部仅保留信息图标，不再使用渐变/半透明标题带。 */
.app-modal-shell .gradient-header,
.app-modal-shell .info-header,
.app-modal-shell .progress-modal-header,
.app-modal-shell .log-modal-header,
.app-modal-shell .heatmap-modal-header {
    color: #1e293b;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    backdrop-filter: none;
}
.app-modal-shell .gradient-header .modal-title,
.app-modal-shell .info-header .modal-title,
.app-modal-shell .progress-modal-header .modal-title,
.app-modal-shell .log-modal-title,
.app-modal-shell .heatmap-modal-title { color: #1e293b; }
.app-modal-shell .gradient-header .btn-close,
.app-modal-shell .info-header .btn-close,
.app-modal-shell .progress-modal-header .btn-close,
.app-modal-shell .log-modal-close { color: #475569; background: #f1f5f9; }

[data-theme="dark"] .app-modal-shell .modal-content,
[data-theme="dark"] .app-modal-shell .modal-header,
[data-theme="dark"] .app-modal-shell .modal-body,
[data-theme="dark"] .app-modal-shell .modal-footer,
[data-theme="dark"] .app-modal-shell .gradient-header,
[data-theme="dark"] .app-modal-shell .info-header,
[data-theme="dark"] .app-modal-shell .progress-modal-header,
[data-theme="dark"] .app-modal-shell .log-modal-header,
[data-theme="dark"] .app-modal-shell .heatmap-modal-header { background: #202631; border-color: #3b4350; }
[data-theme="dark"] .app-modal-shell .modal-header,
[data-theme="dark"] .app-modal-shell .modal-title,
[data-theme="dark"] .app-modal-shell .modal-body,
[data-theme="dark"] .app-modal-shell .log-modal-title,
[data-theme="dark"] .app-modal-shell .heatmap-modal-title { color: #e5e7eb; }