/* Admin dark-mode completion layer. Scoped to the management shell only. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --admin-canvas: #0d1117;
  --admin-card: #161b22;
  --admin-card-alt: #1c2430;
  --admin-line: #2a3440;
  --admin-text: #e6edf3;
  --admin-text-2: #aab7c7;
  --admin-text-3: #7d8ca3;
  --admin-focus: #4fbbff;
}

: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: var(--admin-canvas) !important;
  color: var(--admin-text) !important;
}

:root[data-theme="dark"] .app-shell .card,
:root[data-theme="dark"] .app-shell .kpi,
:root[data-theme="dark"] .app-shell .chart,
:root[data-theme="dark"] .app-shell .link-overview,
:root[data-theme="dark"] .app-shell .link-item,
:root[data-theme="dark"] .app-shell .token-cell,
:root[data-theme="dark"] .app-shell .proxy-settings,
:root[data-theme="dark"] .app-shell .general-config,
:root[data-theme="dark"] .app-shell .section-card,
:root[data-theme="dark"] .app-shell .batch-summary-card,
:root[data-theme="dark"] .app-shell .placed-section,
:root[data-theme="dark"] .app-shell .store-section,
:root[data-theme="dark"] .app-shell .product-section,
:root[data-theme="dark"] .app-shell .spec-section,
:root[data-theme="dark"] .app-shell .detail-section,
:root[data-theme="dark"] .app-shell .error-section,
:root[data-theme="dark"] .app-shell .failed-card,
:root[data-theme="dark"] .app-shell .progress-card,
:root[data-theme="dark"] .app-shell .cup-switch-card,
:root[data-theme="dark"] .app-shell .store-card,
:root[data-theme="dark"] .app-shell .order-card,
:root[data-theme="dark"] .app-shell .info-card,
:root[data-theme="dark"] .app-shell .store-hero {
  background: var(--admin-card) !important;
  color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

:root[data-theme="dark"] .app-shell .kpi:hover,
:root[data-theme="dark"] .app-shell .card:hover,
:root[data-theme="dark"] .app-shell .link-item:hover,
:root[data-theme="dark"] .app-shell .store-card:hover,
:root[data-theme="dark"] .app-shell .order-card:hover {
  background: var(--admin-card-alt) !important;
  border-color: #385066 !important;
}

:root[data-theme="dark"] .app-shell .card-hd,
:root[data-theme="dark"] .app-shell .card-bd,
:root[data-theme="dark"] .app-shell .card-sub,
:root[data-theme="dark"] .app-shell .dash-head,
:root[data-theme="dark"] .app-shell .dash-sub,
:root[data-theme="dark"] .app-shell .section-heading,
:root[data-theme="dark"] .app-shell .link-toolbar,
:root[data-theme="dark"] .app-shell .toolbar,
:root[data-theme="dark"] .app-shell .proxy-form,
:root[data-theme="dark"] .app-shell .cleanup-grid,
:root[data-theme="dark"] .app-shell .coupon-block,
:root[data-theme="dark"] .app-shell .qm-section,
:root[data-theme="dark"] .app-shell .store-top,
:root[data-theme="dark"] .app-shell .store-stats,
:root[data-theme="dark"] .app-shell .info-row,
:root[data-theme="dark"] .app-shell .amount-summary {
  color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
}

:root[data-theme="dark"] .app-shell h1,
:root[data-theme="dark"] .app-shell h2,
:root[data-theme="dark"] .app-shell h3,
:root[data-theme="dark"] .app-shell h4,
:root[data-theme="dark"] .app-shell strong,
:root[data-theme="dark"] .app-shell .card-title,
:root[data-theme="dark"] .app-shell .dash-title,
:root[data-theme="dark"] .app-shell .section-title,
:root[data-theme="dark"] .app-shell .section-heading h2,
:root[data-theme="dark"] .app-shell .qm-title,
:root[data-theme="dark"] .app-shell .coupon-block-title,
:root[data-theme="dark"] .app-shell .store-name,
:root[data-theme="dark"] .app-shell .product-name,
:root[data-theme="dark"] .app-shell .order-id,
:root[data-theme="dark"] .app-shell .token-remark,
:root[data-theme="dark"] .app-shell .link-remark {
  color: var(--admin-text) !important;
}

:root[data-theme="dark"] .app-shell p,
:root[data-theme="dark"] .app-shell small,
:root[data-theme="dark"] .app-shell label,
:root[data-theme="dark"] .app-shell .card-sub,
:root[data-theme="dark"] .app-shell .kpi-label,
:root[data-theme="dark"] .app-shell .kpi-hint,
:root[data-theme="dark"] .app-shell .pmeta,
:root[data-theme="dark"] .app-shell .store-addr,
:root[data-theme="dark"] .app-shell .store-address,
:root[data-theme="dark"] .app-shell .time-muted,
:root[data-theme="dark"] .app-shell .text-muted,
:root[data-theme="dark"] .app-shell .link-tip,
:root[data-theme="dark"] .app-shell .form-unit,
:root[data-theme="dark"] .app-shell .info-label,
:root[data-theme="dark"] .app-shell .info-value,
:root[data-theme="dark"] .app-shell .product-spec,
:root[data-theme="dark"] .app-shell .coupon-name,
:root[data-theme="dark"] .app-shell .cup-summary {
  color: var(--admin-text-2) !important;
}

:root[data-theme="dark"] .app-shell .adm-tbl,
:root[data-theme="dark"] .app-shell .adm-tbl thead,
:root[data-theme="dark"] .app-shell .adm-tbl tbody,
:root[data-theme="dark"] .app-shell .adm-tbl tr,
:root[data-theme="dark"] .app-shell .adm-tbl td,
:root[data-theme="dark"] .app-shell .adm-tbl th,
:root[data-theme="dark"] .app-shell .link-list,
:root[data-theme="dark"] .app-shell .coupon-line,
:root[data-theme="dark"] .app-shell .order-row,
:root[data-theme="dark"] .app-shell .store-row {
  background: var(--admin-card) !important;
  color: var(--admin-text-2) !important;
  border-color: var(--admin-line) !important;
}

:root[data-theme="dark"] .app-shell .adm-tbl tr:hover,
:root[data-theme="dark"] .app-shell .link-list > *,
:root[data-theme="dark"] .app-shell .coupon-line:hover,
:root[data-theme="dark"] .app-shell .order-row:hover,
:root[data-theme="dark"] .app-shell .store-row:hover {
  background: var(--admin-card-alt) !important;
}

:root[data-theme="dark"] .app-shell input,
:root[data-theme="dark"] .app-shell textarea,
:root[data-theme="dark"] .app-shell select,
:root[data-theme="dark"] .app-shell .keyword-input,
:root[data-theme="dark"] .app-shell .filter-select,
:root[data-theme="dark"] .app-shell .remarks-input,
:root[data-theme="dark"] .app-shell .addr-input,
:root[data-theme="dark"] .app-shell button:not(.icon-btn),
:root[data-theme="dark"] .app-shell .ghost-btn {
  background: var(--admin-card-alt) !important;
  color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
}

:root[data-theme="dark"] .app-shell input::placeholder,
:root[data-theme="dark"] .app-shell textarea::placeholder {
  color: var(--admin-text-3) !important;
}

:root[data-theme="dark"] .app-shell button:hover,
:root[data-theme="dark"] .app-shell .ghost-btn:hover,
:root[data-theme="dark"] .app-shell .icon-btn:hover {
  background: #26384a !important;
  color: #ffffff !important;
  border-color: var(--admin-focus) !important;
}

:root[data-theme="dark"] .app-shell .primary-btn,
:root[data-theme="dark"] .app-shell .qa-add,
:root[data-theme="dark"] .app-shell .qa-del,
:root[data-theme="dark"] .app-shell .link-url,
:root[data-theme="dark"] .app-shell .order-link {
  color: #73c9ff !important;
}

:root[data-theme="dark"] .el-overlay,
:root[data-theme="dark"] .el-overlay-message-box,
:root[data-theme="dark"] .el-dialog__wrapper {
  background: rgba(0, 0, 0, .68) !important;
}

:root[data-theme="dark"] .el-dialog,
:root[data-theme="dark"] .el-drawer,
:root[data-theme="dark"] .el-message-box,
:root[data-theme="dark"] .el-popover,
:root[data-theme="dark"] .el-popper,
:root[data-theme="dark"] .el-select-dropdown,
:root[data-theme="dark"] .el-dropdown-menu,
:root[data-theme="dark"] .el-picker-panel,
:root[data-theme="dark"] .el-date-picker,
:root[data-theme="dark"] .el-time-panel {
  background: var(--admin-card) !important;
  color: var(--admin-text) !important;
  border-color: var(--admin-line) !important;
}

:root[data-theme="dark"] .el-dialog *,
:root[data-theme="dark"] .el-drawer *,
:root[data-theme="dark"] .el-message-box *,
:root[data-theme="dark"] .el-popper *,
:root[data-theme="dark"] .el-picker-panel * {
  border-color: var(--admin-line) !important;
}

:root[data-theme="dark"] .el-dialog__title,
:root[data-theme="dark"] .el-drawer__title,
:root[data-theme="dark"] .el-message-box__title,
:root[data-theme="dark"] .el-message-box__message,
:root[data-theme="dark"] .el-popper,
:root[data-theme="dark"] .el-select-dropdown__item,
:root[data-theme="dark"] .el-dropdown-menu__item,
:root[data-theme="dark"] .el-date-table th,
:root[data-theme="dark"] .el-date-table td,
:root[data-theme="dark"] .el-time-panel__content {
  color: var(--admin-text-2) !important;
}

:root[data-theme="dark"] .el-select-dropdown__item.is-hovering,
:root[data-theme="dark"] .el-dropdown-menu__item:hover,
:root[data-theme="dark"] .el-dropdown-menu__item:focus,
:root[data-theme="dark"] .el-date-table td.current:not(.disabled) .el-date-table-cell__text,
:root[data-theme="dark"] .el-date-table td.today .el-date-table-cell__text {
  background: var(--admin-card-alt) !important;
  color: #ffffff !important;
}

:root[data-theme="dark"] .el-popper__arrow::before {
  background: var(--admin-card) !important;
  border-color: var(--admin-line) !important;
}
