/* ===== PMS CSS — DeepSeek浅色专业版 v3.0 ===== */
:root {
  /* 品牌色 - 清新蓝（参考DeepSeek风格） */
  --primary:       #2563eb;
  --primary-light: #3b82f6;
  --primary-dark:  #1d4ed8;
  --primary-50:    #eff6ff;
  --primary-100:   #dbeafe;
  --primary-200:   #bfdbfe;
  --accent:        #7c3aed;

  /* 状态色 */
  --success:    #16a34a;
  --success-bg: #f0fdf4;
  --warning:    #d97706;
  --warning-bg: #fffbeb;
  --danger:     #dc2626;
  --danger-bg:  #fef2f2;
  --info:       #0891b2;
  --info-bg:    #ecfeff;

  /* 背景 - 浅色层级（DeepSeek风格：大面积白色+极淡灰） */
  --bg-base:       #f5f7fa;   /* 整体底色：极淡蓝灰 */
  --bg-sidebar:    #ffffff;   /* 侧边栏：纯白（DeepSeek风格） */
  --bg-card:       #ffffff;   /* 卡片：纯白 */
  --bg-card-hover: #f8fafc;   /* 卡片悬浮 */
  --bg-input:      #f8fafc;   /* 输入框背景 */
  --bg-topbar:     #ffffff;   /* 顶栏：白色 */
  --bg-modal:      #ffffff;

  /* 文字 */
  --text-primary:   #1e293b;  /* 主文字（深灰黑） */
  --text-secondary: #475569;  /* 副文字：中灰 */
  --text-muted:     #94a3b8;  /* 弱文字：浅灰 */

  /* 边框 */
  --border:       #e5e7eb;
  --border-hover: #cbd5e1;
  --border-focus: #2563eb;

  /* 兼容旧 gray 变量 */
  --gray-50:  #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e5e7eb;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;

  /* 尺寸 */
  --sidebar-w:  220px;
  --topbar-h:   40px;
  --radius:     8px;
  --radius-lg:  14px;

  /* 阴影 */
  --shadow-sm:  0 1px 2px rgba(0,0,0,.04);
  --shadow:    0 1px 3px rgba(0,0,0,.05), 0 0 0 1px rgba(0,0,0,.03);
  --shadow-md:  0 4px 16px rgba(0,0,0,.07);
  --shadow-lg:  0 8px 30px rgba(0,0,0,.10);
  --glow:      none;
}

/* ===== 重置 ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; }
body {
  font-family: "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background: var(--bg-base);
  color: var(--text-primary);
  display: flex;
  min-height: 100vh;
  font-size: 14px;
  line-height: 1.55;
}

/* ========== 侧边栏 — 常规浅色风 ========== */
.sidebar {
  width: var(--sidebar-w);
  min-height: 100vh;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 0; top: 0; z-index: 100;
  border-right: 1px solid #e5e7eb;
}
.sidebar-header {
  padding: 12px 12px 10px;
  border-bottom: 1px solid #eef0f3;
  flex-shrink: 0;
}
.sidebar-hotel-name {
  font-size: 14px; font-weight: 600; color: #1f2937;
  letter-spacing: 0; margin-bottom: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.4;
}
.sidebar::before { display: none; }

