/* Admin-only dark color completion. No layout rules belong here. */
:root[data-theme="dark"] .app-shell {
  color-scheme: dark;
  --night-canvas: #0c1117;
  --night-surface: #131a22;
  --night-alt: #18212b;
  --night-stripe: #1b2632;
  --night-hover: #223244;
  --night-line: #2a3746;
  --night-line-strong: #3a4b5e;
  --night-text: #edf3f8;
  --night-muted: #a6b5c5;
  --night-faint: #77889a;
  --night-accent: #66c4f7;
  --el-bg-color: var(--night-surface);
  --el-bg-color-page: var(--night-canvas);
  --el-bg-color-overlay: var(--night-alt);
  --el-fill-color: #1c2733;
  --el-fill-color-light: #202c39;
  --el-fill-color-lighter: var(--night-stripe);
  --el-fill-color-extra-light: var(--night-stripe);
  --el-fill-color-dark: #0f151c;
  --el-fill-color-darker: #0a0f14;
  --el-fill-color-blank: var(--night-surface);
  --el-text-color-primary: var(--night-text);
  --el-text-color-regular: #c8d3df;
  --el-text-color-secondary: var(--night-muted);
  --el-text-color-placeholder: var(--night-faint);
  --el-text-color-disabled: #667789;
  --el-border-color: var(--night-line);
  --el-border-color-light: #303e4e;
  --el-border-color-lighter: #273442;
  --el-border-color-extra-light: #222d39;
  --el-border-color-dark: var(--night-line-strong);
  --el-border-color-darker: #4a5d71;
  --el-mask-color: rgba(2, 6, 10, .72);
  --el-mask-color-extra-light: rgba(2, 6, 10, .42);
}

:root[data-theme="dark"] body:has(.app-shell),
:root[data-theme="dark"] body:has(.app-shell) #app,
:root[data-theme="dark"] .app-shell,
:root[data-theme="dark"] .app-shell .app-body,
:root[data-theme="dark"] .app-shell .admin-main,
:root[data-theme="dark"] .app-shell .admin-content {
  background-color: var(--night-canvas) !important;
  color: var(--night-text) !important;
}

