/* Seattle storefront dark mode completion */
:root[data-theme="dark"] {
    color-scheme: dark;
    --st-bg: #101214;
    --st-surface: #171a1e;
    --st-surface-soft: #1d2126;
    --st-surface-hover: #252a30;
    --st-text: #f3f5f7;
    --st-text-secondary: #b8c0c8;
    --st-text-muted: #8d98a3;
    --st-border: #30363d;
    --st-border-strong: #46505a;
}

:root[data-theme="dark"],
:root[data-theme="dark"] body.st-store-body,
:root[data-theme="dark"] body.st-store-body .st-store-shell,
:root[data-theme="dark"] body.st-store-body .st-pjax {
    background: var(--st-bg) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-market-utility {
    background: #090b0d !important;
    color: #f7f8fa !important;
    border-color: #24282d !important;
}

:root[data-theme="dark"] body.st-store-body .st-store-topbar,
:root[data-theme="dark"] body.st-store-body .st-market-menu,
:root[data-theme="dark"] body.st-store-body .st-bottom-nav,
:root[data-theme="dark"] body.st-store-body .st-mobile-pagebar {
    background: #14171a !important;
    color: var(--st-text) !important;
    border-color: var(--st-border) !important;
}

:root[data-theme="dark"] body.st-store-body .st-brand-copy strong,
:root[data-theme="dark"] body.st-store-body .st-brand-copy small,
:root[data-theme="dark"] body.st-store-body .st-market-menu a,
:root[data-theme="dark"] body.st-store-body .st-market-menu button,
:root[data-theme="dark"] body.st-store-body .st-topbar-login,
:root[data-theme="dark"] body.st-store-body .st-currency-trigger,
:root[data-theme="dark"] body.st-store-body .st-theme-menu > summary,
:root[data-theme="dark"] body.st-store-body .st-page,
:root[data-theme="dark"] body.st-store-body .st-store-home,
:root[data-theme="dark"] body.st-store-body .st-item-page,
:root[data-theme="dark"] body.st-store-body .st-item-overview {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-category-rail,
:root[data-theme="dark"] body.st-store-body .st-catalog-header,
:root[data-theme="dark"] body.st-store-body .st-product-feed,
:root[data-theme="dark"] body.st-store-body .st-product-row,
:root[data-theme="dark"] body.st-store-body .st-panel,
:root[data-theme="dark"] body.st-store-body .st-action-grid a,
:root[data-theme="dark"] body.st-store-body .st-currency-options,
:root[data-theme="dark"] body.st-store-body .st-theme-options,
:root[data-theme="dark"] body.st-store-body .st-market-menu__dropdown,
:root[data-theme="dark"] body.st-store-body .st-market-mega {
    background: var(--st-surface) !important;
    color: var(--st-text) !important;
    border-color: var(--st-border) !important;
}

:root[data-theme="dark"] body.st-store-body .st-product-row:hover,
:root[data-theme="dark"] body.st-store-body .st-action-grid a:hover,
:root[data-theme="dark"] body.st-store-body .st-category-link:hover,
:root[data-theme="dark"] body.st-store-body .st-category-parent-row:hover,
:root[data-theme="dark"] body.st-store-body .st-theme-options button:hover,
:root[data-theme="dark"] body.st-store-body .st-currency-options button:hover {
    background: var(--st-surface-hover) !important;
}

:root[data-theme="dark"] body.st-store-body .st-category-link,
:root[data-theme="dark"] body.st-store-body .st-category-parent-link,
:root[data-theme="dark"] body.st-store-body .st-category-toggle,
:root[data-theme="dark"] body.st-store-body .st-category-name,
:root[data-theme="dark"] body.st-store-body .st-category-count,
:root[data-theme="dark"] body.st-store-body .st-catalog-heading,
:root[data-theme="dark"] body.st-store-body .st-catalog-heading h1,
:root[data-theme="dark"] body.st-store-body .st-product-name,
:root[data-theme="dark"] body.st-store-body .st-product-price,
:root[data-theme="dark"] body.st-store-body .st-panel__header h2,
:root[data-theme="dark"] body.st-store-body .st-item-title,
:root[data-theme="dark"] body.st-store-body .st-item-title h1,
:root[data-theme="dark"] body.st-store-body .st-item-title strong,
:root[data-theme="dark"] body.st-store-body .st-section-header h2,
:root[data-theme="dark"] body.st-store-body .st-field-heading,
:root[data-theme="dark"] body.st-store-body .st-total,
:root[data-theme="dark"] body.st-store-body .st-total strong {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-catalog-heading p,
:root[data-theme="dark"] body.st-store-body .st-product-meta,
:root[data-theme="dark"] body.st-store-body .st-panel__header p,
:root[data-theme="dark"] body.st-store-body .st-item-overview p,
:root[data-theme="dark"] body.st-store-body .st-breadcrumb,
:root[data-theme="dark"] body.st-store-body .st-breadcrumb a,
:root[data-theme="dark"] body.st-store-body .st-field label,
:root[data-theme="dark"] body.st-store-body .st-outline-label {
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-store-body .st-price-sort,
:root[data-theme="dark"] body.st-store-body .st-search,
:root[data-theme="dark"] body.st-store-body .st-search input,
:root[data-theme="dark"] body.st-store-body .st-market-search,
:root[data-theme="dark"] body.st-store-body .st-market-search input,
:root[data-theme="dark"] body.st-store-body .st-field,
:root[data-theme="dark"] body.st-store-body .st-field input,
:root[data-theme="dark"] body.st-store-body .st-field select,
:root[data-theme="dark"] body.st-store-body .st-field textarea,
:root[data-theme="dark"] body.st-store-body .st-outline-control,
:root[data-theme="dark"] body.st-store-body .st-quantity,
:root[data-theme="dark"] body.st-store-body .st-form-section,
:root[data-theme="dark"] body.st-store-body .st-pay-option {
    background: var(--st-surface-soft) !important;
    color: var(--st-text) !important;
    border-color: var(--st-border-strong) !important;
}

:root[data-theme="dark"] body.st-store-body input::placeholder,
:root[data-theme="dark"] body.st-store-body textarea::placeholder {
    color: var(--st-text-muted) !important;
    opacity: 1;
}

:root[data-theme="dark"] body.st-store-body .st-item-purchase,
:root[data-theme="dark"] body.st-store-body .st-item-description,
:root[data-theme="dark"] body.st-store-body .st-buy-dock {
    background: var(--st-surface) !important;
    color: var(--st-text) !important;
    border-color: var(--st-border) !important;
}

:root[data-theme="dark"] body.st-store-body .st-rich-content,
:root[data-theme="dark"] body.st-store-body .st-rich-content p,
:root[data-theme="dark"] body.st-store-body .st-rich-content li,
:root[data-theme="dark"] body.st-store-body .st-rich-content strong,
:root[data-theme="dark"] body.st-store-body .st-rich-content span {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-rich-content a {
    color: #69b7ff !important;
}

:root[data-theme="dark"] body.st-store-body .st-pay-option:hover,
:root[data-theme="dark"] body.st-store-body .st-pay-option.is-active {
    background: var(--st-surface-hover) !important;
    border-color: #69b7ff !important;
}

:root[data-theme="dark"] body.st-store-body .st-soldout,
:root[data-theme="dark"] body.st-store-body [aria-disabled="true"] .st-product-name {
    color: var(--st-text-muted) !important;
}

:root[data-theme="dark"] body.st-store-body .st-callout {
    background: var(--st-surface-soft) !important;
    color: var(--st-text-secondary) !important;
    border-color: var(--st-border) !important;
}

:root[data-theme="dark"] body.st-store-body .st-callout .material-icons-outlined {
    color: #ff8a4c !important;
}

:root[data-theme="dark"] body.st-store-body .st-store-home .st-category-rail .st-category-tree .st-category-name {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-market-menu details > summary,
:root[data-theme="dark"] body.st-store-body .st-market-menu details > summary .material-icons-outlined {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-store-body .st-market-menu .st-market-mega .st-mega-links a {
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-store-body .st-market-menu .st-market-mega .st-mega-links a:hover {
    color: var(--st-text) !important;
    background: var(--st-surface-hover) !important;
}

/* Keep authenticated member pages readable when the global theme is dark. */
:root[data-theme="dark"] body.st-member-body {
    --st-bg: #101214;
    --st-surface: #171a1e;
    --st-surface-soft: #1d2126;
    --st-surface-hover: #252a30;
    --st-text: #f3f5f7;
    --st-text-secondary: #b8c0c8;
    --st-text-muted: #8d98a3;
    --st-border: #30363d;
    --st-border-strong: #46505a;
    --st-primary: #ff6b22;
    --st-primary-hover: #ff812f;
    --st-primary-soft: #262b31;
    --st-primary-readable: #ff9a68;
    --st-on-primary: #ffffff;
    --st-success-soft: #102a22;
    --st-warning-soft: #302516;
    --st-danger-soft: #32181a;
}

:root[data-theme="dark"]:has(body.st-member-body),
:root[data-theme="dark"] body.st-member-body,
:root[data-theme="dark"] body.st-member-body .st-app,
:root[data-theme="dark"] body.st-member-body .st-pjax {
    background: var(--st-bg) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav,
:root[data-theme="dark"] body.st-member-body .st-dashboard-head,
:root[data-theme="dark"] body.st-member-body .st-panel,
:root[data-theme="dark"] body.st-member-body .st-card,
:root[data-theme="dark"] body.st-member-body .st-stat,
:root[data-theme="dark"] body.st-member-body .st-security-summary > div,
:root[data-theme="dark"] body.st-member-body .st-security-card,
:root[data-theme="dark"] body.st-member-body .st-action-grid a,
:root[data-theme="dark"] body.st-member-body .st-action-grid button,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a,
:root[data-theme="dark"] body.st-member-body .st-merchant-tool-grid a {
    background: var(--st-surface) !important;
    border-color: var(--st-border) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__profile strong,
:root[data-theme="dark"] body.st-member-body .st-nav__wallet strong,
:root[data-theme="dark"] body.st-member-body .st-nav__group > a,
:root[data-theme="dark"] body.st-member-body .st-nav__group > a > span:not(.material-icons-outlined),
:root[data-theme="dark"] body.st-member-body .st-main,
:root[data-theme="dark"] body.st-member-body .st-page-header h1,
:root[data-theme="dark"] body.st-member-body .st-dashboard-head h1,
:root[data-theme="dark"] body.st-member-body .st-panel__header h2,
:root[data-theme="dark"] body.st-member-body .st-card__header h2,
:root[data-theme="dark"] body.st-member-body .st-stat strong,
:root[data-theme="dark"] body.st-member-body .st-settings-list > *,
:root[data-theme="dark"] body.st-member-body .st-settings-list > * strong,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a strong,
:root[data-theme="dark"] body.st-member-body .st-merchant-tool-grid a strong {
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__profile small,
:root[data-theme="dark"] body.st-member-body .st-nav__wallet small,
:root[data-theme="dark"] body.st-member-body .st-nav__group > small,
:root[data-theme="dark"] body.st-member-body .st-page-header p,
:root[data-theme="dark"] body.st-member-body .st-dashboard-head p,
:root[data-theme="dark"] body.st-member-body .st-inline-meta,
:root[data-theme="dark"] body.st-member-body .st-inline-meta > span,
:root[data-theme="dark"] body.st-member-body .st-panel__header p,
:root[data-theme="dark"] body.st-member-body .st-panel__header small,
:root[data-theme="dark"] body.st-member-body .st-card__header p,
:root[data-theme="dark"] body.st-member-body .st-card__header small,
:root[data-theme="dark"] body.st-member-body .st-stat > span,
:root[data-theme="dark"] body.st-member-body .st-stat small,
:root[data-theme="dark"] body.st-member-body .st-stat p,
:root[data-theme="dark"] body.st-member-body .st-action-grid small,
:root[data-theme="dark"] body.st-member-body .st-action-grid > a > .material-icons-outlined:last-child,
:root[data-theme="dark"] body.st-member-body .st-action-grid > button > .material-icons-outlined:last-child,
:root[data-theme="dark"] body.st-member-body .st-security-summary > div > span,
:root[data-theme="dark"] body.st-member-body .st-security-summary > div > small,
:root[data-theme="dark"] body.st-member-body .st-settings-list > * > span:nth-child(2) small,
:root[data-theme="dark"] body.st-member-body .st-settings-list > * > .material-icons-outlined:last-child,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a > span,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a > small,
:root[data-theme="dark"] body.st-member-body .st-merchant-tool-grid a small,
:root[data-theme="dark"] body.st-member-body .st-stream__content > span,
:root[data-theme="dark"] body.st-member-body .st-stream__value span {
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__wallet {
    background: var(--st-surface-soft) !important;
    border-color: var(--st-border) !important;
}

:root[data-theme="dark"] body.st-member-body .st-panel__icon,
:root[data-theme="dark"] body.st-member-body .st-settings-list > * > .material-icons-outlined:first-child,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a i {
    background: var(--st-primary-soft) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__group > a:hover,
:root[data-theme="dark"] body.st-member-body .st-action-grid a:hover,
:root[data-theme="dark"] body.st-member-body .st-action-grid button:hover,
:root[data-theme="dark"] body.st-member-body .st-settings-list > *:hover,
:root[data-theme="dark"] body.st-member-body .st-merchant-tool-grid a:hover {
    background: var(--st-surface-hover) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__group > a.is-active {
    background: var(--st-primary-soft) !important;
    color: var(--st-primary-readable) !important;
}

:root[data-theme="dark"] body.st-member-body .st-nav__group > a.is-active .material-icons-outlined,
:root[data-theme="dark"] body.st-member-body .st-panel__icon,
:root[data-theme="dark"] body.st-member-body .st-action-grid > a > .material-icons-outlined:first-child,
:root[data-theme="dark"] body.st-member-body .st-action-grid > button > .material-icons-outlined:first-child,
:root[data-theme="dark"] body.st-member-body .st-settings-list > * > .material-icons-outlined:first-child,
:root[data-theme="dark"] body.st-member-body .st-merchant-overview > a i,
:root[data-theme="dark"] body.st-member-body .st-merchant-tool-grid .material-icons-outlined {
    color: var(--st-primary-readable) !important;
}

:root[data-theme="dark"] body.st-member-body .st-settings-list > button {
    background: transparent !important;
}

:root[data-theme="dark"] body.st-member-body .st-kicker,
:root[data-theme="dark"] body.st-member-body .st-text-link,
:root[data-theme="dark"] body.st-member-body .st-inline-meta .material-icons-outlined {
    color: var(--st-primary-readable) !important;
}

:root[data-theme="dark"] body.st-member-body .st-callout,
:root[data-theme="dark"] body.st-member-body .st-stream,
:root[data-theme="dark"] body.st-member-body .st-feed {
    background: var(--st-surface) !important;
    color: var(--st-text-secondary) !important;
    border-color: var(--st-border) !important;
}

/* Form controls on shop settings, recharge, security and ticket pages. */
:root[data-theme="dark"] body.st-member-body .st-form-section,
:root[data-theme="dark"] body.st-member-body .st-business-tab-panel,
:root[data-theme="dark"] body.st-member-body .st-business-save-actions,
:root[data-theme="dark"] body.st-member-body .st-ticket-search,
:root[data-theme="dark"] body.st-member-body .st-ticket-select,
:root[data-theme="dark"] body.st-member-body .st-ticket-select select,
:root[data-theme="dark"] body.st-member-body .st-outline-control,
:root[data-theme="dark"] body.st-member-body .st-outlined-field,
:root[data-theme="dark"] body.st-member-body .st-form-control,
:root[data-theme="dark"] body.st-member-body input:not([type="checkbox"]):not([type="radio"]),
:root[data-theme="dark"] body.st-member-body select,
:root[data-theme="dark"] body.st-member-body textarea,
:root[data-theme="dark"] body.st-member-body .layui-input,
:root[data-theme="dark"] body.st-member-body .layui-select,
:root[data-theme="dark"] body.st-member-body .layui-textarea,
:root[data-theme="dark"] body.st-member-body .xm-select-default,
:root[data-theme="dark"] body.st-member-body .ev2-editor {
    background: var(--st-surface-soft) !important;
    border-color: var(--st-border-strong) !important;
    color: var(--st-text) !important;
    color-scheme: dark;
}

:root[data-theme="dark"] body.st-member-body .st-outlined-field > .st-outline-label,
:root[data-theme="dark"] body.st-member-body .st-field > label,
:root[data-theme="dark"] body.st-member-body .st-field > span,
:root[data-theme="dark"] body.st-member-body .st-field__label,
:root[data-theme="dark"] body.st-member-body .st-ticket-select__label {
    background: var(--st-surface) !important;
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body input::placeholder,
:root[data-theme="dark"] body.st-member-body textarea::placeholder,
:root[data-theme="dark"] body.st-member-body .st-ticket-search input::placeholder {
    color: var(--st-text-muted) !important;
    opacity: 1;
}

:root[data-theme="dark"] body.st-member-body .st-ticket-search input,
:root[data-theme="dark"] body.st-member-body .st-ticket-select select {
    background: transparent !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-stream__item,
:root[data-theme="dark"] body.st-member-body .st-feed > * {
    border-color: var(--st-border) !important;
}

/* Legacy Bootstrap/Layui tables used by bills, orders and the other list pages. */
:root[data-theme="dark"] body.st-member-body .st-table-wrap,
:root[data-theme="dark"] body.st-member-body .st-table-wrap table,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-container,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-body,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-header,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-footer,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-pagination,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-loading {
    background: var(--st-surface) !important;
    background-color: var(--st-surface) !important;
    border-color: var(--st-border) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-toolbar,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-form,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-form-item,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .mui-sf,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .mui-sf__label {
    background: var(--st-surface) !important;
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-input,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-select-title input,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-textarea,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search input,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search select,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search textarea {
    background: var(--st-surface-soft) !important;
    border-color: var(--st-border-strong) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table > :not(caption) > * > *,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table > :not(caption) > * > *,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table tbody tr,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table tbody td {
    background: transparent !important;
    background-color: transparent !important;
    border-color: var(--st-border) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table thead th,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table thead th .th-inner {
    background: var(--st-surface-soft) !important;
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .bootstrap-table .table tbody tr:hover > td {
    background: var(--st-surface-hover) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .layui-form-label,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search label,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-search .mui-sf__label,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-pagination,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .fixed-table-pagination .pagination-info {
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-switch-state button {
    border-color: var(--st-border) !important;
    background: var(--st-surface-soft) !important;
    color: var(--st-text-secondary) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-switch-state button.active,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .table-switch-state button:focus {
    border-color: var(--st-primary) !important;
    background: var(--st-primary-soft) !important;
    color: var(--st-primary-readable) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table-view,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table-box,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table-header,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table-body,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table-main {
    background: var(--st-surface) !important;
    background-color: var(--st-surface) !important;
    color: var(--st-text) !important;
}

:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table th,
:root[data-theme="dark"] body.st-member-body .st-table-wrap .layui-table td {
    background: transparent !important;
    border-color: var(--st-border) !important;
    color: var(--st-text) !important;
}

/* MarketHeaderBalance.css uses fixed dark text for the account balance. */
:root[data-theme="dark"] body.st-store-body .st-store-topbar .st-account-trigger > span:not(.material-icons-outlined) small,
:root[data-theme="dark"] body.st-store-body .st-store-topbar .st-account-trigger > span:not(.material-icons-outlined) small::before {
    color: #ffffff !important;
}
