:root[data-color-theme="dark"] {
    color-scheme: dark;
    --bg: #242527;
    --surface: #303236;
    --surface-secondary: #393b40;
    --surface-2: var(--surface-secondary);
    --border: #4b4e54;
    --divider: #565a61;
    --text-primary: #f3f4f6;
    --text-secondary: #d1d5db;
    --text-tertiary: #aeb4be;
    --disabled: #858b95;
    --card: var(--surface);
    --text: var(--text-primary);
    --text-2: var(--text-secondary);
    --text-3: var(--text-tertiary);
    --muted: var(--text-secondary);
    --store-product-title-color: var(--text-primary);
    --store-product-body-color: var(--text-secondary);
    --store-product-muted-color: var(--text-tertiary);
    --store-product-panel-color: var(--surface);
    --accent-soft: color-mix(in srgb, var(--primary) 24%, #303236);
    --media-placeholder: linear-gradient(145deg, #35383d 0%, #3c3948 50%, #303f43 100%);
    --shadow-soft: 0 1px 2px rgba(0, 0, 0, .24), 0 10px 28px rgba(0, 0, 0, .24);
    --shadow-md: 0 16px 40px rgba(0, 0, 0, .36);
    --shadow-card-hover: 0 18px 42px rgba(0, 0, 0, .4);
}

:root[data-color-theme="dark"] body.is-store,
:root[data-color-theme="dark"] body.is-store-product {
    --bg: #242527;
    --surface: #303236;
    --surface-secondary: #393b40;
    --border: #4b4e54;
    --divider: #565a61;
    --text-primary: #f3f4f6;
    --text-secondary: #d1d5db;
    --text-tertiary: #aeb4be;
    --store-product-title-color: var(--text-primary);
    --store-product-body-color: var(--text-secondary);
    --store-product-muted-color: var(--text-tertiary);
    --store-product-panel-color: var(--surface);
    background: var(--bg) !important;
    background-image: none !important;
}

/* Header chrome has legacy white backgrounds with high specificity. */
:root[data-color-theme="dark"] .site-header,
:root[data-color-theme="dark"] .site-header__utility {
    color: var(--text-primary) !important;
    background: #2b2d31 !important;
    border-color: var(--border) !important;
}

:root[data-color-theme="dark"] .site-header .site-search__field {
    color: var(--text-primary);
    background: #242629;
    border-color: var(--border);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
}

:root[data-color-theme="dark"] :is(
    .site-brand__text,
    .site-header__promise,
    .site-header__promise strong,
    .site-header__account-link
) {
    color: var(--text-primary) !important;
}

/* Layout wrappers stay transparent; only actual cards receive a surface. */
:root[data-color-theme="dark"] :is(
    .store-detail__summary,
    .store-detail__intro,
    .store-card__body,
    .home-categories,
    .home-category-card,
    .store-product-banner-row,
    .store-product-banner-row__body,
    .store-product-banner-row__products,
    .store-product-banner-row__carousel,
    .store-product-banner-row__carousel .play-carousel,
    .store-product-banner-row__carousel .play-carousel__viewport,
    .store-detail__modules,
    .store-product-carousel
) {
    background: transparent !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-home :is(
    .store-product-banner-row,
    .store-product-banner-row__body,
    .store-product-banner-row__products,
    .store-product-banner-row__carousel
),
:root[data-color-theme="dark"] body.is-store-product .store-section--related {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

:root[data-color-theme="dark"] .site-nav a {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] .site-nav a:hover,
:root[data-color-theme="dark"] .site-nav a.is-active {
    color: var(--text-primary) !important;
    background: #41444a !important;
}

:root[data-color-theme="dark"] :is(.site-header .site-cart-badge, .site-header__account-icon) {
    color: var(--text-primary);
    background: #383a3f;
    border-color: var(--border);
}

:root[data-color-theme="dark"] :is(.site-category-menu__rail, .site-category-menu__content, .site-category-menu__panel) {
    color: var(--text-primary);
    background: var(--surface);
    border-color: var(--border);
}

:root[data-color-theme="dark"] body,
:root[data-color-theme="dark"] main,
:root[data-color-theme="dark"] .home,
:root[data-color-theme="dark"] .st {
    background: var(--bg);
    color: var(--text-primary);
}

:root[data-color-theme="dark"] .site-header,
:root[data-color-theme="dark"] body.is-home .site-header,
:root[data-color-theme="dark"] body.play-apps-page .site-header,
:root[data-color-theme="dark"] body.is-tutorials .site-header,
:root[data-color-theme="dark"] body.is-blog .site-header,
:root[data-color-theme="dark"] body.is-article .site-header,
:root[data-color-theme="dark"] body.is-store .site-header,
:root[data-color-theme="dark"] body.is-store-product .site-header,
:root[data-color-theme="dark"] body.is-contact .site-header,
:root[data-color-theme="dark"] .site-header__navigation,
:root[data-color-theme="dark"] .hdr {
    background: rgba(43, 45, 49, .95);
    border-color: var(--border);
    box-shadow: 0 1px 0 var(--border), 0 10px 28px rgba(0, 0, 0, .2);
}

:root[data-color-theme="dark"] :is(
    .site-search__field,
    .site-search__dropdown,
    .site-category-menu,
    .site-account-menu__dropdown,
    .home-panel,
    .post-card,
    .tutorial-card,
    .app-card,
    .store-card,
    .store-detail__hero,
    .store-detail__section,
    .store-detail__purchase--card,
    .store-detail__compact-specs,
    .store-detail__facts,
    .store-detail__body-shell,
    .store-detail__meta-list,
    .store-catalog__sidebar,
    .store-filter,
    .cart-item,
    .cart-summary,
    .checkout-card,
    .order-card,
    .site-page-section,
    .tile,
    .card,
    .post-card__link,
    .home-category-card,
    .home-hero,
    .home-row,
    .store-section,
    .store-catalog__main,
    .store-toolbar,
    .store-detail__highlights,
    .store-detail__delivery-chip,
    .store-detail__picks,
    .article-shell,
    .article-content,
    .auth-card,
    .account-card,
    .order-summary,
    .checkout-section
) {
    color: var(--text-primary);
    border-color: var(--border);
    background-color: var(--surface);
    box-shadow: var(--shadow-soft);
}

/* Bento product tiles define a light gradient with the background shorthand.
   Override that image as well as the color so dark mode never produces pale
   text on a white card. */
:root[data-color-theme="dark"] .bento .tile.is-product {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: linear-gradient(180deg, #34363b 0%, #2b2d31 100%) !important;
}

:root[data-color-theme="dark"] .bento .tile.is-product :is(
    .tlabel,
    .pinfo h3,
    .pinfo small,
    .pp b,
    .pp span
) {
    color: inherit;
}

:root[data-color-theme="dark"] .bento .tile.is-product .tlabel,
:root[data-color-theme="dark"] .bento .tile.is-product .pinfo small,
:root[data-color-theme="dark"] .bento .tile.is-product .pp span {
    color: var(--text-tertiary);
}

/* Catalog hero, filters and taxonomy controls. */
:root[data-color-theme="dark"] body.is-store :is(
    .store-banner,
    .store-category-panel,
    .store-subcategory-panel,
    .store-catalog,
    .store-catalog-toolbar
) {
    color: var(--text-primary);
    border-color: var(--border);
    background: var(--surface);
    background-image: none;
    box-shadow: var(--shadow-soft);
}

:root[data-color-theme="dark"] body.is-store .store-search__field {
    color: var(--text-primary);
    border-color: var(--border);
    background: #292b2f;
}

:root[data-color-theme="dark"] body.is-store .store-search__input {
    color: var(--text-primary);
}

:root[data-color-theme="dark"] body.is-store .store-search__input::placeholder {
    color: var(--text-tertiary);
}

:root[data-color-theme="dark"] body.is-store .store-hl {
    color: var(--text-primary);
    border-color: var(--border);
    background: var(--surface-secondary);
}

:root[data-color-theme="dark"] body.is-store .store-category-card,
:root[data-color-theme="dark"] body.is-store .store-category-card[data-tone]:not(.is-active) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: #393b40 !important;
    background-image: none !important;
    box-shadow: none;
}

:root[data-color-theme="dark"] body.is-store .store-category-card:hover {
    border-color: color-mix(in srgb, var(--primary) 55%, var(--border)) !important;
    background: #41444a !important;
}

:root[data-color-theme="dark"] body.is-store .store-category-card.is-active {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 18%, #303236) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 25%, transparent);
}

:root[data-color-theme="dark"] body.is-store .store-category-card__name,
:root[data-color-theme="dark"] body.is-store .store-category-card.is-active .store-category-card__name {
    color: var(--text-primary);
}

:root[data-color-theme="dark"] body.is-store .store-subcategory-pill {
    color: var(--text-secondary) !important;
    border-color: var(--border);
    background: #393b40;
}

:root[data-color-theme="dark"] body.is-store .store-subcategory-pill:hover {
    color: var(--text-primary) !important;
    background: #41444a;
}

:root[data-color-theme="dark"] .site-category-menu__all,
:root[data-color-theme="dark"] .site-category-menu__tab {
    color: var(--text-secondary) !important;
    border-color: var(--border);
    background: transparent;
}

:root[data-color-theme="dark"] .site-category-menu__all:hover,
:root[data-color-theme="dark"] .site-category-menu__all:focus-visible,
:root[data-color-theme="dark"] .site-category-menu__tab:hover,
:root[data-color-theme="dark"] .site-category-menu__tab:focus-visible,
:root[data-color-theme="dark"] .site-category-menu__tab[aria-selected="true"] {
    color: var(--text-primary) !important;
    background: #41444a;
    outline-color: var(--primary);
}

/* Product page panels previously retained the light Apple-style surface. */
:root[data-color-theme="dark"] body.is-store-product .store-detail--joyful .store-detail__hero,
:root[data-color-theme="dark"] body.is-store-product :is(
    .store-detail__purchase--card,
    .store-detail__meta-item,
    .store-detail__specs-extra,
    .store-detail__specs-extra-body,
    .store-detail__facts--glossy .store-detail__fact,
    .store-detail__updated,
    .store-detail__specs-summary
) {
    color: var(--text-primary);
    border-color: var(--border);
    background: var(--surface);
    background-image: none;
    box-shadow: var(--shadow-soft);
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__meta-list {
    border-color: var(--border);
}

:root[data-color-theme="dark"] body.is-store-product :is(
    .store-detail__meta-item dt,
    .store-detail__updated-label,
    .store-detail__price-label,
    .store-detail__specs-count,
    .store-detail__specs-extra-count
) {
    color: var(--text-tertiary);
}

:root[data-color-theme="dark"] body.is-store-product :is(
    .store-detail__meta-item dd,
    .store-detail__fact dt,
    .store-detail__fact dd,
    .store-detail__buy-note
) {
    color: var(--text-secondary);
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__delivery-chip--express_tehran,
:root[data-color-theme="dark"] body.is-store-product .store-detail__delivery-chip--nationwide {
    color: var(--text-primary) !important;
    border-color: color-mix(in srgb, var(--primary) 42%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 18%, #393b40) !important;
}

:root[data-color-theme="dark"] :is(
    .store-card__price-current,
    .store-list-item__price .store-card__price-current,
    .store-detail__price-current
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] :is(.store-card__price-current, .store-detail__price-current) .store-price__unit {
    color: var(--text-secondary) !important;
}

/* Keep the complete purchase panel readable. Theme-specific styles used a
   light muted palette here, which became nearly invisible on dark surfaces. */
:root[data-color-theme="dark"] body.is-store-product .store-detail__purchase :is(
    .store-variations__label,
    .store-variations__availability,
    .store-inquiry__text,
    .store-inquiry__note,
    .store-inquiry__fallback,
    .store-detail__buy-note
) {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__purchase :is(
    .store-variations__color-name,
    .store-variations__choice,
    .store-detail__price-label
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__purchase :is(
    .store-variations__color,
    .store-variations__choice
) {
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__purchase :is(
    .store-variations__color.is-active,
    .store-variations__choice.is-active
) {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 14%, var(--surface-secondary)) !important;
}

:root[data-color-theme="dark"] body.is-store-product .store-detail__price-old {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] .store-card__cta--disabled {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: #393b40 !important;
}

:root[data-color-theme="dark"] :is(
    .site-search__field,
    .search,
    .icon-btn,
    .btn-ghost,
    .m-card,
    .m-list,
    .m-apps,
    .m-pc,
    .m-btn-ghost,
    .site-search__dropdown
) {
    color: var(--text-primary);
    border-color: var(--border);
    background: var(--surface);
}

:root[data-color-theme="dark"] :is(input, select, textarea) {
    color: var(--text-primary);
    border-color: var(--border);
    background: #292b2f;
}

:root[data-color-theme="dark"] :is(input, textarea)::placeholder { color: #9399a3; }
:root[data-color-theme="dark"] :is(.store-card__media, .store-detail__media-frame, .home-banner-slider, .home-category-card__media) {
    border-color: var(--border);
    background-color: var(--surface-secondary);
}

:root[data-color-theme="dark"] :is(
    .site-page-section,
    .home-page-builder
) {
    color: var(--text-primary);
    background-color: var(--bg);
}

/* These are layout canvases, not cards. Keeping them transparent prevents a
   second dark rectangle from appearing behind rows, product summaries and
   related-product rails. This block intentionally comes after legacy rules. */
:root[data-color-theme="dark"] :is(
    .store-detail__summary,
    .store-detail__intro,
    .store-card__body,
    .home-categories,
    .home-category-card,
    .store-product-banner-row,
    .store-product-banner-row__body,
    .store-product-banner-row__products,
    .store-product-banner-row__carousel,
    .store-product-banner-row__carousel .play-carousel,
    .store-product-banner-row__carousel .play-carousel__viewport,
    .store-detail__modules,
    .store-section--related,
    .store-section--related .store-product-carousel,
    .store-section--related .play-carousel,
    .store-section--related .play-carousel__viewport
) {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none;
}

:root[data-color-theme="dark"] body.is-store-product :is(
    .store-detail__summary,
    .store-detail__intro
) {
    color: var(--text-primary);
}

:root[data-color-theme="dark"] body.is-store-product .store-detail--joyful .store-detail__hero {
    border-color: transparent !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

:root[data-color-theme="dark"] body.is-home .home-category-card__media {
    border-color: transparent !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

:root[data-color-theme="dark"] :is(h1, h2, h3, h4, h5, h6, strong, dt, .store-card__title, .store-detail__title) {
    color: var(--text-primary);
}

:root[data-color-theme="dark"] :is(p, dd, li, .store-detail__description, .store-detail__body, .post-card__excerpt) {
    border-color: var(--border);
}

:root[data-color-theme="dark"] :is(.sf-footer, .m-tabbar) {
    color: var(--text-primary);
    border-color: var(--border);
    background: #2b2d31;
}

/* Theme-based pages use the compact `.site-footer` footer instead of the
   modular `.sf-footer`. Keep both render trees on the same dark palette. */
:root[data-color-theme="dark"] .site-footer {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: #2b2d31 !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] .site-footer :is(
    .ft-grid,
    .ft-about,
    .ft-bar
) {
    border-color: var(--border) !important;
    background: transparent !important;
}

:root[data-color-theme="dark"] .site-footer :is(
    .ft-title,
    .ft-hours b,
    .ft-phones a,
    .brand-name,
    strong
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] .site-footer :is(
    .ft-about p,
    .ft-links a,
    .ft-hours span,
    .ft-addr,
    .ft-addr a,
    .ft-bar,
    .finowhale-credit,
    .finowhale-credit a
) {
    color: var(--text-tertiary) !important;
}

:root[data-color-theme="dark"] .site-footer :is(.enamad, .rss) {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] .site-footer :is(.ft-seals a, .sf-footer__trust-seal) {
    background: #fff;
}
:root[data-color-theme="dark"] .sf-footer,
:root[data-color-theme="dark"] .sf-footer__benefits {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: #2b2d31 !important;
}
:root[data-color-theme="dark"] :is(.sf-footer__col-title, .sf-footer__benefit h2, .sf-footer__brand, .sf-footer__brand small, .sf-footer__social-strip-title) {
    color: var(--text-primary) !important;
}
:root[data-color-theme="dark"] :is(.sf-footer__text, .sf-footer__benefit p, .sf-footer__list a, .sf-footer__contact a, .sf-footer__address, .sf-footer__copyright) {
    color: var(--text-tertiary) !important;
}
:root[data-color-theme="dark"] :is(.sf-footer__certs--inmod > a, .sf-footer__certs--inmod > span, .sf-footer__trust-seal) {
    background: #fff;
}

/* Store catalog themes still contain legacy literal white surfaces. */
:root[data-color-theme="dark"] body.is-store :is(
    .st-catnav,
    .st-filters,
    .st-catnav__mega-panel,
    .st-toolbar,
    .st-view,
    .sc,
    .store-card,
    .store-list-item
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .st-catnav__toggle,
    .st-catnav__mega > summary,
    .st-catnav__tools .st-catnav__mega--cats > summary,
    .st-fbtn,
    .st-sort select,
    .st-view a,
    .st-catnav__pill,
    .sf-list em
) {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background-color: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .st-catnav__pill em,
    .sf-list a.on em
) {
    color: var(--text-secondary) !important;
    background: #292b2f !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .st-catnav__pill.on,
    .st-catnav__pill:hover,
    .st-catnav__toggle.on,
    .sf-list a.on
) {
    color: var(--text-primary) !important;
    border-color: color-mix(in srgb, var(--primary) 52%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 18%, #303236) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .sc-body,
    .store-card__body,
    .store-card__footer
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: transparent !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .sc-title,
    .sc-title a,
    .sc-price b,
    .store-card__title,
    .store-card__title a,
    .store-card__price-current
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .sc-meta,
    .sc-tag,
    .sc-price span,
    .sc-price s,
    .store-card__meta,
    .store-card__price-old
) {
    color: var(--text-tertiary) !important;
}

/* Cart and checkout use light gradients and translucent white panels in the
   base stylesheet. Replace the full shorthand so no pale layer survives. */
:root[data-color-theme="dark"] body.is-store :is(
    .checkout-progress,
    .checkout-form__section,
    .checkout-form__section-head,
    .order-summary,
    .order-summary__line,
    .order-summary__totals,
    .checkout-address-card,
    .checkout-option-card,
    .cart-item,
    .cart-summary
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-form__section-head,
    .order-summary__line,
    .order-summary__totals,
    .checkout-address-card,
    .checkout-option-card
) {
    background: #2b2d31 !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-address-card:hover,
    .checkout-option-card:hover,
    .checkout-address-card.is-selected,
    .checkout-option-card.is-selected
) {
    border-color: color-mix(in srgb, var(--primary) 62%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 14%, #303236) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-address-card__mark,
    .checkout-option-card__mark,
    .checkout-progress__marker
) {
    color: var(--text-secondary);
    border-color: var(--border);
    background: #393b40;
}

:root[data-color-theme="dark"] body.is-store .checkout-progress__steps::before {
    background: linear-gradient(90deg, #3b4b5e 0%, #355678 45%, #4b4e54 100%);
}

:root[data-color-theme="dark"] body.is-store .checkout-progress__step--done .checkout-progress__marker {
    color: #6ee7b7;
    border-color: #059669;
    background: #163d31;
}

:root[data-color-theme="dark"] body.is-store .checkout-progress__step--active .checkout-progress__marker,
:root[data-color-theme="dark"] body.is-store .checkout-progress__step--upcoming a.checkout-progress__link .checkout-progress__marker {
    color: #93c5fd;
    border-color: var(--primary);
    background: #203b58;
}

:root[data-color-theme="dark"] body.is-store a.checkout-progress__link:hover {
    background: #393b40;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-form__section-title,
    .checkout-address-card__location,
    .checkout-delivery-method__head strong,
    .checkout-payment-method__title,
    .order-summary__title,
    .order-summary__line-name,
    .order-summary__line-price,
    .order-summary__row dd,
    .cart-item__name
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-form__section-sub,
    .checkout-address-card__street,
    .checkout-address-card__meta,
    .checkout-delivery-method__desc,
    .checkout-payment-method__desc,
    .checkout-delivery-hint,
    .order-summary__line-meta,
    .order-summary__row dt,
    .order-summary__grand-label,
    .order-summary__trust-item
) {
    color: var(--text-tertiary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-summary__qty,
    .checkout-form__readonly,
    .checkout-address-fields.is-from-saved input,
    .checkout-address-fields.is-from-saved textarea,
    .checkout-address-fields.is-from-saved select
) {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: #393b40 !important;
}

:root[data-color-theme="dark"] body.is-store :is(.order-summary__thumb, .cart-item__media) {
    border-color: var(--border);
    background: #fff;
}

:root[data-color-theme="dark"] body.is-store .checkout-coupon {
    border-color: var(--border);
    background: #2b2d31;
}

:root[data-color-theme="dark"] body.is-store .checkout-coupon__input {
    border-color: var(--border);
    background: #393b40;
    color: var(--text-primary);
}

:root[data-color-theme="dark"] body.is-store .checkout-coupon__label {
    color: var(--text-primary);
}

/* Cart, account authentication and product feedback still have legacy light
   shorthands in store.css/site.css. Keep these component-level overrides here
   so every storefront theme receives the same readable dark treatment. */
:root[data-color-theme="dark"] body.is-store .cart-page__count {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-auth-card {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
    box-shadow: var(--shadow-md) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-auth-card__icon {
    color: #93c5fd;
    background: #203b58;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 45%, var(--border));
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-auth-card__title,
    .checkout-auth-form__field span
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-auth-card__desc,
    .checkout-auth-card__note,
    .checkout-auth-card__back
) {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-auth-form__field input {
    color: var(--text-primary) !important;
    caret-color: var(--text-primary);
    border-color: var(--border) !important;
    background: #292b2f !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-auth-form__field input::placeholder {
    color: var(--text-tertiary);
    opacity: 1;
}

/* Account, order tracking and offline-payment pages still contain legacy
   light gradient shorthands. Reset the complete surfaces here so every
   storefront theme gets the same readable dark treatment. */
:root[data-color-theme="dark"] body.is-store :is(
    .checkout-success-banner,
    .checkout-bank-transfer__fact,
    .checkout-bank-transfer__file,
    .checkout-bank-transfer__instructions,
    .checkout-bank-transfer__message,
    .checkout-bank-transfer__receipt-state,
    .account-profile__hero,
    .account-profile__actions,
    .account-tier,
    .account-address-card,
    .account-address-add,
    .order-status-track,
    .order-status-track__detail,
    .order-card__footer,
    .my-order-card,
    .my-order-product,
    .my-order-card__empty-products
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-bank-transfer__fact,
    .checkout-bank-transfer__file,
    .checkout-bank-transfer__file input[type="file"],
    .account-profile__actions,
    .account-address-card,
    .account-address-add,
    .order-status-track__detail,
    .order-card__footer,
    .my-order-product,
    .my-order-product__quantity
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store .account-tier.is-active {
    border-color: #047857 !important;
    background: color-mix(in srgb, #059669 14%, var(--surface)) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-success-banner__text,
    .checkout-bank-transfer__fact-value,
    .checkout-bank-transfer__file-title,
    .checkout-bank-transfer__receipt-state strong,
    .account-profile__title,
    .account-tier__title,
    .account-address-card__location,
    .account-address-add__summary,
    .order-status-track__label,
    .order-status-track__detail,
    .my-order-card__state h2,
    .my-order-delivery h3,
    .my-order-card__products-head h3,
    .my-order-product__name,
    .my-order-card__meta strong
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .checkout-bank-transfer__fact-label,
    .checkout-bank-transfer__file-help,
    .checkout-bank-transfer__pending,
    .checkout-bank-transfer__lead,
    .checkout-bank-transfer__receipt-state span:not(.checkout-bank-transfer__receipt-check),
    .account-profile__meta,
    .account-profile__lead,
    .account-tier__desc,
    .account-tier__detail,
    .account-address-card__street,
    .account-address-card__meta,
    .order-status-track__time,
    .order-status-track__detail p,
    .my-order-card__meta,
    .my-order-card__eyebrow,
    .my-order-delivery p,
    .my-order-progress__labels,
    .my-order-progress small,
    .my-order-card__scroll-hint,
    .my-order-product__variant,
    .my-order-card__empty-products
) {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-success-banner {
    border-color: #047857 !important;
    background: color-mix(in srgb, #059669 12%, var(--surface)) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-success-banner--subtle {
    border-color: color-mix(in srgb, var(--primary) 55%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 10%, var(--surface)) !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-success-banner__icon {
    color: #6ee7b7 !important;
    background: #163d31 !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-success-banner--subtle .checkout-success-banner__icon {
    color: #93c5fd !important;
    background: #203b58 !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-bank-transfer__fact--amount .checkout-bank-transfer__fact-value {
    color: #fb7185 !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-bank-transfer__file input[type="file"]::file-selector-button {
    color: #fecdd3 !important;
    background: #51313a !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-bank-transfer__receipt-state {
    color: #6ee7b7 !important;
    border-color: #047857 !important;
    background: #163d31 !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-bank-transfer__receipt-check {
    color: #6ee7b7 !important;
    background: #0f2f26 !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .account-profile__logout,
    .account-profile__logout-btn,
    .account-address-card__delete
) {
    color: #fca5a5 !important;
    border-color: #7f1d1d !important;
    background: #3a2528 !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .account-profile__logout:hover,
    .account-profile__logout-btn:hover,
    .account-address-card__delete:hover
) {
    color: #fecaca !important;
    border-color: #ef4444 !important;
    background: #4b272b !important;
}

:root[data-color-theme="dark"] body.is-store .order-status-track__steps::before {
    background: #4b4e54 !important;
}

:root[data-color-theme="dark"] body.is-store .order-status-track__step--upcoming :is(
    .order-status-track__label,
    .order-status-track__time
) {
    color: var(--text-tertiary) !important;
}

:root[data-color-theme="dark"] body.is-store .order-status-track__marker {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store .order-status-track__step--done .order-status-track__marker {
    color: #6ee7b7 !important;
    border-color: #059669 !important;
    background: #163d31 !important;
}

:root[data-color-theme="dark"] body.is-store .order-status-track__step--active .order-status-track__marker {
    color: #93c5fd !important;
    border-color: var(--primary) !important;
    background: #203b58 !important;
}

:root[data-color-theme="dark"] body.is-store .checkout-progress__caption {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
    border-radius: var(--radius-lg);
    padding: .75rem .9rem;
}

:root[data-color-theme="dark"] body.is-store .checkout-complete-actions .btn-store--ghost {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .my-order-card__head,
    .my-order-card__products-pane
) {
    border-color: var(--border) !important;
}

:root[data-color-theme="dark"] body.is-store .my-order-card__open {
    color: var(--text-primary) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store .my-order-progress__bar {
    background: var(--border) !important;
}

:root[data-color-theme="dark"] body.is-store .my-order-product__thumb {
    border-color: var(--border) !important;
    background: #fff !important;
}

:root[data-color-theme="dark"] body.is-store .order-balance {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-balance__notice,
    .order-balance__bank-guide,
    .order-balance__refund-form
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-balance__head strong,
    .order-balance__refund-form label
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-balance__head p,
    .order-balance__refund-form p
) {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-balance__form input,
    .order-balance__refund-form input
) {
    color: var(--text-primary) !important;
    caret-color: var(--text-primary);
    border-color: var(--border) !important;
    background: #292b2f !important;
}

:root[data-color-theme="dark"] body.is-store :is(
    .order-balance__form input,
    .order-balance__refund-form input
)::placeholder {
    color: var(--text-tertiary) !important;
    opacity: 1;
}

:root[data-color-theme="dark"] .footer-info-page__content > .site-page-section {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] .footer-info-page__content :is(
    .cms-block--heading h1,
    .cms-block--heading h2,
    .cms-block--heading h3
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] .footer-info-page__content .cms-block--paragraph {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] .context-bottom-content {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] .context-bottom-content__title {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] .context-bottom-content__text {
    color: var(--text-secondary) !important;
}

/* Article themes (especially Neon) define light gradient shorthands after the
   base article stylesheet. Reset the full article surface in dark mode so the
   body, tags and sharing footer remain readable as one coherent card. */
:root[data-color-theme="dark"] body.is-article :is(
    .article-card,
    .article-card__header,
    .article-card__body,
    .article-card__tags,
    .article-card__footer
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-article :is(
    .article-card__lead,
    .article-card__meta,
    .article-card__body.prose,
    .article-card__body.prose p,
    .article-card__body.prose li,
    .social-share__label
) {
    color: var(--text-secondary) !important;
}

:root[data-color-theme="dark"] body.is-article :is(
    .article-card__title,
    .article-card__body.prose h2,
    .article-card__body.prose h3,
    .article-card__body.prose h4,
    .article-card__body.prose strong
) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-article :is(
    .article-card__badge,
    .article-card__tag,
    .article-card__back,
    .social-share__btn,
    .article-card__body.prose blockquote,
    .article-card__body.prose pre,
    .article-card__body.prose code
) {
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
    background-image: none !important;
    box-shadow: none !important;
}

:root[data-color-theme="dark"] body.is-article :is(
    .article-card__back:hover,
    .article-card__tag:hover,
    .social-share__btn:hover
) {
    color: var(--text-primary) !important;
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 14%, var(--surface-secondary)) !important;
}

:root[data-color-theme="dark"] body.is-article .social-share__btn svg {
    color: inherit;
    fill: currentColor;
}

:root[data-color-theme="dark"] :is(body.is-store, body.is-store-product) .cart-quantity-control {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] :is(body.is-store, body.is-store-product) .cart-quantity-control__value {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] :is(body.is-store, body.is-store-product) .cart-quantity-control__button:disabled {
    color: var(--disabled) !important;
}

:root[data-color-theme="dark"] .cart-toast {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    box-shadow: var(--shadow-md) !important;
}

:root[data-color-theme="dark"] .cart-toast__text,
:root[data-color-theme="dark"] .cart-toast__text strong {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] .cart-toast__check {
    color: #6ee7b7;
    background: #163d31;
}

:root[data-color-theme="dark"] .cart-toast__link {
    color: #60a5fa !important;
}

/* Home news hero and article cards share the page's dark surfaces. */
:root[data-color-theme="dark"] body.is-home :is(
    .home-hero,
    .home-hero__thumbs,
    .home-hero__thumb,
    .home-articles,
    .home-articles__lead,
    .home-articles--grid,
    .home-panel .post-card,
    .home-panel .post-card__link
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    background-image: none !important;
}

:root[data-color-theme="dark"] body.is-home :is(
    .home-hero__thumb:hover,
    .home-hero__thumb.is-active,
    .post-card__placeholder,
    .post-card__footer
) {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface-secondary) !important;
}

:root[data-color-theme="dark"] body.is-home :is(.home-hero__thumb-title, .post-card__title, .post-card__title a) {
    color: var(--text-primary) !important;
}

:root[data-color-theme="dark"] body.is-home :is(.post-card__excerpt, .post-card__date) {
    color: var(--text-tertiary) !important;
}

/* Store-forward theme: its hero and category chips use fixed light colours. */
:root[data-color-theme="dark"] body.is-home .spot {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: linear-gradient(135deg, #303236 0%, #333740 55%, #373342 100%) !important;
    box-shadow: var(--shadow-soft), 0 0 0 1px color-mix(in srgb, var(--primary) 24%, transparent) !important;
}

:root[data-color-theme="dark"] body.is-home .spot :is(h2, p, .sprice b) {
    color: var(--text-primary) !important;
    background: transparent !important;
}

:root[data-color-theme="dark"] body.is-home .spot :is(.sprice span, .sw small) {
    color: var(--text-tertiary) !important;
}

:root[data-color-theme="dark"] body.is-home .spot .eyebrow {
    color: #8ec5ff !important;
    background: color-mix(in srgb, var(--primary) 22%, #303236) !important;
}

:root[data-color-theme="dark"] body.is-home .spot-img img {
    mix-blend-mode: normal;
}

:root[data-color-theme="dark"] body.is-home .chips .chip {
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
    background: var(--surface) !important;
    box-shadow: var(--shadow-soft) !important;
}

:root[data-color-theme="dark"] body.is-home .chips .chip.all {
    color: #8ec5ff !important;
    border-color: color-mix(in srgb, var(--primary) 30%, var(--border)) !important;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface)) !important;
}

:root[data-color-theme="dark"] :is(.sf-footer a, .m-tabbar a, .site-nav a, .hdr-nav a) { color: var(--text-secondary); }
:root[data-color-theme="dark"] :is(.sf-footer a:hover, .m-tabbar a.on, .site-nav a.is-active, .hdr-nav a.is-active) { color: var(--primary); }
:root[data-color-theme="dark"] :is(.store-detail__tagline, .store-detail__price-label, .store-card__meta, .store-card__excerpt, small) { color: var(--text-tertiary); }

.site-color-theme-toggle {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 13px;
    color: var(--text-primary);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    cursor: pointer;
    transition: transform .18s ease, color .18s ease, background .18s ease, border-color .18s ease;
}
.site-color-theme-toggle:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 50%, var(--border)); transform: translateY(-1px); }
.site-color-theme-toggle__sun { display: none; }
:root[data-color-theme="dark"] .site-color-theme-toggle__moon { display: none; }
:root[data-color-theme="dark"] .site-color-theme-toggle__sun { display: block; }
:root[data-color-theme="dark"] .site-color-theme-toggle { background: #383a3f; }

@media (max-width: 640px) {
    .site-color-theme-toggle { width: 40px; height: 40px; border-radius: 12px; }
}