/**
 * Mollie UI global tokens
 * Do not edit directly
 * Generated on Fri, 19 Dec 2025 12:17:33 GMT
 */

:root,
[data-mollie-ui-theme="light"],
[data-mollie-ui-theme="auto"] {
  --mollie-ui-space-1200: 6rem;
  --mollie-ui-space-1100: 5.5rem;
  --mollie-ui-space-1000: 5rem;
  --mollie-ui-space-900: 4.5rem;
  --mollie-ui-space-800: 4rem;
  --mollie-ui-space-700: 3.5rem;
  --mollie-ui-space-600: 3rem;
  --mollie-ui-space-500: 2.5rem;
  --mollie-ui-space-400: 2rem;
  --mollie-ui-space-300: 1.5rem;
  --mollie-ui-space-200: 1rem;
  --mollie-ui-space-150: 0.75rem;
  --mollie-ui-space-100: 0.5rem;
  --mollie-ui-space-50: 0.25rem;
  --mollie-ui-space-25: 0.125rem;
  --mollie-ui-space-0: 0;
  --mollie-ui-size-700: 4rem;
  --mollie-ui-size-600: 3rem;
  --mollie-ui-size-500: 2.5rem;
  --mollie-ui-size-400: 2rem;
  --mollie-ui-size-300: 1.5rem;
  --mollie-ui-size-200: 1.25rem;
  --mollie-ui-size-100: 1rem;
  --mollie-ui-size-50: 0.75rem;
  --mollie-ui-size-25: 0.5rem;
  --mollie-ui-shadow-inputs: 0 0 4px 0 #0000000d, 0 1.5px 2px 0 #0000000d;
  --mollie-ui-shadow-default: 0 1px 0 0 #0000000d, 0 4px 8px 0 #0000000d,
    0 12px 24px 0 #0000000d;
  --mollie-ui-page-size-width: 80rem;
  --mollie-ui-page-size-height: 64rem;
  --mollie-ui-line-height-spaced: 1.5;
  --mollie-ui-line-height-dense: 1;
  --mollie-ui-line-height-default: 1.3;
  --mollie-ui-letter-spacing-spaced: 0.02em;
  --mollie-ui-letter-spacing-dense: -0.01em;
  --mollie-ui-letter-spacing-default: 0;
  --mollie-ui-icon-size-default: 1rem;
  --mollie-ui-font-weight-semi-bold: 600;
  --mollie-ui-font-weight-regular-code: 500;
  --mollie-ui-font-weight-regular: 400;
  --mollie-ui-font-weight-medium: 500;
  --mollie-ui-font-size-900: 1.875rem;
  --mollie-ui-font-size-800: 1.75rem;
  --mollie-ui-font-size-700: 1.625rem;
  --mollie-ui-font-size-600: 1.5rem;
  --mollie-ui-font-size-500: 1.375rem;
  --mollie-ui-font-size-400: 1.25rem;
  --mollie-ui-font-size-300: 1.125rem;
  --mollie-ui-font-size-200: 1rem;
  --mollie-ui-font-size-100: 0.875rem;
  --mollie-ui-font-size-75: 0.75rem;
  --mollie-ui-font-size-50: 0.625rem;
  --mollie-ui-font-size-25: 0.5rem;
  --mollie-ui-font-family-code: ui-monospace, Menlo, Monaco, "Cascadia Mono",
    "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace",
    "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
  --mollie-ui-font-family-brand: Inter, -apple-system, "BlinkMacSystemFont",
    "Segoe UI", "Roboto", "Helvetica", "Arial", sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol";
  --mollie-ui-color-palette-yellow-800: #664c11;
  --mollie-ui-color-palette-yellow-700: #8b6900;
  --mollie-ui-color-palette-yellow-600: #cc9822;
  --mollie-ui-color-palette-yellow-500: #e6ab26;
  --mollie-ui-color-palette-yellow-50: #fffcf4;
  --mollie-ui-color-palette-yellow-400: #f0c369;
  --mollie-ui-color-palette-yellow-300: #fad47d;
  --mollie-ui-color-palette-yellow-200: #ffe5aa;
  --mollie-ui-color-palette-yellow-100: #fff2d4;
  --mollie-ui-color-palette-white: #ffffff;
  --mollie-ui-color-palette-red-800: #660012;
  --mollie-ui-color-palette-red-700: #99001c;
  --mollie-ui-color-palette-red-600: #cc0025;
  --mollie-ui-color-palette-red-500: #e60029;
  --mollie-ui-color-palette-red-50: #fff2f5;
  --mollie-ui-color-palette-red-400: #ff6982;
  --mollie-ui-color-palette-red-300: #ff99ab;
  --mollie-ui-color-palette-red-200: #ffccd5;
  --mollie-ui-color-palette-red-100: #ffe6ea;
  --mollie-ui-color-palette-purple-700: #7b0da1;
  --mollie-ui-color-palette-purple-600: #910fbe;
  --mollie-ui-color-palette-purple-500: #b513ee;
  --mollie-ui-color-palette-purple-100: #f6ccff;
  --mollie-ui-color-palette-green-800: #144513;
  --mollie-ui-color-palette-green-700: #1e681d;
  --mollie-ui-color-palette-green-600: #288a26;
  --mollie-ui-color-palette-green-500: #32ad30;
  --mollie-ui-color-palette-green-50: #f5fbf5;
  --mollie-ui-color-palette-green-400: #75cc72;
  --mollie-ui-color-palette-green-300: #9ed99c;
  --mollie-ui-color-palette-green-200: #c2e6c1;
  --mollie-ui-color-palette-green-100: #ebf7ea;
  --mollie-ui-color-palette-gray-800: #383633;
  --mollie-ui-color-palette-gray-75: #faf8f7;
  --mollie-ui-color-palette-gray-700: #595653;
  --mollie-ui-color-palette-gray-600: #7d7975;
  --mollie-ui-color-palette-gray-500: #b2aeaa;
  --mollie-ui-color-palette-gray-50: #fcfbfa;
  --mollie-ui-color-palette-gray-400: #c2beba;
  --mollie-ui-color-palette-gray-300: #e0ddda;
  --mollie-ui-color-palette-gray-200: #edeae8;
  --mollie-ui-color-palette-gray-100: #f5f2f0;
  --mollie-ui-color-palette-brown-900: #331300;
  --mollie-ui-color-palette-brown-800: #4d2205;
  --mollie-ui-color-palette-brown-700: #5e2b08;
  --mollie-ui-color-palette-brown-600: #734626;
  --mollie-ui-color-palette-brown-500: #99623c;
  --mollie-ui-color-palette-brown-50: #f5eae4;
  --mollie-ui-color-palette-brown-400: #c78b61;
  --mollie-ui-color-palette-brown-300: #e0b190;
  --mollie-ui-color-palette-brown-200: #ebd2c0;
  --mollie-ui-color-palette-brown-100: #f2e1d5;
  --mollie-ui-color-palette-blue-800: #002699;
  --mollie-ui-color-palette-blue-75: #d9e2ff;
  --mollie-ui-color-palette-blue-700: #0033cc;
  --mollie-ui-color-palette-blue-600: #003ae6;
  --mollie-ui-color-palette-blue-500: #0040ff;
  --mollie-ui-color-palette-blue-50: #e6ecff;
  --mollie-ui-color-palette-blue-400: #3366ff;
  --mollie-ui-color-palette-blue-300: #99b3ff;
  --mollie-ui-color-palette-blue-25: #f5f7ff;
  --mollie-ui-color-palette-blue-200: #b4c6fa;
  --mollie-ui-color-palette-blue-100: #ccd9ff;
  --mollie-ui-color-palette-black: #121110;
  --mollie-ui-color-palette-alpha-20: rgba(0, 0, 0, 0.2);
  --mollie-ui-color-palette-alpha-10: rgba(0, 0, 0, 0.1);
  --mollie-ui-color-palette-alpha-05: rgba(0, 0, 0, 0.05);
  --mollie-ui-color-palette-alpha-00: rgba(0, 0, 0, 0);
  --mollie-ui-color-gradient-default-start: #ffffff;
  --mollie-ui-color-gradient-default-end: rgba(255, 255, 255, 0);
  --mollie-ui-color-gradient-default: linear-gradient(
    270deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, 0) 100%
  );
  --mollie-ui-color-components-tooltip-background-default: rgba(
    33,
    33,
    37,
    0.9
  );
  --mollie-ui-color-components-toast-foreground-warning: #ffcb55;
  --mollie-ui-color-components-toast-foreground-positive: #5bbd59;
  --mollie-ui-color-components-toast-foreground-negative: #ff8097;
  --mollie-ui-color-components-toast-background-native: #37373b;
  --mollie-ui-color-components-toast-background-hover: #484750;
  --mollie-ui-color-components-toast-background-default: rgba(33, 33, 37, 0.9);
  --mollie-ui-color-components-navbar-background-default: rgba(
    255,
    255,
    255,
    0.95
  );
  --mollie-ui-color-components-modal-background-overlay: rgba(
    194,
    190,
    186,
    0.2
  );
  --mollie-ui-color-components-menu-background-default: rgba(255, 255, 255, 0);
  --mollie-ui-color-components-footer-background-screen-large: rgba(
    255,
    255,
    255,
    0.9
  );
  --mollie-ui-color-components-date-picker-menu-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-date-picker-calendar-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-charts-legacy-background-secondary: linear-gradient(
    180deg,
    rgba(165, 165, 165, 0.5) 0%,
    rgba(165, 165, 165, 0) 100%
  );
  --mollie-ui-color-components-charts-legacy-background-default: linear-gradient(
    180deg,
    rgba(0, 64, 255, 0.5) 0%,
    rgba(0, 64, 255, 0) 100%
  );
  --mollie-ui-color-components-button-tertiary-inline-background-disabled: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-button-tertiary-inline-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-button-quaternary-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-button-destructive-inline-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-components-banner-dismiss-background-pressed: rgba(
    210,
    211,
    221,
    0.7
  );
  --mollie-ui-color-components-banner-dismiss-background-hover: rgba(
    210,
    211,
    221,
    0.6
  );
  --mollie-ui-color-components-banner-dismiss-background-disabled: rgba(
    210,
    211,
    221,
    0.2
  );
  --mollie-ui-color-components-banner-dismiss-background-default: rgba(
    210,
    211,
    221,
    0.4
  );
  --mollie-ui-color-components-avatar-people-foreground-border: rgba(
    0,
    0,
    0,
    0.1
  );
  --mollie-ui-color-components-avatar-organisation-foreground-border: rgba(
    0,
    0,
    0,
    0.1
  );
  --mollie-ui-color-components-action-list-background-default: rgba(
    255,
    255,
    255,
    0
  );
  --mollie-ui-color-accessibility-focus: #458fff;
  --mollie-ui-border-width-thick: 0.125rem;
  --mollie-ui-border-width-medium: 0.09375rem;
  --mollie-ui-border-width-default: 0.0625rem;
  --mollie-ui-border-radius-smallest: 0.125rem;
  --mollie-ui-border-radius-small: 0.25rem;
  --mollie-ui-border-radius-rounded: 999rem;
  --mollie-ui-border-radius-none: 0;
  --mollie-ui-border-radius-medium: 0.5rem;
  --mollie-ui-border-radius-large: 1rem;
  --mollie-ui-border-radius-extra-large: 1.5rem;
  --mollie-ui-color-typography-warning: var(--mollie-ui-color-palette-black);
  --mollie-ui-color-typography-secondary: var(
    --mollie-ui-color-palette-gray-700
  );
  --mollie-ui-color-typography-primary-inverse: var(
    --mollie-ui-color-palette-white
  );
  --mollie-ui-color-typography-primary: var(--mollie-ui-color-palette-black);
  --mollie-ui-color-typography-positive: var(
    --mollie-ui-color-palette-green-600
  );
  --mollie-ui-color-typography-negative: var(--mollie-ui-color-palette-red-500);
  --mollie-ui-color-typography-interactive: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-typography-discovery: var(
    --mollie-ui-color-palette-purple-600
  );
  --mollie-ui-color-typography-disabled: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-wizards-header-background-hold: var(
    --mollie-ui-color-palette-gray-500
  );
  --mollie-ui-color-components-toggle-interactive-secondary-pressed: var(
    --mollie-ui-color-palette-yellow-700
  );
  --mollie-ui-color-components-toggle-interactive-secondary-hover: var(
    --mollie-ui-color-palette-yellow-600
  );
  --mollie-ui-color-components-toggle-interactive-secondary-default: var(
    --mollie-ui-color-palette-yellow-500
  );
  --mollie-ui-color-components-toggle-interactive-secondary-active: var(
    --mollie-ui-color-palette-yellow-700
  );
  --mollie-ui-color-components-toggle-interactive-primary-pressed: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-components-toggle-interactive-primary-hover: var(
    --mollie-ui-color-palette-green-600
  );
  --mollie-ui-color-components-toggle-interactive-primary-default: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-toggle-interactive-primary-active: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-components-toggle-background-pressed: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-toggle-background-hover: var(
    --mollie-ui-color-palette-gray-500
  );
  --mollie-ui-color-components-toggle-background-default: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-toggle-background-active: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-timeline-foreground-border: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-tag-input-background-pressed: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-tag-input-background-hover: var(
    --mollie-ui-color-palette-gray-75
  );
  --mollie-ui-color-components-tag-input-background-disabled: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-tag-input-background-active: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-tag-filter-foreground-border-hover: var(
    --mollie-ui-color-palette-gray-75
  );
  --mollie-ui-color-components-tag-filter-foreground-border-default: var(
    --mollie-ui-color-palette-white
  );
  --mollie-ui-color-components-tag-filter-foreground-border-active: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-table-header-foreground-default: var(
    --mollie-ui-color-palette-gray-700
  );
  --mollie-ui-color-components-tabbar-foreground-secondary: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-stepper-foreground-divider: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-progress-bar-foreground-secondary: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-progress-bar-background-default: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-menu-background-secondary: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-menu-background-pressed: var(
    --mollie-ui-color-palette-gray-75
  );
  --mollie-ui-color-components-menu-background-hover: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-menu-background-active: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-inputs-foreground-warning: var(
    --mollie-ui-color-palette-yellow-500
  );
  --mollie-ui-color-components-inputs-foreground-positive: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-inputs-foreground-placeholder: var(
    --mollie-ui-color-palette-gray-500
  );
  --mollie-ui-color-components-inputs-foreground-negative: var(
    --mollie-ui-color-palette-red-500
  );
  --mollie-ui-color-components-inputs-foreground-helper: var(
    --mollie-ui-color-palette-gray-700
  );
  --mollie-ui-color-components-inputs-background-disabled: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-charts-legacy-foreground-secondary: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-charts-legacy-foreground-default: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-charts-legacy-blob-border: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-charts-disabled-background-tertiary: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-charts-disabled-background-senary: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-charts-disabled-background-secondary: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-charts-disabled-background-quinary: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-charts-disabled-background-quaternary: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-charts-disabled-background-primary: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-charts-disabled-background-default: var(
    --mollie-ui-color-palette-gray-75
  );
  --mollie-ui-color-components-charts-base-line-tertiary: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-charts-base-line-secondary: var(
    --mollie-ui-color-palette-yellow-500
  );
  --mollie-ui-color-components-charts-base-line-quaternary: var(
    --mollie-ui-color-palette-gray-500
  );
  --mollie-ui-color-components-charts-base-line-primary: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-charts-base-blob-tertiary: var(
    --mollie-ui-color-palette-green-600
  );
  --mollie-ui-color-components-charts-base-blob-secondary: var(
    --mollie-ui-color-palette-yellow-600
  );
  --mollie-ui-color-components-charts-base-blob-quaternary: var(
    --mollie-ui-color-palette-gray-700
  );
  --mollie-ui-color-components-charts-base-blob-primary: var(
    --mollie-ui-color-palette-blue-600
  );
  --mollie-ui-color-components-charts-base-blob-disabled: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-charts-base-background-tertiary: var(
    --mollie-ui-color-palette-yellow-400
  );
  --mollie-ui-color-components-charts-base-background-senary: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-charts-base-background-secondary: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-charts-base-background-quinary: var(
    --mollie-ui-color-palette-blue-50
  );
  --mollie-ui-color-components-charts-base-background-quaternary: var(
    --mollie-ui-color-palette-red-400
  );
  --mollie-ui-color-components-charts-base-background-primary: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-charts-base-background-hover: var(
    --mollie-ui-color-palette-blue-50
  );
  --mollie-ui-color-components-cards-foreground-secondary: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-button-tertiary-inline-foreground-default: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-button-tertiary-inline-background-pressed: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-button-tertiary-inline-background-hover: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-components-button-tertiary-inline-background-active: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-button-secondary-background-hover: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-button-secondary-background-default: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-button-secondary-background-active: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-button-quaternary-background-pressed: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-button-quaternary-background-hover: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-button-quaternary-background-active: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-button-icon-background-pressed: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-button-icon-background-hover: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-components-button-icon-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-button-icon-background-active: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-button-destructive-inline-background-pressed: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-button-destructive-inline-background-hover: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-button-destructive-inline-background-active: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-button-destructive-background-pressed: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-button-destructive-background-hover: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-button-destructive-background-default: var(
    --mollie-ui-color-palette-red-100
  );
  --mollie-ui-color-components-button-destructive-background-active: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-badge-background-warning: var(
    --mollie-ui-color-palette-yellow-500
  );
  --mollie-ui-color-components-badge-background-positive: var(
    --mollie-ui-color-palette-green-500
  );
  --mollie-ui-color-components-badge-background-neutral: var(
    --mollie-ui-color-palette-gray-600
  );
  --mollie-ui-color-components-badge-background-negative: var(
    --mollie-ui-color-palette-red-500
  );
  --mollie-ui-color-components-badge-background-informative: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-components-badge-background-discovery: var(
    --mollie-ui-color-palette-purple-600
  );
  --mollie-ui-color-components-alert-warning-foreground-default: var(
    --mollie-ui-color-palette-yellow-800
  );
  --mollie-ui-color-components-alert-warning-button-secondary-foreground-default: var(
    --mollie-ui-color-palette-yellow-800
  );
  --mollie-ui-color-components-alert-warning-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-yellow-400
  );
  --mollie-ui-color-components-alert-warning-button-secondary-background-hover: var(
    --mollie-ui-color-palette-yellow-200
  );
  --mollie-ui-color-components-alert-warning-button-secondary-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-alert-warning-button-secondary-background-active: var(
    --mollie-ui-color-palette-yellow-400
  );
  --mollie-ui-color-components-alert-warning-button-primary-foreground-default: var(
    --mollie-ui-color-palette-yellow-800
  );
  --mollie-ui-color-components-alert-warning-button-primary-background-pressed: var(
    --mollie-ui-color-palette-yellow-400
  );
  --mollie-ui-color-components-alert-warning-button-primary-background-hover: var(
    --mollie-ui-color-palette-yellow-300
  );
  --mollie-ui-color-components-alert-warning-button-primary-background-default: var(
    --mollie-ui-color-palette-yellow-200
  );
  --mollie-ui-color-components-alert-warning-button-primary-background-active: var(
    --mollie-ui-color-palette-yellow-400
  );
  --mollie-ui-color-components-alert-warning-background-default: var(
    --mollie-ui-color-palette-yellow-100
  );
  --mollie-ui-color-components-alert-success-foreground-default: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-components-alert-success-button-secondary-foreground-default: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-components-alert-success-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-green-400
  );
  --mollie-ui-color-components-alert-success-button-secondary-background-hover: var(
    --mollie-ui-color-palette-green-200
  );
  --mollie-ui-color-components-alert-success-button-secondary-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-alert-success-button-secondary-background-active: var(
    --mollie-ui-color-palette-green-400
  );
  --mollie-ui-color-components-alert-success-button-primary-foreground-default: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-components-alert-success-button-primary-background-pressed: var(
    --mollie-ui-color-palette-green-400
  );
  --mollie-ui-color-components-alert-success-button-primary-background-hover: var(
    --mollie-ui-color-palette-green-300
  );
  --mollie-ui-color-components-alert-success-button-primary-background-default: var(
    --mollie-ui-color-palette-green-200
  );
  --mollie-ui-color-components-alert-success-button-primary-background-active: var(
    --mollie-ui-color-palette-green-400
  );
  --mollie-ui-color-components-alert-success-background-default: var(
    --mollie-ui-color-palette-green-100
  );
  --mollie-ui-color-components-alert-neutral-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-alert-neutral-button-secondary-background-hover: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-alert-neutral-button-secondary-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-alert-neutral-button-secondary-background-active: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-alert-neutral-button-primary-background-pressed: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-alert-neutral-button-primary-background-hover: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-components-alert-neutral-button-primary-background-default: var(
    --mollie-ui-color-palette-gray-200
  );
  --mollie-ui-color-components-alert-neutral-button-primary-background-active: var(
    --mollie-ui-color-palette-gray-400
  );
  --mollie-ui-color-components-alert-informative-foreground-default: var(
    --mollie-ui-color-palette-blue-700
  );
  --mollie-ui-color-components-alert-informative-button-secondary-foreground-default: var(
    --mollie-ui-color-palette-blue-700
  );
  --mollie-ui-color-components-alert-informative-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-alert-informative-button-secondary-background-hover: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-components-alert-informative-button-secondary-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-alert-informative-button-secondary-background-active: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-alert-informative-button-primary-foreground-default: var(
    --mollie-ui-color-palette-blue-700
  );
  --mollie-ui-color-components-alert-informative-button-primary-background-pressed: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-alert-informative-button-primary-background-hover: var(
    --mollie-ui-color-palette-blue-200
  );
  --mollie-ui-color-components-alert-informative-button-primary-background-default: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-components-alert-informative-button-primary-background-active: var(
    --mollie-ui-color-palette-blue-300
  );
  --mollie-ui-color-components-alert-informative-background-default: var(
    --mollie-ui-color-palette-blue-50
  );
  --mollie-ui-color-components-alert-error-foreground-default: var(
    --mollie-ui-color-palette-red-700
  );
  --mollie-ui-color-components-alert-error-button-secondary-foreground-default: var(
    --mollie-ui-color-palette-red-700
  );
  --mollie-ui-color-components-alert-error-button-secondary-background-pressed: var(
    --mollie-ui-color-palette-red-400
  );
  --mollie-ui-color-components-alert-error-button-secondary-background-hover: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-alert-error-button-secondary-background-default: var(
    --mollie-ui-color-palette-alpha-00
  );
  --mollie-ui-color-components-alert-error-button-secondary-background-active: var(
    --mollie-ui-color-palette-red-400
  );
  --mollie-ui-color-components-alert-error-button-primary-foreground-default: var(
    --mollie-ui-color-palette-red-700
  );
  --mollie-ui-color-components-alert-error-button-primary-background-pressed: var(
    --mollie-ui-color-palette-red-400
  );
  --mollie-ui-color-components-alert-error-button-primary-background-hover: var(
    --mollie-ui-color-palette-red-300
  );
  --mollie-ui-color-components-alert-error-button-primary-background-default: var(
    --mollie-ui-color-palette-red-200
  );
  --mollie-ui-color-components-alert-error-button-primary-background-active: var(
    --mollie-ui-color-palette-red-400
  );
  --mollie-ui-color-components-alert-error-background-default: var(
    --mollie-ui-color-palette-red-100
  );
  --mollie-ui-color-border-warning: var(--mollie-ui-color-palette-yellow-200);
  --mollie-ui-color-border-strong: var(--mollie-ui-color-palette-gray-500);
  --mollie-ui-color-border-positive: var(--mollie-ui-color-palette-green-200);
  --mollie-ui-color-border-negative: var(--mollie-ui-color-palette-red-200);
  --mollie-ui-color-border-inputs: var(--mollie-ui-color-palette-gray-300);
  --mollie-ui-color-border-informative: var(--mollie-ui-color-palette-blue-100);
  --mollie-ui-color-border-divider: var(--mollie-ui-color-palette-gray-100);
  --mollie-ui-color-background-warning: var(
    --mollie-ui-color-palette-yellow-50
  );
  --mollie-ui-color-background-tertiary: var(--mollie-ui-color-palette-gray-75);
  --mollie-ui-color-background-secondary: var(
    --mollie-ui-color-palette-gray-50
  );
  --mollie-ui-color-background-quaternary: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-background-primary: var(--mollie-ui-color-palette-white);
  --mollie-ui-color-background-positive: var(
    --mollie-ui-color-palette-green-50
  );
  --mollie-ui-color-background-negative: var(--mollie-ui-color-palette-red-50);
  --mollie-ui-color-background-informative: var(
    --mollie-ui-color-palette-blue-25
  );
  --mollie-ui-color-background-disabled: var(
    --mollie-ui-color-palette-gray-300
  );
  --mollie-ui-color-accent-foreground-warning: var(
    --mollie-ui-color-palette-yellow-700
  );
  --mollie-ui-color-accent-foreground-secondary: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-accent-foreground-positive: var(
    --mollie-ui-color-palette-green-700
  );
  --mollie-ui-color-accent-foreground-neutral: var(
    --mollie-ui-color-palette-gray-800
  );
  --mollie-ui-color-accent-foreground-negative: var(
    --mollie-ui-color-palette-red-700
  );
  --mollie-ui-color-accent-foreground-informative: var(
    --mollie-ui-color-palette-blue-700
  );
  --mollie-ui-color-accent-foreground-discovery: var(
    --mollie-ui-color-palette-purple-600
  );
  --mollie-ui-color-accent-foreground-default-inverse: var(
    --mollie-ui-color-palette-blue-500
  );
  --mollie-ui-color-accent-foreground-default: var(
    --mollie-ui-color-palette-white
  );
  --mollie-ui-color-accent-background-warning: var(
    --mollie-ui-color-palette-yellow-100
  );
  --mollie-ui-color-accent-background-secondary-inverse: var(
    --mollie-ui-color-palette-blue-25
  );
  --mollie-ui-color-accent-background-pressed-inverse: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-accent-background-pressed: var(
    --mollie-ui-color-palette-brown-700
  );
  --mollie-ui-color-accent-background-positive: var(
    --mollie-ui-color-palette-green-100
  );
  --mollie-ui-color-accent-background-neutral: var(
    --mollie-ui-color-palette-gray-100
  );
  --mollie-ui-color-accent-background-negative: var(
    --mollie-ui-color-palette-red-100
  );
  --mollie-ui-color-accent-background-informative: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-accent-background-hover-inverse: var(
    --mollie-ui-color-palette-blue-75
  );
  --mollie-ui-color-accent-background-hover: var(
    --mollie-ui-color-palette-brown-800
  );
  --mollie-ui-color-accent-background-discovery: var(
    --mollie-ui-color-palette-purple-100
  );
  --mollie-ui-color-accent-background-default-inverse: var(
    --mollie-ui-color-palette-blue-50
  );
  --mollie-ui-color-accent-background-default: var(
    --mollie-ui-color-palette-brown-900
  );
  --mollie-ui-color-accent-background-active-inverse: var(
    --mollie-ui-color-palette-blue-100
  );
  --mollie-ui-color-accent-background-active: var(
    --mollie-ui-color-palette-brown-700
  );
  --mollie-ui-color-components-wizards-steps-foreground-secondary: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-wizards-steps-foreground-default: var(
    --mollie-ui-color-typography-primary-inverse
  );
  --mollie-ui-color-components-wizards-steps-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-wizards-steps-background-success: var(
    --mollie-ui-color-typography-positive
  );
  --mollie-ui-color-components-wizards-steps-background-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-wizards-steps-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-wizards-sidebar-foreground-disabled: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-wizards-sidebar-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-wizards-sidebar-foreground-complete: var(
    --mollie-ui-color-typography-positive
  );
  --mollie-ui-color-components-wizards-sidebar-foreground-active: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-wizards-sidebar-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-wizards-header-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-wizards-header-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-wizards-header-background-secondary: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-wizards-header-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-wizards-header-background-complete: var(
    --mollie-ui-color-typography-positive
  );
  --mollie-ui-color-components-wizards-header-background-active: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-topbar-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-topbar-foreground-divider: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-topbar-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-topbar-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-tooltip-foreground-default: var(
    --mollie-ui-color-typography-primary-inverse
  );
  --mollie-ui-color-components-toggle-foreground-default: var(
    --mollie-ui-color-typography-primary-inverse
  );
  --mollie-ui-color-components-toast-foreground-default: var(
    --mollie-ui-color-typography-primary-inverse
  );
  --mollie-ui-color-components-timeline-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-timeline-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-tag-input-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-tag-input-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-tag-input-foreground-border: var(
    --mollie-ui-color-border-inputs
  );
  --mollie-ui-color-components-tag-input-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-tag-filter-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-tag-filter-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-tag-filter-background-default: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-tabs-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-tabs-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-tabs-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-tabs-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-tabs-background-pressed: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-tabs-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-tabs-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-tabs-background-active: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-table-row-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-table-row-foreground-divider: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-table-row-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-table-row-background-pressed: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-table-row-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-table-row-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-table-row-background-active: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-table-header-foreground-divider: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-table-header-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-tabbar-foreground-divider: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-tabbar-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-tabbar-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-stepper-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-stepper-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-stepper-background-pressed: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-stepper-background-hover: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-stepper-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-stepper-background-default: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-stepper-background-active: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-sliders-track-background-default: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-sliders-text-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-sliders-blob-foreground-border: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-sliders-blob-background-secondary: var(
    --mollie-ui-color-accent-background-hover-inverse
  );
  --mollie-ui-color-components-sliders-blob-background-default: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-sliders-bar-background-secondary: var(
    --mollie-ui-color-accent-background-hover-inverse
  );
  --mollie-ui-color-components-sliders-bar-background-default: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-segment-control-foreground-text: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-segment-control-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-segment-control-background-secondary: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-segment-control-background-pressed: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-segment-control-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-segment-control-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-segment-control-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-segment-control-background-active: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-progress-bar-foreground-default: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-popover-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-popover-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-pills-foreground-warning: var(
    --mollie-ui-color-accent-foreground-warning
  );
  --mollie-ui-color-components-pills-foreground-positive: var(
    --mollie-ui-color-accent-foreground-positive
  );
  --mollie-ui-color-components-pills-foreground-neutral: var(
    --mollie-ui-color-accent-foreground-neutral
  );
  --mollie-ui-color-components-pills-foreground-negative: var(
    --mollie-ui-color-accent-foreground-negative
  );
  --mollie-ui-color-components-pills-foreground-informative: var(
    --mollie-ui-color-accent-foreground-informative
  );
  --mollie-ui-color-components-pills-foreground-discovery: var(
    --mollie-ui-color-accent-foreground-discovery
  );
  --mollie-ui-color-components-pills-background-warning: var(
    --mollie-ui-color-accent-background-warning
  );
  --mollie-ui-color-components-pills-background-positive: var(
    --mollie-ui-color-accent-background-positive
  );
  --mollie-ui-color-components-pills-background-neutral: var(
    --mollie-ui-color-accent-background-neutral
  );
  --mollie-ui-color-components-pills-background-negative: var(
    --mollie-ui-color-accent-background-negative
  );
  --mollie-ui-color-components-pills-background-informative: var(
    --mollie-ui-color-accent-background-informative
  );
  --mollie-ui-color-components-pills-background-discovery: var(
    --mollie-ui-color-accent-background-discovery
  );
  --mollie-ui-color-components-navbar-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-modal-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-menu-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-menu-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-menu-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-menu-foreground-active: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-inputs-interactive-pressed: var(
    --mollie-ui-color-accent-background-pressed
  );
  --mollie-ui-color-components-inputs-interactive-hover: var(
    --mollie-ui-color-accent-background-hover
  );
  --mollie-ui-color-components-inputs-interactive-foreground: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-inputs-interactive-default: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-inputs-interactive-active: var(
    --mollie-ui-color-accent-background-active
  );
  --mollie-ui-color-components-inputs-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-inputs-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-inputs-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-inputs-background-secondary: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-inputs-background-pressed: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-inputs-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-inputs-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-inputs-background-border: var(
    --mollie-ui-color-border-inputs
  );
  --mollie-ui-color-components-footer-foreground-border: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-footer-background-screen-small: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-detail-list-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-detail-list-foreground-interactive: var(
    --mollie-ui-color-typography-interactive
  );
  --mollie-ui-color-components-detail-list-foreground-divider: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-detail-list-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-detail-list-background-pressed: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-detail-list-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-detail-list-background-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-detail-list-background-active: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-date-picker-menu-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-date-picker-menu-background-pressed: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-date-picker-menu-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-date-picker-menu-background-active: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-date-picker-calendar-foreground-secondary: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-date-picker-calendar-foreground-hover: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-date-picker-calendar-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-date-picker-calendar-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-date-picker-calendar-foreground-active: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-date-picker-calendar-background-secondary: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-date-picker-calendar-background-pressed: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-date-picker-calendar-background-hover: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-date-picker-calendar-background-active: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-charts-legacy-lines-default: var(
    --mollie-ui-color-border-divider
  );
  --mollie-ui-color-components-charts-legacy-label-default: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-charts-legacy-blob-default: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-charts-base-background-default: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-cards-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-cards-border-hover: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-cards-background-pressed: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-cards-background-hover: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-cards-background-default: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-cards-background-active: var(
    --mollie-ui-color-background-quaternary
  );
  --mollie-ui-color-components-button-tertiary-inline-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-tertiary-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-tertiary-foreground-default: var(
    --mollie-ui-color-accent-foreground-default-inverse
  );
  --mollie-ui-color-components-button-tertiary-background-pressed: var(
    --mollie-ui-color-accent-background-pressed-inverse
  );
  --mollie-ui-color-components-button-tertiary-background-hover: var(
    --mollie-ui-color-accent-background-hover-inverse
  );
  --mollie-ui-color-components-button-tertiary-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-tertiary-background-default: var(
    --mollie-ui-color-accent-background-default-inverse
  );
  --mollie-ui-color-components-button-tertiary-background-active: var(
    --mollie-ui-color-accent-background-active-inverse
  );
  --mollie-ui-color-components-button-secondary-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-secondary-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-button-secondary-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-quaternary-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-quaternary-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-button-quaternary-foreground-border: var(
    --mollie-ui-color-border-inputs
  );
  --mollie-ui-color-components-button-quaternary-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-primary-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-primary-foreground-default: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-button-primary-background-pressed: var(
    --mollie-ui-color-accent-background-pressed
  );
  --mollie-ui-color-components-button-primary-background-hover: var(
    --mollie-ui-color-accent-background-hover
  );
  --mollie-ui-color-components-button-primary-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-primary-background-default: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-button-primary-background-active: var(
    --mollie-ui-color-accent-background-active
  );
  --mollie-ui-color-components-button-icon-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-icon-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-button-icon-foreground-accent: var(
    --mollie-ui-color-accent-foreground-default-inverse
  );
  --mollie-ui-color-components-button-icon-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-destructive-inline-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-destructive-inline-foreground-default: var(
    --mollie-ui-color-typography-negative
  );
  --mollie-ui-color-components-button-destructive-inline-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-button-destructive-foreground-disabled: var(
    --mollie-ui-color-typography-disabled
  );
  --mollie-ui-color-components-button-destructive-foreground-default: var(
    --mollie-ui-color-typography-negative
  );
  --mollie-ui-color-components-button-destructive-background-disabled: var(
    --mollie-ui-color-background-disabled
  );
  --mollie-ui-color-components-badge-foreground-default: var(
    --mollie-ui-color-typography-primary-inverse
  );
  --mollie-ui-color-components-avatar-organisation-foreground-yellow: var(
    --mollie-ui-color-accent-foreground-warning
  );
  --mollie-ui-color-components-avatar-organisation-foreground-red: var(
    --mollie-ui-color-accent-foreground-negative
  );
  --mollie-ui-color-components-avatar-organisation-foreground-purple: var(
    --mollie-ui-color-accent-foreground-discovery
  );
  --mollie-ui-color-components-avatar-organisation-foreground-green: var(
    --mollie-ui-color-accent-foreground-positive
  );
  --mollie-ui-color-components-avatar-organisation-foreground-blue: var(
    --mollie-ui-color-accent-foreground-informative
  );
  --mollie-ui-color-components-avatar-organisation-background-yellow: var(
    --mollie-ui-color-accent-background-warning
  );
  --mollie-ui-color-components-avatar-organisation-background-red: var(
    --mollie-ui-color-accent-background-negative
  );
  --mollie-ui-color-components-avatar-organisation-background-purple: var(
    --mollie-ui-color-accent-background-discovery
  );
  --mollie-ui-color-components-avatar-organisation-background-green: var(
    --mollie-ui-color-accent-background-positive
  );
  --mollie-ui-color-components-avatar-organisation-background-blue: var(
    --mollie-ui-color-accent-background-informative
  );
  --mollie-ui-color-components-avatar-action-foreground-warning: var(
    --mollie-ui-color-accent-foreground-warning
  );
  --mollie-ui-color-components-avatar-action-foreground-secondary: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-avatar-action-foreground-primary: var(
    --mollie-ui-color-accent-foreground-default
  );
  --mollie-ui-color-components-avatar-action-foreground-positive: var(
    --mollie-ui-color-accent-foreground-positive
  );
  --mollie-ui-color-components-avatar-action-foreground-neutral: var(
    --mollie-ui-color-accent-foreground-neutral
  );
  --mollie-ui-color-components-avatar-action-foreground-negative: var(
    --mollie-ui-color-accent-foreground-negative
  );
  --mollie-ui-color-components-avatar-action-foreground-informative: var(
    --mollie-ui-color-accent-foreground-informative
  );
  --mollie-ui-color-components-avatar-action-foreground-discovery: var(
    --mollie-ui-color-accent-foreground-discovery
  );
  --mollie-ui-color-components-avatar-action-background-warning: var(
    --mollie-ui-color-accent-background-warning
  );
  --mollie-ui-color-components-avatar-action-background-secondary: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-avatar-action-background-primary: var(
    --mollie-ui-color-accent-background-default
  );
  --mollie-ui-color-components-avatar-action-background-positive: var(
    --mollie-ui-color-accent-background-positive
  );
  --mollie-ui-color-components-avatar-action-background-neutral: var(
    --mollie-ui-color-accent-background-neutral
  );
  --mollie-ui-color-components-avatar-action-background-negative: var(
    --mollie-ui-color-accent-background-negative
  );
  --mollie-ui-color-components-avatar-action-background-informative: var(
    --mollie-ui-color-accent-background-informative
  );
  --mollie-ui-color-components-avatar-action-background-discovery: var(
    --mollie-ui-color-accent-background-discovery
  );
  --mollie-ui-color-components-announcement-foreground-warning: var(
    --mollie-ui-color-accent-foreground-warning
  );
  --mollie-ui-color-components-announcement-foreground-negative: var(
    --mollie-ui-color-accent-foreground-negative
  );
  --mollie-ui-color-components-announcement-foreground-default: var(
    --mollie-ui-color-accent-foreground-informative
  );
  --mollie-ui-color-components-announcement-background-warning: var(
    --mollie-ui-color-accent-background-warning
  );
  --mollie-ui-color-components-announcement-background-negative: var(
    --mollie-ui-color-accent-background-negative
  );
  --mollie-ui-color-components-announcement-background-default: var(
    --mollie-ui-color-accent-background-informative
  );
  --mollie-ui-color-components-alert-neutral-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-alert-neutral-button-secondary-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-alert-neutral-button-primary-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-alert-neutral-background-default: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-components-alert-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-action-list-foreground-secondary: var(
    --mollie-ui-color-typography-secondary
  );
  --mollie-ui-color-components-action-list-foreground-default: var(
    --mollie-ui-color-typography-primary
  );
  --mollie-ui-color-components-action-list-background-hover: var(
    --mollie-ui-color-background-tertiary
  );
  --mollie-ui-color-accent-background-secondary: var(
    --mollie-ui-color-background-primary
  );
  --mollie-ui-color-components-inputs-interactive-secondary: var(
    --mollie-ui-color-accent-background-secondary
  );
}

[data-mollie-ui-theme="light"],
:root:has(body[data-mollie-ui-theme="light"]) {
  color-scheme: light;
}

@media (prefers-color-scheme: light) {
  [data-mollie-ui-theme="auto"],
  :root:has(body[data-mollie-ui-theme="auto"]) {
    color-scheme: light;
  }
}