/**
 * 项目统一主题（与 CodeEasyUtil 风格一致）：青色系、卡片、表格、按钮、加载遮罩、提示框
 * Bootstrap 与 Bootstrap Icons 使用本地 webjars，不依赖远程 CDN
 */
:root {
    --sidebar-width: 260px;
    --header-height: 60px;
    --primary: #0f766e;
    --primary-light: #0d9488;
    --primary-dark: #0c4a6e;
    --accent: #14b8a6;
    --bg-main: #f0fdfa;
    --card-bg: #ffffff;
    --text-primary: #134e4a;
    --text-muted: #64748b;
    --font-family-base: 'Noto Sans SC', system-ui, -apple-system, sans-serif;
}

/*
 * 权限菜单：默认靠 HTML hidden / 无 role 时隐藏；去掉 hidden 后显示。
 * 角色恢复见 role-boot.js / ui-common.js（按用户名校验，避免串号闪超管菜单）。
 */
.sidebar .nav-link.admin-only[hidden],
.sidebar .nav-link.manager-only[hidden],
.menu-item[data-role="admin"][hidden],
.menu-item[data-role="manager"][hidden] {
    display: none !important;
}
.sidebar .nav-link.admin-only:not([hidden]),
.sidebar .nav-link.manager-only:not([hidden]) {
    display: block !important;
}
.menu-item[data-role="admin"]:not([hidden]),
.menu-item[data-role="manager"]:not([hidden]) {
    display: block !important;
}
/* 无 hidden 属性的旧标记：在未确认角色前仍默认隐藏 */
html:not(.role-ready) .sidebar .nav-link.admin-only,
html:not(.role-ready) .sidebar .nav-link.manager-only,
html:not(.role-ready) .menu-item[data-role="admin"],
html:not(.role-ready) .menu-item[data-role="manager"] {
    display: none !important;
}
html.role-user .sidebar .nav-link.admin-only,
html.role-user .sidebar .nav-link.manager-only,
html.role-manager .sidebar .nav-link.admin-only,
html.role-user .menu-item[data-role="admin"],
html.role-user .menu-item[data-role="manager"],
html.role-manager .menu-item[data-role="admin"] {
    display: none !important;
}

/* =========================================================
   夜间主题终版（可读性优先）
   规则放在文件末尾，确保覆盖各页面内联/早期样式
   ========================================================= */
body.theme-dark-soft .app-layout .main-wrap,
body.theme-dark-contrast .app-layout .main-wrap {
    background: transparent !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card,
body.theme-dark-contrast .app-layout .main-wrap .content-card {
    background: #f8fafc !important;
    color: #0f172a !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.24) !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card .card,
body.theme-dark-soft .app-layout .main-wrap .content-card .app-card,
body.theme-dark-contrast .app-layout .main-wrap .content-card .card,
body.theme-dark-contrast .app-layout .main-wrap .content-card .app-card {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid rgba(15, 23, 42, 0.1) !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card .card-body,
body.theme-dark-contrast .app-layout .main-wrap .content-card .card-body {
    background: #ffffff !important;
    color: #0f172a !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card .page-title,
body.theme-dark-soft .app-layout .main-wrap .content-card h1,
body.theme-dark-soft .app-layout .main-wrap .content-card h2,
body.theme-dark-soft .app-layout .main-wrap .content-card h3,
body.theme-dark-soft .app-layout .main-wrap .content-card h4,
body.theme-dark-soft .app-layout .main-wrap .content-card h5,
body.theme-dark-soft .app-layout .main-wrap .content-card h6,
body.theme-dark-contrast .app-layout .main-wrap .content-card .page-title,
body.theme-dark-contrast .app-layout .main-wrap .content-card h1,
body.theme-dark-contrast .app-layout .main-wrap .content-card h2,
body.theme-dark-contrast .app-layout .main-wrap .content-card h3,
body.theme-dark-contrast .app-layout .main-wrap .content-card h4,
body.theme-dark-contrast .app-layout .main-wrap .content-card h5,
body.theme-dark-contrast .app-layout .main-wrap .content-card h6 {
    color: #0f172a !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card p,
body.theme-dark-soft .app-layout .main-wrap .content-card span,
body.theme-dark-soft .app-layout .main-wrap .content-card label,
body.theme-dark-soft .app-layout .main-wrap .content-card .text-muted,
body.theme-dark-contrast .app-layout .main-wrap .content-card p,
body.theme-dark-contrast .app-layout .main-wrap .content-card span,
body.theme-dark-contrast .app-layout .main-wrap .content-card label,
body.theme-dark-contrast .app-layout .main-wrap .content-card .text-muted {
    color: #334155 !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card .form-control,
body.theme-dark-soft .app-layout .main-wrap .content-card .form-select,
body.theme-dark-soft .app-layout .main-wrap .content-card textarea,
body.theme-dark-contrast .app-layout .main-wrap .content-card .form-control,
body.theme-dark-contrast .app-layout .main-wrap .content-card .form-select,
body.theme-dark-contrast .app-layout .main-wrap .content-card textarea {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}
body.theme-dark-soft .app-layout .main-wrap .content-card .table,
body.theme-dark-soft .app-layout .main-wrap .content-card .table-responsive,
body.theme-dark-soft .app-layout .main-wrap .content-card .table th,
body.theme-dark-soft .app-layout .main-wrap .content-card .table td,
body.theme-dark-contrast .app-layout .main-wrap .content-card .table,
body.theme-dark-contrast .app-layout .main-wrap .content-card .table-responsive,
body.theme-dark-contrast .app-layout .main-wrap .content-card .table th,
body.theme-dark-contrast .app-layout .main-wrap .content-card .table td {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
}

body.theme-light {
    --bg-main: #f0fdfa;
    --card-bg: #ffffff;
    --text-primary: #134e4a;
    --text-muted: #64748b;
}

body.theme-dark-soft {
    --bg-main: #0b1220;
    --card-bg: #0f172a;
    --text-primary: #e2e8f0;
    --text-muted: #94a3b8;
}

body.theme-dark-contrast {
    --bg-main: #020617;
    --card-bg: #0b1120;
    --text-primary: #f8fafc;
    --text-muted: #cbd5e1;
}

/* 简化主题切换：theme-dark 作为深色主题别名（便于 JS 统一控制） */
body.theme-dark {
    --bg-main: #0b1220;
    --card-bg: #0f172a;
    --text-primary: #e2e8f0;
    --text-muted: #94a3b8;
}


/* ---------- 基础容器 ---------- */
.app-page-body {
    font-family: 'Noto Sans SC', system-ui, -apple-system, sans-serif;
    background: var(--bg-main);
    min-height: 100vh;
    padding: 12px 20px;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    color: #1e293b;
}

/* ---------- 统一卡片 ---------- */
.app-card,
.card.app-card {
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .06);
    background: var(--card-bg);
    border: 1px solid rgba(15, 118, 110, .06);
    position: relative;
    z-index: 10;
    overflow: hidden;
}

.app-card .card-body {
    padding: 1.25rem 1.5rem;
}

/* ---------- 统一卡片头部 ---------- */
.app-card .card-header,
.card-header.app-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 50%, var(--primary-light) 100%) !important;
    color: white;
    border-radius: 16px 16px 0 0 !important;
    padding: 14px 18px;
    border: none;
}

.app-card .card-header h4,
.app-card .card-header h5,
.card-header.app-card-header h4,
.card-header.app-card-header h5 {
    color: white;
    font-size: 1.1rem;
    margin: 0;
}

/* 深色渐变表头内的按钮：与内容区「主按钮 / 描边按钮」同一主题色；白边+阴影与表头渐变区分，避免糊成一片 */
.card-header.app-card-header .btn-primary,
.card-header.app-card-header .btn-info {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    font-weight: 600;
    opacity: 1 !important;
}
.card-header.app-card-header .btn-primary:hover:not(:disabled):not(.disabled),
.card-header.app-card-header .btn-info:hover:not(:disabled):not(.disabled) {
    color: #fff !important;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    border-color: #fff !important;
    filter: brightness(1.05);
    opacity: 1 !important;
}
.card-header.app-card-header .btn-outline-secondary,
.card-header.app-card-header .btn-outline-primary,
.card-header.app-card-header .btn-outline-info,
.card-header.app-card-header .btn-outline-warning,
.card-header.app-card-header .btn-warning {
    background: #fff !important;
    color: var(--primary) !important;
    border: 2px solid var(--primary) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    font-weight: 600;
    opacity: 1 !important;
}
.card-header.app-card-header .btn-outline-secondary:hover:not(:disabled):not(.disabled),
.card-header.app-card-header .btn-outline-primary:hover:not(:disabled):not(.disabled),
.card-header.app-card-header .btn-outline-info:hover:not(:disabled):not(.disabled),
.card-header.app-card-header .btn-outline-warning:hover:not(:disabled):not(.disabled),
.card-header.app-card-header .btn-warning:hover:not(:disabled):not(.disabled) {
    background: #f0fdfa !important;
    color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
    opacity: 1 !important;
}
.card-header.app-card-header .btn-primary:focus-visible,
.card-header.app-card-header .btn-info:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.55), 0 2px 12px rgba(0, 0, 0, 0.22) !important;
}
.card-header.app-card-header .btn-outline-secondary:focus-visible,
.card-header.app-card-header .btn-outline-primary:focus-visible,
.card-header.app-card-header .btn-outline-info:focus-visible,
.card-header.app-card-header .btn-outline-warning:focus-visible,
.card-header.app-card-header .btn-warning:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45) !important;
}
.card-header.app-card-header .btn-primary:disabled,
.card-header.app-card-header .btn-info:disabled,
.card-header.app-card-header .btn-primary.disabled,
.card-header.app-card-header .btn-info.disabled {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    color: rgba(255, 255, 255, 0.78) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    opacity: 0.75 !important;
    cursor: not-allowed;
    filter: grayscale(0.15);
}
.card-header.app-card-header .btn-outline-secondary:disabled,
.card-header.app-card-header .btn-outline-primary:disabled,
.card-header.app-card-header .btn-outline-info:disabled,
.card-header.app-card-header .btn-outline-warning:disabled,
.card-header.app-card-header .btn-warning:disabled,
.card-header.app-card-header .btn-outline-secondary.disabled,
.card-header.app-card-header .btn-outline-primary.disabled,
.card-header.app-card-header .btn-outline-info.disabled,
.card-header.app-card-header .btn-outline-warning.disabled,
.card-header.app-card-header .btn-warning.disabled {
    background: rgba(255, 255, 255, 0.88) !important;
    color: rgba(15, 118, 110, 0.55) !important;
    border-color: rgba(15, 118, 110, 0.4) !important;
    opacity: 1 !important;
    cursor: not-allowed;
}

/* 弹窗头部与主题一致（添加/编辑等 Bootstrap modal） */
.modal-header.app-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 50%, var(--primary-light) 100%) !important;
    color: white;
    border: none;
    padding: 14px 18px;
}
.modal-header.app-card-header .modal-title {
    color: white;
    font-size: 1.1rem;
    margin: 0;
}

/* ---------- 返回/首页按钮 ---------- */
.btn-return,
.app-btn-return,
a.btn-return {
    background: rgba(255, 255, 255, .2);
    border: 1px solid rgba(255, 255, 255, .35);
    color: white;
    border-radius: 10px;
    padding: 8px 16px;
    font-size: 0.85rem;
    text-decoration: none;
    white-space: nowrap;
    transition: background .2s, color .2s;
}

.btn-return:hover,
.app-btn-return:hover,
a.btn-return:hover {
    color: white;
    background: rgba(255, 255, 255, .3);
}

/* ---------- 统一表格 ---------- */
.app-table,
.table.app-table {
    font-size: 0.9rem;
    margin-bottom: 0;
}

.app-table thead th,
.table.app-table thead th {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    color: white;
    font-weight: 600;
    border: none;
    padding: 0.6rem 0.75rem;
    white-space: nowrap;
}

.app-table tbody td,
.table.app-table tbody td {
    padding: 0.5rem 0.75rem;
    vertical-align: middle;
}

.app-table td.wrap,
.table.app-table td.wrap {
    white-space: normal;
    max-width: 280px;
    word-break: break-all;
}

/* 产品统计列（手机端行数限制在下方媒体查询） */