.nav { flex: 1; padding: 6px 8px; display: flex; flex-direction: column; gap: 0; }
.nav-item {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  color: #475569;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
  cursor: pointer;
  font-weight: 500; font-size: 13px; letter-spacing: 0;
  position: relative;
}
.nav-item svg {
  opacity: 1;
  width: 18px; height: 18px;
  flex-shrink: 0;
  transition: none;
}
.nav-item:hover {
  background: #f1f5f9;
  color: #1f2937;
}
.nav-item:hover svg { opacity: 1; transform: none; color: inherit; }
/* 激活状态：浅蓝底 + 主色文字，与右侧主题色呼应 */
.nav-item.active {
  background: #eef2ff;
  color: #2563eb;
  font-weight: 600;
  box-shadow: none;
  border-left: none;
  margin-left: 0;
  padding-left: 10px;
}
.nav-item.active svg { opacity: 1; color: #2563eb; transform: none; }
.nav-item.active::before { display: none; }

/* 侧边栏图标：静态线性，无绘制动画 */
.nav-item .nav-icon {
  width: 18px; height: 18px; flex-shrink: 0;
  opacity: 1;
}
.nav-item .nav-icon path,
.nav-item .nav-icon rect,
.nav-item .nav-icon circle,
.nav-item .nav-icon line,
.nav-item .nav-icon polyline,
.nav-item .nav-icon polygon {
  stroke-dasharray: none;
  stroke-dashoffset: 0;
  animation: none;
}
.nav-item:hover .nav-icon path,
.nav-item:hover .nav-icon rect,
.nav-item:hover .nav-icon circle,
.nav-item:hover .nav-icon line,
.nav-item:hover .nav-icon polyline,
.nav-item:hover .nav-icon polygon {
  stroke: currentColor;
}
.nav-item.active .nav-icon path,
.nav-item.active .nav-icon rect,
.nav-item.active .nav-icon circle,
.nav-item.active .nav-icon line,
.nav-item.active .nav-icon polyline,
.nav-item.active .nav-icon polygon {
  stroke: currentColor; stroke-dashoffset: 0;
}

/* ===== 主内容区 ===== */
.main {
  margin-left: var(--sidebar-w); flex: 1;
  display: flex; flex-direction: column; min-height: 100vh;
  background: var(--bg-base);
  overflow-x: hidden;
}

/* ===== 顶栏 — 白色简洁 ===== */
.topbar {
  height: var(--topbar-h);
  background: var(--bg-topbar);
  border-bottom: 1px solid var(--border);
  display: grid; grid-template-columns: auto 1fr auto; align-items: center;
  padding: 0 20px; position: sticky; top: 0; z-index: 50;
  box-shadow: var(--shadow-sm);
}
.topbar-left { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; }
.topbar-hotel-name {
  font-weight: 700; font-size: 14px;
  color: var(--primary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px;
}
.topbar-page-title {
  font-size: 14px; font-weight: 600;
  color: var(--text-secondary); display: flex; align-items: center; gap: 6px;
}
.topbar-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }

/* ===== 顶部滚动通知 ===== */
.topbar-center {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 0 16px;
}
.scroll-notice {
  width: 360px; max-width: 50vw; flex-shrink: 1;
  height: 28px;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(90deg, #FF6B6B, #FFD93D, #6BCB77, #4D96FF);
  background-size: 300% 100%;
  animation: notice-gradient 4s ease-in-out infinite;
  position: relative;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
@keyframes notice-gradient {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.scroll-notice-track {
  display: flex;
  white-space: nowrap;
  animation: notice-scroll var(--scroll-speed, 10s) linear infinite;
}
@keyframes notice-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.scroll-notice-text {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.3);
  padding: 0 60px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.scroll-notice.hidden { display: none; }

.topbar-time {
  font-size: 13px; color: var(--text-secondary);
  font-variant-numeric: tabular-nums; font-weight: 500;
}
.topbar-stats { display:flex; align-items:center; gap:6px; }
.topbar-stat {
  display:inline-flex; align-items:center; gap:4px; flex-shrink:0;
  padding: 2px 10px; border-radius: 14px; min-width: 70px; justify-content: center;
  background: var(--primary-50);
  color: var(--primary); font-size: 12px;
  cursor: default; transition: none;
  border: 1px solid var(--primary-100);
}
.topbar-stat:hover { background: var(--primary-100); }
.topbar-stat.clickable {
  cursor: pointer;
  transition: all .15s;
}
.topbar-stat.clickable:hover {
  background: var(--primary-200);
  transform: scale(1.03);
  box-shadow: 0 2px 8px rgba(59,130,246,.15);
}
.topbar-stat-label { font-weight: 500; opacity: .7; white-space: nowrap; font-size:10px; }
.topbar-stat-val { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; line-height:1; }
.topbar-stat-val small { font-size: 9px; opacity: .7; margin-left: 1px; }

/* ===== 页面内容 ===== */
.page-content { flex: 1; padding: 20px 24px; overflow-x: auto; }

/* ===== 卡片 ===== */
.card {
  background: var(--bg-card);
  border-radius: var(--radius-lg);
  padding: 18px; margin-bottom: 14px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.card:hover { border-color: var(--border-hover); }
.card-title {
  font-size: 14px; font-weight: 600; color: var(--text-primary);
  margin-bottom: 14px; display: flex; align-items: center; gap: 8px;
}

/* ===== 看板统计卡片 ===== */
.stat-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 20px; }
.stat-card {
  background: var(--bg-card);
  border-radius: var(--radius-lg); padding: 16px;
  box-shadow: var(--shadow);
  text-align: center;
  border: 1px solid var(--border);
  border-top: 3px solid transparent;
  transition: transform .2s, box-shadow .2s;
}
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.stat-card.blue   { border-top-color: var(--primary); }
.stat-card.green  { border-top-color: var(--success); }
.stat-card.orange { border-top-color: var(--warning); }
.stat-card.red    { border-top-color: var(--danger); }
.stat-card.gray   { border-top-color: var(--text-muted); }
.stat-val { font-size: 28px; font-weight: 700; color: var(--text-primary); line-height: 1.25; font-variant-numeric: tabular-nums; }
.stat-label { font-size: 13px; color: var(--text-muted); margin-top: 4px; letter-spacing: .3px; }

/* ===== 工具栏 ===== */
.toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.search-input {
  flex: 1; min-width: 200px; max-width: 300px; padding: 8px 12px;
  border: 1px solid var(--border); border-radius: var(--radius); font-size: 14px; outline: none;
  background: var(--bg-input); color: var(--text-primary);
  transition: border-color .15s, box-shadow .15s;
}
.search-input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.search-input::placeholder { color: var(--text-muted); }
select.filter {
  padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius);
  font-size: 14px; background: var(--bg-input); color: var(--text-primary);
  cursor: pointer; outline: none; appearance: auto;
}
select.filter:focus { border-color: var(--primary); }

/* ===== 按钮 ===== */
.btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 14px; border: none; border-radius: 4px;
  font-size: 14px; font-weight: 500; cursor: pointer;
  transition: all .15s ease; text-decoration: none; white-space: nowrap;
  min-height: 34px; letter-spacing: 0.2px;
}
.btn:hover { background: #2563eb; color: #fff; border-color: #2563eb; filter: none; transform: translateY(-1px); }
.btn:active { transform: none; filter: brightness(.92); }
.btn-primary, .btn-success, .btn-warning, .btn-danger, .btn-info {
  background: #e5e7eb; color: #374151; border: 1px solid #d1d5db;
  box-shadow: none;
}
.btn-primary:hover, .btn-success:hover, .btn-warning:hover, .btn-danger:hover, .btn-info:hover {
  background: #2563eb; border-color: #2563eb; color: #fff; filter: none;
}
.btn-ghost {
  background: var(--bg-card); color: var(--text-secondary);
  border: 1px solid var(--border); box-shadow: var(--shadow-sm);
}
.btn-ghost:hover { background: #2563eb; border-color: #2563eb; color: #fff; filter: none; transform: none; }
.btn-reverse {
  background: var(--bg-card); color: var(--danger);
  border: 1px solid rgba(220,38,38,.3);
  font-weight: 600; padding: 8px 18px; border-radius: 4px;
  cursor: pointer; transition: all .15s;
}
.btn-reverse:hover { background: var(--danger-bg); border-color: var(--danger); }
.guest-card { transition: border-color .15s; }
.guest-card:hover { border-color: var(--primary) !important; }
.btn-sm { padding: 5px 10px; font-size: 13px; min-height: 28px; }
.btn-link {
  background: none; border: none; color: var(--primary);
  padding: 3px; font-size: 13px; cursor: pointer;
}
.btn-link:hover { text-decoration: underline; }

/* ===== 表格 ===== */
.table-wrap { overflow-x: auto; border-radius: var(--radius-lg); border: 1px solid var(--border); background: var(--bg-card); }
table { width: 100%; border-collapse: collapse; }
thead tr { background: var(--bg-base); border-bottom: 1px solid var(--border); }
th {
  padding: 8px 14px; text-align: left; font-size: 13px; font-weight: 600;
  color: var(--text-secondary); letter-spacing: .3px; white-space: nowrap;
  border-bottom: 2px solid var(--border);
}
td {
  padding: 10px 14px; border-top: 1px solid var(--border);
  color: var(--text-primary); font-size: 14px; line-height: 1.45;
  vertical-align: middle;
}
tbody tr:hover td { background: var(--primary-50); transition: background 0.1s ease; }
/* 带网格线的报表表格 */
.report-grid-wrap { border: none; background: transparent; }
.report-grid-table { width: 100%; border-collapse: collapse; border: 1px solid var(--border); background: var(--bg-card); border-radius: var(--radius-lg); overflow: hidden; }
.report-grid-table thead tr { background: var(--bg-base); border-bottom: 1px solid var(--border); }
.report-grid-table th,
.report-grid-table td { border: 1px solid var(--border); padding: 8px 14px; font-size: 13px; text-align: center; }
.report-grid-table th { font-weight: 600; }
/* 紧凑型表格（储值管理等子页面）— 与订单列表风格一致 */
.compact-table { border: none; }
.compact-table thead tr { background: #fafbfc; border-bottom: 1px solid #e5e7eb; }
.compact-table th { padding: 8px 10px; font-size: 12px; color: #6b7280; font-weight: 600; border-bottom: 1px solid #e5e7eb; white-space: nowrap; text-align: left; }
.compact-table td { padding: 7px 10px; font-size: 13px; color: #374151; border-bottom: 1px solid #f0f0f0; vertical-align: middle; white-space: nowrap; line-height: 1.45; }
.compact-table tbody tr:hover td { background: var(--primary-50); transition: background 0.1s ease; }
.td-actions { display: flex; gap: 3px; flex-wrap: wrap; }
.orders-table-wrap td { font-size: 13px; padding: 7px 8px; border-bottom: 1px solid #f0f0f0; color: #374151; vertical-align: middle; white-space: nowrap; }
.orders-table-wrap th { font-size: 12px; padding: 8px 8px; background: #fafbfc; color: #6b7280; font-weight: 600; border-bottom: 1px solid #e5e7eb; white-space: nowrap; text-align: center; }
.orders-table-wrap .btn-sm { padding: 2px 7px; font-size: 12px; min-height: 22px; }
/* 订单列表列宽对齐 */
.orders-table-wrap th:nth-child(1), .orders-table-wrap td:nth-child(1) { width: 60px; text-align: left; }
.orders-table-wrap th:nth-child(2), .orders-table-wrap td:nth-child(2) { width: 36px; text-align: center; }
.orders-table-wrap th:nth-child(3), .orders-table-wrap td:nth-child(3) { width: 40px; text-align: center; }
.orders-table-wrap th:nth-child(4), .orders-table-wrap td:nth-child(4) { width: 72px; text-align: left; }
.orders-table-wrap th:nth-child(5), .orders-table-wrap td:nth-child(5) { width: 56px; text-align: right; }
.orders-table-wrap th:nth-child(6), .orders-table-wrap td:nth-child(6),
.orders-table-wrap th:nth-child(7), .orders-table-wrap td:nth-child(7) { width: 88px; text-align: center; }
.orders-table-wrap th:nth-child(8), .orders-table-wrap td:nth-child(8) { width: 96px; text-align: center; }
.orders-table-wrap th:nth-child(9), .orders-table-wrap td:nth-child(9) { width: 36px; text-align: center; }
.orders-table-wrap th:nth-child(10), .orders-table-wrap td:nth-child(10) { width: 40px; text-align: center; }
.orders-table-wrap th:nth-child(11), .orders-table-wrap td:nth-child(11) { width: 48px; text-align: center; }
.orders-table-wrap th:nth-child(12), .orders-table-wrap td:nth-child(12) { width: 48px; text-align: center; }
.orders-table-wrap th:nth-child(13), .orders-table-wrap td:nth-child(13) { text-align: center; }
/* 复选框列（新增第1列，后续 nth-child 顺延1位） */
.orders-table-wrap th:nth-child(1), .orders-table-wrap td:nth-child(1) { width: 36px; text-align: center; }
.orders-table-wrap th:nth-child(2), .orders-table-wrap td:nth-child(2) { width: 60px; text-align: left; }
.orders-table-wrap th:nth-child(3), .orders-table-wrap td:nth-child(3) { width: 40px; text-align: center; }
.orders-table-wrap th:nth-child(4), .orders-table-wrap td:nth-child(4) { width: 40px; text-align: center; }
.orders-table-wrap th:nth-child(5), .orders-table-wrap td:nth-child(5) { width: 72px; text-align: left; }
.orders-table-wrap th:nth-child(14), .orders-table-wrap td:nth-child(14) { text-align: center; }

/* ===== 批量操作 ===== */
#batchAssignBtn, #batchCheckinBtn { transition: opacity .2s; }
.batch-order-item {
  padding: 8px 10px; margin-bottom: 6px; border-radius: 6px;
  background: #fff; border: 1px solid #e5e7eb; cursor: pointer;
  transition: all .15s;
}
.batch-order-item:hover { border-color:#93c5fd; }
.batch-order-item.active {
  border-color: #3b82f6; background: #eff6ff; box-shadow: 0 0 0 2px rgba(59,130,235,.15);
}
.batch-order-name { font-weight: 600; font-size: 13px; color: #1f2937; }
.batch-order-room { font-size: 12px; color: #9ca3af; margin-top: 2px; }
.batch-room-cell {
  width: 68px; padding: 6px 4px; text-align: center; border-radius: 8px;
  background: #22c55e; cursor: pointer; color: #fff;
  transition: transform .1s, opacity .2s;
  user-select: none;
}
.batch-room-cell:hover { transform: scale(1.05); }
.batch-room-cell div:first-child { font-weight: 700; font-size: 14px; }

/* ===== 状态徽章 ===== */
.badge {
  display: inline-flex; align-items: center;
  padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; white-space: nowrap;
}
.badge-booked,
.badge-checked_in,
.badge-checked_out,
.badge-cancelled,
.badge-noshow,
.badge-settled {
  background: #f3f4f6;
  color: #374151;
}
.badge-noshow {
  background: #fef3c7;
  color: #92400e;
}
.badge-open {
  background: #fef2f2;
  color: #dc2626;
}

/* ===== 分页 ===== */
.pagination { display: flex; align-items: center; gap: 6px; justify-content: flex-end; margin-top: 14px; }
.page-btn {
  min-width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 4px;
  background: var(--bg-card); cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 13px;
  color:  var(--text-secondary); transition: all .15s;
}
.page-btn:hover { background: #2563eb; border-color: #2563eb; color: #fff; }
.page-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.page-info { font-size: 13px; color: var(--text-muted); }

/* ===== 表单 ===== */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid.compact { gap: 8px 14px; }
.form-group { display: flex; flex-direction: column; gap: 4px; }
.form-grid.compact .form-group { gap: 3px; }
.form-grid.compact .form-label { font-size: 11.5px; }
.form-grid.compact .form-input,
.form-grid.compact .form-select,
.form-grid.compact .form-textarea { padding: 6px 10px; font-size: 12.5px; }
.form-group.full { grid-column: span 2; }
.grid-span-2 { grid-column: span 2; }
.grid-span-3 { grid-column: span 3; }
.form-label { font-size: 13px; font-weight: 500; color: var(--text-secondary); line-height: 1.5; }
.form-label .required { color: var(--danger); margin-left: 2px; }
.form-optional { color: var(--text-muted, #94a3b8); font-weight: 400; font-size: 12px; margin-left: 2px; }
.form-input, .form-select, .form-textarea {
  padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--radius);
  font-size: 14px; outline: none; width: 100%; line-height: 1.5;
  background: var(--bg-input); color: var(--text-primary);
  transition: border-color .15s, box-shadow .15s;
  box-sizing: border-box; height: 38px; font-family: inherit;
}
/* 隐藏 number 输入框的上下箭头（全局） */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }
.form-input[type="number"]::-webkit-outer-spin-button,
.form-input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.form-input[type="number"] { -moz-appearance: textfield; }
.form-select { appearance: none; padding-right: 28px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center;
}
/* Compact form variant */
.form-compact .form-input,
.form-compact .form-select,
.form-compact .form-textarea {
  padding: 5px 8px; font-size: 13px; line-height: 1.4; height: 32px;
}
.form-compact .form-select { padding-right: 24px; background-position: right 6px center; }
.form-compact .form-label { font-size: 12px; }
.form-compact .form-group { gap: 2px; }

/* 房间空房快速入住弹窗专用紧凑布局 */
.room-checkin-form .form-grid.compact { gap: 5px 8px; }
.room-checkin-form .form-grid.compact .form-group { gap: 0px; margin: 0; }
.room-checkin-form .form-grid.compact .form-label { font-size: 11.5px; line-height: 1.25; color: var(--text-secondary); margin-bottom: 2px; }
.room-checkin-form .form-grid.compact .form-input,
.room-checkin-form .form-grid.compact .form-select { padding: 3px 7px; font-size: 12.5px; height: 28px; line-height: 1.3; border-radius: 4px; }
.room-checkin-form .form-grid.compact .form-select { padding-right: 20px; background-position: right 4px center; background-size: 9px; }
.room-checkin-form .form-grid.compact .form-input::placeholder { font-size: 12px; }
/* 入住登记最终布局：用户定死的宽度与行高，原样套用，不做调整 */
.room-checkin-form .rc-form-grid { display: flex; gap: 40px; margin-bottom: 8px; }
.room-checkin-form .rc-col-left { flex: 1.4; min-width: 0; }
.room-checkin-form .rc-col-right { flex: 1; min-width: 0; }
.room-checkin-form .field-row { display: flex; align-items: center; height: 38px; margin-bottom: 2px; }
.room-checkin-form .field-row > label { font-size: 13px; color: #333; width: 72px; flex-shrink: 0; }
.room-checkin-form .field-row > label .required { color: #f53f3f; margin-right: 2px; }
.room-checkin-form .field-row > label .optional { color: #999; font-weight: 400; font-size: 12px; }
.room-checkin-form .field-row input,
.room-checkin-form .field-row select { height: 30px; border: 1px solid #d9dde6; border-radius: 4px; padding: 0 8px; font-size: 13px; color: #1a2634; background: #fff; outline: none; transition: .2s; }
.room-checkin-form .field-row input:focus,
.room-checkin-form .field-row select:focus { border-color: #4d7cff; box-shadow: 0 0 0 2px rgba(77,124,255,.15); }
.room-checkin-form .field-row .w-name { width: 120px; }
.room-checkin-form .field-row .w-phone { width: 130px; }
.room-checkin-form .field-row .w-gender { width: 70px; }
.room-checkin-form .field-row .w-id { width: 180px; }
.room-checkin-form .field-row .w-address { width: 100%; }
.room-checkin-form .field-row .w-remark { width: 100%; }
.room-checkin-form .field-row .w-date { width: 130px; }
.room-checkin-form .field-row .w-days { width: 45px; text-align: center; }
.room-checkin-form .field-row .w-rooms { width: 45px; text-align: center; }
.room-checkin-form .field-row .w-channel { width: 80px; }
.room-checkin-form .field-row .w-price { width: 80px; }
.room-checkin-form .rc-price-unit { font-size: 13px; color: #4e5a66; margin-left: 4px; white-space: nowrap; }
.room-checkin-form .rc-footer { display: flex; justify-content: center; border-top: 1px solid #eaedf2; padding-top: 12px; margin-top: 4px; }

.form-input::placeholder, .form-textarea::placeholder { color: var(--text-muted); }
.form-input:focus, .form-select:focus, .form-textarea:focus {
  border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37,99,235,.12);
  background: #fff;
}
.form-textarea { min-height: 72px; resize: vertical; height: auto; }
.form-grid.compact .form-textarea { min-height: 50px; height: auto; }
.new-order-form { margin: -18px -20px; padding: 14px 20px 8px; }
.new-order-form .form-grid.compact { gap: 6px 16px; }
.new-order-form .form-grid.compact .form-group { gap: 2px; }
.new-order-form .form-grid.compact .form-label { font-size: 12.5px; line-height: 1.3; color:#666; }
.new-order-form .form-grid.compact .form-input,
.new-order-form .form-grid.compact .form-select,
.new-order-form .form-grid.compact .form-textarea { padding: 5px 9px; font-size: 13.5px; height: 32px; line-height: 1.35; border-color:#d4d4d8; border-radius:5px; }
.new-order-form .form-grid.compact .form-select { padding-right: 22px; background-position: right 7px center; background-size: 10px; }
.new-order-form .form-grid.compact .form-textarea { min-height: 32px; height: auto; resize: none; }
.new-order-form .ot-tabs { margin-bottom: 10px; }
.new-order-form .ot-tab { padding:6px 0; font-size:13px; }
.new-order-form .ot-tab-tag { font-size:9.5px; padding:0 4px; }
.new-order-form #otHint { padding:5px 0; font-size:12px; margin-top:4px; background:none; color:#999; border:none; }
.new-order-form .form-actions { margin-top:8px; padding-top:8px; }

/* ===== 新建预订 - 紧凑版（按线框图 Arco 风格） ===== */
.nof-form { margin: -14px -18px; padding: 12px 18px 8px; color:#1d2129; }

/* ---- 顶部 Tab 行：左=切换tab(下划线) 右=灰标信息 ---- */
.top-tabs {
  display: flex; align-items: center;
  border-bottom: 1px solid #e5e6eb; padding-bottom: 6px; margin-bottom: 10px;
}
.tabs-left { display: flex; gap: 0; }
.ot-tab {
  padding: 4px 14px 6px 14px; font-size: 14px; color: #4e5969;
  cursor: pointer; border-bottom: 2px solid transparent;
}
.ot-tab:hover { color: #1d2129; }
.ot-tab.active { color: #165dff; border-bottom-color: #165dff; font-weight: 500; }

.tabs-right { display: flex; gap: 6px; font-size: 12px; color: #86909c; }
.ot-info-tag {
  background: #f2f3f5; padding: 2px 10px; border-radius: 4px; line-height: 20px;
  white-space: nowrap;
}
.ot-info-tag.ot-clickable { cursor: pointer; }
.ot-info-tag.ot-clickable:hover { background: #e5e6eb; color: #4e5969; }

/* ---- 表单行 ---- */
.form-row {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 4px; flex-wrap: wrap;
}
.field-group {
  display: flex; align-items: center; gap: 4px;
  flex: 0 0 auto;
}
.field-group > label {
  font-size: 13px; color: #4e5969; white-space: nowrap;
}
.required { color: #f53f3f; margin-right: 1px; }
.opt-label, .inline-opt { color: #86909c; font-size: 12px; font-weight: 400; }

/* ---- 输入控件统一风格 ---- */
.fn {
  height: 28px; padding: 0 8px; border: 1px solid #d9dde6; border-radius: 4px;
  font-size: 13px; color: #1d2129; background: #fff;
  outline: none; transition: border .2s, box-shadow .2s;
}
.fn:focus { border-color: #165dff; box-shadow: 0 0 0 2px rgba(22,93,255,.15); }
select.fn { padding-right: 22px; min-width: 0; }
textarea.fn { height: auto; resize: vertical; padding: 6px 10px; line-height: 1.5; }
/* 隐藏数字输入框的上下箭头（房价/天数/间数） */
input.fn[type="number"]::-webkit-outer-spin-button,
input.fn[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input.fn[type="number"] { -moz-appearance: textfield; }

/* 各字段固定宽度（精确：按实际内容长度） */
.fn-name    { width: 90px; }    /* 预订人：2-3个汉字 */
.fn-phone   { width: 140px; }   /* 联系手机：拉长 */
.fn-order   { width: 160px; }   /* 外部订单号(OTA)：拉长 */
.fn-channel { width: 62px; padding-right: 4px; }  /* 渠道："前台"2字，窄 */
.fg-roomtype { flex: 0 0 auto; }
.fn-roomtype { width: 118px; }  /* 房型："豪华大床房"5字（定宽，不撑满，房价靠左） */
.fg-price   { flex: 0 0 auto; }
.fn-price   { width: 60px; }    /* 房价：纯数字3-4位 */
.fn-date    { width: 120px; }   /* 日期：2026/08/11 */
.fg-small   { flex: 0 0 auto; }
.fn-small   { width: 36px; text-align: center; }
.fn-small[readonly] { background: #f7f8fa; cursor: default; }

/* 房价单位（元/晚 独立显示） */
.price-unit { font-size: 13px; color: #4e5969; margin-left: 2px; white-space: nowrap; }

/* 房型剩余数小标签（橙） */
.room-stock {
  font-size: 12px; color: #f77234; background: #fff4e8;
  padding: 0 8px; border-radius: 4px; line-height: 22px;
  white-space: nowrap; margin-left: 2px;
}

/* ===== 新建预订：房型选择（横向卡片布局） ===== */
.rt-cards { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.rt-card {
  border: 1px solid #e5e7eb; border-radius: 6px;
  padding: 8px 10px; cursor: pointer; transition: all .15s;
  background: #fff; min-width: 120px; flex: 1; max-width: 180px;
}
.rt-card:hover { border-color:#a5b4fc; background:#f8faff; }
.rt-card.rt-picked {
  border-color: #4338ca; background: #eef2ff;
  box-shadow: 0 0 0 2px rgba(67,56,202,.15);
}
.rt-card-name {
  font-size: 13px; font-weight: 600; color: #1f2329; margin-bottom: 4px;
}
.rt-card-stock {
  font-size: 11px; color: #16a34a; margin-bottom: 4px;
}
.rt-card-stock.zero { color: #dc2626; }
.rt-card-row {
  display: flex; align-items: center; gap: 4px;
}
.rt-card-price-label { font-size: 11px; color: #86909c; white-space: nowrap; }
.rt-card-price-input {
  width: 54px; height: 24px; text-align: center;
  border: 1px solid #d9dde6; border-radius: 3px;
  font-size: 12px; outline: none; padding: 0 4px;
}
.rt-card-qty-label { font-size: 11px; color: #86909c; white-space: nowrap; margin-left: 4px; }
.rt-card-qty {
  width: 38px; height: 24px; text-align: center;
  border: 1px solid #d9dde6; border-radius: 3px;
  font-size: 12px; outline: none; padding: 0 4px;
}
.rt-card-price-input:focus, .rt-card-qty:focus { border-color: #4338ca; box-shadow: 0 0 0 2px rgba(67,56,202,.12); }
input.rt-card-price-input::-webkit-outer-spin-button,
input.rt-card-price-input::-webkit-inner-spin-button,
input.rt-card-qty::-webkit-outer-spin-button,
input.rt-card-qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input.rt-card-price-input, input.rt-card-qty { -moz-appearance: textfield; }

/* 备注行（独占一行） */
.remark-row { margin-top: 2px; margin-bottom: 4px; display: flex; align-items: flex-start; gap: 4px; }
.remark-row > label { font-size: 13px; color: #4e5969; white-space: nowrap; padding-top: 4px; }
.remark-row textarea.fn { width: 100%; height: 48px; min-height: 48px; }

/* 空房快速预订 - 与新建预订统一紧凑风格 */
.qof-form { margin: -16px; padding: 14px 16px 6px; color: #1d2129; }
.qof-hint {
  margin: 2px 0 12px; padding: 8px 12px; border-radius: 4px;
  font-size: 13px; color: #4b5563; background: #f2f3f5;
  border: 1px solid #e5e6eb; line-height: 1.5;
}
.qof-hint strong { color: #1d2129; }

/* 底部按钮 - 居中 */
.modal-footer {
  display: flex; justify-content: center; align-items: center;
  gap: 16px;
  border-top: 1px solid #e5e6eb; padding-top: 14px; margin-top: 4px;
}
.modal-footer .btn {
  padding: 6px 32px; border-radius: 4px; font-size: 13px;
  font-weight: 500; cursor: pointer; border: 1px solid transparent; line-height: 22px;
}
.btn-cancel { color: #4e5969; background: #f2f3f5; border-color: #d9dde6; }
.btn-cancel:hover { background: #2563eb; border-color: #2563eb; color: #fff; }
.btn-confirm { color: #ffffff; background: #165dff; border-color: #165dff; }
.btn-confirm:hover { background: #2563eb; border-color: #2563eb; }
.form-actions {
  display: flex; gap: 8px; justify-content: flex-end;
  margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border);
}
.form-grid.compact ~ .form-actions,
.compact-form-actions { margin-top: 10px; padding-top: 10px; }

/* 订单类型标签 */
.ot-tabs { display:flex; gap:0; margin-bottom:8px; border-bottom:1px solid #e5e7eb }
.ot-tab {
  padding:6px 16px; font-size:13px; font-weight:500; text-align:center;
  border:none; border-radius:0; background:transparent; color:#9ca3af;
  cursor:pointer; transition:all .15s; position:relative; bottom:-1px;
}
.ot-tab:hover { color:#555 }
.ot-tab.active { color:var(--primary); font-weight:600; border-bottom:2px solid var(--primary); }
.ot-tab-tag {
  display:inline-block; font-size:10px; font-weight:400; padding:0 4px; border-radius:3px;
  background:#f3f4f6; margin-left:4px; vertical-align:middle; color:#9ca3af
}

/* ===== 弹窗 ===== */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 200;
  display: none; backdrop-filter: blur(4px);
}
.modal-overlay.open { display: block; }
.modal {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%);
  background: #fff; border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
  z-index: 201; width: 620px; max-width: 94vw;
  display: none; flex-direction: column; overflow: hidden;
}
.modal.open { display: flex; }
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid #e5e7eb;
  background: #fff;
}
#modalTitle { font-size: 14px; font-weight: 600; color: #1f2937; }
.modal-header-actions { display: flex; align-items: center; gap: 6px; }
.modal-minimize-btn {
  width: 28px; height: 28px; border: none; border-radius: 4px;
  background: #e0f2fe; color: #0369a1; cursor: pointer; font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s ease;
}
.modal-minimize-btn:hover { background: #2563eb; color: #fff; }
.modal-close {
  width: 30px; height: 30px; border: none; border-radius: 4px;
  background: #fecaca;
  cursor: pointer; font-size: 16px; display: flex;
  align-items: center; justify-content: center;
  color: #1f2937; transition: all .15s ease;
}
.modal-close:hover { background: #fca5a5; }
.modal-body {
  padding: 14px 18px; overflow-y: hidden;
  color: #374151;
}
/* 隐藏滚动条但保留滚动能力 */
.modal-body::-webkit-scrollbar { display: none; width: 0 !important; }
.modal-body { scrollbar-width: none; -ms-overflow-style: none; }
/* ===== 全局滚动条优化 ===== */
.modal-body::-webkit-scrollbar,
#odTabContent::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 10px;
}
.modal-body::-webkit-scrollbar-track,
#odTabContent::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: #f3f4f6; border-radius: 5px;
}
.modal-body::-webkit-scrollbar-thumb,
#odTabContent::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  background: #c4c9d0; border-radius: 5px;
  border: 2px solid #f3f4f6;
}
.modal-body::-webkit-scrollbar-thumb:hover,
#odTabContent::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
  background: #9ca3af;
}
/* 订单详情标签内容区：占据弹窗剩余高度，支持滚动 */
#odTabContent {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.modal-body .form-label { color: var(--text-secondary); }
.modal-body .form-input,
.modal-body .form-select,
.modal-body .form-textarea {
  background: var(--bg-input); border-color: var(--border); color: var(--text-primary);
}
.modal-body .form-input:focus,
.modal-body .form-select:focus,
.modal-body .form-textarea:focus {
  border-color: var(--primary); outline: none;
}
.modal-body .card-title { color: var(--text-primary); }
.modal-body .toolbar span { color: var(--text-secondary); }
.modal-body .empty-text { color: var(--text-muted); }
.modal-wide { width: 800px; }
.modal-xlarge {
  width: 1020px; max-width: 96vw;
  /* 订单详情弹窗顶部固定，Tab 切换时位置不再随内容高度变化而跳动 */
  top: 80px; transform: translate(-50%, 0);
  height: auto; max-height: calc(100vh - 120px);
}
.modal-xlarge .modal-body { display: flex; flex-direction: column; flex: 1; overflow-y: hidden; }
.modal-xxl { width: 1400px; max-height: 90vh; }

/* ===== 已最小化订单停靠栏（实时房态页顶部） ===== */
.room-minimized-dock {
  display: none;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 8px 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}
.room-minimized-dock::before {
  content: '已打开房间';
  font-size: 12px; color: #64748b; font-weight: 500;
  margin-right: 4px; white-space: nowrap;
}
.room-dock-card {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px 4px 6px;
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  cursor: pointer;
  transition: all .15s ease;
  user-select: none;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  max-width: 180px;
}
.room-dock-card:hover {
  border-color: #2563eb;
  background: #eef2ff;
  box-shadow: 0 2px 6px rgba(37,99,235,.10);
}
.room-dock-status {
  width: 7px; height: 7px; border-radius: 50%;
  flex-shrink: 0;
}
.room-dock-room {
  font-size: 13px; font-weight: 700; color: #1f2937;
  flex-shrink: 0;
}
.room-dock-name {
  font-size: 12px; color: #475569;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0;
}
.room-dock-close {
  width: 16px; height: 16px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 4px;
  font-size: 13px; color: #94a3b8;
  margin-left: 2px; flex-shrink: 0;
}
.room-dock-close:hover {
  background: #fee2e2; color: #dc2626;
}

/* ===== Toast ===== */
.toast-container { position: fixed; top: 16px; right: 16px; z-index: 9999; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.toast {
  padding: 11px 16px; border-radius: var(--radius); font-size: 14px;
  box-shadow: var(--shadow-lg); animation: toastSlideIn .3s ease forwards; max-width: 340px;
  display: flex; align-items: center; gap: 8px; pointer-events: auto;
  background: #fff; border: 1px solid var(--border); color: var(--text-primary);
}
.toast.toast-out { animation: toastSlideOut .3s ease forwards; }
.toast-success { border-left: 3px solid var(--success); }
.toast-error   { border-left: 3px solid var(--danger); }
.toast-info    { border-left: 3px solid var(--primary); }
@keyframes toastSlideIn  { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes toastSlideOut { from { transform: translateX(0); opacity: 1; } to { transform: translateX(120%); opacity: 0; } }

/* ===== 右下角订单变动通知 ===== */
.order-notify-area {
  position: fixed; right: 24px; bottom: 24px; z-index: 9998;
  display: flex; flex-direction: column; gap: 10px; pointer-events: none;
}
.order-notify-area .order-notify { pointer-events: auto; cursor: default; }
.order-notify-area .order-notify:hover { transform: translateX(-2px) scale(1.02); transition: transform .2s; }
@keyframes orderNotifyIn { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* ===== 账单详情 ===== */
.bill-info-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin-bottom: 10px; }
.bill-info-card {
  background: var(--bg-base); border-radius: var(--radius); padding: 4px 6px;
  text-align: center; border: 1px solid var(--border);
}
.bill-info-val { font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--text-primary); }
.bill-info-label { font-size: 10px; color: var(--text-muted); margin-top: 1px; letter-spacing: .3px; }
.bill-info-val.danger  { color: var(--danger); }
.bill-info-val.success { color: var(--success); }

/* 账单详情弹窗紧凑表格 */
.bill-detail-table th,
.bill-detail-table td { padding: 6px 8px; font-size: 13px; }
.bill-detail-table th { font-size: 12px; padding: 6px 8px; }
.bill-detail-table .badge { padding: 1px 6px; font-size: 10px; }
.bill-detail-table .btn-sm { padding: 2px 8px; font-size: 12px; min-height: 24px; }
.bill-detail-table td { line-height: 1.3; }

/* 订单详情弹窗 - 账单标签页紧凑样式 */
.od-bill-summary {
  margin-bottom: 4px; padding: 3px 8px; font-size: 12px; color: #444;
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 2px;
}
.od-bill-summary strong { font-weight: 600; }
.od-bill-grid {
  display: flex; align-items: center; gap: 14px; margin-bottom: 6px;
  padding: 3px 0; border-bottom: 1px solid #e5e7eb;
  font-size: 12px; flex-wrap: wrap;
}
.od-bill-card { text-align: left; display: inline-flex; align-items: baseline; gap: 3px; }
.od-bill-card-val { font-size: 14px; font-weight: 700; color: #333; }
.od-bill-card-label { font-size: 11px; color: #999; }
.od-bill-table { width: 100%; border-collapse: collapse; }
.od-bill-table th {
  padding: 4px 5px; font-size: 11px; color: #aaa; font-weight: 500;
  background: transparent; border-bottom: 1px solid #ddd; text-align: left; white-space: nowrap;
}
.od-bill-table td {
  padding: 3px 5px; font-size: 12px; border-bottom: 1px solid #f5f5f5;
  vertical-align: middle; color: #444;
}
.od-bill-table tbody tr:hover { background: #fafafa; }
.od-bill-table .type-badge {
  padding: 0 4px; border-radius: 2px; font-size: 10px; font-weight: 500;
  background: #eee; color: #777;
}
.od-bill-table .del-btn {
  width: 15px; height: 15px; padding: 0; font-size: 9px; line-height: 15px;
  border: 1px solid #ddd; border-radius: 50%; background: #fff; color: #bbb; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.od-bill-table .del-btn:hover { background: #f5f5f5; color: #888; }
.od-bill-section {
  padding: 6px 0 0; margin-bottom: 2px;
  border-top: 1px solid #eee;
}
.od-bill-section-title { font-weight: 500; margin-bottom: 4px; font-size: 11px; color: #888; }
.od-bill-section .form-select, .od-bill-section .form-input { padding: 2px 5px; font-size: 12px; height: 26px; border-color: #ccc; }
.od-bill-section .btn { padding: 2px 8px; font-size: 11px; height: 26px; }
.od-bill-close { text-align: center; padding: 4px; margin-top: 6px; }
.od-bill-close .btn { padding: 4px 14px; font-size: 12px; height: 28px; }

/* 账单骨架屏：切换 tab 时先出框架，再异步浮现内容 */
.od-bill-skeleton .skel-line,
.od-bill-skeleton .skel-label,
.od-bill-skeleton .skel-val,
.od-bill-skeleton .skel-input,
.od-bill-skeleton .skel-btn {
  background: #e2e8f0; border-radius: 4px;
  animation: skelPulse 1.6s ease-in-out infinite;
}
.od-bill-skeleton .skel-line { height: 12px; }
.od-bill-skeleton .skel-label { width: 30px; height: 11px; }
.od-bill-skeleton .skel-val { width: 44px; height: 13px; }
.od-bill-skeleton .skel-input,
.od-bill-skeleton .skel-btn { height: 26px; background: #eef2f6; }
.od-bill-skeleton .od-bill-card { gap: 5px; }
.od-bill-skeleton tbody td { padding: 6px 5px; }
@keyframes skelPulse { 0%,100%{opacity:1} 50%{opacity:.55} }
.od-bill-fade-in { animation: odBillFadeIn .22s ease; }
@keyframes odBillFadeIn { from{opacity:0} to{opacity:1} }

/* ===== 账单管理页面 ===== */
.bill-mgmt-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.bill-mgmt-table th {
  padding: 6px 8px; font-size: 12px; font-weight: 600; color: #6b7280;
  background: #fafbfc; border-bottom: 1px solid #e5e7eb; text-align: center;
  white-space: nowrap;
}
.bill-mgmt-table td {
  padding: 6px 8px; font-size: 13px; border-bottom: 1px solid #f0f0f0;
  vertical-align: middle; transition: background .15s; white-space: nowrap; color: #374151;
}
.bill-mgmt-table tbody tr:hover td { background: #f9fafb; }
.bill-mgmt-table .btn-sm { padding: 2px 7px; font-size: 12px; min-height: 22px; }
/* 账单列表列宽对齐 */
.bill-mgmt-table th:nth-child(1), .bill-mgmt-table td:nth-child(1) { width: 60px; text-align: left; }
.bill-mgmt-table th:nth-child(2), .bill-mgmt-table td:nth-child(2) { width: 36px; text-align: center; }
.bill-mgmt-table th:nth-child(3), .bill-mgmt-table td:nth-child(3) { width: 40px; text-align: center; }
.bill-mgmt-table th:nth-child(4), .bill-mgmt-table td:nth-child(4) { width: 44px; text-align: center; }
.bill-mgmt-table th:nth-child(5), .bill-mgmt-table td:nth-child(5),
.bill-mgmt-table th:nth-child(6), .bill-mgmt-table td:nth-child(6),
.bill-mgmt-table th:nth-child(7), .bill-mgmt-table td:nth-child(7),
.bill-mgmt-table th:nth-child(8), .bill-mgmt-table td:nth-child(8),
.bill-mgmt-table th:nth-child(9), .bill-mgmt-table td:nth-child(9) { width: 68px; text-align: right; }
.bill-mgmt-table th:nth-child(10), .bill-mgmt-table td:nth-child(10) { width: 52px; text-align: center; }
.bill-mgmt-table th:nth-child(11), .bill-mgmt-table td:nth-child(11) { width: 76px; text-align: center; }
.bill-mgmt-table th:nth-child(12), .bill-mgmt-table td:nth-child(12) { text-align: center; }
.bill-mgmt-table tbody tr:hover { background: #f8fafc; }
.bill-mgmt-table tbody tr.bill-row-urgent { background: #fef2f2; }
.bill-mgmt-table tbody tr.bill-row-urgent:hover { background: #fee2e2; }
.bill-mgmt-table .td-actions { display: flex; gap: 4px; flex-wrap: wrap; }

/* ===== 订单详情-入住人标签页 ===== */
.od-guests-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--border);
}
.od-guests-header div { font-weight: 700; font-size: 14px; }
.guest-card {
  border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px;
  margin-bottom: 6px; background: var(--bg-base);
}
.guest-card-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 5px; font-size: 13px; font-weight: 600; color: var(--text-primary);
}
.guest-card-body {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px 8px; font-size: 13px;
}
.guest-card-body div { color: var(--text-primary); line-height: 1.4; }
.guest-card-body span { color: var(--text-muted); margin-right: 4px; font-size: 12px; }

/* 入住人编辑弹窗紧凑样式 */
.guest-form-compact .form-grid.compact { gap: 6px 10px; }
.guest-form-compact .form-group { gap: 2px; }
.guest-form-compact .form-label { font-size: 12px; }
.guest-form-compact .form-input,
.guest-form-compact .form-select { padding: 4px 8px; font-size: 13px; height: 30px; line-height: 1.35; }
.guest-form-compact .form-select { padding-right: 22px; background-position: right 5px center; background-size: 10px; }
.guest-form-compact .form-actions { margin-top: 8px; padding-top: 8px; }
.guest-form-compact .form-actions .btn { padding: 4px 12px; font-size: 13px; height: 28px; }

/* 入住人弹窗身份证读取区域醒目标识 */
/* 入住人标签页/弹窗进一步紧凑化 */
.od-guests-header-compact {
  margin-bottom: 6px; padding-bottom: 4px;
}
.od-guests-header-compact div { font-size: 14px; font-weight: 600; }
.guest-card-compact {
  padding: 6px 10px; margin-bottom: 6px; border-radius: 5px;
}
.guest-card-header-compact {
  margin-bottom: 4px; font-size: 13px;
}
.guest-card-body-compact {
  gap: 3px 8px; font-size: 13px;
}
.guest-card-body-compact div { line-height: 1.45; }
.guest-card-body-compact span { font-size: 12px; margin-right: 3px; }

.guest-form-extra-compact .form-grid.compact { grid-template-columns: repeat(3, 1fr); gap: 6px 10px; }
.guest-form-extra-compact .form-group { gap: 2px; }
.guest-form-extra-compact .form-label { font-size: 13px; color: var(--text-secondary); }
.guest-form-extra-compact .form-input,
.guest-form-extra-compact .form-select { padding: 4px 8px; font-size: 14px; height: 30px; line-height: 1.4; }
.guest-form-extra-compact .form-select { padding-right: 22px; background-position: right 5px center; background-size: 10px; }
.guest-form-extra-compact .form-actions { margin-top: 8px; padding-top: 8px; }
.guest-form-extra-compact .form-actions .btn { padding: 4px 12px; font-size: 13px; height: 28px; }

.extra-compact-actions { margin-top: 6px; padding-top: 6px; gap: 6px; }

/* 超小按钮 */
.btn.btn-xs { padding: 2px 8px; font-size: 12px; height: 24px; min-height: 24px; line-height: 1.2; }
.report-tabs { display: flex; gap: 0; margin-bottom: 16px; border-bottom: 1px solid var(--border); width: fit-content; }
.report-tab {
  padding: 8px 16px; border-radius: 0; cursor: pointer; font-size: 13.5px; font-weight: 500;
  color: var(--text-secondary); transition: all .15s; border: none; background: transparent; border-bottom: 2px solid transparent; margin-bottom: -1px;
  text-align: center;
}
.report-tab.active { background: transparent; color: var(--text-primary); border-bottom-color: var(--primary); }

/* ===== 空状态 ===== */
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-muted); }
.empty-icon { font-size: 48px; margin-bottom: 12px; opacity: .5; }
.empty-text { font-size: 15px; }

/* ===== 用户信息区（左下角）抖音深色风 ===== */
.nav-user-area {
  margin: 6px 8px 0;
  padding: 6px 8px;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #eef0f3;
  width: calc(100% - 16px);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.nav-user-info {
  display: flex;
  align-items: center;
  gap: 4px;
}
#navUserName {
  font-size: 13px;
  font-weight: 600;
  color: #1f2937;
}
.nav-user-role {
  font-size: 11px;
  color: #64748b;
  background: #eef2f7;
  padding: 1px 8px;
  border-radius: 10px;
}
.nav-logout-btn {
  width: auto;
  align-self: flex-start;
  padding: 3px 12px;
  font-size: 12px;
  color: #dc2626;
  background: #fff;
  border: 1px solid #f3c9c9;
  border-radius: 8px;
  cursor: pointer;
  transition: all .15s;
}
.nav-logout-btn:hover {
  background: #fef2f2;
  border-color: #f0a8a8;
}
.nav-switch-hotel-btn {
  width: auto;
  align-self: flex-start;
  padding: 2px 10px;
  font-size: 12px;
  color: #1f2937;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  transition: all .15s;
}
.nav-switch-hotel-btn:hover {
  background: #f1f5f9;
}
.nav-user-area { position: relative; }
.nav-switch-hotel-dropdown {
  display: none;
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 -8px 24px rgba(0,0,0,.12);
  z-index: 200;
  max-height: 200px;
  overflow-y: auto;
  margin-bottom: 4px;
}
.nav-switch-hotel-dropdown.show { display: block; }
.nav-switch-hotel-dropdown-item {
  padding: 8px 12px;
  font-size: 13px;
  color: #334155;
  cursor: pointer;
  transition: background .15s, color .15s;
  border-bottom: 1px solid #f1f5f9;
}
.nav-switch-hotel-dropdown-item:last-child { border-bottom: none; }
.nav-switch-hotel-dropdown-item:hover { background: #f1f5f9; color: #1f2937; }
.nav-switch-hotel-dropdown-item.active {
  color: #2563eb;
  font-weight: 600;
  background: #eef2ff;
}
  100%{background-position:0% 50%}
}

/* ===== 响应式 ===== */
@media (max-width: 768px) {
  .sidebar { width: 56px; }
  .nav-item span { display: none; }
  .sidebar-hotel-name { display: none !important; }
  .nav-item { padding: 12px; justify-content: center; }
  .nav-user-area {
    width: 40px;
    margin: 8px auto 0;
    padding: 8px;
  }
  .nav-user-info { flex-direction: column; gap: 2px; }
  #navUserName { font-size: 10px; }
  .nav-user-role { display: none; }
  .nav-logout-btn { font-size: 9px; padding: 4px 0; }
  .main { margin-left: 56px; }
  .stat-grid { grid-template-columns: repeat(2,1fr); }
  .form-grid { grid-template-columns: 1fr; }
  .form-group.full { grid-column: span 1; }
}

/* ===== 在住高亮 ===== */
tr.in-stay td { background: #f8fafc; }

/* ===== 快速标签筛选（正方形拼接、状态底色、白字）===== */
.rg-quick-tags {
  display: inline-flex; gap: 0; flex-wrap: wrap; margin-bottom: 0;
  border-radius: 8px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
.rg-tag {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 1px;
  width: 28px; height: 28px; cursor: pointer;
  font-size: 9px; font-weight: 600;
  transition: all .15s; user-select: none;
  color: #fff; border: none;
  position: relative;
}
.rg-tag:hover { filter: brightness(1.12); z-index: 1; }
.rg-tag .rg-tag-count {
  font-size: 13px; font-weight: 700; line-height: 1;
  color: #fff; background: none; border-radius: 0;
  padding: 0;
}
.rg-tag.active {
  box-shadow: inset 0 0 0 3px rgba(255,255,255,0.55);
  z-index: 2;
}
.rg-tag.active .rg-tag-count { color: #fff; background: none; }

/* ===== 房态网格视图 ===== */
.room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(82px, 1fr));
  gap: 6px;
}
.rg-room-card {
  position: relative;
  border-radius: 0;
  padding: 6px 5px;
  cursor: pointer;
  border: none;
  aspect-ratio: 1 / 1;
  display: flex; flex-direction: column;
  justify-content: flex-start; align-items: flex-start;
  overflow: hidden;
}
.rg-room-card:hover {
  /* 无动效 */
}
.rg-card-no {
  font-size: 22px; font-weight: 800; color: #1a1a1a;
  letter-spacing: .5px;
  text-shadow: 0 1px 2px rgba(255,255,255,.4); line-height: 1.25;
}
.rg-card-type {
  font-size: 13px; color: #1f2329;
  margin-bottom: 2px; line-height: 1.3;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(255,255,255,.4);
  letter-spacing: .3px;
}
.rg-card-guest {
  font-size: 10px; font-weight: 600; color: #1a1a1a;
  white-space: nowrap; overflow: hidden;
  margin-top: 1px; line-height: 1.3; display:flex;align-items:center;gap:2px;
  width: 100%; min-width: 0;
}
.rg-card-guest > span:first-child,
.rg-card-guest > .rg-guest-name {
  overflow: hidden; text-overflow: ellipsis; min-width:0; flex:1;
}
.rg-vip-badge { flex-shrink:0; display:inline-flex;align-items:center;margin-left:1px;vertical-align:middle;line-height:1 }

/* 会员等级炫彩徽章（QQ彩砖风格） */
.tier-badge {
  display:inline-flex; align-items:center; justify-content:center;
  height:14px; padding:0 3px; border-radius:3px;
  font-size:8px; font-weight:700; color:#fff; letter-spacing:0;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;
  box-shadow:0 1px 1px rgba(0,0,0,.2); vertical-align:middle; line-height:1;
  white-space:nowrap;
}
.tier-0 { background:linear-gradient(135deg,#94a3b8 0%,#cbd5e1 100%); color:#334155; text-shadow:0 1px 1px rgba(255,255,255,.5); }            /* 普通 灰蓝 */
.tier-1 { background:linear-gradient(135deg,#9ca3af 0%,#e5e7eb 55%,#f8fafc 100%); color:#475569; text-shadow:0 1px 1px rgba(255,255,255,.6); } /* 白银 */
.tier-2 { background:linear-gradient(135deg,#d97706 0%,#f59e0b 50%,#fbbf24 100%); }                                                       /* 黄金 */
.tier-3 { background:linear-gradient(135deg,#22d3ee 0%,#a5f3fc 50%,#e0fbff 100%); color:#0e7490; text-shadow:0 1px 1px rgba(255,255,255,.5); } /* 铂金 青白 */
.tier-4 {                                                                                                                                /* 黑钻 黑底彩虹描边 */
  color:#fff; border:1.5px solid transparent;
  background-image:linear-gradient(#1e1b4b,#0f172a), linear-gradient(90deg,#ff0080,#ff8c00,#ffd500,#00ff88,#00b8ff,#8a2be2,#ff0080);
  background-origin:border-box; background-clip:padding-box,border-box;
  box-shadow:0 0 4px rgba(168,85,247,.4), 0 1px 1px rgba(0,0,0,.3);
}

/* 会员明细弹窗：等级下拉（紧凑） */
.dp-set-sel {
  width:110px !important;
  min-width:110px !important;
  padding:4px 18px 4px 6px !important;
  background-position: right 4px center !important;
  background-size: 9px !important;
}

/* VIP徽章悬浮提示（消费值 + 升级进度） */
.vip-tooltip {
  position:fixed; z-index:9999; pointer-events:none;
  background:#1e293b; color:#f8fafc; border-radius:6px;
  padding:6px 10px; font-size:12px; line-height:1.6;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
  opacity:0; transform:translateY(-4px);
  transition:opacity .15s ease, transform .15s ease;
  white-space:nowrap;
}
.vip-tooltip div:first-child { font-weight:600; color:#fbbf24; }
.vip-tooltip div:last-child { color:#94a3b8; }
.rg-card-status-text {
  font-size: 12px; font-weight: 600; margin-bottom: 1px;
  letter-spacing: .5px; line-height: 1.3; color: rgba(255,255,255,.9);
}
.rg-card-status {
  display: inline-block; font-size: 10px; font-weight: 600;
  padding: 1px 7px; border-radius: 10px; margin-top: auto;
  align-self: center;
}
.rg-card-lock { position: absolute; top: 4px; right: 4px; font-size: 13px; }
.rg-card-channel {
  position: absolute; top: 2px; left: 3px;
  font-size: 8px; background: rgba(0,0,0,.25); color: rgba(255,255,255,.9);
  padding: 0 3px; border-radius: 3px; font-weight: 600;
}

/* 停售/维修/锁定 原因标签 */
.rg-card-stop-reason {
  position: absolute; bottom: 6px; left: 6px; right: 6px;
  font-size: 10px; background: rgba(0,0,0,.4); color: #fff;
  padding: 2px 6px; border-radius: 4px; font-weight: 500;
  white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; text-align: left; cursor: help; line-height: 1.3;
  max-width: calc(100% - 12px);
}
.rg-card-stop-reason:hover { background: rgba(0,0,0,.6); }

/* ===== 房态视图房间卡片（弹窗模式） ===== */
.room-card {
  width: 100px; padding: 10px 6px; text-align: center; border-radius: 10px;
  color: #fff; cursor: pointer; transition: transform .1s, box-shadow .1s;
  font-size: 13px;
}
.room-card:hover { transform: scale(1.06); box-shadow: 0 4px 12px rgba(0,0,0,.2); }

/* ===== 房间管理表格 ===== */
#roomMgrTable table td { vertical-align: middle; }

/* ===== 房态图例 ===== */
.legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-secondary); }
.legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }

/* ===== 房间快速操作面板 — 白底 ===== */
.room-panel {
  display: block; min-height: 420px;
}
.room-panel-left {
  display: none; /* 隐藏左侧房号列表 */
}
.room-panel-right {
  padding: 20px; background: #fff;
  border-radius: 10px;
  overflow-y: auto; max-height: 80vh;
  border: 1px solid var(--border);
  color: var(--text-primary);
}
.rp-room-item {
  padding: 7px 10px; border-radius: 6px; cursor: pointer;
  margin-bottom: 3px; font-size: 14px; transition: background .15s; position: relative;
}
.rp-room-item:hover { background: var(--primary-50); }
.rp-room-item.active {
  background: linear-gradient(90deg, var(--primary-50), transparent);
  box-shadow: inset 3px 0 0 var(--primary);
}
.rp-room-row { display:flex; align-items:center; gap:6px; line-height:1.2; }
.rp-room-no { font-size: 14px; font-weight: 700; color: var(--text-primary); }
.rp-room-type { font-size: 12px; color: var(--text-muted); }
.rp-room-guest { font-size: 12px; color: var(--text-secondary); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-check-icon {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; border-radius: 50%; background: var(--primary); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700;
}
.rp-actions { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; margin-bottom: 12px; }
.rp-btn {
  display: flex; align-items: center; justify-content: center; gap: 2px;
  padding: 4px 6px; border: 1px solid #d1d5db; border-radius: 4px;
  font-size: 12px;
  cursor: pointer; white-space: nowrap;
  background: #f9fafb; color: #374151;
  transition: all .15s ease;
}
.rp-btn:hover { background: #3b82f6; border-color: #3b82f6; color: #fff; box-shadow: 0 1px 4px rgba(59,130,246,.35); transform: translateY(-1px); }
.rp-btn-primary { background: #f3f4f6; color: #374151; border-color: #d1d5db; }
.rp-btn-primary:hover { background: #3b82f6; border-color: #3b82f6; color: #fff; box-shadow: 0 1px 4px rgba(59,130,246,.35); transform: translateY(-1px); }
.rp-btn-success, .rp-btn-warning, .rp-btn-danger, .rp-btn-info {
  background: #f3f4f6; color: #374151; border-color: #d1d5db;
}
.rp-btn-success:hover, .rp-btn-warning:hover, .rp-btn-danger:hover, .rp-btn-info:hover {
  background: #3b82f6; border-color: #3b82f6; color: #fff; box-shadow: 0 1px 4px rgba(59,130,246,.35); transform: translateY(-1px);
}
.rp-btn:disabled { opacity: .4; cursor: not-allowed; transform:none; box-shadow:none; }
.rp-btn:disabled:hover { background: #f3f4f6; border-color: #d1d5db; color: #374151; }

/* 详情区域 */
.rp-detail-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.rp-title { font-size: 15px; font-weight: 600; color: #1f2937; }
.rp-tabs { display: flex; gap: 0; border-bottom: 2px solid #e5e7eb; width: fit-content; }
.rp-tab {
  padding: 6px 16px; font-size: 14px; cursor: pointer;
  background: transparent; border: none; color: #6b7280;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
}
.rp-tab.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }

/* ===== 详单标签页（按用户参考源码样式） ===== */
.od-tabs {
  display: flex; gap: 0;
  border-bottom: 2px solid #e8ecf1;
  width: 100%; margin-bottom: 10px; background: none;
  padding-bottom: 0;
  flex-shrink: 0;
}
.od-tab {
  padding: 6px 14px 8px 14px; font-size: 14px; cursor: pointer;
  background: transparent; border: none; color: #4e5a66;
  text-align: center; white-space: nowrap;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
}
.od-tab:hover { color: #1a2634; }
.od-tab.active { color: #2d6cff; border-bottom-color: #2d6cff; font-weight: 500; }

/* ===== 订单详情参考布局（od-detail-ref 作用域，数值照搬源码） ===== */
.od-detail-ref { color: #1a2634; font-size: 13px; border-bottom: 1px solid #e8ecf1; padding-bottom: 8px; }
.od-detail-ref input[type="text"]::placeholder,
.od-detail-ref textarea::placeholder { color: #94a3b8; opacity: 1; }
.od-detail-ref .header {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 8px;
  margin-bottom: 10px; padding-bottom: 8px;
  border-bottom: 1px solid #e8ecf1;
}
.od-detail-ref .room-info { display: flex; align-items: center; gap: 10px; }
.od-detail-ref .room-number { font-size: 18px; font-weight: 600; color: #1a2634; }
.od-detail-ref .room-status { font-size: 12px; color: #00a854; background: #e6f7ed; padding: 1px 10px; border-radius: 20px; }
.od-detail-ref .action-btns { display: flex; gap: 4px; flex-wrap: wrap; }
.od-detail-ref .action-btns .btn-tag {
  font-size: 12px; padding: 3px 10px; border-radius: 4px;
  background: #f3f5f8; color: #4e5a66; cursor: pointer;
  border: 1px solid transparent; user-select: none;
}
.od-detail-ref .action-btns .btn-tag.primary { background: #e8edff; color: #2d6cff; border-color: #ccd8ff; }
.od-detail-ref .action-btns .btn-tag.warning { background: #fff3e6; color: #e67a2e; border-color: #ffe4cc; }
.od-detail-ref .action-btns .btn-tag.danger { background: #ffe8e8; color: #e63e3e; border-color: #ffcccc; }
.od-detail-ref .action-btns .btn-tag:hover { background: #2563eb; color: #fff; border-color: #2563eb; }

/* 主要操作按钮（排房/入住/打印/退房）—— 房间标题旁的空位 */
.od-detail-ref .primary-action-btns { display: flex; gap: 6px; align-items: center; margin-left: auto; margin-right: 10px; }
.od-detail-ref .primary-action-btns .btn-tag {
  font-size: 12px; padding: 4px 14px; border-radius: 4px;
  cursor: pointer; user-select: none; border: 1px solid transparent;
  font-weight: 500; white-space: nowrap;
}
.od-detail-ref .primary-action-btns .btn-tag.primary { background: #fff; color: #2d6cff; border-color: #2d6cff; }
.od-detail-ref .primary-action-btns .btn-tag.warning { background: #fff; color: #e67a2e; border-color: #e67a2e; }
.od-detail-ref .primary-action-btns .btn-tag.danger { background: #2d6cff; color: #fff; border-color: #2d6cff; }
.od-detail-ref .primary-action-btns .btn-tag:hover { background: #2563eb; color: #fff; border-color: #2563eb; opacity: 1; }
.od-detail-ref .main-grid { display: flex; gap: 14px; margin-bottom: 10px; align-items: flex-start; }
.od-detail-ref .col-left { flex: 1.15; min-width: 0; }
.od-detail-ref .col-right { flex: 1.25; min-width: 0; }

/* 顶部三字段 紧凑单行 */
.od-detail-ref .top-grid {
  display: flex; flex-direction: column; gap: 2px;
  margin-bottom: 4px;
}
.od-detail-ref .top-grid .tg-row {
  display: flex; align-items: center; gap: 6px;
  min-height: 26px;
}
.od-detail-ref .top-grid .tg-label {
  color: #475569; font-size: 13px; min-width: 68px;
  line-height: 26px; padding: 2px 0;
}
.od-detail-ref .top-grid .tg-row input[type="text"] {
  width: 160px; height: 26px; flex-shrink: 0;
  border: 1px solid #d9dde6; border-radius: 4px;
  padding: 0 8px; font-size: 13px; color: #1a2634; background: #fff;
  outline: none; box-sizing: border-box;
}
.od-detail-ref .top-grid .tg-row input[type="text"]:focus { border-color: #4d7cff; box-shadow: 0 0 0 2px rgba(77,124,255,.15); }
.od-detail-ref .top-grid .tg-row .save-btn {
  font-size: 12px; color: #2d6cff; background: transparent;
  border: 1px solid #ccd8ff; border-radius: 4px;
  padding: 0 10px; height: 22px; line-height: 20px;
  cursor: pointer; user-select: none; flex-shrink: 0;
}
.od-detail-ref .top-grid .tg-row .save-btn:hover { background: #2563eb; color: #fff; border-color: #2563eb; }
.od-detail-ref .top-grid .tg-row .copy-btn {
  font-size: 12px; color: #86909c; background: transparent;
  border: 1px solid #d9dde6; border-radius: 4px;
  padding: 0 8px; height: 22px; line-height: 20px;
  cursor: pointer; user-select: none; flex-shrink: 0;
}
.od-detail-ref .top-grid .tg-row .copy-btn:hover { background: #2563eb; color: #fff; border-color: #2563eb; }
.od-detail-ref .od-guest-below {
  background: #fff; border: 1px solid #e8ecf1; border-radius: 6px;
  padding: 5px 8px; margin-bottom: 4px;
}
.od-detail-ref .info-card {
  background: #f8f9fb; border-radius: 8px;
  padding: 10px 12px; margin-bottom: 8px;
}
.od-detail-ref .info-card.od-rate-card-wrap {
  height: 100%; max-height: 300px; min-height: 220px;
  display: flex; flex-direction: column;
  padding-bottom: 10px;
}
.od-detail-ref .info-card.od-rate-card-wrap .price-header { flex-shrink: 0; }
.od-detail-ref .info-card.od-rate-card-wrap #odRatePlanInlineArea {
  flex: 1; min-height: 0; overflow-y: auto;
}
.od-detail-ref .info-card .card-title {
  font-size: 13px; font-weight: 600; color: #1a2634;
  margin-bottom: 6px; padding-bottom: 4px;
  border-bottom: 1px solid #e8ecf1;
}
.od-detail-ref .info-row {
  display: flex; align-items: center;
  font-size: 13px; color: #1a2634;
  padding: 2px 0; min-height: 26px; gap: 6px;
}
.od-detail-ref .info-row .label { color: #475569; width: 68px; flex-shrink: 0; }
.od-detail-ref .info-row .value { color: #1a2634; flex: 1; min-width: 0; }
.od-detail-ref .info-row .value .highlight { color: #2d6cff; font-weight: 500; }
.od-detail-ref .info-row .save-btn {
  font-size: 12px; color: #2d6cff; background: transparent;
  border: 1px solid #ccd8ff; border-radius: 4px;
  padding: 0 10px; height: 22px; line-height: 20px;
  cursor: pointer; user-select: none;
}
.od-detail-ref .info-row .save-btn:hover { background: #2563eb; color: #fff; border-color: #2563eb; }
.od-detail-ref .info-row .copy-btn {
  font-size: 12px; color: #86909c; background: transparent;
  border: 1px solid #d9dde6; border-radius: 4px;
  padding: 0 8px; height: 22px; line-height: 20px;
  cursor: pointer; user-select: none;
}
.od-detail-ref .info-row .copy-btn:hover { background: #2563eb; color: #fff; border-color: #2563eb; }
.od-detail-ref .info-row.remark-row .value { display: flex; gap: 8px; align-items: flex-start; }
.od-detail-ref .info-row.remark-row .remark-text {
  background: #fff; border: 1px solid #e8ecf1; border-radius: 4px;
  padding: 8px 10px; flex: 1; min-height: 72px; min-width: 300px;
  color: #1a2634; font-size: 14px; line-height: 1.55;
}
.od-detail-ref .info-row input[type="text"] {
  height: 26px; border: 1px solid #d9dde6; border-radius: 4px;
  padding: 0 8px; font-size: 13px; color: #1a2634; background: #fff;
  outline: none; flex: 1; min-width: 0; max-width: 200px;
}
.od-detail-ref .info-row input[type="text"]:focus { border-color: #4d7cff; box-shadow: 0 0 0 2px rgba(77,124,255,.15); }

/* 入住人 */
.od-detail-ref .guest-list { margin-top: 2px; }
.od-detail-ref .guest-item {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 0; border-bottom: 1px solid #f0f2f5;
  font-size: 13px;
}
.od-detail-ref .guest-item:last-child { border-bottom: none; }
.od-detail-ref .guest-item .guest-name { font-weight: 500; }
.od-detail-ref .guest-item .guest-level {
  font-size: 12px; background: #fff3e6; color: #e67a2e;
  padding: 0 10px; border-radius: 12px;
}
.od-detail-ref .guest-item .guest-phone { color: #4e5a66; }
.od-detail-ref .guest-item .guest-id { color: #86909c; font-size: 12px; }
.od-detail-ref .guest-item .guest-actions { margin-left: auto; display: flex; gap: 6px; }
.od-detail-ref .guest-item .guest-actions span {
  font-size: 12px; color: #2d6cff; cursor: pointer;
  background: #f3f5f8; padding: 0 10px; border-radius: 4px;
  height: 22px; line-height: 22px; user-select: none;
}
.od-detail-ref .guest-item .guest-actions span.add { color: #fff; background: #2d6cff; }

/* 每日房价 */
.od-detail-ref .price-section { margin-top: 4px; }
.od-detail-ref .price-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
}
.od-detail-ref .price-header .title { font-size: 13px; font-weight: 500; color: #1a2634; }
.od-detail-ref .price-header .adjust-btn {
  font-size: 12px; color: #2d6cff; background: #e8edff;
  padding: 2px 14px; border-radius: 4px; cursor: pointer; user-select: none;
}
.od-detail-ref .price-grid { display: flex; gap: 6px; flex-wrap: wrap; }
.od-detail-ref .price-item {
  display: flex; align-items: center; gap: 8px;
  background: #f8f9fb; padding: 4px 14px 4px 12px;
  border-radius: 6px; font-size: 13px;
  border-left: 3px solid #2d6cff;
}
.od-detail-ref .price-item .day { color: #86909c; }
.od-detail-ref .price-item .amount { font-weight: 500; color: #1a2634; }
.od-detail-ref .price-item .audited {
  font-size: 11px; color: #00a854; background: #e6f7ed;
  padding: 0 8px; border-radius: 10px;
}
.od-detail-ref .price-item.special { border-left-color: #e67a2e; }
.od-detail-ref .price-item.special .amount { color: #e67a2e; }

/* 顶部/底部按钮 */
.form-actions.od-detail-footer { justify-content: flex-end; gap: 12px; border-bottom: 1px solid #e8ecf1; padding-bottom: 12px; margin-bottom: 12px; margin-top: 0; flex-shrink: 0; }
.form-actions.od-detail-footer .btn { padding: 6px 22px; border-radius: 6px; font-size: 13px; cursor: pointer; border: 1px solid transparent; font-weight: 500; }
.form-actions.od-detail-footer .od-btn-secondary { color: #4e5a66; background: #f3f5f8; border-color: #d9dde6; }
.form-actions.od-detail-footer .od-btn-primary { color: #fff; background: #2d6cff; padding: 8px 36px; font-size: 15px; }
.form-actions.od-detail-footer .od-btn-primary:hover { background: #2563eb; }
.form-actions.od-detail-footer .od-btn-secondary:hover { background: #2563eb; border-color: #2563eb; color: #fff; }

/* 订单详情 - 渠道下拉（带颜色标签） */
.od-detail-ref .od-channel-select-in-detail {
  height: 26px; padding: 0 22px 0 10px; font-size: 13px; border-radius: 4px;
  border: 1px solid transparent; background-color: #f3f4f6; color: #374151;
  appearance: none; -webkit-appearance: none; cursor: pointer; outline: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 6px center; background-size: 8px 8px;
}

/* 订单详情 - 备注 textarea 固定更大展示 */
.od-detail-ref .info-row.remark-row .remark-text {
  min-height: 72px; max-height: 160px; min-width: 300px; resize: vertical;
  padding: 8px 10px; font-size: 14px; line-height: 1.55;
  background: #fff; border: 1px solid #e8ecf1; border-radius: 4px;
  color: #1a2634; flex: 1; font-family: inherit;
  overflow-y: auto;
}
.od-detail-ref .info-row.remark-row .remark-text:focus { border-color: #4d7cff; box-shadow: 0 0 0 2px rgba(77,124,255,.15); outline: none; }

/* 订单详情 - 每日房价日历卡片 */
.od-detail-ref .od-rate-cal {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 8px;
}
.od-detail-ref .od-rate-cal-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  margin-bottom: 4px;
}
.od-detail-ref .od-rate-cal-dayname {
  text-align: center;
  font-size: 11px;
  font-weight: 500;
  color: #64748b;
}
.od-detail-ref .od-rate-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.od-detail-ref .od-rate-cal-cell {
  min-height: 46px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  padding: 3px 1px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  cursor: pointer;
  transition: all .15s;
  user-select: none;
}
.od-detail-ref .od-rate-cal-cell:hover {
  border-color: #2563eb;
  box-shadow: 0 1px 4px rgba(37,99,235,.10);
}
.od-detail-ref .od-rate-cal-cell.active {
  border-color: #2563eb;
  background: #eef2ff;
  box-shadow: 0 0 0 2px rgba(37,99,235,.12);
}
.od-detail-ref .od-rate-cal-cell.empty {
  background: transparent;
  border-color: transparent;
  cursor: default;
  pointer-events: none;
}
.od-detail-ref .od-rate-cal-cell.audited {
  background: #f1f5f9;
  opacity: .75;
  cursor: not-allowed;
}
.od-detail-ref .od-rate-cal-cell.audited .od-rate-cal-date,
.od-detail-ref .od-rate-cal-cell.audited .od-rate-cal-price { text-decoration: line-through; color: #94a3b8; }
.od-detail-ref .od-rate-cal-cell.modified { background: #fff7ed; border-color: #fed7aa; }
.od-detail-ref .od-rate-cal-cell.modified .od-rate-cal-date { color: #ea580c; }
.od-detail-ref .od-rate-cal-cell.modified .od-rate-cal-price { color: #ea580c; font-weight: 700; }
.od-detail-ref .od-rate-cal-date {
  font-size: 13px;
  font-weight: 700;
  color: #2563eb;
  line-height: 1.2;
}
.od-detail-ref .od-rate-cal-price {
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  line-height: 1.2;
}
.od-detail-ref .od-rate-cal-price .cal-cur { font-size: 9px; margin-right: 1px; }
.od-detail-ref .od-rate-cal-original {
  font-size: 9px;
  color: #94a3b8;
  text-decoration: line-through;
  line-height: 1;
}
.od-detail-ref .od-rate-cal-tags {
  display: flex;
  gap: 2px;
  align-items: center;
  justify-content: center;
  min-height: 12px;
}
.od-detail-ref .od-rate-cal-tags .cal-tag {
  font-size: 8px;
  line-height: 1;
  padding: 1px 3px;
  border-radius: 2px;
  font-weight: 600;
}
.od-detail-ref .od-rate-cal-tags .cal-tag.in { color: #16a34a; background: #dcfce7; }
.od-detail-ref .od-rate-cal-tags .cal-tag.out { color: #dc2626; background: #fee2e2; }
.od-detail-ref .od-rate-cal-tags .cal-tag.mod { color: #fff; background: #ea580c; }

.od-detail-ref .od-rate-edit-panel {
  margin-top: 10px;
  padding: 10px 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}
.od-detail-ref .od-rate-edit-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.od-detail-ref .od-rate-edit-date {
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  min-width: 90px;
}
.od-detail-ref .od-rate-edit-label {
  font-size: 13px;
  color: #64748b;
}
.od-detail-ref .od-rate-edit-input {
  width: 110px;
  padding: 5px 8px;
  border: 1px solid #d1d5db;
  border-radius: 5px;
  font-size: 14px;
  color: #1e293b;
  outline: none;
}
.od-detail-ref .od-rate-edit-input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.od-detail-ref .od-rate-edit-save,
.od-detail-ref .od-rate-edit-cancel {
  font-size: 13px;
  padding: 5px 12px;
  border-radius: 5px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all .15s;
}
.od-detail-ref .od-rate-edit-save { background: #2563eb; color: #fff; }
.od-detail-ref .od-rate-edit-save:hover { background: #1d4ed8; }
.od-detail-ref .od-rate-edit-cancel { background: #fff; color: #64748b; border-color: #d1d5db; }
.od-detail-ref .od-rate-edit-cancel:hover { background: #2563eb; border-color: #2563eb; color: #fff; }

.rp-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; margin-top: 12px; }
.rp-info-row { display: flex; gap: 8px; align-items: baseline; font-size: 14px; }
.rp-label { color: #6b7280; white-space: nowrap; min-width: 70px; }
.rp-value { color: #1f2937; }
.rp-empty-hint { text-align: center; padding: 24px 0; color: #9ca3af; font-size: 14px; }

/* ===== 入住详情分区 ===== */
.od-section {
  padding: 4px 0;
  margin-bottom: 5px;
}
#odRatePlanInlineArea {
  max-height: 260px;
  overflow-y: auto;
  align-content: start;
}
#odRatePlanInlineArea::-webkit-scrollbar {
  width: 6px;
}
#odRatePlanInlineArea::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 3px;
}
#odRatePlanInlineArea::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}
.od-section-header {
  display: flex; align-items: center; gap: 4px;
  font-weight: 600; font-size: 14px; color: #1f2937;
  margin-bottom: 6px; padding-bottom: 4px;
  border-bottom: 1px solid #f0f0f0;
}
.od-info-grid {
  display: grid; grid-template-columns: auto 1fr auto 1fr;
  gap: 4px 12px; font-size: 12.5px;
  align-items: center;
}
.od-info-grid > .od-field-label {
  color: #6b7280; font-size: 13px; line-height: 24px;
  text-align: right; white-space: nowrap; padding-right: 4px;
  justify-self: end;
}
.od-info-grid > .od-field-value {
  color: #1f2937; line-height: 24px;
  display: inline-flex; align-items: center; gap: 4px;
  min-height: 24px;
}
.od-field-value.highlight { color: var(--danger); font-weight: 700; }
.od-guest-card {
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 4px;
  padding: 5px 8px;
  background: var(--bg-subtle);
}
.od-guest-card.primary { background: #f0f4ff; border-color: #c7d7fe; }
.od-guest-card .od-guest-info {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1px 8px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-secondary);
}
.od-guest-card .od-guest-info .gi-label { color: #475569; white-space: nowrap; }
.od-guest-card .od-guest-info .gi-val { word-break: break-all; }
.od-guest-card .od-guest-info .gi-full { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: 1px 8px; }
.od-detail-two-col {
  display: grid; grid-template-columns: 1fr 320px;
  gap: 14px; align-items: start;
}
.od-channel-select {
  border: none;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  background: transparent;
  padding: 0 16px 0 2px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.6;
  appearance: none; -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 2px center;
  background-size: 8px 8px;
  transition: border-color .15s;
}
.od-channel-select:hover { border-bottom-color: var(--primary); }
.od-channel-select:focus { outline: none; border-bottom-color: var(--primary); }
.od-change-room-link {
  display: inline; color: var(--primary);
  font-size: 12px; cursor: pointer;
  margin-left: 4px; text-decoration: underline;
}
.od-change-room-link:hover { text-decoration: none; }

/* ===== 工具性 ===== */
.batch-hint { font-size: 13px; color: var(--text-muted); margin-top: 4px; }
.loading { display: flex; align-items: center; justify-content: center; padding: 60px; color: var(--text-muted); }
.spinner {
  width: 28px; height: 28px;
  border: 3px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ===== 房价计划 ===== */
.rate-plan-header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.rate-plan-title { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.rate-plan-total { font-size: 18px; font-weight: 700; color: var(--danger); }
.rate-plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 8px; overflow-x: auto; }
.rate-day-card {
  border: 1px solid var(--border); border-radius: 8px; padding: 10px 6px;
  text-align: center; background: var(--bg-card);
  transition: border-color .15s; position: relative;
}
.rate-day-card:hover { border-color: var(--primary); }
.rate-day-card.weekend { background: #fffbeb; border-color: #fde68a; }
.rate-day-card.weekend .rate-day-date { color: var(--warning); font-weight: 700; }
.rate-day-card.modified { border-color: var(--danger); background: var(--danger-bg); }
.rate-day-week { font-size: 12px; color: var(--text-muted); margin-bottom: 4px; }
.rate-day-date { font-size: 16px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
.rate-day-price { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.rate-day-price-input {
  width: 70px; padding: 3px 6px; border: 1px solid var(--primary);
  border-radius: 6px; font-size: 14px; font-weight: 700; text-align: center;
  color: var(--text-primary); outline: none; background: var(--bg-input);
}
.rate-day-price-input:focus { box-shadow: 0 0 0 2px rgba(37,99,235,.2); }
.rate-day-tag { display: inline-block; font-size: 12px; padding: 1px 6px; border-radius: 8px; margin-top: 3px; font-weight: 600; }
.rate-day-tag.changed { background: var(--danger-bg); color: var(--danger); }
.rate-day-tag.continue-changed { background: var(--warning-bg); color: var(--warning); }
.rate-day-base-price { font-size: 12px; color: var(--text-muted); margin-top: 2px; text-decoration: line-through; }
.rate-secret-label { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; color: var(--text-secondary); cursor: pointer; }

/* ===== 房态卡片新元素 ===== */
.rg-room-card { position: relative; }
/* ===== 房态卡片角标（底部独立行，文字标签） ===== */
.rg-card-badges {
  position: absolute; left: 4px; bottom: 3px;
  display: flex; flex-wrap: wrap; gap: 2px;
  align-items: center;
}
.rg-badge {
  display: inline-block; font-size: 9px; font-weight: 600;
  padding: 0 3px; border-radius: 2px; letter-spacing: .1px;
  line-height: 1.4; white-space: nowrap;
}
.rg-badge-channel { color: #fff; background: rgba(0,0,0,.18); }
.rg-badge-leave { color: #ef4444; background: #fef2f2; border: 1px solid #fecaca; }
.rg-badge-extend { color: #d97706; background: #fffbeb; border: 1px solid #fde68a; }
.rg-badge-debt { color: #dc2626; background: #fee2e2; border: 1px solid #fca5a5; font-weight: 800; }
.rg-badge-free { color: #059669; background: #ecfdf5; border: 1px solid #a7f3d0; }

/* 备注标签（右上角，矩形，淡红色，同渠道标签风格） */
.rg-remark-badge {
  position: absolute; top: 3px; right: 3px;
  display: inline-block;
  font-size: 9px; font-weight: 600;
  color: #991b1b; background: #fecaca; border-radius: 2px;
  padding: 0 4px; line-height: 1.5; white-space: nowrap;
  cursor: default; z-index: 10;
}
/* 备注悬浮 tooltip（JS 驱动，挂 body 下避免 overflow 裁切） */
#rg-remark-tooltip {
  position: fixed; z-index: 99999;
  background: #1f2937; color: #fff;
  font-size: 12px; font-weight: 400;
  padding: 6px 10px; border-radius: 5px;
  max-width: 260px; white-space: normal; word-break: break-all;
  box-shadow: 0 4px 16px rgba(0,0,0,.22);
  pointer-events: none; opacity: 0;
  transition: opacity .12s;
}
#rg-remark-tooltip.show { opacity: 1; }

/* 铃铛图标 */
.rg-card-bell, .rg-card-bell-add {
  display: inline-block; font-size: 14px; margin-left: 4px; cursor: pointer; vertical-align: middle;
}
.rg-card-bell:hover, .rg-card-bell-add:hover { transform: scale(1.3); }
.rg-card-bell-add { opacity: .35; }
.rg-card-bell-add:hover { opacity: 1; }

/* .rg-card-flag 动画已关闭，标签常亮 */
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }

/* ===== 远期房态表格 ===== */
.forecast-table th, .forecast-table td { white-space: nowrap; }

/* 远期房态滚动容器：预留滚动条空间，避免原生横向滚动条遮挡顶部"今天"列头与右侧营收数据 */
.forecast-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 12px;
  scrollbar-gutter: stable;
}
.forecast-scroll::-webkit-scrollbar { height: 10px; }
.forecast-scroll::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 4px; }
.forecast-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
.forecast-scroll::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.fc-table th, .fc-table td { border-color: var(--border); color: var(--text-primary); }
.fc-table thead tr { background: var(--bg-base); }
.fc-table tbody tr:hover td { background: var(--primary-50) !important; }
.fc-table tbody tr:nth-child(even) td { background: var(--bg-base); }

/* ===== 提醒面板 ===== */
.reminder-item {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  background: var(--bg-base); border-radius: 8px;
  border-left: 3px solid var(--text-muted); margin-bottom: 6px; border: 1px solid var(--border);
}
.reminder-item.high { border-left-color: var(--warning); }
.reminder-item.urgent { border-left-color: var(--danger); }

/* ===== 日历选择器 ===== */
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendar-day {
  padding: 10px; text-align: center; border-radius: 8px;
  background: var(--bg-card); color: var(--text-primary); cursor: pointer;
  font-weight: 600; border: 1px solid transparent; transition: all .15s;
}
.calendar-day:hover:not(.disabled) { background: var(--primary-50); border-color: var(--primary-200); }
.calendar-day.disabled { color: var(--text-muted); cursor: not-allowed; background: var(--bg-base); }
.calendar-day.weekend { background: #fffbeb; }
.calendar-day.today { border-color: var(--primary); }
.calendar-day.selected { background: var(--primary); color: #fff; border-color: var(--primary); }
.rp-btn-extend-calendar { background: var(--bg-card); border: 1px solid var(--warning); color: var(--warning); }

/* ===== 操作日志 ===== */
.rp-log-item { padding: 10px 12px; margin-bottom: 8px; background: var(--bg-base); border-radius: 8px; border-left: 3px solid var(--primary-200); }
.rp-log-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.rp-log-action { font-weight: 600; font-size: 14px; color: var(--text-primary); }
.rp-log-time { font-size: 12px; color: var(--text-muted); }
.rp-log-operator { font-size: 13px; color: var(--text-secondary); margin-bottom: 4px; }
.rp-log-details { font-size: 12px; color: var(--text-muted); margin-top: 4px; line-height: 1.5; }

/* ===== 设置模块卡片 ===== */
.settings-module-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 16px 20px;
  cursor: pointer; transition: all .2s;
}
.settings-module-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

/* ===== 设置浏览方式切换按钮 ===== */
.view-toggle {
  display: inline-flex; align-items: center;
  background: var(--gray-100); border-radius: 6px;
  padding: 2px; gap: 1px;
}
.vt-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 26px; border: none; background: transparent;
  font-size: 15px; cursor: pointer; border-radius: 4px;
  color: var(--gray-500); transition: all .15s; line-height: 1;
}
.vt-btn:hover { color: var(--gray-700); }
.vt-btn.active { background: #fff; color: var(--primary); box-shadow: 0 1px 3px rgba(0,0,0,.12); font-weight: 700; }

/* ===== 铃铛抖动 ===== */
@keyframes bellShake {
  0%, 100% { transform: rotate(0); }
  20% { transform: rotate(15deg); }
  40% { transform: rotate(-12deg); }
  60% { transform: rotate(8deg); }
  80% { transform: rotate(-4deg); }
}
.rg-card-bell.has-reminder { animation: bellShake 1.2s ease-in-out infinite; color: #fca5a5; }

/* ===== 房态卡片状态文字 ===== */
.rg-card-status-text.is-vacant { color: rgba(255,255,255,.9); }
.rg-card-status-text.is-stay   { color: rgba(255,255,255,.9); }
.rg-card-status-text.is-leave  { color: rgba(255,255,255,.9); }
.rg-card-status-text.is-clean  { color: rgba(255,255,255,.9); }
.rg-card-status-text.is-dirty  { color: rgba(255,255,255,.9); }
.rg-card-status-text.is-oos    { color: rgba(255,255,255,.9); }

/* ===== 提醒优先级 ===== */
.reminder-prio-badge { display: inline-block; padding: 1px 6px; border-radius: 8px; font-size: 10px; font-weight: 700; }
.reminder-prio-badge.normal  { background: var(--bg-base); color: var(--text-secondary); border: 1px solid var(--border); }
.reminder-prio-badge.high    { background: var(--warning-bg); color: var(--warning); }
.reminder-prio-badge.urgent  { background: var(--danger-bg); color: var(--danger); }
.reminder-list-item { padding: 10px 12px; margin-bottom: 8px; background: var(--bg-base); border-radius: 8px; border-left: 3px solid var(--text-muted); display: flex; justify-content: space-between; align-items: center; gap: 8px; border: 1px solid var(--border); }
.reminder-list-item.high   { border-left-color: var(--warning); }
.reminder-list-item.urgent { border-left-color: var(--danger); animation: pulseBg 1.6s ease-in-out infinite; }
@keyframes pulseBg { 0%, 100% { background: var(--bg-base); } 50% { background: var(--danger-bg); } }

/* ===== 日历标题/导航 ===== */
.calendar-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; padding: 0 4px; }
.calendar-title { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.calendar-nav { display: flex; gap: 4px; }
.calendar-nav button {
  width: 32px; height: 32px; border-radius: var(--radius);
  border: 1px solid var(--border); background: var(--bg-card); color: var(--text-secondary);
  cursor: pointer; font-size: 16px; line-height: 1;
}
.calendar-nav button:hover { border-color: var(--primary); color: var(--primary); }
.calendar-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 4px; text-align: center; font-size: 12px; font-weight: 600; color: var(--text-muted); }
.calendar-weekdays div { padding: 4px 0; }
.calendar-summary {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px; padding: 10px 12px;
  background: var(--primary-50); border: 1px dashed var(--primary-200);
  border-radius: 8px; font-size: 14px; color: var(--text-primary);
}
.calendar-summary .nights { font-weight: 700; color: var(--primary); font-size: 15px; }

/* ===== 账单类型彩色标签 ===== */
.bill-type-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; }
.bill-type-tag-room_fee      { background: #16a34a; }
.bill-type-tag-night_audit   { background: #059669; }
.bill-type-tag-food          { background: #ea580c; }
.bill-type-tag-laundry       { background: #0891b2; }
.bill-type-tag-minibar       { background: #7c3aed; }
.bill-type-tag-deposit       { background: #0284c7; }
.bill-type-tag-extra_fee     { background: #db2777; }
.bill-type-tag-other         { background: #6b7280; }
.bill-type-tag-channel_prepay{ background: #7c3aed; }
.bill-type-tag-refund        { background: #f43f5e; }
.bill-type-tag-payment       { background: #475569; }

/* ===== 订单状态筛选标签页 ===== */
.order-status-tab {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 5px 14px; border-radius: 0; cursor: pointer;
  font-size: 14px; font-weight: 500; color: var(--text-secondary);
  background: transparent; border: none;
  border-bottom: 2px solid transparent; transition: all .15s; user-select: none; white-space: nowrap;
}
.order-status-tab:hover {
  color: var(--primary);
}
.order-status-tab.active {
  color: var(--primary); font-weight: 600;
  border-bottom-color: var(--primary); background: transparent; box-shadow: none;
}

/* ===== 订单搜索栏（紧凑内联布局）===== */
.os-search-bar {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  padding: 8px 10px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 4px;
}
.os-inline-field {
  display: inline-flex; align-items: center; gap: 4px; font-size: 13px;
}
.os-inline-field b { color: #6b7280; font-weight: 500; white-space: nowrap; font-size: 12px; }
.os-inline-field input {
  height: 28px; padding: 0 6px; font-size: 13px; border: 1px solid #d1d5db; border-radius: 3px;
  outline: none; width: 90px; background: #fff; transition: border-color .15s;
}
.os-inline-field input:focus { border-color: var(--primary); }
.os-inline-field input[type="date"] { width: 110px; }
.os-divider { width: 1px; height: 18px; background: #d1d5db; flex-shrink: 0; }
.os-search-bar select {
  height: 28px; font-size: 13px; border: 1px solid #d1d5db; border-radius: 3px;
  background: #fff; padding: 0 6px; min-width: 80px;
}
.os-search-btn { font-weight: 600 !important; }

.os-quick-dates { display: flex; gap: 2px; }

/* 旧样式保留兼容 */
.os-field { display:flex; flex-direction:column; gap:2px; }
.os-field-label { font-size:12px; color:var(--text-muted); font-weight:500; }

/* ===== 订单状态彩色标签 ===== */
.order-status-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; }
.order-status-booked             { background: #2563eb; }
.order-status-checked_in         { background: #16a34a; }
.order-status-checked_out        { background: #6b7280; }
.order-status-checked_out_unsettled { background: #d97706; }
.order-status-cancelled          { background: #dc2626; }
.order-status-noshow             { background: #9ca3af; }

/* ===== 设置页面 ===== */
.settings-section {
  background: var(--bg-card); border-radius: var(--radius-lg); padding: 18px 20px;
  margin-bottom: 14px; border: 1px solid var(--border);
}
.settings-section h3 { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.settings-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-top: 1px dashed var(--border); }
.settings-row:first-of-type { border-top: none; }
.settings-row .label { color: var(--text-primary); font-size: 14px; }
.settings-row .hint  { color: var(--text-muted); font-size: 13px; margin-top: 2px; }
.settings-row input[type=time],
.settings-row input[type=number],
.settings-row select {
  padding: 6px 10px; border: 1px solid var(--border); border-radius: var(--radius); font-size: 14px;
  background: var(--bg-input); color: var(--text-primary);
}
.settings-row .switch {
  position: relative; width: 44px; height: 24px;
  background: var(--border); border: 1px solid var(--border);
  border-radius: 12px; cursor: pointer; transition: background .2s;
}
.settings-row .switch::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 18px; height: 18px; background: #fff; border-radius: 50%;
  transition: left .2s; box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.settings-row .switch.on { background: var(--primary); border-color: var(--primary); }
.settings-row .switch.on::after { left: 22px; }

/* ===== 设置模块卡片网格 ===== */
.settings-module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.settings-module-card {
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 10px;
  padding: 18px 20px;
  cursor: pointer;
  transition: all .15s;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.settings-module-card:hover {
  border-color: var(--primary);
  box-shadow: 0 4px 12px rgba(37,99,235,.12);
  transform: translateY(-1px);
}
.settings-module-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
.settings-module-icon {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}
.settings-module-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-primary);
}
.settings-module-desc {
  color: var(--text-muted);
  font-size: 14px;
  line-height: 1.6;
}
.settings-module-action {
  margin-top: 12px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 600;
}

/* ===== 小商品页面 ===== */
.ms-cat-tabs { display:flex;gap:4px;flex-wrap:wrap }
.ms-cat-btn {
  padding:5px 12px;border:none;border-bottom:2px solid transparent;
  background:transparent;font-size:13px;color:var(--text-secondary);cursor:pointer;transition:all .15s
}
.ms-cat-btn:hover { color:var(--text-primary) }
.ms-cat-btn.active { color:var(--primary);border-bottom-color:var(--primary);font-weight:600 }

.ms-product-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px }
.ms-product-card {
  background:var(--bg-card);border:1px solid var(--border);border-radius:6px;
  padding:8px 10px;cursor:default;
}
.ms-product-card:hover { border-color:#cbd5e1 }
.ms-product-card.ms-product-selected { border-color:var(--primary);background:#fafbfc; }
.ms-p-name { font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.ms-p-meta { display:flex;align-items:center;gap:4px;margin-bottom:6px;flex-wrap:wrap }
.ms-p-cat { font-size:10px;color:var(--gray-500);font-weight:500 }
.ms-p-price { font-size:14px;font-weight:600;color:#b91c1c;cursor:pointer;transition:color .15s }
.ms-p-price:hover { color:#991b1b;text-decoration:underline }
.ms-p-unit { font-size:10px;color:var(--gray-400) }
.ms-p-actions { display:flex;align-items:center;justify-content:center;gap:4px }
.ms-p-minus,.ms-p-plus {
  width:24px;height:24px;border:1px solid #d1d5db;border-radius:4px;
  background:#fff;font-size:14px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;line-height:1;color:var(--text-secondary)
}
.ms-p-minus:hover,.ms-p-plus:hover { border-color:var(--gray-400);background:#f8fafc }
.ms-p-minus:disabled { opacity:.35;cursor:not-allowed; }
.ms-p-qty { font-size:14px;font-weight:600;color:var(--text-primary);min-width:18px;text-align:center }

.ms-p-stock {
  font-size:10px;color:var(--gray-400);font-weight:500
}
.ms-p-delete {
  width:18px;height:18px;border:none;border-radius:50%;
  background:#fef2f2;color:#dc2626;font-size:12px;display:flex;
  align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  transition:all .15s;line-height:1;opacity:.5
}
.ms-p-delete:hover { background:#fee2e2;opacity:1 }

/* 商品管理按钮 */
.ms-p-edit-btn, .ms-p-delete-btn {
  width:26px;height:26px;border:1px solid var(--border);border-radius:6px;
  background:var(--bg-card);font-size:13px;display:inline-flex;
  align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  transition:all .15s;line-height:1;color:var(--text-secondary)
}
.ms-p-edit-btn:hover { border-color:var(--primary);color:var(--primary);background:var(--primary-50) }
.ms-p-delete-btn:hover { border-color:var(--danger);color:var(--danger);background:var(--danger-bg) }

.ms-cart-badge {
  padding:3px 10px;background:#f1f5f9;color:var(--text-secondary);
  border:1px solid #e2e8f0;border-radius:4px;font-size:12px;font-weight:600
}
.ms-search { margin-bottom:12px }
.ms-revenue-bar {
  display:flex;align-items:center;gap:12px;padding:6px 12px;
  background:#f8fafc;
  border:1px solid #e5e7eb;border-radius:4px;
  margin-bottom:10px;font-size:13px
}

/* ===== 通知徽章 ===== */
.notify-badge {
  background:var(--danger);color:#fff;font-size:10.5px;font-weight:700;
  min-width:17px;height:17px;border-radius:9px;display:inline-flex;
  align-items:center;justify-content:center;padding:0 4px;
  margin-left:auto;line-height:1;
}
.nav-item { position: relative; }

/* ===== 消息通知中心面板 ===== */
.nc-overlay {
  position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);
  z-index:9997;animation:ncFadeIn .2s ease
}
@keyframes ncFadeIn{from{opacity:0}to{opacity:1}}
.nc-panel {
  position:fixed;top:0;right:0;width:360px;height:100vh;
  background:#fff;z-index:9998;
  box-shadow:-4px 0 20px rgba(0,0,0,.1);
  display:flex;flex-direction:column;animation:ncSlideIn .25s ease;
  border-left: 1px solid var(--border);
}
@keyframes ncSlideIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
.nc-header {
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-bottom:1px solid var(--border);
  background:#fff;
}
.nc-header h3 { font-size:15px;font-weight:700;color:var(--text-primary);margin:0 }
.nc-header-actions { display:flex;align-items:center;gap:10px;font-size:13px }
.nc-header-actions .nc-read-all {
  color:var(--primary);cursor:pointer;font-weight:500;background:none;
  border:none;padding:3px 0;transition:color .15s
}
.nc-header-actions .nc-read-all:hover { color:var(--primary-dark) }
.nc-close-btn {
  width:24px;height:24px;border-radius:50%;border:1px solid var(--border);
  background:var(--bg-base);display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:13px;color:var(--text-muted);transition:all .15s
}
.nc-close-btn:hover { border-color:var(--danger);color:var(--danger);background:var(--danger-bg) }

.nc-list { flex:1;overflow-y:auto;padding:8px 0 }
.nc-empty {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;color:var(--text-muted);gap:6px;padding:30px 16px
}
.nc-empty svg { opacity:.3;width:40px;height:40px }
.nc-empty span { font-size:14px }

.nc-item {
  margin:0 10px 8px;padding:10px 12px;border-radius:var(--radius);
  border:1px solid var(--border);background:var(--bg-card);transition:all .15s;
  cursor:pointer;position:relative
}
.nc-item:hover { border-color:var(--border-hover);box-shadow:var(--shadow-sm) }
.nc-item.unread { background:var(--warning-bg);border-color:#fde68a }
.nc-item.unread::before {
  content:'';position:absolute;left:10px;top:13px;
  width:6px;height:6px;border-radius:50%;background:var(--danger);
}
.nc-item-title {
  font-size:12.5px;font-weight:600;color:var(--text-primary);
  margin-bottom:6px;padding-left:12px;display:flex;align-items:center;gap:5px
}
.nc-item-dot-label { width:6px;height:6px;border-radius:50%;flex-shrink:0 }
.nc-item-dot-label.dot-red { background:var(--danger) }
.nc-item-dot-label.dot-green { background:var(--success) }
.nc-item-dot-label.dot-gray { background:#6b7280 }
.nc-item-card {
  background:var(--bg-base);border:1px solid var(--border);border-radius:6px;
  padding:8px 10px;margin-left:16px;font-size:13px;line-height:1.65;color:var(--text-primary)
}
.nc-item-card .nc-field { display:flex }
.nc-item-card .nc-label { color:var(--text-muted);min-width:70px;flex-shrink:0 }
.nc-item-card .nc-value { font-weight:500;color:var(--text-primary) }
.nc-item-card .nc-value.red { color:var(--danger) }
.nc-item-card .nc-value.green { color:var(--success) }
.nc-item-footer {
  display:flex;align-items:center;justify-content:space-between;
  margin-top:6px;padding-left:16px;font-size:12px;color:var(--text-muted)
}
.nc-item-time { font-family:monospace }
.nc-item-actions { display:flex;gap:6px }
.nc-item-actions button {
  background:none;border:none;cursor:pointer;font-size:11.5px;
  font-weight:500;padding:2px 0;color:var(--primary);transition:color .15s
}
.nc-item-actions button:hover { color:var(--primary-dark);text-decoration:underline }
.nc-item-actions button.btn-del { color:var(--text-muted) }
.nc-item-actions button.btn-del:hover { color:var(--danger) }

/* ===== 自定义确认对话框（统一UI风格）===== */
.confirm-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.25); z-index: 300;
  display: none;
}
.confirm-overlay.open { display: block; }
.confirm-dialog {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%);
  background: #fff; border-radius: 6px;
  box-shadow: 0 8px 30px rgba(0,0,0,.15), 0 0 0 1px rgba(0,0,0,.08);
  z-index: 301; width: 380px; max-width: 92vw;
  display: none; flex-direction: column; overflow: hidden;
}
.confirm-dialog.open { display: flex; }
.confirm-body {
  padding: 18px 20px 14px; color: var(--text-primary);
  font-size: 14px; line-height: 1.6;
}
.confirm-body .confirm-title {
  font-size: 14px; font-weight: 600; margin-bottom: 8px; color: var(--text-primary);
}
.confirm-body .confirm-detail {
  font-size: 14px; color: var(--text-secondary); margin-top: 6px; line-height: 1.5;
}
.confirm-footer {
  display: flex; justify-content: flex-end; gap: 8px;
  padding: 12px 20px 16px;
  border-top: 1px solid var(--border);
}
.confirm-footer .btn { padding: 7px 18px; font-size: 14px; }

/* 右下角通知 */
.order-notify-area .order-notify {
  pointer-events: auto; cursor: default;
  border-radius: 10px !important; overflow: hidden;
  box-shadow: var(--shadow-lg) !important;
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
}
.order-notify-area .order-notify .on-title { color: var(--text-primary) !important; }
.order-notify-area .order-notify .on-body { color: var(--text-secondary) !important; }

/* ===== 钟点房到期提醒 ===== */
.hourly-remind-area {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none;
  max-height: 80vh;
  overflow-y: auto;
}

.hourly-remind-card {
  pointer-events: auto;
  width: 340px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
  border: 1px solid var(--border);
  overflow: hidden;
  animation: hrSlideIn .4s ease-out;
}

@keyframes hrSlideIn {
  from { transform: translateX(120%); opacity: 0; }
  to   { transform: translateX(0);     opacity: 1; }
}

.hr-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.hr-card-header .hr-icon {
  font-size: 18px;
}

.hr-card-header .hr-title {
  font-size: 14px;
  font-weight: 700;
  color: #92400e;
  flex: 1;
  margin-left: 8px;
}

.hr-card-header .hr-close {
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  color: #92400e;
  opacity: .6;
  padding: 0 4px;
}
.hr-card-header .hr-close:hover { opacity: 1; }

.hr-card-body {
  padding: 14px 16px;
}

.hr-room {
  font-size: 22px;
  font-weight: 800;
  color: var(--primary);
}

.hr-guest {
  font-size: 14px;
  color: var(--text-primary);
  margin-top: 4px;
}

.hr-time {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: 6px;
}

.hr-card-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--border);
  background: var(--bg-card);
}

.hr-card-footer .btn { padding: 6px 14px; font-size: 13px; }

/* ===== 壁纸模式 — 容器半透明显示全局背景 ===== */
body.has-wallpaper .sidebar {
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
body.has-wallpaper .main {
  background: rgba(245,247,250,0.55);
}
body.has-wallpaper .topbar {
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
body.has-wallpaper .card,
body.has-wallpaper .modal-content,
body.has-wallpaper .modal-header,
body.has-wallpaper .modal-body,
body.has-wallpaper .modal-footer {
  background: rgba(255,255,255,0.88);
}
body.has-wallpaper .page-btn {
  background: rgba(255,255,255,0.75);
}
body.has-wallpaper .page-btn:hover {
  background: rgba(255,255,255,0.9);
}
body.has-wallpaper thead tr {
  background: rgba(245,247,250,0.7);
}
body.has-wallpaper tbody tr:hover td {
  background: rgba(239,246,255,0.6);
}
body.has-wallpaper .rg-tag {
  /* 保持状态底色，仅微调透明度 */
  opacity: 0.92;
}
body.has-wallpaper .form-input,
body.has-wallpaper .form-select,
body.has-wallpaper .form-textarea {
  background: rgba(248,250,252,0.75);
}
body.has-wallpaper .table-wrap {
  background: rgba(255,255,255,0.82);
}
body.has-wallpaper .btn-ghost {
  background: rgba(255,255,255,0.6);
}
body.has-wallpaper .btn-ghost:hover {
  background: #2563eb; border-color: #2563eb; color: #fff;
}

/* ===== 设置主枢纽页 ===== */
.settings-hub { padding: 0 0 16px; }
.settings-hub-group { margin-bottom: 14px; }
.settings-hub-group-title {
  font-size: 13px; font-weight: 600; color: var(--text-secondary, #64748b);
  margin: 0 0 6px 2px; letter-spacing: .5px;
}
.settings-hub-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
.settings-hub-card {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; background: var(--bg-card, #fff);
  border: 1px solid var(--border, #e5e7eb); border-radius: 8px;
  cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .05s;
  min-height: 58px;
}
.settings-hub-card:hover {
  border-color: #cbd5e1; box-shadow: 0 2px 8px rgba(15,23,42,.06);
}
.settings-hub-card:active { transform: translateY(1px); }
.settings-hub-card-body { min-width: 0; flex: 1; }
.settings-hub-card-title {
  font-size: 13px; font-weight: 600; color: var(--text-primary, #0f172a); margin-bottom: 2px;
}
.settings-hub-card-desc {
  font-size: 11px; color: var(--text-muted, #94a3b8); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.settings-hub-card-arrow {
  flex-shrink: 0; font-size: 18px; line-height: 1; color: #cbd5e1; margin-left: 6px;
}
@media (max-width: 1100px) {
  .settings-hub-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 820px) {
  .settings-hub-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .settings-hub-grid { grid-template-columns: 1fr; }
}