/* Order UI shares the shell snow backdrop and theme tokens with the dashboard. */
.admin-theme .module-main > .orders-page { padding: 0; border: 0; background: transparent; box-shadow: none; max-width: 1920px; margin: 0 auto; }
.orders-page .payment-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.orders-page .payment-heading > div:first-child { min-width: 0; flex: 1; }
.admin-theme .orders-page .payment-heading h2 { margin: 0 0 6px; color: #152d57; }
.orders-page .payment-heading p { margin: 0; font-size: 12px; line-height: 1.7; color: #61799f; }
.order-heading-tools { display: flex; gap: 8px; flex-shrink: 0; align-items: center; }
.orders-page .el-button { height: 36px; border-radius: 8px; font-size: 12px; gap: 4px; }
.orders-page .el-button + .el-button { margin-left: 0; }
.orders-page .el-button:not(.is-link):not(.el-button--primary):not(.el-button--danger) { background: rgb(255 255 255 / 72%); border-color: #d7e4f9; color: #355581; }
.orders-page .el-button:not(.is-link):hover { background-color: #eaf3ff; border-color: #a9caff; }
.orders-page .el-button--primary:not(.is-link) { background: linear-gradient(135deg, #428cff, #1667f5); border-color: transparent; color: white; }
.orders-page .el-button .el-icon { margin-right: 4px; }
.order-stats { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; margin-bottom: 16px; }
.order-stat-card { display: flex; align-items: center; gap: 14px; position: relative; min-width: 0; min-height: 112px; padding: 18px; box-sizing: border-box; border-radius: 16px; border: 1px solid rgb(255 255 255 / 76%); background: rgb(255 255 255 / 68%); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); box-shadow: var(--admin-shadow); overflow: hidden; transition: transform 180ms, box-shadow 180ms; }
.order-stat-card:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgb(45 85 150 / 12%); }
.order-stat-card .metric-icon { width: 44px; height: 44px; font-size: 24px; }
.order-stat-content { min-width: 0; flex: 1; }
.order-stat-label { display: block; font-size: 13px; color: #46618a; margin-bottom: 6px; }
.order-stat-value { display: block; font-size: 28px; font-weight: 700; line-height: 1.25; color: #142b55; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.order-stat-skeleton { width: 80%; height: 32px; }
.order-panel { min-width: 0; padding: 16px 18px; border-radius: 16px; background: rgb(255 255 255 / 72%); border: 1px solid rgb(255 255 255 / 78%); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: var(--admin-shadow); }
.admin-theme .orders-page .el-tabs__header { margin: 0 0 16px; }
.orders-page .el-tabs__item { height: 36px; font-size: 14px; }
.orders-page .el-tabs__item.is-active { font-weight: 600; }
.order-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; margin-bottom: 12px; border-radius: 10px; background: rgb(240 247 255 / 72%); border: 1px solid rgb(221 233 252 / 70%); }
.orders-page .order-select { width: 126px; flex: 1 1 112px; min-width: 0; }
.orders-page .order-keyword { width: 210px; flex: 1.6 1 180px; min-width: 0; }
.orders-page .el-input__wrapper, .orders-page .el-select__wrapper { min-height: 36px; box-sizing: border-box; background: rgb(255 255 255 / 80%); border-radius: 8px; font-size: 12px; }
.order-events { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 12px 16px; margin-bottom: 14px; border-radius: 10px; background: rgb(219 231 248 / 46%); font-size: 12px; color: #49638a; }
.order-events > span { display: inline-flex; align-items: center; gap: 7px; }
.order-events .el-icon { color: var(--metric-color); font-size: 18px; }
.order-events strong { color: var(--metric-color); font-weight: 600; font-variant-numeric: tabular-nums; }
.order-events .tone-red { --metric-color: #e05268; }
.order-table-wrap { min-width: 0; overflow-x: auto; border-radius: 10px; }
.admin-theme .orders-page .el-table { width: 100%; --el-table-header-bg-color: rgb(226 237 255 / 65%); --el-table-tr-bg-color: rgb(255 255 255 / 64%); --el-table-row-hover-bg-color: #eaf3ff; --el-table-text-color: #405c88; --el-table-header-text-color: #24436f; font-size: 12px; }
.admin-theme .orders-page .el-table th.el-table__cell { padding: 8px 0; height: 42px; background: rgb(226 237 255 / 65%); }
.admin-theme .orders-page .el-table td.el-table__cell { padding: 5px 0; height: 44px; }
.orders-page .el-table .cell { padding: 0 10px; line-height: 1.5; white-space: nowrap; }
.orders-page .order-number .cell { font-family: Consolas, monospace; font-size: 12px; }
.orders-page .order-mac .cell { font-variant-numeric: tabular-nums; }
.orders-page .el-tag { border: 0; border-radius: 4px; font-size: 11px; padding: 0 7px; }
.orders-page .el-table .el-button.is-link { height: auto; font-size: 12px; }
.orders-page .el-dropdown { margin-left: 12px; vertical-align: middle; }
.order-pagination { display: flex; justify-content: flex-end; min-width: 0; margin-top: 12px; }
.admin-theme .orders-page .el-pagination { padding-top: 4px; font-size: 12px; flex-wrap: wrap; gap: 6px; }
.order-empty-action { text-align: center; padding-top: 8px; }
.order-error { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.order-error .el-alert { flex: 1; }
@media (max-width: 1600px) {
  .order-stat-card { padding: 16px 12px; gap: 10px; }
  .order-stat-card .metric-icon { width: 36px; height: 36px; font-size: 21px; }
  .order-stat-value { font-size: 26px; }
  .orders-page .order-select { flex-basis: 106px; }
  .order-filters { gap: 8px; padding: 10px; }
  .orders-page .el-button:not(.is-link) { padding: 8px 12px; }
}
@media (max-width: 1400px) { .orders-page .order-keyword { flex-basis: 210px; } }
@media (max-width: 1150px) {
  .order-stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .orders-page .payment-heading { flex-wrap: wrap; }
  .order-panel { padding: 14px; }
}
@media (max-width: 680px) {
  .order-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .order-stat-card { min-height: 104px; }
  .order-stat-value { font-size: 24px; }
  .order-heading-tools { flex-wrap: wrap; max-width: 100%; }
  .order-pagination { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .order-stat-card { transition: none; } .order-stat-card:hover { transform: none; } }
/* Sticky action cells must mask columns scrolling behind them. */
.admin-theme .orders-page .el-table td.el-table-fixed-column--right { background: #f7faff; }
.admin-theme .orders-page .el-table th.el-table-fixed-column--right { background: #eaf2ff; }
.admin-theme .orders-page .el-table tr:hover > td.el-table-fixed-column--right { background: #eaf3ff; }
.orders-page .order-heading-tools .el-date-editor { width: 270px; flex: 0 1 270px; --el-date-editor-width: 270px; height: 36px; }
.orders-page .order-heading-tools .el-range-input { font-size: 12px; }

/* The full ten-row page shares spare viewport height; other pages keep compact rows. */
.admin-theme .module-main > .orders-page { height: 100%; display: flex; flex-direction: column; }
.orders-page > .payment-heading, .orders-page > .order-stats { flex-shrink: 0; }
.orders-page .order-panel { flex: 1; display: flex; flex-direction: column; }
.orders-page .order-panel > :not(.order-table-wrap) { flex-shrink: 0; }
.orders-page .order-table-wrap { flex: 1; }
.orders-page .order-fill-rows { container-type: size; min-height: 484px; }
.orders-page .order-fill-rows .el-table__body { height: max(440px, calc(100cqh - 44px)); }