.table-responsive.app-table-wrap {
    border-radius: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* 分页信息文字：保证清晰可读 */
.page-info {
    color: #212529;
    font-weight: 500;
    font-size: 0.95rem;
}

/* ---------- 统一主按钮 ---------- */
.btn-primary.app-btn,
.btn.app-btn-primary {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    border: none;
    border-radius: 10px;
    font-weight: 500;
    padding: 0.5rem 1rem;
    transition: opacity .2s, transform .15s;
}

.btn-primary.app-btn:hover,
.btn.app-btn-primary:hover {
    opacity: 0.92;
    transform: translateY(-1px);
}

.btn-success.app-btn,
.btn.app-btn-success {
    background: linear-gradient(135deg, var(--primary), var(--accent));
    border: none;
    border-radius: 10px;
    font-weight: 500;
}

.btn-success.app-btn:hover,
.btn.app-btn-success:hover {
    opacity: 0.92;
}

.btn-outline-secondary.app-btn {
    border-radius: 10px;
}

/* ---------- 全局按钮主题色（覆盖 Bootstrap 默认蓝，全站统一青色） ---------- */
.btn-primary {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    border: none !important;
    border-radius: 10px;
    font-weight: 500;
    color: #fff !important;
}
.btn-primary:hover {
    opacity: 0.92;
    color: #fff !important;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
}
.btn-outline-primary {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
    border-radius: 10px;
    background: rgba(15, 118, 110, 0.08) !important;
}
.btn-outline-primary:hover {
    background: var(--primary) !important;
    color: #fff !important;
    border-color: var(--primary) !important;
}
/* 描边按钮统一加浅色背景，与主按钮风格一致 */
.btn-outline-secondary {
    background: rgba(15, 118, 110, 0.06) !important;
    border-color: var(--primary) !important;
    color: var(--text-primary) !important;
    border-radius: 10px;
}
.btn-outline-secondary:hover {
    background: rgba(15, 118, 110, 0.15) !important;
    border-color: var(--primary) !important;
    color: var(--text-primary) !important;
}
.btn-outline-danger {
    background: rgba(220, 53, 69, 0.08) !important;
    border-color: #dc3545 !important;
    color: #dc3545 !important;
    border-radius: 10px;
}
.btn-outline-danger:hover {
    background: #dc3545 !important;
    border-color: #dc3545 !important;
    color: #fff !important;
}
.btn-success {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 10px;
}
.btn-success:hover {
    opacity: 0.92;
    color: #fff !important;
}
.btn-info {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary)) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 10px;
}
.btn-info:hover {
    opacity: 0.92;
    color: #fff !important;
}
.btn-warning {
    background: transparent !important;
    color: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    border-radius: 10px;
}
.btn-warning:hover {
    background: rgba(15, 118, 110, 0.1) !important;
    color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}

/* 分页当前页与主题一致 */
.pagination .page-item.active .page-link {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

/* ---------- 上传区域 ---------- */
.upload-zone.app-upload-zone {
    border: 2px dashed var(--primary);
    border-radius: 12px;
    padding: 24px 20px;
    text-align: center;
    background: #f0fdfa;
    transition: border-color .2s, background .2s;
}

.upload-zone.app-upload-zone.dragover,
.upload-zone.dragover {
    border-color: var(--primary-light);
    background: rgba(20, 184, 166, .08);
}

/* ---------- 加载遮罩 ---------- */
#appLoadingOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 118, 110, .2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}

#appLoadingOverlay.show {
    opacity: 1;
    visibility: visible;
}

#appLoadingOverlay .spinner-box {
    width: 56px;
    height: 56px;
    border: 4px solid rgba(15, 118, 110, .2);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: app-spin .9s linear infinite;
}

#appLoadingOverlay .spinner-text {
    margin-top: 16px;
    color: var(--text-primary);
    font-size: 0.95rem;
    font-weight: 500;
}

@keyframes app-spin {
    to { transform: rotate(360deg); }
}

/* ---------- 统一提示框（Toast/Modal） ---------- */
.app-toast-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99998;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}

.app-toast-modal.show {
    opacity: 1;
    visibility: visible;
}

.app-toast-modal .toast-content {
    background: var(--card-bg);
    border-radius: 16px;
    padding: 24px 28px;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .15);
    border: 1px solid rgba(15, 118, 110, .1);
    transform: scale(0.9);
    transition: transform .25s ease;
}

.app-toast-modal.show .toast-content {
    transform: scale(1);
}

.app-toast-modal .toast-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(15, 118, 110, .1);
}

.app-toast-modal .toast-title {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 10px;
}

.app-toast-modal .toast-title .icon-success { color: var(--primary); }
.app-toast-modal .toast-title .icon-error { color: #dc3545; }
.app-toast-modal .toast-title .icon-warning { color: #fd7e14; }
.app-toast-modal .toast-title .icon-info { color: var(--primary-light); }

.app-toast-modal .toast-close {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.5rem;
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
}

.app-toast-modal .toast-close:hover {
    color: var(--text-primary);
}

.app-toast-modal .toast-body {
    color: var(--text-primary);
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 18px;
}

.app-toast-modal .toast-footer {
    display: flex;
    justify-content: flex-end;
}

.app-toast-modal .toast-btn {
    padding: 10px 22px;
    border-radius: 10px;
    border: none;
    font-weight: 500;
    cursor: pointer;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    color: white;
    transition: opacity .2s;
}

.app-toast-modal .toast-btn:hover {
    opacity: 0.9;
}

/* ---------- 快捷卡片（首页等） ---------- */
.quick-card {
    border-radius: 14px;
    transition: transform .2s ease, box-shadow .2s ease;
}
.quick-card .card {
    border: none;
    border-radius: 14px;
}
.quick-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(15, 118, 110, .15);
}
.quick-icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5rem;
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.13), rgba(20, 184, 166, 0.13));
}
.quick-icon-wrap .bi {
    color: var(--primary);
}
.quick-card-title {
    color: var(--text-primary);
}

body.theme-dark.page-home .app-layout .content-card,
body.theme-dark-soft.page-home .app-layout .content-card,
body.theme-dark-contrast.page-home .app-layout .content-card {
    background: linear-gradient(180deg, #0f172a 0%, #111827 100%) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 10px 30px rgba(2, 6, 23, 0.35) !important;
}

body.theme-dark.page-home .quick-card,
body.theme-dark-soft.page-home .quick-card,
body.theme-dark-contrast.page-home .quick-card {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.26) !important;
}

body.theme-dark.page-home .quick-card .card-body,
body.theme-dark-soft.page-home .quick-card .card-body,
body.theme-dark-contrast.page-home .quick-card .card-body {
    background: transparent !important;
}

body.theme-dark.page-home .quick-card-title,
body.theme-dark-soft.page-home .quick-card-title,
body.theme-dark-contrast.page-home .quick-card-title {
    color: #f8fafc !important;
}

body.theme-dark.page-home .quick-card small,
body.theme-dark.page-home .quick-card .text-muted,
body.theme-dark-soft.page-home .quick-card small,
body.theme-dark-soft.page-home .quick-card .text-muted,
body.theme-dark-contrast.page-home .quick-card small,
body.theme-dark-contrast.page-home .quick-card .text-muted {
    color: #cbd5e1 !important;
}

body.theme-dark.page-home .quick-icon-wrap,
body.theme-dark-soft.page-home .quick-icon-wrap,
body.theme-dark-contrast.page-home .quick-icon-wrap {
    background: linear-gradient(135deg, rgba(20, 184, 166, 0.18), rgba(14, 165, 233, 0.14)) !important;
}

body.theme-dark.page-home .quick-icon-wrap .bi,
body.theme-dark-soft.page-home .quick-icon-wrap .bi,
body.theme-dark-contrast.page-home .quick-icon-wrap .bi {
    color: #99f6e4 !important;
}

body.theme-dark.page-home .quick-card:hover,
body.theme-dark-soft.page-home .quick-card:hover,
body.theme-dark-contrast.page-home .quick-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(2, 6, 23, 0.4) !important;
    border-color: rgba(45, 212, 191, 0.28) !important;
}

/* ---------- 统一布局：头部 + 侧栏 + 主内容（与首页一致） ---------- */
body.app-layout {
    margin: 0;
    background: var(--bg-main);
    font-family: var(--font-family-base);
    color: var(--text-primary);
}
.app-header {
    height: var(--header-height);
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 50%, var(--primary-light) 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    box-shadow: 0 4px 20px rgba(15, 118, 110, .25);
}
.app-header .brand {
    font-weight: 700;
    font-size: 1.35rem;
    letter-spacing: -0.02em;
}
.app-header .user-bar {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}
.app-header .user-name-wrap {
    font-size: 0.85rem;
    opacity: .92;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}
