feat: unify saved payment methods view

[jakubjasinsky]

Summary

Refactors saved payment methods (saved cards and saved APMs) in Dynamic Checkout to act as direct click-to-pay buttons instead of the previous radio-button-select → expand → click-pay-button flow. Each saved method now renders as a standalone bordered card with centered logo and description that triggers payment immediately on click.

Changes

New base class

• Added SavedPaymentMethodButton abstract class (elements/saved-payment-method-button.ts) that creates a <button> element with centered logo + description badge
• Includes setLoading() that preserves button height while replacing content with a spinner
• Handles delete mode by rendering a <div> with a delete button instead

Saved Card & Saved APM refactors

• Both SavedCardPaymentMethod and SavedApmPaymentMethod now extend SavedPaymentMethodButton instead of PaymentMethodButton
• Removed radio button selection, expandable children container, and separate pay button
• Click handler attached directly to the element, triggering payment immediately
• Removed theme dependency (no longer needed without a separate pay button to style)
• All payment handling logic (success/error/pending, redirect flows) preserved as-is

View & layout changes

• Saved methods now render in a .dco-saved-payment-methods-wrapper (flex column, 8px gap) instead of the grouped .dco-express-checkout-payment-methods-wrapper
• Each saved method is a standalone bordered card rather than grouped in a single bordered container
• Removed the role="radiogroup" wrapper since saved methods are no longer radio inputs
• Updated deletePaymentMethodFromDom to query the new wrapper class

Type changes

• PaymentMethodsManager now accepts { element: HTMLElement }[] instead of PaymentMethodButton[] since saved methods no longer extend PaymentMethodButton

Impact

• Saved payment methods UX changes from two-step (select + pay) to single-click
• Visual layout changes: standalone bordered cards with centered content instead of grouped radio list
• No breaking changes to payment processing logic — all event dispatching and API calls remain identical
• Delete mode in the payment methods manager modal continues to work unchanged

Testing Plan

• Verify saved card renders as a standalone bordered card with centered logo (24x24) and description
• Verify saved APM renders the same way
• Click a saved card → payment should trigger immediately (no radio select step)
• Click a saved APM → payment should trigger immediately
• Verify loading state: button shows spinner, maintains same height, and is disabled
• Verify payment success/error/pending views render correctly after payment completes
• Open settings modal (cog icon) → verify delete mode shows delete buttons on saved methods
• Delete a saved method → verify it's removed from both the modal and the express checkout section
• Verify multiple saved methods each have their own border with 8px gap between them
• Test with saved APM that has a redirect URL (redirect flow should still work)

Additional Context

The previous PaymentMethodButton base class is architecturally designed around the radio-select → expand → interact pattern (uses a <label for="radio"> with CSS :has(input:checked) to reveal children). Rather than adding conditional flags to support direct-click behavior, a new lightweight SavedPaymentMethodButton base class was created to keep both patterns simple and focused. The only shared contract needed by PaymentMethodsManager is { element: HTMLElement }.