:root[data-theme="dark"] .app-shell .el-card,
:root[data-theme="dark"] .app-shell .el-card__header,
:root[data-theme="dark"] .app-shell .el-card__body,
:root[data-theme="dark"] .app-shell .toolbar,
:root[data-theme="dark"] .app-shell .link-item,
:root[data-theme="dark"] .app-shell .overview-item,
:root[data-theme="dark"] .app-shell .cleanup-grid,
:root[data-theme="dark"] .app-shell .coupon-block,
:root[data-theme="dark"] .app-shell .qm-section {
  background-color: var(--night-surface) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-table {
  --el-table-bg-color: var(--night-surface) !important;
  --el-table-tr-bg-color: var(--night-surface) !important;
  --el-table-header-bg-color: var(--night-alt) !important;
  --el-table-row-hover-bg-color: var(--night-hover) !important;
  --el-table-current-row-bg-color: var(--night-hover) !important;
  --el-table-expanded-cell-bg-color: var(--night-surface) !important;
  --el-table-border-color: var(--night-line) !important;
  --el-table-text-color: var(--night-text) !important;
  --el-table-header-text-color: var(--night-muted) !important;
  --el-bg-color: var(--night-surface) !important;
  --el-fill-color-blank: var(--night-surface) !important;
  --el-fill-color-light: var(--night-alt) !important;
  --el-fill-color-lighter: var(--night-stripe) !important;
  --el-fill-color-extra-light: var(--night-stripe) !important;
  background-color: var(--night-surface) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-table__inner-wrapper,
:root[data-theme="dark"] .app-shell .el-table__header-wrapper,
:root[data-theme="dark"] .app-shell .el-table__body-wrapper,
:root[data-theme="dark"] .app-shell .el-table__fixed,
:root[data-theme="dark"] .app-shell .el-table__fixed-right,
:root[data-theme="dark"] .app-shell .el-table__fixed-body-wrapper,
:root[data-theme="dark"] .app-shell .el-table__empty-block,
:root[data-theme="dark"] .app-shell .el-table__expanded-cell {
  background-color: var(--night-surface) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-table thead,
:root[data-theme="dark"] .app-shell .el-table thead tr,
:root[data-theme="dark"] .app-shell .el-table th.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table th.el-table-fixed-column--left,
:root[data-theme="dark"] .app-shell .el-table th.el-table-fixed-column--right {
  background-color: var(--night-alt) !important;
  color: var(--night-muted) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-table tbody tr,
:root[data-theme="dark"] .app-shell .el-table tbody tr > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table tbody tr > td.el-table-fixed-column--left,
:root[data-theme="dark"] .app-shell .el-table tbody tr > td.el-table-fixed-column--right {
  background-color: var(--night-surface) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-table--striped .el-table__body tr.el-table__row--striped > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table__body tr.el-table__row--striped > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table__body tr.el-table__row--striped > td.el-table-fixed-column--left,
:root[data-theme="dark"] .app-shell .el-table__body tr.el-table__row--striped > td.el-table-fixed-column--right,
:root[data-theme="dark"] .app-shell .el-table__body tbody tr:nth-child(even) > td.el-table__cell {
  background-color: var(--night-stripe) !important;
  color: var(--night-text) !important;
}

:root[data-theme="dark"] .app-shell .el-table__body tr:hover > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table__body tr.hover-row > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table__body tr.current-row > td.el-table__cell,
:root[data-theme="dark"] .app-shell .el-table__body tr:hover > td.el-table-fixed-column--left,
:root[data-theme="dark"] .app-shell .el-table__body tr:hover > td.el-table-fixed-column--right {
  background-color: var(--night-hover) !important;
  color: #ffffff !important;
}

:root[data-theme="dark"] .app-shell .el-table__empty-text,
:root[data-theme="dark"] .app-shell .el-table .cell {
  color: inherit !important;
}

:root[data-theme="dark"] .app-shell .el-input__wrapper,
:root[data-theme="dark"] .app-shell .el-select__wrapper,
:root[data-theme="dark"] .app-shell .el-textarea__inner,
:root[data-theme="dark"] .app-shell .el-input-number,
:root[data-theme="dark"] .app-shell .el-input-number .el-input__wrapper,
:root[data-theme="dark"] .app-shell .el-input-number__decrease,
:root[data-theme="dark"] .app-shell .el-input-number__increase {
  background-color: var(--night-alt) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line-strong) !important;
  box-shadow: 0 0 0 1px var(--night-line-strong) inset !important;
}

:root[data-theme="dark"] .app-shell .el-input__wrapper:hover,
:root[data-theme="dark"] .app-shell .el-select__wrapper:hover,
:root[data-theme="dark"] .app-shell .el-textarea__inner:hover,
:root[data-theme="dark"] .app-shell .el-input-number__decrease:hover,
:root[data-theme="dark"] .app-shell .el-input-number__increase:hover {
  background-color: #202c39 !important;
  color: #ffffff !important;
  border-color: #4a6075 !important;
  box-shadow: 0 0 0 1px #4a6075 inset !important;
}

:root[data-theme="dark"] .app-shell .el-input__wrapper.is-focus,
:root[data-theme="dark"] .app-shell .el-select__wrapper.is-focused,
:root[data-theme="dark"] .app-shell .el-textarea__inner:focus {
  border-color: var(--night-accent) !important;
  box-shadow: 0 0 0 1px var(--night-accent) inset, 0 0 0 3px rgba(102, 196, 247, .12) !important;
}

:root[data-theme="dark"] .app-shell .el-input__inner,
:root[data-theme="dark"] .app-shell .el-textarea__inner,
:root[data-theme="dark"] .app-shell .el-select__selected-item,
:root[data-theme="dark"] .app-shell .el-select__placeholder,
:root[data-theme="dark"] .app-shell .el-input-number .el-input__inner {
  color: var(--night-text) !important;
  caret-color: var(--night-accent) !important;
}

:root[data-theme="dark"] .app-shell .el-input__inner::placeholder,
:root[data-theme="dark"] .app-shell .el-textarea__inner::placeholder,
:root[data-theme="dark"] .app-shell .el-select__placeholder.is-transparent {
  color: var(--night-faint) !important;
}

:root[data-theme="dark"] .app-shell .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger) {
  background-color: var(--night-alt) !important;
  color: #d8e2ec !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):hover {
  background-color: var(--night-hover) !important;
  color: #ffffff !important;
  border-color: #4c6278 !important;
}

:root[data-theme="dark"] .app-shell .el-button.is-disabled,
:root[data-theme="dark"] .app-shell .el-button.is-disabled:hover {
  background-color: #141c25 !important;
  color: #617184 !important;
  border-color: #263341 !important;
}

:root[data-theme="dark"] .app-shell .el-checkbox__inner,
:root[data-theme="dark"] .app-shell .el-radio__inner {
  background-color: #101720 !important;
  border-color: #46586b !important;
}

:root[data-theme="dark"] .app-shell .el-checkbox__input.is-checked .el-checkbox__inner,
:root[data-theme="dark"] .app-shell .el-checkbox__input.is-indeterminate .el-checkbox__inner,
:root[data-theme="dark"] .app-shell .el-radio__input.is-checked .el-radio__inner {
  background-color: #409eff !important;
  border-color: #409eff !important;
}

:root[data-theme="dark"] .app-shell .el-checkbox__label,
:root[data-theme="dark"] .app-shell .el-radio__label,
:root[data-theme="dark"] .app-shell .el-form-item__label,
:root[data-theme="dark"] .app-shell .el-pagination,
:root[data-theme="dark"] .app-shell .el-pagination__total,
:root[data-theme="dark"] .app-shell .el-pagination__jump {
  color: var(--night-muted) !important;
}

:root[data-theme="dark"] .app-shell .el-pagination {
  --el-pagination-bg-color: transparent;
  --el-pagination-button-bg-color: var(--night-alt);
  --el-pagination-button-color: var(--night-muted);
  --el-pagination-hover-color: var(--night-accent);
}

:root[data-theme="dark"] .app-shell .el-pagination button,
:root[data-theme="dark"] .app-shell .el-pagination .el-pager li {
  background-color: var(--night-alt) !important;
  color: var(--night-muted) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-pagination .el-pager li.is-active {
  background-color: #245a7d !important;
  color: #ffffff !important;
  border-color: #4b9ac9 !important;
}

:root[data-theme="dark"] .app-shell .el-pagination button:disabled {
  background-color: #101720 !important;
  color: #536477 !important;
  border-color: #222e3b !important;
}

:root[data-theme="dark"] .app-shell .el-tag {
  --el-tag-bg-color: rgba(102, 196, 247, .12);
  --el-tag-border-color: rgba(102, 196, 247, .32);
  --el-tag-text-color: #8bd5ff;
  background-color: var(--el-tag-bg-color) !important;
  color: var(--el-tag-text-color) !important;
  border-color: var(--el-tag-border-color) !important;
}

:root[data-theme="dark"] .app-shell .el-tag--success {
  --el-tag-bg-color: rgba(66, 190, 135, .14);
  --el-tag-border-color: rgba(66, 190, 135, .34);
  --el-tag-text-color: #76d9a9;
}

:root[data-theme="dark"] .app-shell .el-tag--warning {
  --el-tag-bg-color: rgba(224, 166, 62, .14);
  --el-tag-border-color: rgba(224, 166, 62, .35);
  --el-tag-text-color: #f2c56e;
}

:root[data-theme="dark"] .app-shell .el-tag--danger {
  --el-tag-bg-color: rgba(230, 89, 101, .14);
  --el-tag-border-color: rgba(230, 89, 101, .36);
  --el-tag-text-color: #ff929b;
}

:root[data-theme="dark"] .app-shell .el-tag--info {
  --el-tag-bg-color: rgba(145, 162, 181, .12);
  --el-tag-border-color: rgba(145, 162, 181, .3);
  --el-tag-text-color: #b2bfcc;
}

:root[data-theme="dark"] .app-shell .el-descriptions,
:root[data-theme="dark"] .app-shell .el-descriptions__body,
:root[data-theme="dark"] .app-shell .el-descriptions__table,
:root[data-theme="dark"] .app-shell .el-descriptions__cell,
:root[data-theme="dark"] .app-shell .el-descriptions__content {
  background-color: var(--night-surface) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .el-descriptions__label,
:root[data-theme="dark"] .app-shell .el-descriptions__label.is-bordered-label {
  background-color: var(--night-alt) !important;
  color: var(--night-muted) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] .app-shell .coupon-ok {
  background-color: #112d25 !important;
  color: #89dbb3 !important;
  border-color: #285b48 !important;
}

:root[data-theme="dark"] .app-shell .coupon-no {
  background-color: #302714 !important;
  color: #e9c36d !important;
  border-color: #67552b !important;
}

:root[data-theme="dark"] .app-shell .coupon-fail {
  background-color: #321c22 !important;
  color: #f29aa3 !important;
  border-color: #6a3640 !important;
}

:root[data-theme="dark"] .app-shell .coupon-line,
:root[data-theme="dark"] .app-shell .coupon-block-title,
:root[data-theme="dark"] .app-shell .coupon-summary,
:root[data-theme="dark"] .app-shell .qm-title,
:root[data-theme="dark"] .app-shell .link-remark {
  color: var(--night-text) !important;
}

:root[data-theme="dark"] .app-shell .cleanup-grid,
:root[data-theme="dark"] .app-shell .order-state,
:root[data-theme="dark"] .app-shell .hb-time,
:root[data-theme="dark"] .app-shell .token-cell,
:root[data-theme="dark"] .app-shell .link-tip {
  color: var(--night-muted) !important;
}

:root[data-theme="dark"] .app-shell .order-link,
:root[data-theme="dark"] .app-shell .link-url {
  color: var(--night-accent) !important;
}

:root[data-theme="dark"] .app-shell .el-scrollbar__thumb {
  background-color: #4b5d70 !important;
}

:root[data-theme="dark"] .app-shell .el-table__body-wrapper::-webkit-scrollbar-track,
:root[data-theme="dark"] .app-shell .el-scrollbar__wrap::-webkit-scrollbar-track {
  background-color: #0d131a !important;
}

:root[data-theme="dark"] .app-shell .el-table__body-wrapper::-webkit-scrollbar-thumb,
:root[data-theme="dark"] .app-shell .el-scrollbar__wrap::-webkit-scrollbar-thumb {
  background-color: #4b5d70 !important;
  border-color: #0d131a !important;
}

/* Element Plus overlays are teleported outside the admin shell. */
:root[data-theme="dark"] body:has(.app-shell) .el-overlay,
:root[data-theme="dark"] body:has(.app-shell) .el-overlay-message-box {
  background-color: rgba(2, 6, 10, .72) !important;
}

:root[data-theme="dark"] body:has(.app-shell) .el-dialog,
:root[data-theme="dark"] body:has(.app-shell) .el-drawer,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box,
:root[data-theme="dark"] body:has(.app-shell) .el-popover,
:root[data-theme="dark"] body:has(.app-shell) .el-popper,
:root[data-theme="dark"] body:has(.app-shell) .el-select-dropdown,
:root[data-theme="dark"] body:has(.app-shell) .el-dropdown-menu,
:root[data-theme="dark"] body:has(.app-shell) .el-picker-panel,
:root[data-theme="dark"] body:has(.app-shell) .el-date-picker,
:root[data-theme="dark"] body:has(.app-shell) .el-time-panel {
  --el-bg-color-overlay: var(--night-alt);
  --el-fill-color-light: #202c39;
  --el-text-color-primary: var(--night-text);
  --el-text-color-regular: #c8d3df;
  --el-text-color-secondary: var(--night-muted);
  --el-border-color-light: var(--night-line);
  background-color: var(--night-alt) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .38) !important;
}

:root[data-theme="dark"] body:has(.app-shell) .el-dialog__header,
:root[data-theme="dark"] body:has(.app-shell) .el-dialog__body,
:root[data-theme="dark"] body:has(.app-shell) .el-dialog__footer,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box__header,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box__content,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box__btns {
  background-color: var(--night-alt) !important;
  color: var(--night-text) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] body:has(.app-shell) .el-dialog__title,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box__title,
:root[data-theme="dark"] body:has(.app-shell) .el-message-box__message,
:root[data-theme="dark"] body:has(.app-shell) .el-select-dropdown__item,
:root[data-theme="dark"] body:has(.app-shell) .el-dropdown-menu__item,
:root[data-theme="dark"] body:has(.app-shell) .el-date-table th,
:root[data-theme="dark"] body:has(.app-shell) .el-date-table td,
:root[data-theme="dark"] body:has(.app-shell) .el-time-panel__content {
  color: var(--night-muted) !important;
  border-color: var(--night-line) !important;
}

:root[data-theme="dark"] body:has(.app-shell) .el-select-dropdown__item.is-hovering,
:root[data-theme="dark"] body:has(.app-shell) .el-select-dropdown__item.is-selected,
:root[data-theme="dark"] body:has(.app-shell) .el-dropdown-menu__item:hover,
:root[data-theme="dark"] body:has(.app-shell) .el-dropdown-menu__item:focus {
  background-color: var(--night-hover) !important;
  color: #ffffff !important;
}

:root[data-theme="dark"] body:has(.app-shell) .el-popper__arrow::before {
  background-color: var(--night-alt) !important;
  border-color: var(--night-line) !important;
}