.app-header .user-name-wrap .bi-person-circle {
    font-size: 1.1rem;
    opacity: .9;
}
.app-header .expire-wrap {
    font-size: 0.85rem;
    opacity: .92;
}
/* 手机端顶部滚动广播（仅小屏显示，由 ui-common.js 控制） */
.app-mobile-broadcast {
    display: none;
    position: fixed;
    top: var(--header-height);
    left: 0;
    right: 0;
    z-index: 1025;
    height: var(--mobile-broadcast-height, 28px);
    overflow: hidden;
    background: linear-gradient(90deg, #fff7ed 0%, #ffedd5 50%, #fff7ed 100%);
    color: #9a3412;
    border-bottom: 1px solid rgba(234, 88, 12, 0.18);
    box-shadow: 0 2px 8px rgba(234, 88, 12, 0.08);
}
.app-mobile-broadcast-viewport {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
}
.app-mobile-broadcast-track {
    display: inline-block;
    white-space: nowrap;
    padding-left: 100%;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: var(--mobile-broadcast-height, 28px);
    animation: app-mobile-broadcast-scroll var(--broadcast-duration, 18s) linear infinite;
}
.app-mobile-broadcast-track.is-duplicated {
    padding-left: 0;
    animation-name: app-mobile-broadcast-scroll-loop;
}
/* 登录/注册页：贴顶显示（无顶栏） */
body.auth-page .app-mobile-broadcast,
.app-mobile-broadcast-auth {
    top: 0;
    z-index: 1040;
}
@media (max-width: 767.98px) {
    body.auth-page.mobile-broadcast-on {
        --mobile-broadcast-height: 28px;
        padding-top: calc(1.5rem + var(--mobile-broadcast-height));
    }
}
@keyframes app-mobile-broadcast-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}
@keyframes app-mobile-broadcast-scroll-loop {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.btn-toggle-sidebar {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    border: none;
    padding: 0.45rem 0.75rem;
    border-radius: 10px;
    transition: background .2s;
}
.btn-toggle-sidebar:hover {
    background: rgba(255, 255, 255, .35);
    color: #fff;
}
/* 返回首页按钮：仅手机端显示，PC 端隐藏 */
.btn-mobile-home {
    display: none;
    align-items: center;
    background: rgba(255, 255, 255, .2);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 10px;
    padding: 0.4rem 0.75rem;
    font-size: 0.85rem;
    text-decoration: none;
    white-space: nowrap;
    transition: background .2s, color .2s;
}
.btn-mobile-home:hover {
    background: rgba(255, 255, 255, .3);
    color: #fff;
}
.app-layout .sidebar {
    width: var(--sidebar-width);
    min-height: calc(100vh - var(--header-height));
    margin-top: var(--header-height);
    background: var(--card-bg);
    box-shadow: 4px 0 24px rgba(0, 0, 0, .06);
    position: fixed;
    left: 0;
    transition: transform .25s ease;
    z-index: 1020;
    overflow-y: auto;
    border-right: 1px solid rgba(15, 118, 110, .08);
}
.app-layout .sidebar.collapsed {
    transform: translateX(calc(-1 * var(--sidebar-width)));
}
.app-layout .sidebar .nav {
    padding: 0.75rem 0;
}
.app-layout .sidebar .nav-link {
    color: #475569;
    padding: 0.85rem 1.35rem;
    margin: 0 0.5rem;
    border-radius: 10px;
    font-weight: 500;
    transition: all .2s ease;
    text-decoration: none;
}
.app-layout .sidebar .nav-link i {
    margin-right: 0.65rem;
    width: 1.35rem;
    text-align: center;
    font-size: 1.1rem;
    opacity: .9;
}
.app-layout .sidebar .nav-link:hover {
    background: rgba(15, 118, 110, .08);
    color: var(--primary);
}
.app-layout .sidebar .nav-link.active {
    background: linear-gradient(90deg, rgba(15, 118, 110, .12), rgba(20, 184, 166, .08));
    color: var(--primary);
    font-weight: 600;
}
.app-layout .main-wrap {
    margin-left: var(--sidebar-width);
    margin-top: var(--header-height);
    padding: 1.75rem;
    min-height: calc(100vh - var(--header-height));
    transition: margin-left .25s ease;
}
.app-layout .main-wrap.sidebar-collapsed {
    margin-left: 0;
}
.app-layout .content-card {
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .06);
    padding: 2rem;
    border: 1px solid rgba(15, 118, 110, .06);
}
.app-layout .page-title {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}
.app-layout .page-desc {
    color: var(--text-muted);
    font-size: 0.95rem;
    margin-bottom: 1.5rem;
}
.help-btn-header {
    background: rgba(255, 255, 255, .15);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;
    padding: 0.4rem 0.9rem;
    font-size: 0.9rem;
    text-decoration: none;
}
.help-btn-header:hover {
    background: rgba(255, 255, 255, .25);
    color: #fff;
}
a.help-btn-header {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.mobile-advanced-config {
    display: none;
    margin-bottom: 12px;
    border: 1px solid rgba(15, 118, 110, 0.2);
    border-radius: 10px;
    background: #f8fbfb;
    overflow: hidden;
}
.mobile-advanced-config .advanced-head {
    width: 100%;
    border: 0;
    background: transparent;
    color: #0f766e;
    font-weight: 600;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mobile-advanced-config .advanced-body {
    padding: 10px 12px 12px;
    border-top: 1px dashed rgba(15, 118, 110, 0.2);
}

body.theme-dark.app-layout .mobile-advanced-config,
body.theme-dark-soft.app-layout .mobile-advanced-config,
body.theme-dark-contrast.app-layout .mobile-advanced-config {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 6px 18px rgba(2, 6, 23, 0.22) !important;
}

body.theme-dark.app-layout .mobile-advanced-config .advanced-head,
body.theme-dark-soft.app-layout .mobile-advanced-config .advanced-head,
body.theme-dark-contrast.app-layout .mobile-advanced-config .advanced-head {
    background: transparent !important;
    color: #e5eef8 !important;
}

body.theme-dark.app-layout .mobile-advanced-config .advanced-body,
body.theme-dark-soft.app-layout .mobile-advanced-config .advanced-body,
body.theme-dark-contrast.app-layout .mobile-advanced-config .advanced-body {
    background: transparent !important;
    border-top-color: rgba(148, 163, 184, 0.16) !important;
}

body.theme-dark.app-layout .mobile-advanced-config .form-check-label,
body.theme-dark.app-layout .mobile-advanced-config .text-muted,
body.theme-dark.app-layout .mobile-advanced-config small,
body.theme-dark-soft.app-layout .mobile-advanced-config .form-check-label,
body.theme-dark-soft.app-layout .mobile-advanced-config .text-muted,
body.theme-dark-soft.app-layout .mobile-advanced-config small,
body.theme-dark-contrast.app-layout .mobile-advanced-config .form-check-label,
body.theme-dark-contrast.app-layout .mobile-advanced-config .text-muted,
body.theme-dark-contrast.app-layout .mobile-advanced-config small {
    color: #cbd5e1 !important;
}

.theme-toggle-btn {
    background: rgba(255, 255, 255, .18);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    padding: 0.38rem 0.85rem;
    font-size: 0.86rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    line-height: 1;
}
.theme-toggle-btn:hover {
    background: rgba(255, 255, 255, .3);
    color: #fff;
}

/* ---------- 深夜主题：表格/列表/字体可读性优先 ---------- */
body.theme-dark-soft,
body.theme-dark-contrast {
    color: var(--text-primary);
}
body.theme-dark-soft .app-page-body,
body.theme-dark-soft .main-wrap,
body.theme-dark-soft .content-card,
body.theme-dark-contrast .app-page-body,
body.theme-dark-contrast .main-wrap,
body.theme-dark-contrast .content-card {
    background: var(--bg-main) !important;
    color: var(--text-primary) !important;
}
body.theme-dark-soft .app-layout .content-card,
body.theme-dark-soft .app-card,
body.theme-dark-soft .card.app-card,
body.theme-dark-soft .card,
body.theme-dark-soft .modal-content,
body.theme-dark-soft .list-group-item,
body.theme-dark-contrast .app-layout .content-card,
body.theme-dark-contrast .app-card,
body.theme-dark-contrast .card.app-card,
body.theme-dark-contrast .card,
body.theme-dark-contrast .modal-content,
body.theme-dark-contrast .list-group-item {
    background: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
}
body.theme-dark-soft .app-card .card-body,
body.theme-dark-soft .card.app-card .card-body,
body.theme-dark-contrast .app-card .card-body,
body.theme-dark-contrast .card.app-card .card-body {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(2, 6, 23, 0.92)) !important;
}
body.theme-dark-soft .app-card .card-header,
body.theme-dark-soft .card-header.app-card-header,
body.theme-dark-soft .modal-header.app-card-header,
body.theme-dark-contrast .app-card .card-header,
body.theme-dark-contrast .card-header.app-card-header,
body.theme-dark-contrast .modal-header.app-card-header {
    background: linear-gradient(135deg, #0b3a4a 0%, #0f766e 55%, #0891b2 100%) !important;
    color: #f8fafc !important;
}
body.theme-dark-soft .app-card .card-header h4,
body.theme-dark-soft .app-card .card-header h5,
body.theme-dark-soft .card-header.app-card-header h4,
body.theme-dark-soft .card-header.app-card-header h5,
body.theme-dark-contrast .app-card .card-header h4,
body.theme-dark-contrast .app-card .card-header h5,
body.theme-dark-contrast .card-header.app-card-header h4,
body.theme-dark-contrast .card-header.app-card-header h5 {
    color: #f8fafc !important;
}
body.theme-dark-soft .app-layout .page-title,
body.theme-dark-soft .page-title,
body.theme-dark-soft h1,
body.theme-dark-soft h2,
body.theme-dark-soft h3,
body.theme-dark-soft h4,
body.theme-dark-soft h5,
body.theme-dark-soft h6,
body.theme-dark-soft .fw-bold,
body.theme-dark-soft strong,
body.theme-dark-contrast .app-layout .page-title,
body.theme-dark-contrast .page-title,
body.theme-dark-contrast h1,
body.theme-dark-contrast h2,
body.theme-dark-contrast h3,
body.theme-dark-contrast h4,
body.theme-dark-contrast h5,
body.theme-dark-contrast h6,
body.theme-dark-contrast .fw-bold,
body.theme-dark-contrast strong {
    color: #f8fafc !important;
}
body.theme-dark-soft .text-muted,
body.theme-dark-soft .page-desc,
body.theme-dark-soft small,
body.theme-dark-contrast .text-muted,
body.theme-dark-contrast .page-desc,
body.theme-dark-contrast small {
    color: var(--text-muted) !important;
}
body.theme-dark-soft .table-responsive,
body.theme-dark-soft .table,
body.theme-dark-contrast .table-responsive,
body.theme-dark-contrast .table {
    background: #0f172a !important;
    color: #e2e8f0 !important;
}
body.theme-dark-soft .table th,
body.theme-dark-soft .table td,
body.theme-dark-contrast .table th,
body.theme-dark-contrast .table td {
    color: #e2e8f0 !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
}
body.theme-dark-soft .table-striped > tbody > tr:nth-of-type(odd) > *,
body.theme-dark-contrast .table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(30, 41, 59, 0.62);
    color: #e2e8f0 !important;
}
body.theme-dark-soft .table-hover > tbody > tr:hover > *,
body.theme-dark-contrast .table-hover > tbody > tr:hover > * {
    --bs-table-accent-bg: rgba(15, 118, 110, 0.2);
    color: #f8fafc !important;
}
body.theme-dark-soft .form-control,
body.theme-dark-soft .form-select,
body.theme-dark-soft textarea,
body.theme-dark-contrast .form-control,
body.theme-dark-contrast .form-select,
body.theme-dark-contrast textarea {
    background: #111827 !important;
    color: #e2e8f0 !important;
    border-color: rgba(148, 163, 184, 0.35) !important;
}
body.theme-dark-soft input[type="file"]::file-selector-button,
body.theme-dark-contrast input[type="file"]::file-selector-button {
    background: #0f766e;
    color: #fff;
    border: 1px solid rgba(153, 246, 228, 0.5);
}
body.theme-dark-soft .form-control:focus,
body.theme-dark-soft .form-select:focus,
body.theme-dark-soft textarea:focus,
body.theme-dark-contrast .form-control:focus,
body.theme-dark-contrast .form-select:focus,
body.theme-dark-contrast textarea:focus {
    background: #0f172a !important;
    color: #f8fafc !important;
    border-color: #14b8a6 !important;
    box-shadow: 0 0 0 0.2rem rgba(20, 184, 166, 0.22) !important;
}
body.theme-dark-soft .btn-primary,
body.theme-dark-soft .btn-primary.app-btn,
body.theme-dark-soft .btn.app-btn-primary,
body.theme-dark-contrast .btn-primary,
body.theme-dark-contrast .btn-primary.app-btn,
body.theme-dark-contrast .btn.app-btn-primary {
    background: linear-gradient(135deg, #0f766e, #0ea5a4) !important;
    color: #fff !important;
    border-color: rgba(153, 246, 228, 0.45) !important;
}
body.theme-dark-soft .btn-outline-secondary,
body.theme-dark-soft .btn-outline-primary,
body.theme-dark-soft .btn-outline-danger,
body.theme-dark-contrast .btn-outline-secondary,
body.theme-dark-contrast .btn-outline-primary,
body.theme-dark-contrast .btn-outline-danger {
    background: rgba(15, 23, 42, 0.9) !important;
    color: #cbd5e1 !important;
    border-color: rgba(148, 163, 184, 0.45) !important;
}
body.theme-dark-soft .btn-outline-secondary:hover,
body.theme-dark-soft .btn-outline-primary:hover,
body.theme-dark-soft .btn-outline-danger:hover,
body.theme-dark-contrast .btn-outline-secondary:hover,
body.theme-dark-contrast .btn-outline-primary:hover,
body.theme-dark-contrast .btn-outline-danger:hover {
    color: #f8fafc !important;
    border-color: #14b8a6 !important;
    background: rgba(20, 184, 166, 0.15) !important;
}
body.theme-dark-soft .form-control::placeholder,
body.theme-dark-soft textarea::placeholder,
body.theme-dark-contrast .form-control::placeholder,
body.theme-dark-contrast textarea::placeholder {
    color: #94a3b8 !important;
}
body.theme-dark-soft .pagination .page-link,
body.theme-dark-contrast .pagination .page-link {
    background: #0f172a;
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, 0.25);
}
body.theme-dark-soft .pagination .page-item.active .page-link,
body.theme-dark-contrast .pagination .page-item.active .page-link {
    background: #0f766e;
    border-color: #0f766e;
    color: #fff;
}
body.theme-dark-soft .app-layout .sidebar,
body.theme-dark-contrast .app-layout .sidebar {
    background: #111827 !important;
    border-right-color: rgba(148, 163, 184, 0.2) !important;
}
body.theme-dark-soft .app-layout .sidebar .nav-link,
body.theme-dark-contrast .app-layout .sidebar .nav-link {
    color: #cbd5e1;
}
body.theme-dark-soft .app-layout .sidebar .nav-link:hover,
body.theme-dark-contrast .app-layout .sidebar .nav-link:hover {
    background: rgba(15, 118, 110, .2);
    color: #99f6e4;
}
body.theme-dark-soft .app-layout .sidebar .nav-link.active,
body.theme-dark-contrast .app-layout .sidebar .nav-link.active {
    background: linear-gradient(90deg, rgba(15, 118, 110, .35), rgba(20, 184, 166, .18));
    color: #99f6e4;
}
body.theme-dark-soft .modal-body,
body.theme-dark-soft .modal-footer,
body.theme-dark-contrast .modal-body,
body.theme-dark-contrast .modal-footer {
    background: #0f172a;
    color: #e2e8f0;
    border-color: rgba(148, 163, 184, 0.2);
}
body.theme-dark-soft .alert-info,
body.theme-dark-contrast .alert-info {
    background: rgba(14, 165, 164, 0.14) !important;
    border-color: rgba(45, 212, 191, 0.28) !important;
    color: #e2e8f0 !important;
}
body.theme-dark-soft .app-toast-modal .toast-content,
body.theme-dark-contrast .app-toast-modal .toast-content {
    background: #111827;
    color: #e2e8f0;
    border: 1px solid rgba(148, 163, 184, 0.25);
}

/* 深夜高对比：增强可读性 */
body.theme-dark-contrast .table,
body.theme-dark-contrast .table-responsive,
body.theme-dark-contrast .modal-body,
body.theme-dark-contrast .modal-footer {
    background: #020617 !important;
}
body.theme-dark-contrast .table th,
body.theme-dark-contrast .table td {
    color: #f8fafc !important;
    border-color: rgba(203, 213, 225, 0.34) !important;
}
body.theme-dark-contrast .table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(51, 65, 85, 0.82);
}
body.theme-dark-contrast .table-hover > tbody > tr:hover > * {
    --bs-table-accent-bg: rgba(20, 184, 166, 0.32);
}
body.theme-dark-contrast .form-control,
body.theme-dark-contrast .form-select,
body.theme-dark-contrast textarea {
    background: #020617 !important;
    color: #f8fafc !important;
    border-color: rgba(203, 213, 225, 0.45) !important;
}
body.theme-dark-contrast .text-muted,
body.theme-dark-contrast .page-desc,
body.theme-dark-contrast small {
    color: #cbd5e1 !important;
}

