/* Text-only darkening: activity 5%, dialogs and recharge 25%. Never on purchase. */
/* color, font metrics, backgrounds, borders, fill, stroke and filters remain untouched. */
@supports (-webkit-text-fill-color: color-mix(in srgb, currentColor 95%, black 5%)) {
  :where(body[data-page='activity'], body[data-page='recharge']),
  :where(body[data-page='activity'], body[data-page='recharge']) * {
    -webkit-text-fill-color: color-mix(in srgb, currentColor 95%, black 5%);
  }

  /* A placeholder has its own color; avoid inheriting its input text fill. */
  :where(body[data-page='activity'], body[data-page='recharge']) ::placeholder {
    -webkit-text-fill-color: color-mix(in srgb, currentColor 95%, black 5%);
  }

  /* Stronger text contrast is limited to activity dialogs and recharge screens. */
  :where(body[data-page='activity']) dialog,
  :where(body[data-page='activity']) dialog *,
  :where(body[data-page='recharge']),
  :where(body[data-page='recharge']) * {
    -webkit-text-fill-color: color-mix(in srgb, currentColor 75%, black 25%);
  }

  :where(body[data-page='activity']) dialog ::placeholder,
  :where(body[data-page='recharge']) ::placeholder {
    -webkit-text-fill-color: color-mix(in srgb, currentColor 75%, black 25%);
  }

  /* White call-to-action text retains its existing brightness. */
  :where(body[data-page='activity'])
    dialog
    :where(
      .primary-button:not(:disabled),
      .withdraw-submit:not(:disabled),
      .withdraw-bind-button:not(:disabled)
    ),
  :where(body[data-page='activity'])
    dialog
    :where(
      .primary-button:not(:disabled),
      .withdraw-submit:not(:disabled),
      .withdraw-bind-button:not(:disabled)
    )
    *,
  :where(body[data-page='recharge'])
    :where(.usdt-continue:not(:disabled), .recharge-submit:not(:disabled)),
  :where(body[data-page='recharge'])
    :where(.usdt-continue:not(:disabled), .recharge-submit:not(:disabled))
    * {
    -webkit-text-fill-color: color-mix(in srgb, currentColor 95%, black 5%);
  }

  /* Reset inherited text fill on SVGs and existing pure glyph icons. */
  :where(body[data-page='activity'], body[data-page='recharge'])
    :is(
      svg,
      svg *,
      .shortcut-icon,
      .shortcut-icon *,
      .empty-icon,
      .empty-icon *,
      .my-empty-symbol,
      .my-empty-symbol *,
      .dialog-close,
      .dialog-close *,
      .dialog-brand,
      .dialog-brand *,
      .success-mark,
      .success-mark *,
      .avatar,
      .avatar *,
      .task-icon,
      .task-icon *,
      .order-icon,
      .order-icon *,
      .feature-icon,
      .feature-icon *,
      .hero-spark,
      .hero-spark *,
      .more-button,
      .more-button *,
      .text-link > span,
      .primary-button > span
    ) {
    -webkit-text-fill-color: initial;
  }

  /* Existing generated content is decorative (including the selected check). */
  :where(body[data-page='activity'], body[data-page='recharge']) *::before,
  :where(body[data-page='activity'], body[data-page='recharge']) *::after {
    -webkit-text-fill-color: initial;
  }
}
