feat(theme): improved color contrast with color palette (#28791)

Issue number: Internal

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

The team would like to ensure that Ionic Framework components that use
an Ionic color (primary, secondary, etc) on top of a contrast color pass
minimum contrast ratios as defined in the WCAG.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Introduces a revised set of Ionic colors that pass AA color contrast
guidelines when with the appropriate contrast.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

---------

Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
Co-authored-by: Brandy Carney <brandy@ionic.io>
Co-authored-by: Sean Perkins <sean@ionic.io>
Co-authored-by: Shawn Taylor <shawn@ionic.io>
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com>
Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com>
Co-authored-by: ionitron <hi@ionicframework.com>

core/src/components/select-popover/test/a11y/select-popover.e2e.ts

@@ -0,0 +1,36 @@
+import AxeBuilder from '@axe-core/playwright';
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ directions: ['ltr'], themes: ['dark', 'light'] }).forEach(({ config, title }) => {
+  test.describe(title('select-popover: a11y'), () => {
+    test('should not have accessibility violations when header is defined', async ({ page }) => {
+      await page.setContent(
+        `
+          <ion-popover is-open="true">
+            <ion-select-popover multiple="false"></ion-select-popover>
+          </ion-popover>
+
+          <script>
+            const selectPopover = document.querySelector('ion-select-popover');
+            selectPopover.options = [
+              { value: 'apple', text: 'Apple', disabled: false, checked: true },
+              { value: 'banana', text: 'Banana', disabled: false, checked: false },
+            ];
+          </script>
+        `,
+        config
+      );
+
+      const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
+      const popover = page.locator('ion-popover');
+
+      await popover.evaluate((el: HTMLIonPopoverElement) => el.present());
+      await ionPopoverDidPresent.next();
+
+      // TODO(FW-5698): remove withRules() call and resolve Axe errors
+      const results = await new AxeBuilder({ page }).withRules('color-contrast').analyze();
+      expect(results.violations).toEqual([]);
+    });
+  });
+});