/* ---------- 深夜主题可读性兜底：深色外壳 + 浅色内容区 ---------- */
body.theme-dark-soft .app-layout .content-card,
body.theme-dark-soft .app-card,
body.theme-dark-soft .card.app-card,
body.theme-dark-soft .card,
body.theme-dark-contrast .app-layout .content-card,
body.theme-dark-contrast .app-card,
body.theme-dark-contrast .card.app-card,
body.theme-dark-contrast .card {
    background: #f8fafc !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.08) !important;
}
body.theme-dark-soft .app-card .card-body,
body.theme-dark-soft .card.app-card .card-body,
body.theme-dark-contrast .app-card .card-body,
body.theme-dark-contrast .card.app-card .card-body {
    background: #f8fafc !important;
    color: #0f172a !important;
}
body.theme-dark-soft .page-title,
body.theme-dark-soft .app-layout .page-title,
body.theme-dark-soft h1,
body.theme-dark-soft h2,
body.theme-dark-soft h3,
body.theme-dark-soft h4,
body.theme-dark-soft h5,
body.theme-dark-soft h6,
body.theme-dark-soft .fw-bold,
body.theme-dark-contrast .page-title,
body.theme-dark-contrast .app-layout .page-title,
body.theme-dark-contrast h1,
body.theme-dark-contrast h2,
body.theme-dark-contrast h3,
body.theme-dark-contrast h4,
body.theme-dark-contrast h5,
body.theme-dark-contrast h6,
body.theme-dark-contrast .fw-bold {
    color: #0f172a !important;
}
body.theme-dark-soft .text-muted,
body.theme-dark-soft .page-desc,
body.theme-dark-soft small,
body.theme-dark-contrast .text-muted,
body.theme-dark-contrast .page-desc,
body.theme-dark-contrast small {
    color: #475569 !important;
}
body.theme-dark-soft .table,
body.theme-dark-soft .table-responsive,
body.theme-dark-soft .table th,
body.theme-dark-soft .table td,
body.theme-dark-contrast .table,
body.theme-dark-contrast .table-responsive,
body.theme-dark-contrast .table th,
body.theme-dark-contrast .table td {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
}
body.theme-dark-soft .form-control,
body.theme-dark-soft .form-select,
body.theme-dark-soft textarea,
body.theme-dark-contrast .form-control,
body.theme-dark-contrast .form-select,
body.theme-dark-contrast textarea {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.18) !important;
}
body.theme-dark-soft .form-control::placeholder,
body.theme-dark-soft textarea::placeholder,
body.theme-dark-contrast .form-control::placeholder,
body.theme-dark-contrast textarea::placeholder {
    color: #64748b !important;
}
body.theme-dark-soft .btn-outline-secondary,
body.theme-dark-soft .btn-outline-primary,
body.theme-dark-soft .btn-outline-danger,
body.theme-dark-contrast .btn-outline-secondary,
body.theme-dark-contrast .btn-outline-primary,
body.theme-dark-contrast .btn-outline-danger {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
}

/* 处理日志·可编辑产品列表：产品名与输入框同一行，多列排布放不下再换行 */
#logModalOrdersContainer .row.g-2,
.log-modal-orders-container .row.g-2 {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
}
#logModalOrdersContainer .row.g-2 .col-auto,
.log-modal-orders-container .row.g-2 .col-auto,
#logModalOrdersContainer .row.g-2 .order-count-item,
.log-modal-orders-container .row.g-2 .order-count-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
#logModalOrdersContainer .row.g-2 .col-auto .form-label,
.log-modal-orders-container .row.g-2 .col-auto .form-label,
#logModalOrdersContainer .row.g-2 .order-count-item .form-label,
.log-modal-orders-container .row.g-2 .order-count-item .form-label {
    white-space: nowrap;
    margin-bottom: 0;
}

/* PC：产品名与输入框垂直居中，网格单元内居中；恢复 Chrome 原生加减 */
@media (min-width: 768px) {
    #logModalOrdersContainer > .card,
    #logModalOrdersContainer .card.mb-2 {
        margin-bottom: 0.85rem !important;
    }
    #logModalOrdersContainer .card-body {
        padding: 0.65rem 0.75rem;
        gap: 0.55rem;
    }
    #logModalOrdersContainer .log-order-summary-panel {
        padding: 0.45rem 0.7rem;
    }
    /* PC：产品区去掉灰底边框，恢复扁平编辑样式；手机端仍用带框面板 */
    #logModalOrdersContainer .log-order-products-panel {
        padding: 0.15rem 0;
        background: transparent;
        border: none;
        border-radius: 0;
    }
    #logModalOrdersContainer .log-order-products-panel > .row.g-2,
    #logModalOrdersContainer .card-body > .row.g-2,
    .log-modal-orders-container .log-order-products-panel > .row.g-2 {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.55rem 0.75rem;
        align-items: center;
        justify-items: center;
    }
    #logModalOrdersContainer .log-order-products-panel > .row.g-2 > .order-count-item,
    #logModalOrdersContainer .log-order-products-panel > .row.g-2 > .col-auto,
    #logModalOrdersContainer .card-body > .row.g-2 > .order-count-item,
    #logModalOrdersContainer .card-body > .row.g-2 > .col-auto,
    .log-modal-orders-container .log-order-products-panel > .row.g-2 > .order-count-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        min-width: 0;
        max-width: 100%;
        width: 100%;
        margin: 0;
        padding: 0.1rem 0.1rem;
        box-sizing: border-box;
    }
    #logModalOrdersContainer .log-order-products-panel .order-count-product-label,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-product-label,
    .log-modal-orders-container .log-order-products-panel .order-count-product-label {
        flex: 0 0 auto;
        /* 至少放下 3 个汉字；超长再省略，避免「外贸…」只露两位 */
        width: 4.1em;
        min-width: 4.1em;
        max-width: 4.1em;
        margin: 0 !important;
        padding: 0;
        line-height: 2rem;
        height: 2rem;
        text-align: right;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 0.82rem;
        font-weight: 600;
    }
    #logModalOrdersContainer .log-order-products-panel .order-count-stepper,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-stepper,
    .log-modal-orders-container .log-order-products-panel .order-count-stepper {
        flex: 0 0 auto;
        width: 4.75rem;
        height: 2rem;
        align-items: center;
        justify-content: center;
        border: none;
        border-radius: 0;
        background: transparent;
        overflow: visible;
    }
    #logModalOrdersContainer .log-order-products-panel .order-count-input,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-input,
    .log-modal-orders-container .log-order-products-panel .order-count-input {
        width: 4.75rem !important;
        min-width: 4.75rem !important;
        max-width: 4.75rem !important;
        height: 2rem;
        line-height: 1;
        padding: 0.15rem 0.2rem 0.15rem 0.3rem !important;
        border: 1px solid #ced4da !important;
        border-radius: 0.375rem !important;
        background: #fff !important;
        box-shadow: none !important;
        -moz-appearance: auto;
        appearance: auto;
    }
    #logModalOrdersContainer .log-order-products-panel .order-count-item.is-active .order-count-stepper,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-item.is-active .order-count-stepper {
        border: none;
        background: transparent;
    }
    #logModalOrdersContainer .log-order-products-panel .order-count-item.is-active .order-count-input,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-item.is-active .order-count-input {
        border-color: rgba(220, 53, 69, 0.55) !important;
        background: #fff !important;
    }
    /* Chrome：始终显示原生上下加减（默认常 hover 才出现） */
    #logModalOrdersContainer .log-order-products-panel .order-count-input::-webkit-outer-spin-button,
    #logModalOrdersContainer .log-order-products-panel .order-count-input::-webkit-inner-spin-button,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-input::-webkit-outer-spin-button,
    #logModalOrdersContainer .card-body > .row.g-2 .order-count-input::-webkit-inner-spin-button,
    .log-modal-orders-container .log-order-products-panel .order-count-input::-webkit-outer-spin-button,
    .log-modal-orders-container .log-order-products-panel .order-count-input::-webkit-inner-spin-button {
        -webkit-appearance: inner-spin-button;
        opacity: 1;
        height: 1.6rem;
        margin: 0;
    }
}
@media (min-width: 1200px) {
    #logModalOrdersContainer .log-order-products-panel > .row.g-2,
    #logModalOrdersContainer .card-body > .row.g-2,
    .log-modal-orders-container .log-order-products-panel > .row.g-2 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
@media (min-width: 1400px) {
    #logModalOrdersContainer .log-order-products-panel > .row.g-2,
    #logModalOrdersContainer .card-body > .row.g-2,
    .log-modal-orders-container .log-order-products-panel > .row.g-2 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

/* ========== 手机端适配（小屏统一排版） ========== */
@media (max-width: 767.98px) {
    body.app-layout {
        /* 顶栏与主区 margin-top 对齐；略小于原 60px，随内容更紧凑 */
        --header-height: 46px;
        --mobile-broadcast-height: 0px;
    }
    body.app-layout.mobile-broadcast-on {
        --mobile-broadcast-height: 28px;
    }
    body.app-layout.mobile-broadcast-on .app-layout .sidebar,
    body.app-layout.mobile-broadcast-on .sidebar,
    body.app-layout.mobile-broadcast-on #sidebar {
        margin-top: calc(var(--header-height) + var(--mobile-broadcast-height));
        min-height: calc(100vh - var(--header-height) - var(--mobile-broadcast-height));
    }
    body.app-layout.mobile-broadcast-on .app-layout .main-wrap,
    body.app-layout.mobile-broadcast-on .main-wrap {
        margin-top: calc(var(--header-height) + var(--mobile-broadcast-height));
        min-height: calc(100vh - var(--header-height) - var(--mobile-broadcast-height));
    }
    /* 手机端：去掉左侧菜单，主内容全宽 */
    .app-layout .sidebar,
    .sidebar,
    #sidebar {
        display: none !important;
    }
    .btn-toggle-sidebar {
        display: none !important;
    }
    .btn-mobile-home {
        display: inline-flex !important;
    }
    .mobile-advanced-config {
        display: block;
    }
    /* 全站统一：header 内「返回」等按钮同尺寸，避免商品配置/个人资料等页内 .btn 覆盖 */
    .app-header .btn-mobile-home {
        min-height: 0 !important;
        padding: 0.2rem 0.38rem !important;
        font-size: 0.68rem !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        min-width: 0;
        flex-shrink: 0;
    }
    .app-header .btn-mobile-home .bi {
        margin-right: 0.2rem !important;
    }
    /* 主内容区全宽、缩小内边距 */
    .app-layout .main-wrap,
    .main-wrap {
        margin-left: 0 !important;
        padding: 1rem !important;
        min-height: calc(100vh - var(--header-height));
    }
    .app-layout .main-wrap.sidebar-collapsed,
    .main-wrap.sidebar-collapsed {
        margin-left: 0 !important;
    }
    /* 头部单行：隐藏系统标题；左侧仅「返回」，右侧主题+登录名+过期+退出同一行自适应 */
    .app-header {
        padding: 0 0.45rem;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.3rem;
        height: var(--header-height);
        min-height: 0;
        box-sizing: border-box;
        line-height: 1.15;
        box-shadow: 0 2px 12px rgba(15, 118, 110, 0.2);
    }
    .app-header .brand {
        display: none !important;
    }
    .app-header > .d-flex:first-child {
        flex: 0 0 auto;
        min-width: 0;
        max-width: 40%;
        overflow: visible;
    }
    .app-header .user-bar {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 100%;
        gap: 0.2rem 0.35rem;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-end;
    }
    .app-header .user-bar .btn,
    .app-header .help-btn-header {
        min-height: 0 !important;
        padding: 0.18rem 0.36rem;
        font-size: 0.68rem;
        line-height: 1.15;
        white-space: nowrap;
        flex-shrink: 0;
    }
    #btnHeaderHelpManual .help-manual-label {
        display: none;
    }
    .app-header .theme-toggle-btn {
        min-height: 0 !important;
        padding: 0.18rem 0.34rem !important;
        font-size: 0.68rem !important;
        line-height: 1.15 !important;
        flex-shrink: 0;
    }
    /* 主题按钮仅保留图标，省宽度 */
    .app-header .theme-toggle-btn span {
        display: none !important;
    }
    .app-header .user-name-wrap {
        font-size: 0.68rem;
        line-height: 1.15;
        min-width: 0;
        flex: 0 1 auto;
        max-width: 26vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .app-header .user-name-wrap .bi-person-circle {
        font-size: 0.95rem;
        line-height: 1;
        vertical-align: -0.05em;
    }
    .app-header .expire-wrap {
        font-size: 0.68rem;
        line-height: 1.15;
        min-width: 0;
        flex: 0 1 auto;
        max-width: 32vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* 内容卡片内边距 */
    .app-layout .content-card,
    .content-card {
        padding: 1rem !important;
        border-radius: 12px;
    }
    .app-layout .page-title,
    .page-title {
        font-size: 1.2rem;
        margin-bottom: 0.35rem;
    }
    .app-layout .page-desc,
    .page-desc {
        font-size: 0.9rem;
        margin-bottom: 1rem;
    }
    /* 卡片与表头 */
    .app-card .card-body { padding: 1rem; }
    .app-card .card-header,
    .card-header.app-card-header { padding: 12px 14px; font-size: 0.95rem; }
    .app-toast-modal .toast-content { padding: 20px 22px; width: 94%; }
    /* 表格：横向滚动、缩小字号；允许横纵手势，避免只能在表格外竖滑 */
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .app-layout .table-responsive .table,
    .table-responsive .table {
        font-size: 0.8rem;
        min-width: 600px;
    }
    .app-layout .table-responsive th,
    .app-layout .table-responsive td,
    .table-responsive th,
    .table-responsive td {
        padding: 0.5rem 0.4rem;
        white-space: nowrap;
    }
    .table-responsive td.wrap,
    #resultStatBody td.wrap {
        white-space: normal !important;
        word-break: break-word;
        max-width: none;
        min-width: 140px;
    }
    /* 通用手机端表格卡片化：所有 app-table 自动启用（由 ui-common.js 加 class） */
    .table-responsive .app-table.mobile-card-table {
        min-width: 100% !important;
    }
    /* 寄件码统计：手机端取消通用 .table-responsive 负边距+内边距，避免表格外侧露出卡片底色形成左侧白条 */
    .table-responsive.stat-table-wrap {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-radius: 12px;
        border: 1px solid rgba(15, 118, 110, 0.22);
        background-clip: padding-box;
    }
    /* 寄件码统计等：卡片列表无横向滚动层，避免竖滑被局部「吃掉」 */
    .table-responsive.stat-table-wrap:has(table.app-table.mobile-card-table) {
        overflow-x: visible !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: auto;
        touch-action: pan-y;
    }
    body.theme-dark.app-layout .table-responsive.stat-table-wrap,
    body.theme-dark-soft.app-layout .table-responsive.stat-table-wrap,
    body.theme-dark-contrast.app-layout .table-responsive.stat-table-wrap {
        border-color: var(--night-card-border);
        background-color: var(--night-card-bg-solid);
    }
    .mobile-table-select-all {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        margin-bottom: 0.45rem;
        padding: 0 0.1rem;
    }
    .mobile-table-select-all-label {
        display: inline-flex;
        align-items: center;
        gap: 0.42rem;
        font-size: 0.82rem;
        font-weight: 600;
        color: #0f766e;
    }
    .table-responsive .app-table.mobile-card-table thead {
        display: none;
    }
    .table-responsive .app-table.mobile-card-table tbody tr {
        display: block;
        margin-bottom: 0.65rem;
        border: 1px solid rgba(15, 118, 110, 0.08);
        border-radius: 12px;
        background: linear-gradient(180deg, #ffffff 0%, #fcfffe 100%);
        box-shadow: 0 1px 6px rgba(15, 23, 42, 0.04);
        overflow: hidden;
        position: relative;
    }
    .table-responsive .app-table.mobile-card-table tbody tr::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: linear-gradient(180deg, var(--primary-light), var(--primary-dark));
        opacity: 0.7;
    }
    .table-responsive .app-table.mobile-card-table tbody td {
        display: grid;
        grid-template-columns: 5.2rem minmax(0, 1fr);
        align-items: start;
        column-gap: 0.55rem;
        width: 100%;
        white-space: normal !important;
        border: 0;
        border-bottom: 1px solid rgba(15, 118, 110, 0.08);
        padding: 0.5rem 0.7rem;
        font-size: 0.92rem;
        line-height: 1.4;
        color: #0f172a;
        font-family: 'Noto Sans SC', system-ui, -apple-system, sans-serif;
        font-weight: 600;
    }
    .table-responsive .app-table.mobile-card-table tbody td::before {
        content: attr(data-label);
        color: #334155;
        font-weight: 600;
        font-size: 0.92rem;
        line-height: 1.35;
        display: inline-block;
    }
    .table-responsive .app-table.mobile-card-table tbody td > * {
        min-width: 0;
    }
    .table-responsive .app-table.mobile-card-table tbody td:first-child {
        display: flex;
        align-items: center;
        gap: 0.45rem;
        background: rgba(15, 118, 110, 0.04);
        padding-top: 0.4rem;
        padding-bottom: 0.4rem;
    }
    .table-responsive .app-table.mobile-card-table tbody td:first-child::before {
        margin-bottom: 0;
    }
    .table-responsive .app-table.mobile-card-table tbody td:last-child {
        border-bottom: 0;
        background: rgba(15, 118, 110, 0.02);
    }
    .table-responsive .app-table.mobile-card-table tbody td[data-field-type="primary"] {
        background: rgba(255, 255, 255, 0.9);
    }
    .table-responsive .app-table.mobile-card-table tbody td[data-field-type="primary"]::before {
        color: #0f766e;
        font-weight: 700;
    }
    .table-responsive .app-table.mobile-card-table tbody td[data-field-type="metric"] {
        background: rgba(15, 118, 110, 0.06);
        font-weight: 600;
        color: #0b3b36;
        border-left: 2px solid rgba(15, 118, 110, 0.35);
    }
    .table-responsive .app-table.mobile-card-table tbody td[data-field-type="metric"]::before {
        color: #0f766e;
    }
    .table-responsive .app-table.mobile-card-table tbody td[data-field-type="action"]::before {
        color: #0f766e;
        font-weight: 700;
    }
    .table-responsive .app-table.mobile-card-table tbody td.wrap,
    .table-responsive .app-table.mobile-card-table tbody td[data-col="barCode"] {
        word-break: break-all;
        max-width: none !important;
        width: 100% !important;
    }
    .table-responsive .app-table.mobile-card-table tbody td .product-stat-text {
        display: block;
        width: 100%;
        max-width: none !important;
        white-space: normal !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
        color: inherit !important;
        font-family: inherit !important;
    }
    .table-responsive .app-table.mobile-card-table tbody td,
    .table-responsive .app-table.mobile-card-table tbody td * {
        font-family: 'Noto Sans SC', system-ui, -apple-system, sans-serif;
    }
    .table-responsive .app-table.mobile-card-table .table-action-btns {
        width: 100%;
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 0.45rem;
    }
    .table-responsive .app-table.mobile-card-table .table-action-btns .btn {
        min-height: 34px;
        padding: 0.35rem 0.45rem;
        font-size: 0.78rem;
    }
    .table-responsive .app-table.mobile-card-table td[data-field-type="action"] {
        align-items: center;
    }
    .table-responsive .app-table.mobile-card-table#productTable td[data-field-type="action"] {
        align-items: start !important;
    }
    .table-responsive .app-table.mobile-card-table td[data-field-type="action"] .table-action-btns {
        margin: 0;
        justify-content: flex-start;
        align-items: center;
    }
    .table-responsive .app-table.mobile-card-table#productTable td[data-field-type="action"] .table-action-btns {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        width: 100%;
    }
    .table-responsive .app-table.mobile-card-table#productTable td[data-field-type="action"] .table-action-btns .btn {
        width: 100%;
        min-height: 36px;
        margin: 0 !important;
    }
    /* 商品配置页：左侧列名统一竖向对齐（含“操作”） */
    .table-responsive .app-table.mobile-card-table#productTable tbody td {
        grid-template-columns: 5.2rem minmax(0, 1fr) !important;
    }
    .table-responsive .app-table.mobile-card-table#productTable tbody td::before {
        width: 5.2rem;
        justify-self: start;
        text-align: left;
    }
    .table-responsive .app-table.mobile-card-table tbody td {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        white-space: normal !important;
    }
    .table-responsive .app-table.mobile-card-table td[class*="col-"] {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }
    /* 商品配置页兼容：清理其独立表格宽度限制，避免手机端文字竖排 */
    .table-responsive .app-table.mobile-card-table#productTable,
    .table-responsive .app-table.mobile-card-table#productTable tbody tr,
    .table-responsive .app-table.mobile-card-table#productTable tbody td,
    .table-responsive .app-table.mobile-card-table#productTable tbody td:nth-child(1),
    .table-responsive .app-table.mobile-card-table#productTable tbody td:nth-child(2),
    .table-responsive .app-table.mobile-card-table#productTable tbody td:nth-child(3),
    .table-responsive .app-table.mobile-card-table#productTable tbody td:nth-child(4),
    .table-responsive .app-table.mobile-card-table#productTable tbody td:nth-child(5) {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }
    .table-responsive .app-table.mobile-card-table#productTable td.aliases-cell {
        display: grid !important;
    }
    .table-responsive .app-table.mobile-card-table#productTable td.aliases-cell .aliases-text {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        max-width: none !important;
        min-width: 0 !important;
        position: static !important;
        display: block;
    }
    .table-responsive .app-table.mobile-card-table#productTable .aliases-content {
        display: none !important;
    }
    /* 手机端：序号、数量列收窄；产品统计列不截断，全部换行显示 */
    .table-responsive .col-no,
    #resultStatBody .col-no {
        width: 2.25rem;
        min-width: 2.25rem;
        max-width: 2.25rem;
    }
    .table-responsive .col-qty,
    #resultStatBody .col-qty,
    .app-table-wrap .col-qty {
        width: 2.5rem;
        min-width: 2.5rem;
        max-width: 2.5rem;
    }
    /* 单只列：手机端保证表头不重叠，单独设最小宽 */
    #resultStatBody .col-black-duck,
    .table-responsive .col-black-duck {
        min-width: 4.25rem;
        width: 4.25rem;
        max-width: 4.25rem;
    }
    .product-stat-cell .product-stat-text {
        display: block;
        line-height: 1.35;
        word-break: break-all;
        white-space: normal;
    }
    .table-responsive .col-amount,
    #resultStatBody .col-amount,
    .app-table-wrap .col-amount {
        min-width: 4rem;
        white-space: nowrap;
    }
    /* 特殊地区列：防止与操作列重叠，保证可读 */
    .app-table th[data-col="specialRegion"],
    .app-table td[data-col="specialRegion"],
    #resultStatBody td[data-col="specialRegion"] {
        min-width: 4.5rem;
        white-space: normal;
        word-break: break-all;
        line-height: 1.3;
    }
    /* 操作列：保证查看日志/删除按钮不被挤压 */
    .app-table thead th:last-child,
    .app-table tbody td:last-child {
        min-width: 7rem;
        white-space: nowrap;
    }
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    /* 按钮组：便于触控 */
    .app-layout .btn-sm,
    .btn-sm {
        min-height: 36px;
        padding: 0.4rem 0.75rem;
    }
    /* 顶栏内按钮不参与「最小 36px」，避免把固定高度顶栏撑出空白 */
    .app-header .btn,
    .app-header .btn-sm {
        min-height: 0 !important;
    }
    .app-layout .form-control-sm,
    .form-control-sm,
    .app-layout .form-select-sm,
    .form-select-sm {
        min-height: 38px;
    }
    /* 查看日志·产品数量：手机端每行 4 个，名称在上、数量在下 */
    #logModalOrdersContainer .row.g-2,
    .log-modal-orders-container .row.g-2 {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.4rem 0.3rem;
    }
    #logModalOrdersContainer .row.g-2 .col-auto,
    .log-modal-orders-container .row.g-2 .col-auto,
    #logModalOrdersContainer .row.g-2 .order-count-item,
    .log-modal-orders-container .row.g-2 .order-count-item {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.2rem;
        min-width: 0;
        margin: 0;
        padding: 0.15rem 0.05rem;
        border: none;
        border-radius: 0;
        background: transparent;
        box-sizing: border-box;
    }
    #logModalOrdersContainer .row.g-2 .order-count-item.is-active,
    .log-modal-orders-container .row.g-2 .order-count-item.is-active {
        border: none;
        background: transparent;
    }
    #logModalOrdersContainer .row.g-2 .col-auto .form-label,
    .log-modal-orders-container .row.g-2 .col-auto .form-label,
    #logModalOrdersContainer .row.g-2 .order-count-item .form-label,
    .log-modal-orders-container .row.g-2 .order-count-item .form-label {
        white-space: nowrap;
        margin-bottom: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        flex: none;
        min-width: 0;
        width: 100%;
        font-size: 0.68rem;
        font-weight: 700;
        color: #212529;
        text-align: center;
    }
    #logModalOrdersContainer .order-count-stepper,
    .log-modal-orders-container .order-count-stepper {
        display: flex !important;
        width: 100%;
        min-width: 0;
        justify-content: center;
        align-items: stretch;
        border-radius: 0.35rem;
        border-color: #dee2e6;
        overflow: hidden;
    }
    #logModalOrdersContainer .order-count-btn,
    .log-modal-orders-container .order-count-btn {
        display: inline-flex !important;
        flex: 0 0 1.25rem;
        width: 1.25rem;
        min-width: 1.25rem;
        max-width: 1.25rem;
        min-height: 1.55rem !important;
        height: 1.55rem;
        padding: 0 !important;
        font-size: 0.9rem;
        line-height: 1;
        overflow: visible;
    }
    #logModalOrdersContainer .order-count-minus::before,
    .log-modal-orders-container .order-count-minus::before {
        content: '−';
    }
    #logModalOrdersContainer .order-count-plus::before,
    .log-modal-orders-container .order-count-plus::before {
        content: '+';
    }
    #logModalOrdersContainer .form-control-sm,
    #logModalOrdersContainer .order-count-input,
    .log-modal-orders-container .form-control-sm,
    .log-modal-orders-container .order-count-input {
        min-height: 1.55rem !important;
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 1.2rem !important;
        max-width: 1.65rem !important;
        font-size: 0.75rem !important;
        padding: 0 !important;
        text-align: center;
        box-sizing: border-box;
    }
    /* 表单行：小屏纵向堆叠（排除处理日志） */
    .app-layout .row.g-2 .col-auto,
    .row.g-2 .col-auto {
        flex: 0 0 100%;
        max-width: 100%;
    }
    /* 统计筛选行：手机端查询、重置与「识别并查询」一致——各占一行、全宽、主按钮同款绿色 */
    .stat-filter-row .col-auto:nth-last-child(-n+2) .btn {
        width: 100%;
        min-height: 44px;
        padding: 0.5rem 1rem;
    }
    .stat-filter-row.mb-3 { margin-bottom: 0.75rem !important; }
    /* 图片识别区：手机端略收紧内边距 */
    .barcode-image-recognize {
        padding: 0.75rem !important;
    }
    /* 寄件码识别·查询并统计：手机端占满一行，与「识别并查询」同款 */
    .barcode-input-row .col-12.col-md-auto .btn,
    .barcode-input-row .col-md-auto .btn {
        width: 100%;
        min-height: 44px;
        padding: 0.5rem 1rem;
    }
    /* 表格操作列·查看日志/删除：手机端并排一行、样式统一 */
    .table-action-btns {
        flex-wrap: nowrap;
        gap: 0.35rem;
    }
    .table-action-btns .btn {
        flex: 1 1 auto;
        min-width: 0;
        white-space: nowrap;
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }
    /* 已选摘要·清除选择/批量删除/生成图片并下载：手机端三按钮一行、等宽同格式 */
    #statSelectedSummary .stat-summary-actions {
        flex-wrap: nowrap;
        gap: 0.35rem;
        margin-left: 0;
    }
    #statSelectedSummary .stat-summary-actions .btn {
        flex: 1 1 0;
        min-width: 0;
        font-size: 0.75rem;
        padding: 0.4rem 0.35rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* 处理日志·可编辑产品列表：不占满行，由上方 grid 控制 */
    #logModalOrdersContainer .row.g-2 .col-auto,
    .log-modal-orders-container .row.g-2 .col-auto,
    #logModalOrdersContainer .row.g-2 .order-count-item,
    .log-modal-orders-container .row.g-2 .order-count-item {
        flex: none;
        max-width: none;
    }
    .app-layout .row.g-2 .col-md-6,
    .row.g-2 .col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    /* 分页 */
    .pagination { flex-wrap: wrap; }
    .pagination .page-link {
        padding: 0.4rem 0.6rem;
        min-width: 2.2rem;
    }
    /* 首页快捷卡片：单列 */
    .row.g-4 .col-md-4,
    .row.g-4 .col-lg-3 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* ---------- 深夜模式最终兜底（含 theme-dark 别名） ----------
   某些页面在深夜模式下仍可能出现“深色背景 + 深色文字”的组合，
   这里统一将主内容区调整为浅底深字，优先保障可读性。 */
body.theme-dark .app-layout .main-wrap .content-card,
body.theme-dark-soft .app-layout .main-wrap .content-card,
body.theme-dark-contrast .app-layout .main-wrap .content-card {
    background: #f8fafc !important;
    color: #0f172a !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
}
body.theme-dark .app-layout .main-wrap .content-card .card,
body.theme-dark .app-layout .main-wrap .content-card .app-card,
body.theme-dark-soft .app-layout .main-wrap .content-card .card,
body.theme-dark-soft .app-layout .main-wrap .content-card .app-card,
body.theme-dark-contrast .app-layout .main-wrap .content-card .card,
body.theme-dark-contrast .app-layout .main-wrap .content-card .app-card {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.1) !important;
}
body.theme-dark .app-layout .main-wrap .content-card p,
body.theme-dark .app-layout .main-wrap .content-card li,
body.theme-dark .app-layout .main-wrap .content-card label,
body.theme-dark .app-layout .main-wrap .content-card .text-muted,
body.theme-dark-soft .app-layout .main-wrap .content-card p,
body.theme-dark-soft .app-layout .main-wrap .content-card li,
body.theme-dark-soft .app-layout .main-wrap .content-card label,
body.theme-dark-soft .app-layout .main-wrap .content-card .text-muted,
body.theme-dark-contrast .app-layout .main-wrap .content-card p,
body.theme-dark-contrast .app-layout .main-wrap .content-card li,
body.theme-dark-contrast .app-layout .main-wrap .content-card label,
body.theme-dark-contrast .app-layout .main-wrap .content-card .text-muted {
    color: #334155 !important;
}
body.theme-dark .app-layout .main-wrap .content-card strong,
body.theme-dark-soft .app-layout .main-wrap .content-card strong,
body.theme-dark-contrast .app-layout .main-wrap .content-card strong {
    color: #0f172a !important;
}

/* 修正命中范围：body 本身同时带 theme-* 与 app-layout（不是后代关系） */
body.theme-dark.app-layout .main-wrap .content-card,
body.theme-dark-soft.app-layout .main-wrap .content-card,
body.theme-dark-contrast.app-layout .main-wrap .content-card {
    background: #f8fafc !important;
    color: #0f172a !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
}
body.theme-dark.app-layout .main-wrap .content-card .card,
body.theme-dark.app-layout .main-wrap .content-card .app-card,
body.theme-dark-soft.app-layout .main-wrap .content-card .card,
body.theme-dark-soft.app-layout .main-wrap .content-card .app-card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .app-card {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.1) !important;
}
body.theme-dark.app-layout .main-wrap .content-card p,
body.theme-dark.app-layout .main-wrap .content-card li,
body.theme-dark.app-layout .main-wrap .content-card label,
body.theme-dark.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-soft.app-layout .main-wrap .content-card p,
body.theme-dark-soft.app-layout .main-wrap .content-card li,
body.theme-dark-soft.app-layout .main-wrap .content-card label,
body.theme-dark-soft.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-contrast.app-layout .main-wrap .content-card p,
body.theme-dark-contrast.app-layout .main-wrap .content-card li,
body.theme-dark-contrast.app-layout .main-wrap .content-card label,
body.theme-dark-contrast.app-layout .main-wrap .content-card .text-muted {
    color: #334155 !important;
}
body.theme-dark.app-layout .main-wrap .content-card strong,
body.theme-dark-soft.app-layout .main-wrap .content-card strong,
body.theme-dark-contrast.app-layout .main-wrap .content-card strong {
    color: #0f172a !important;
}

/* 修正深夜模式斑马纹表格变量：避免出现“浅底浅字” */
body.theme-dark.app-layout .main-wrap .content-card .table,
body.theme-dark-soft.app-layout .main-wrap .content-card .table,
body.theme-dark-contrast.app-layout .main-wrap .content-card .table {
    --bs-table-bg: #ffffff;
    --bs-table-color: #0f172a;
    --bs-table-striped-bg: #f1f5f9;
    --bs-table-striped-color: #0f172a;
    --bs-table-active-bg: #e2e8f0;
    --bs-table-active-color: #0f172a;
    --bs-table-hover-bg: #e8f7f5;
    --bs-table-hover-color: #0f172a;
    color: #0f172a !important;
}
body.theme-dark.app-layout .main-wrap .content-card .table > :not(caption) > * > *,
body.theme-dark-soft.app-layout .main-wrap .content-card .table > :not(caption) > * > *,
body.theme-dark-contrast.app-layout .main-wrap .content-card .table > :not(caption) > * > * {
    color: #0f172a !important;
}

/* 首页夜间模式最终覆盖：避免被上方浅底兜底规则冲掉 */
body.theme-dark.page-home.app-layout .main-wrap .content-card,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card {
    background: linear-gradient(180deg, #0b1220 0%, #111827 100%) !important;
    color: #e5eef8 !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 12px 32px rgba(2, 6, 23, 0.42) !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .page-title,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .page-title,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .page-title,
body.theme-dark.page-home.app-layout .main-wrap .content-card h1,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card h1,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card h1 {
    color: #f8fafc !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .page-desc,
body.theme-dark.page-home.app-layout .main-wrap .content-card p,
body.theme-dark.page-home.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .page-desc,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card p,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .page-desc,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card p,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .text-muted {
    color: #cbd5e1 !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card,
body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card.card,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card.card,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card.card {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%) !important;
    color: #e5eef8 !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.3) !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card .card-body,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card .card-body,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card .card-body {
    background: transparent !important;
    color: inherit !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card-title,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card-title,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card-title {
    color: #f8fafc !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card small,
body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-card .text-muted,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card small,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-card .text-muted,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card small,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-card .text-muted {
    color: #cbd5e1 !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-icon-wrap,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-icon-wrap,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-icon-wrap {
    background: linear-gradient(135deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.16)) !important;
}

body.theme-dark.page-home.app-layout .main-wrap .content-card .quick-icon-wrap .bi,
body.theme-dark-soft.page-home.app-layout .main-wrap .content-card .quick-icon-wrap .bi,
body.theme-dark-contrast.page-home.app-layout .main-wrap .content-card .quick-icon-wrap .bi {
    color: #99f6e4 !important;
}

/* 全站深夜模式统一：所有页面与首页保持同一套深色内容区风格 */
body.theme-dark.app-layout .main-wrap .content-card,
body.theme-dark-soft.app-layout .main-wrap .content-card,
body.theme-dark-contrast.app-layout .main-wrap .content-card {
    background: linear-gradient(180deg, #0b1220 0%, #111827 100%) !important;
    color: #e5eef8 !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 12px 32px rgba(2, 6, 23, 0.42) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .card,
body.theme-dark.app-layout .main-wrap .content-card .app-card,
body.theme-dark-soft.app-layout .main-wrap .content-card .card,
body.theme-dark-soft.app-layout .main-wrap .content-card .app-card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .app-card {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%) !important;
    color: #e5eef8 !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.3) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .card-body,
body.theme-dark-soft.app-layout .main-wrap .content-card .card-body,
body.theme-dark-contrast.app-layout .main-wrap .content-card .card-body {
    background: transparent !important;
    color: inherit !important;
}

body.theme-dark.app-layout .main-wrap .content-card .page-title,
body.theme-dark.app-layout .main-wrap .content-card h1,
body.theme-dark.app-layout .main-wrap .content-card h2,
body.theme-dark.app-layout .main-wrap .content-card h3,
body.theme-dark.app-layout .main-wrap .content-card h4,
body.theme-dark.app-layout .main-wrap .content-card h5,
body.theme-dark.app-layout .main-wrap .content-card h6,
body.theme-dark.app-layout .main-wrap .content-card strong,
body.theme-dark-soft.app-layout .main-wrap .content-card .page-title,
body.theme-dark-soft.app-layout .main-wrap .content-card h1,
body.theme-dark-soft.app-layout .main-wrap .content-card h2,
body.theme-dark-soft.app-layout .main-wrap .content-card h3,
body.theme-dark-soft.app-layout .main-wrap .content-card h4,
body.theme-dark-soft.app-layout .main-wrap .content-card h5,
body.theme-dark-soft.app-layout .main-wrap .content-card h6,
body.theme-dark-soft.app-layout .main-wrap .content-card strong,
body.theme-dark-contrast.app-layout .main-wrap .content-card .page-title,
body.theme-dark-contrast.app-layout .main-wrap .content-card h1,
body.theme-dark-contrast.app-layout .main-wrap .content-card h2,
body.theme-dark-contrast.app-layout .main-wrap .content-card h3,
body.theme-dark-contrast.app-layout .main-wrap .content-card h4,
body.theme-dark-contrast.app-layout .main-wrap .content-card h5,
body.theme-dark-contrast.app-layout .main-wrap .content-card h6,
body.theme-dark-contrast.app-layout .main-wrap .content-card strong {
    color: #f8fafc !important;
}

body.theme-dark.app-layout .main-wrap .content-card p,
body.theme-dark.app-layout .main-wrap .content-card li,
body.theme-dark.app-layout .main-wrap .content-card span,
body.theme-dark.app-layout .main-wrap .content-card label,
body.theme-dark.app-layout .main-wrap .content-card .text-muted,
body.theme-dark.app-layout .main-wrap .content-card small,
body.theme-dark-soft.app-layout .main-wrap .content-card p,
body.theme-dark-soft.app-layout .main-wrap .content-card li,
body.theme-dark-soft.app-layout .main-wrap .content-card span,
body.theme-dark-soft.app-layout .main-wrap .content-card label,
body.theme-dark-soft.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-soft.app-layout .main-wrap .content-card small,
body.theme-dark-contrast.app-layout .main-wrap .content-card p,
body.theme-dark-contrast.app-layout .main-wrap .content-card li,
body.theme-dark-contrast.app-layout .main-wrap .content-card span,
body.theme-dark-contrast.app-layout .main-wrap .content-card label,
body.theme-dark-contrast.app-layout .main-wrap .content-card .text-muted,
body.theme-dark-contrast.app-layout .main-wrap .content-card small {
    color: #cbd5e1 !important;
}

body.theme-dark.app-layout .main-wrap .content-card .form-control,
body.theme-dark.app-layout .main-wrap .content-card .form-select,
body.theme-dark.app-layout .main-wrap .content-card textarea,
body.theme-dark-soft.app-layout .main-wrap .content-card .form-control,
body.theme-dark-soft.app-layout .main-wrap .content-card .form-select,
body.theme-dark-soft.app-layout .main-wrap .content-card textarea,
body.theme-dark-contrast.app-layout .main-wrap .content-card .form-control,
body.theme-dark-contrast.app-layout .main-wrap .content-card .form-select,
body.theme-dark-contrast.app-layout .main-wrap .content-card textarea {
    background: rgba(15, 23, 42, 0.78) !important;
    color: #f8fafc !important;
    border-color: rgba(148, 163, 184, 0.3) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .form-control::placeholder,
body.theme-dark.app-layout .main-wrap .content-card textarea::placeholder,
body.theme-dark-soft.app-layout .main-wrap .content-card .form-control::placeholder,
body.theme-dark-soft.app-layout .main-wrap .content-card textarea::placeholder,
body.theme-dark-contrast.app-layout .main-wrap .content-card .form-control::placeholder,
body.theme-dark-contrast.app-layout .main-wrap .content-card textarea::placeholder {
    color: #94a3b8 !important;
}

body.theme-dark.app-layout .main-wrap .content-card .table,
body.theme-dark-soft.app-layout .main-wrap .content-card .table,
body.theme-dark-contrast.app-layout .main-wrap .content-card .table {
    --bs-table-bg: #0f172a;
    --bs-table-color: #e5eef8;
    --bs-table-striped-bg: rgba(30, 41, 59, 0.82);
    --bs-table-striped-color: #e5eef8;
    --bs-table-active-bg: rgba(51, 65, 85, 0.9);
    --bs-table-active-color: #f8fafc;
    --bs-table-hover-bg: rgba(20, 184, 166, 0.16);
    --bs-table-hover-color: #f8fafc;
    color: #e5eef8 !important;
}

body.theme-dark.app-layout .main-wrap .content-card .table > :not(caption) > * > *,
body.theme-dark-soft.app-layout .main-wrap .content-card .table > :not(caption) > * > *,
body.theme-dark-contrast.app-layout .main-wrap .content-card .table > :not(caption) > * > * {
    background: #0f172a !important;
    color: #e5eef8 !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .table thead th,
body.theme-dark-soft.app-layout .main-wrap .content-card .table thead th,
body.theme-dark-contrast.app-layout .main-wrap .content-card .table thead th {
    background: linear-gradient(135deg, #0b3a4a 0%, #0f766e 55%, #0891b2 100%) !important;
    color: #ffffff !important;
}

body.theme-dark.app-layout .main-wrap .content-card .single-stat-hint-box,
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary,
body.theme-dark-soft.app-layout .main-wrap .content-card .single-stat-hint-box,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary,
body.theme-dark-contrast.app-layout .main-wrap .content-card .single-stat-hint-box,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary {
    background: rgba(15, 23, 42, 0.68) !important;
    border-color: rgba(45, 212, 191, 0.18) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .single-stat-hint-box .hint-title,
body.theme-dark-soft.app-layout .main-wrap .content-card .single-stat-hint-box .hint-title,
body.theme-dark-contrast.app-layout .main-wrap .content-card .single-stat-hint-box .hint-title {
    color: #99f6e4 !important;
}

body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text,
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text span,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text span,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-text span,
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-inline,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-inline,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-inline,
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-rows,
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-value,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-rows,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-value,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-rows,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-value {
    color: #f8fafc !important;
}
body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-label,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-label,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .stat-summary-label {
    color: #99f6e4 !important;
}

body.theme-dark.app-layout .main-wrap .content-card .stat-selected-summary .fw-bold,
body.theme-dark-soft.app-layout .main-wrap .content-card .stat-selected-summary .fw-bold,
body.theme-dark-contrast.app-layout .main-wrap .content-card .stat-selected-summary .fw-bold {
    color: #99f6e4 !important;
}

/* ---------- 夜间主题统一最终收口：以首页深夜风格为准 ---------- */
body.theme-dark,
body.theme-dark-soft,
body.theme-dark-contrast {
    --night-shell-bg: #09111f;
    --night-panel-bg: linear-gradient(180deg, #0b1220 0%, #111827 100%);
    --night-card-bg: linear-gradient(180deg, #111827 0%, #0f172a 100%);
    --night-card-bg-solid: #0f172a;
    --night-card-border: rgba(148, 163, 184, 0.18);
    --night-card-border-strong: rgba(45, 212, 191, 0.24);
    --night-text-main: #f8fafc;
    --night-text-body: #e5eef8;
    --night-text-muted: #cbd5e1;
    --night-text-dim: #94a3b8;
    --night-accent: #99f6e4;
    --night-accent-strong: #2dd4bf;
    --night-primary-bg: linear-gradient(135deg, #0f766e 0%, #0891b2 100%);
    --night-secondary-bg: rgba(15, 23, 42, 0.78);
    --night-danger: #fb7185;
}

body.theme-dark.app-layout,
body.theme-dark-soft.app-layout,
body.theme-dark-contrast.app-layout {
    background: var(--night-shell-bg) !important;
    color: var(--night-text-body) !important;
}

body.theme-dark.app-layout .app-header,
body.theme-dark-soft.app-layout .app-header,
body.theme-dark-contrast.app-layout .app-header {
    background: linear-gradient(135deg, #0b3a4a 0%, #0f766e 55%, #0891b2 100%) !important;
    box-shadow: 0 6px 24px rgba(2, 6, 23, 0.35) !important;
}

body.theme-dark.app-layout .brand,
body.theme-dark.app-layout .user-bar,
body.theme-dark.app-layout .user-bar span,
body.theme-dark-soft.app-layout .brand,
body.theme-dark-soft.app-layout .user-bar,
body.theme-dark-soft.app-layout .user-bar span,
body.theme-dark-contrast.app-layout .brand,
body.theme-dark-contrast.app-layout .user-bar,
body.theme-dark-contrast.app-layout .user-bar span {
    color: #ffffff !important;
}

body.theme-dark.app-layout .help-btn-header,
body.theme-dark.app-layout .btn-mobile-home,
body.theme-dark.app-layout .btn-toggle-sidebar,
body.theme-dark-soft.app-layout .help-btn-header,
body.theme-dark-soft.app-layout .btn-mobile-home,
body.theme-dark-soft.app-layout .btn-toggle-sidebar,
body.theme-dark-contrast.app-layout .help-btn-header,
body.theme-dark-contrast.app-layout .btn-mobile-home,
body.theme-dark-contrast.app-layout .btn-toggle-sidebar {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

body.theme-dark.app-layout .help-btn-header:hover,
body.theme-dark.app-layout .btn-mobile-home:hover,
body.theme-dark.app-layout .btn-toggle-sidebar:hover,
body.theme-dark-soft.app-layout .help-btn-header:hover,
body.theme-dark-soft.app-layout .btn-mobile-home:hover,
body.theme-dark-soft.app-layout .btn-toggle-sidebar:hover,
body.theme-dark-contrast.app-layout .help-btn-header:hover,
body.theme-dark-contrast.app-layout .btn-mobile-home:hover,
body.theme-dark-contrast.app-layout .btn-toggle-sidebar:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
}

body.theme-dark.app-layout .sidebar,
body.theme-dark-soft.app-layout .sidebar,
body.theme-dark-contrast.app-layout .sidebar {
    background: linear-gradient(180deg, #0d1628 0%, #111827 100%) !important;
    border-right-color: rgba(148, 163, 184, 0.16) !important;
    box-shadow: 4px 0 24px rgba(2, 6, 23, 0.28) !important;
}

body.theme-dark.app-layout .sidebar .nav-link,
body.theme-dark-soft.app-layout .sidebar .nav-link,
body.theme-dark-contrast.app-layout .sidebar .nav-link {
    color: var(--night-text-muted) !important;
}

body.theme-dark.app-layout .sidebar .nav-link:hover,
body.theme-dark-soft.app-layout .sidebar .nav-link:hover,
body.theme-dark-contrast.app-layout .sidebar .nav-link:hover {
    background: rgba(45, 212, 191, 0.12) !important;
    color: var(--night-accent) !important;
}

body.theme-dark.app-layout .sidebar .nav-link.active,
body.theme-dark-soft.app-layout .sidebar .nav-link.active,
body.theme-dark-contrast.app-layout .sidebar .nav-link.active {
    background: linear-gradient(90deg, rgba(15, 118, 110, 0.32), rgba(8, 145, 178, 0.18)) !important;
    color: var(--night-accent) !important;
    box-shadow: inset 3px 0 0 var(--night-accent-strong);
}

body.theme-dark.app-layout .main-wrap,
body.theme-dark-soft.app-layout .main-wrap,
body.theme-dark-contrast.app-layout .main-wrap {
    background: transparent !important;
}

body.theme-dark.app-layout .main-wrap .content-card,
body.theme-dark-soft.app-layout .main-wrap .content-card,
body.theme-dark-contrast.app-layout .main-wrap .content-card {
    background: var(--night-panel-bg) !important;
    color: var(--night-text-body) !important;
    border: 1px solid var(--night-card-border) !important;
    box-shadow: 0 12px 32px rgba(2, 6, 23, 0.42) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .card,
body.theme-dark.app-layout .main-wrap .content-card .app-card,
body.theme-dark.app-layout.legacy-panel-page .card,
body.theme-dark-soft.app-layout .main-wrap .content-card .card,
body.theme-dark-soft.app-layout .main-wrap .content-card .app-card,
body.theme-dark-soft.app-layout.legacy-panel-page .card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .card,
body.theme-dark-contrast.app-layout .main-wrap .content-card .app-card,
body.theme-dark-contrast.app-layout.legacy-panel-page .card {
    background: var(--night-card-bg) !important;
    color: var(--night-text-body) !important;
    border: 1px solid var(--night-card-border) !important;
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.3) !important;
}

body.theme-dark.app-layout .main-wrap .content-card .card-body,
body.theme-dark.app-layout.legacy-panel-page .card-body,
body.theme-dark-soft.app-layout .main-wrap .content-card .card-body,
body.theme-dark-soft.app-layout.legacy-panel-page .card-body,
body.theme-dark-contrast.app-layout .main-wrap .content-card .card-body,
body.theme-dark-contrast.app-layout.legacy-panel-page .card-body {
    background: transparent !important;
    color: inherit !important;
}

body.theme-dark.app-layout .page-title,
body.theme-dark.app-layout h1,
body.theme-dark.app-layout h2,
body.theme-dark.app-layout h3,
body.theme-dark.app-layout h4,
body.theme-dark.app-layout h5,
body.theme-dark.app-layout h6,
body.theme-dark.app-layout .quick-card-title,
body.theme-dark.app-layout .fw-bold,
body.theme-dark.app-layout strong,
body.theme-dark.app-layout.legacy-panel-page .recharge-title,
body.theme-dark.app-layout.legacy-panel-page .profile-name,
body.theme-dark.app-layout.legacy-panel-page .info-value,
body.theme-dark-soft.app-layout .page-title,
body.theme-dark-soft.app-layout h1,
body.theme-dark-soft.app-layout h2,
body.theme-dark-soft.app-layout h3,
body.theme-dark-soft.app-layout h4,
body.theme-dark-soft.app-layout h5,
body.theme-dark-soft.app-layout h6,
body.theme-dark-soft.app-layout .quick-card-title,
body.theme-dark-soft.app-layout .fw-bold,
body.theme-dark-soft.app-layout strong,
body.theme-dark-soft.app-layout.legacy-panel-page .recharge-title,
body.theme-dark-soft.app-layout.legacy-panel-page .profile-name,
body.theme-dark-soft.app-layout.legacy-panel-page .info-value,
body.theme-dark-contrast.app-layout .page-title,
body.theme-dark-contrast.app-layout h1,
body.theme-dark-contrast.app-layout h2,
body.theme-dark-contrast.app-layout h3,
body.theme-dark-contrast.app-layout h4,
body.theme-dark-contrast.app-layout h5,
body.theme-dark-contrast.app-layout h6,
body.theme-dark-contrast.app-layout .quick-card-title,
body.theme-dark-contrast.app-layout .fw-bold,
body.theme-dark-contrast.app-layout strong,
body.theme-dark-contrast.app-layout.legacy-panel-page .recharge-title,
body.theme-dark-contrast.app-layout.legacy-panel-page .profile-name,
body.theme-dark-contrast.app-layout.legacy-panel-page .info-value {
    color: var(--night-text-main) !important;
}

body.theme-dark.app-layout p,
body.theme-dark.app-layout li,
body.theme-dark.app-layout label,
body.theme-dark.app-layout span,
body.theme-dark.app-layout small,
body.theme-dark.app-layout .page-desc,
body.theme-dark.app-layout .text-muted,
body.theme-dark.app-layout.legacy-panel-page .recharge-desc,
body.theme-dark.app-layout.legacy-panel-page .profile-username,
body.theme-dark.app-layout.legacy-panel-page .info-label,
body.theme-dark-soft.app-layout p,
body.theme-dark-soft.app-layout li,
body.theme-dark-soft.app-layout label,
body.theme-dark-soft.app-layout span,
body.theme-dark-soft.app-layout small,
body.theme-dark-soft.app-layout .page-desc,
body.theme-dark-soft.app-layout .text-muted,
body.theme-dark-soft.app-layout.legacy-panel-page .recharge-desc,
body.theme-dark-soft.app-layout.legacy-panel-page .profile-username,
body.theme-dark-soft.app-layout.legacy-panel-page .info-label,
body.theme-dark-contrast.app-layout p,
body.theme-dark-contrast.app-layout li,
body.theme-dark-contrast.app-layout label,
body.theme-dark-contrast.app-layout span,
body.theme-dark-contrast.app-layout small,
body.theme-dark-contrast.app-layout .page-desc,
body.theme-dark-contrast.app-layout .text-muted,
body.theme-dark-contrast.app-layout.legacy-panel-page .recharge-desc,
body.theme-dark-contrast.app-layout.legacy-panel-page .profile-username,
body.theme-dark-contrast.app-layout.legacy-panel-page .info-label {
    color: var(--night-text-muted) !important;
}

body.theme-dark.app-layout .quick-icon-wrap,
body.theme-dark-soft.app-layout .quick-icon-wrap,
body.theme-dark-contrast.app-layout .quick-icon-wrap {
    background: linear-gradient(135deg, rgba(20, 184, 166, 0.2), rgba(14, 165, 233, 0.16)) !important;
}

body.theme-dark.app-layout .quick-icon-wrap .bi,
body.theme-dark-soft.app-layout .quick-icon-wrap .bi,
body.theme-dark-contrast.app-layout .quick-icon-wrap .bi {
    color: var(--night-accent) !important;
}

body.theme-dark.app-layout .form-control,
body.theme-dark.app-layout .form-select,
body.theme-dark.app-layout textarea,
body.theme-dark-soft.app-layout .form-control,
body.theme-dark-soft.app-layout .form-select,
body.theme-dark-soft.app-layout textarea,
body.theme-dark-contrast.app-layout .form-control,
body.theme-dark-contrast.app-layout .form-select,
body.theme-dark-contrast.app-layout textarea {
    background: rgba(15, 23, 42, 0.82) !important;
    color: var(--night-text-main) !important;
    border-color: rgba(148, 163, 184, 0.28) !important;
}

body.theme-dark.app-layout .form-control:focus,
body.theme-dark.app-layout .form-select:focus,
body.theme-dark.app-layout textarea:focus,
body.theme-dark-soft.app-layout .form-control:focus,
body.theme-dark-soft.app-layout .form-select:focus,
body.theme-dark-soft.app-layout textarea:focus,
body.theme-dark-contrast.app-layout .form-control:focus,
body.theme-dark-contrast.app-layout .form-select:focus,
body.theme-dark-contrast.app-layout textarea:focus {
    background: rgba(15, 23, 42, 0.94) !important;
    color: var(--night-text-main) !important;
    border-color: var(--night-accent-strong) !important;
    box-shadow: 0 0 0 0.2rem rgba(45, 212, 191, 0.18) !important;
}

body.theme-dark.app-layout .form-control::placeholder,
body.theme-dark.app-layout textarea::placeholder,
body.theme-dark-soft.app-layout .form-control::placeholder,
body.theme-dark-soft.app-layout textarea::placeholder,
body.theme-dark-contrast.app-layout .form-control::placeholder,
body.theme-dark-contrast.app-layout textarea::placeholder {
    color: var(--night-text-dim) !important;
}

body.theme-dark.app-layout .btn-primary,
body.theme-dark.app-layout .btn-primary.app-btn,
body.theme-dark.app-layout .btn-success,
body.theme-dark.app-layout .btn-success.app-btn,
body.theme-dark.app-layout .btn-info,
body.theme-dark.app-layout .btn-info.app-btn,
body.theme-dark-soft.app-layout .btn-primary,
body.theme-dark-soft.app-layout .btn-primary.app-btn,
body.theme-dark-soft.app-layout .btn-success,
body.theme-dark-soft.app-layout .btn-success.app-btn,
body.theme-dark-soft.app-layout .btn-info,
body.theme-dark-soft.app-layout .btn-info.app-btn,
body.theme-dark-contrast.app-layout .btn-primary,
body.theme-dark-contrast.app-layout .btn-primary.app-btn,
body.theme-dark-contrast.app-layout .btn-success,
body.theme-dark-contrast.app-layout .btn-success.app-btn,
body.theme-dark-contrast.app-layout .btn-info,
body.theme-dark-contrast.app-layout .btn-info.app-btn {
    background: var(--night-primary-bg) !important;
    color: #ffffff !important;
    border: 1px solid rgba(45, 212, 191, 0.24) !important;
    box-shadow: 0 6px 16px rgba(2, 6, 23, 0.22) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
}

body.theme-dark.app-layout .btn-outline-primary,
body.theme-dark.app-layout .btn-outline-secondary,
body.theme-dark.app-layout .btn-warning,
body.theme-dark-soft.app-layout .btn-outline-primary,
body.theme-dark-soft.app-layout .btn-outline-secondary,
body.theme-dark-soft.app-layout .btn-warning,
body.theme-dark-contrast.app-layout .btn-outline-primary,
body.theme-dark-contrast.app-layout .btn-outline-secondary,
body.theme-dark-contrast.app-layout .btn-warning {
    background: var(--night-secondary-bg) !important;
    color: var(--night-text-body) !important;
    border: 1px solid rgba(45, 212, 191, 0.22) !important;
    box-shadow: 0 6px 16px rgba(2, 6, 23, 0.18) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
}

body.theme-dark.app-layout .btn-outline-danger,
body.theme-dark-soft.app-layout .btn-outline-danger,
body.theme-dark-contrast.app-layout .btn-outline-danger {
    background: rgba(35, 16, 24, 0.78) !important;
    color: #fecdd3 !important;
    border: 1px solid rgba(251, 113, 133, 0.34) !important;
    box-shadow: 0 6px 16px rgba(2, 6, 23, 0.18) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
}

body.theme-dark.app-layout .btn-primary:hover,
body.theme-dark.app-layout .btn-success:hover,
body.theme-dark.app-layout .btn-info:hover,
body.theme-dark.app-layout .btn-outline-primary:hover,
body.theme-dark.app-layout .btn-outline-secondary:hover,
body.theme-dark.app-layout .btn-outline-danger:hover,
body.theme-dark.app-layout .btn-warning:hover,
body.theme-dark-soft.app-layout .btn-primary:hover,
body.theme-dark-soft.app-layout .btn-success:hover,
body.theme-dark-soft.app-layout .btn-info:hover,
body.theme-dark-soft.app-layout .btn-outline-primary:hover,
body.theme-dark-soft.app-layout .btn-outline-secondary:hover,
body.theme-dark-soft.app-layout .btn-outline-danger:hover,
body.theme-dark-soft.app-layout .btn-warning:hover,
body.theme-dark-contrast.app-layout .btn-primary:hover,
body.theme-dark-contrast.app-layout .btn-success:hover,
body.theme-dark-contrast.app-layout .btn-info:hover,
body.theme-dark-contrast.app-layout .btn-outline-primary:hover,
body.theme-dark-contrast.app-layout .btn-outline-secondary:hover,
body.theme-dark-contrast.app-layout .btn-outline-danger:hover,
body.theme-dark-contrast.app-layout .btn-warning:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

body.theme-dark.app-layout .btn:disabled,
body.theme-dark.app-layout .btn.disabled,
body.theme-dark-soft.app-layout .btn:disabled,
body.theme-dark-soft.app-layout .btn.disabled,
body.theme-dark-contrast.app-layout .btn:disabled,
body.theme-dark-contrast.app-layout .btn.disabled {
    opacity: 0.56 !important;
    box-shadow: none !important;
    transform: none !important;
}

body.theme-dark.app-layout .modal-content,
body.theme-dark-soft.app-layout .modal-content,
body.theme-dark-contrast.app-layout .modal-content {
    background: var(--night-panel-bg) !important;
    color: var(--night-text-body) !important;
    border: 1px solid var(--night-card-border) !important;
    box-shadow: 0 18px 40px rgba(2, 6, 23, 0.48) !important;
}

body.theme-dark.app-layout .modal-body,
body.theme-dark.app-layout .modal-footer,
body.theme-dark-soft.app-layout .modal-body,
body.theme-dark-soft.app-layout .modal-footer,
body.theme-dark-contrast.app-layout .modal-body,
body.theme-dark-contrast.app-layout .modal-footer {
    background: transparent !important;
    color: var(--night-text-body) !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
}

body.theme-dark.app-layout .modal-body .text-secondary,
body.theme-dark-soft.app-layout .modal-body .text-secondary,
body.theme-dark-contrast.app-layout .modal-body .text-secondary {
    color: var(--night-text-muted) !important;
}

body.theme-dark.app-layout .table-responsive,
body.theme-dark-soft.app-layout .table-responsive,
body.theme-dark-contrast.app-layout .table-responsive {
    border-radius: 12px;
}

body.theme-dark.app-layout .table tbody td,
body.theme-dark-soft.app-layout .table tbody td,
body.theme-dark-contrast.app-layout .table tbody td {
    line-height: 1.5;
}

body.theme-dark.app-layout .table,
body.theme-dark-soft.app-layout .table,
body.theme-dark-contrast.app-layout .table {
    --bs-table-bg: var(--night-card-bg-solid);
    --bs-table-color: var(--night-text-body);
    --bs-table-striped-bg: rgba(30, 41, 59, 0.82);
    --bs-table-striped-color: var(--night-text-body);
    --bs-table-hover-bg: rgba(20, 184, 166, 0.16);
    --bs-table-hover-color: var(--night-text-main);
    color: var(--night-text-body) !important;
}

body.theme-dark.app-layout .table > :not(caption) > * > *,
body.theme-dark-soft.app-layout .table > :not(caption) > * > *,
body.theme-dark-contrast.app-layout .table > :not(caption) > * > * {
    background: var(--night-card-bg-solid) !important;
    color: var(--night-text-body) !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
}

body.theme-dark.app-layout .table thead th,
body.theme-dark-soft.app-layout .table thead th,
body.theme-dark-contrast.app-layout .table thead th {
    background: linear-gradient(135deg, #0b3a4a 0%, #0f766e 55%, #0891b2 100%) !important;
    color: #ffffff !important;
}

body.theme-dark.app-layout .pagination .page-link,
body.theme-dark-soft.app-layout .pagination .page-link,
body.theme-dark-contrast.app-layout .pagination .page-link {
    background: rgba(15, 23, 42, 0.9) !important;
    color: var(--night-text-body) !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
}

body.theme-dark.app-layout .pagination .page-item.active .page-link,
body.theme-dark-soft.app-layout .pagination .page-item.active .page-link,
body.theme-dark-contrast.app-layout .pagination .page-item.active .page-link {
    background: #0f766e !important;
    border-color: #0f766e !important;
    color: #ffffff !important;
}