import { css } from 'styled-components'; export const CssVars = css` :root { --font-base-family: Inter, -apple-system, 'Helvetica Neue', 'Segoe UI', Roboto, Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-base-size-xs: 14px; --font-base-size-sm: 15px; --font-base-size-md: 15px; --font-base-size-lg: 16px; --font-base-size-xl: 16px; --font-base-line-height: 1.5; --font-display10-size: Min(8rem, 20vw); --font-display10-line-height: 1.05; --font-display20-size: Min(6.25rem, 16vw); --font-display20-line-height: 1.15; --font-display30-size: Min(4.5rem, 11.5vw); --font-display30-line-height: 1.25; --font-display40-size: Min(2.75rem, 7vw); --font-display40-line-height: 1.35; --font-heading10-size: Min(2.5rem, 6.4vw); --font-heading10-line-height: 1.45; --font-heading20-size: 2.25rem; --font-heading20-line-height: 1.55; --font-heading30-size: 1.875rem; --font-heading30-line-height: 1.65; --font-heading40-size: 1.5rem; --font-heading40-line-height: 1.75; --font-paragraph10-size: 1.125rem; --font-paragraph10-line-height: 1.85; --font-paragraph20-size: 1rem; --font-paragraph20-line-height: 1.95; --font-paragraph30-size: 0.9rem; --font-paragraph30-line-height: 2.05; --font-paragraph40-size: 0.8rem; --font-paragraph40-line-height: 2.15; --font-paragraph50-size: 0.7rem; --font-paragraph50-line-height: 2.25; --grid-default-columns: 12; --grid-default-size: 1fr; --grid-default-column-gap-xs: Max(4vw, Min(96px, calc(100% / 24))); --grid-default-column-gap-sm: Max(4vw, Min(96px, calc(100% / 24))); --grid-default-column-gap-md: Max(4vw, Min(96px, calc(100% / 24))); --grid-default-column-gap-lg: Max(4vw, Min(96px, calc(100% / 24))); --grid-default-column-gap-xl: Max(4vw, Min(96px, calc(100% / 24))); --grid-default-row-gap-xs: 0; --grid-default-row-gap-sm: 0; --grid-default-row-gap-md: 0; --grid-default-row-gap-lg: 0; --grid-default-row-gap-xl: 0; --media-query-xs: 0; --media-query-sm: 768px; --media-query-md: 1024px; --media-query-lg: 1440px; --media-query-xl: 1600px; --container-default-max-width-xs: calc(100% - var(--grid-default-column-gap-xs) * 2); --container-default-max-width-sm: calc(100% - var(--grid-default-column-gap-sm) * 2); --container-default-max-width-md: calc(1024px - var(--grid-default-column-gap-md) * 2); --container-default-max-width-lg: calc(1440px - var(--grid-default-column-gap-lg) * 2); --container-default-max-width-xl: calc(1600px - var(--grid-default-column-gap-xl) * 2); --container-fluid-max-width-xs: calc(100% - var(--grid-default-column-gap-xs) * 2); --container-fluid-max-width-sm: calc(100% - var(--grid-default-column-gap-sm) * 2); --container-fluid-max-width-md: calc(100% - var(--grid-default-column-gap-md) * 2); --container-fluid-max-width-lg: calc(100% - var(--grid-default-column-gap-lg) * 2); --container-fluid-max-width-xl: calc(100% - var(--grid-default-column-gap-xl) * 2); --button-size-xs: 0.7rem; --button-size-sm: 0.8rem; --button-size-md: 1rem; --button-size-lg: 1.25rem; --button-size-xl: 1.45rem; --button-border-radius: 0.2em; --form-default-background-color: var(--color-neutral-100); --form-default-background-color-disabled: var(--color-neutral-200); --form-default-background-color-info: var(--color-warning-100); --form-default-background-color-error: var(--color-warning-100); --form-default-color: var(--color-neutral-800); --form-default-color-placeholder: var(--color-neutral-400); --form-default-color-hover: var(--color-neutral-900); --form-default-color-disabled: var(--color-neutral-700); --form-default-color-info: var(--color-warning-900); --form-default-color-error: var(--color-warning-900); --form-default-border: 0 solid transparent; --form-default-border-width: 2px; --form-default-border-color: var(--color-neutral-200); --form-default-border-color-hover: var(--color-neutral-300); --form-default-border-color-disabled: var(--color-neutral-300); --form-default-border-color-info: var(--color-warning-500); --form-default-border-color-error: var(--color-warning-500); --form-default-border-radius: var(--border-radius); --form-default-outline: 3px solid transparent; --form-default-outline-color-focus: var(--color-neutral-800); --form-default-outline-color-active: var(--color-primary-500); --form-default-outline-color-error: var(--color-warning-500); --form-default-outline-offset: 0; --form-default-transition: border 150ms ease-in 0s, outline-color 150ms ease-in 0s, color 200ms ease-out 0s, box-shadow 200ms ease 0s; --form-default-field-gap: 0.5rem; --form-default-control-padding: 0.8em; --form-default-control-font-size: 1rem; --form-default-control-font-weight: inherit; --form-default-control-line-height: 1.625; --form-default-label-padding: 0; --form-default-label-font-size: 0.9rem; --form-default-label-font-weight: 500; --form-default-label-line-height: 1.2; --form-default-error-margin: 0.5em 0; --form-default-error-padding: 0.2em 0.4em; --form-default-error-font-size: 0.9rem; --form-default-error-font-weight: 500; --form-default-error-line-height: 1.2; --form-default-error-border: 1px solid var(--form-border-color-error); --form-default-error-background-color: var(--form-background-color-error); --form-default-error-color: var(--form-color-error); --form-minimal-border-width: 0 0 2px 0; --form-minimal-border-radius: 0; --form-minimal-outline-offset: 0; --card-shadow: 0 20px 20px -10px rgba(0,0,0,0.2); --backdrop-opacity: 0.5; --border-radius: 0.35em; --shadow-xs: 0 0.1rem 0.4rem -0.1rem rgba(0, 0, 0, 0.2); --shadow-sm: 0 0.3rem 0.8rem -0.2rem rgba(0, 0, 0, 0.3); --shadow-md: 0 0.6rem 1.6rem -0.3rem rgba(0, 0, 0, 0.4); --shadow-lg: 0 0.9rem 3.2rem -0.4rem rgba(0, 0, 0, 0.5); --shadow-xl: 0 1.2rem 6.4rem -0.5rem rgba(0, 0, 0, 0.6); --transition-smooth: 400ms cubic-bezier(0.73, 0.01, 0.24, 1); --grid-columns: var(--grid-default-columns); --grid-size: var(--grid-default-size); --grid-column-gap-xs: var(--grid-default-column-gap-xs); --grid-column-gap-sm: var(--grid-default-column-gap-sm); --grid-column-gap-md: var(--grid-default-column-gap-md); --grid-column-gap-lg: var(--grid-default-column-gap-lg); --grid-column-gap-xl: var(--grid-default-column-gap-xl); --grid-row-gap-xs: var(--grid-default-row-gap-xs); --grid-row-gap-sm: var(--grid-default-row-gap-sm); --grid-row-gap-md: var(--grid-default-row-gap-md); --grid-row-gap-lg: var(--grid-default-row-gap-lg); --grid-row-gap-xl: var(--grid-default-row-gap-xl); --container-max-width-xs: var(--container-default-max-width-xs); --container-max-width-sm: var(--container-default-max-width-sm); --container-max-width-md: var(--container-default-max-width-md); --container-max-width-lg: var(--container-default-max-width-lg); --container-max-width-xl: var(--container-default-max-width-xl); --form-background-color: var(--form-default-background-color); --form-background-color-disabled: var(--form-default-background-color-disabled); --form-background-color-info: var(--form-default-background-color-info); --form-background-color-error: var(--form-default-background-color-error); --form-color: var(--form-default-color); --form-color-placeholder: var(--form-default-color-placeholder); --form-color-hover: var(--form-default-color-hover); --form-color-disabled: var(--form-default-color-disabled); --form-color-info: var(--form-default-color-info); --form-color-error: var(--form-default-color-error); --form-border: var(--form-default-border); --form-border-width: var(--form-default-border-width); --form-border-color: var(--form-default-border-color); --form-border-color-hover: var(--form-default-border-color-hover); --form-border-color-disabled: var(--form-default-border-color-disabled); --form-border-color-info: var(--form-default-border-color-info); --form-border-color-error: var(--form-default-border-color-error); --form-border-radius: var(--form-default-border-radius); --form-outline: var(--form-default-outline); --form-outline-color-focus: var(--form-default-outline-color-focus); --form-outline-color-active: var(--form-default-outline-color-active); --form-outline-color-error: var(--form-default-outline-color-error); --form-outline-offset: var(--form-default-outline-offset); --form-transition: var(--form-default-transition); --form-field-gap: var(--form-default-field-gap); --form-control-padding: var(--form-default-control-padding); --form-control-font-size: var(--form-default-control-font-size); --form-control-font-weight: var(--form-default-control-font-weight); --form-control-line-height: var(--form-default-control-line-height); --form-label-padding: var(--form-default-label-padding); --form-label-font-size: var(--form-default-label-font-size); --form-label-font-weight: var(--form-default-label-font-weight); --form-label-line-height: var(--form-default-label-line-height); --form-error-margin: var(--form-default-error-margin); --form-error-padding: var(--form-default-error-padding); --form-error-font-size: var(--form-default-error-font-size); --form-error-font-weight: var(--form-default-error-font-weight); --form-error-line-height: var(--form-default-error-line-height); --form-error-border: var(--form-default-error-border); --form-error-background-color: var(--form-default-error-background-color); --form-error-color: var(--form-default-error-color); --font-base-size: var(--font-base-size-xs); --grid-column-gap: var(--grid-default-column-gap-xs); --grid-row-gap: var(--grid-default-row-gap-xs); --media-query: var(--media-query-xs); --container-max-width: var(--container-default-max-width-xs); --container-fluid-max-width: var(--container-fluid-max-width-xs); --button-size: var(--button-size-xs); --shadow: var(--shadow-xs); @media (min-width: 768px) { --font-base-size: var(--font-base-size-sm); --grid-column-gap: var(--grid-default-column-gap-sm); --grid-row-gap: var(--grid-default-row-gap-sm); --media-query: var(--media-query-sm); --container-max-width: var(--container-default-max-width-sm); --container-fluid-max-width: var(--container-fluid-max-width-sm); --button-size: var(--button-size-sm); --shadow: var(--shadow-sm); }; @media (min-width: 1024px) { --font-base-size: var(--font-base-size-md); --grid-column-gap: var(--grid-default-column-gap-md); --grid-row-gap: var(--grid-default-row-gap-md); --media-query: var(--media-query-md); --container-max-width: var(--container-default-max-width-md); --container-fluid-max-width: var(--container-fluid-max-width-md); --button-size: var(--button-size-md); --shadow: var(--shadow-md); }; @media (min-width: 1440px) { --font-base-size: var(--font-base-size-lg); --grid-column-gap: var(--grid-default-column-gap-lg); --grid-row-gap: var(--grid-default-row-gap-lg); --media-query: var(--media-query-lg); --container-max-width: var(--container-default-max-width-lg); --container-fluid-max-width: var(--container-fluid-max-width-lg); --button-size: var(--button-size-lg); --shadow: var(--shadow-lg); }; @media (min-width: 1600px) { --font-base-size: var(--font-base-size-xl); --grid-column-gap: var(--grid-default-column-gap-xl); --grid-row-gap: var(--grid-default-row-gap-xl); --media-query: var(--media-query-xl); --container-max-width: var(--container-default-max-width-xl); --container-fluid-max-width: var(--container-fluid-max-width-xl); --button-size: var(--button-size-xl); --shadow: var(--shadow-xl); }; --light-scheme-color-neutral-100: #FFFFFF; --light-scheme-color-neutral-200: #EFEFF2; --light-scheme-color-neutral-300: #DBDBD7; --light-scheme-color-neutral-400: #B1B1B1; --light-scheme-color-neutral-500: #7E7E8B; --light-scheme-color-neutral-600: #61616B; --light-scheme-color-neutral-700: #44444B; --light-scheme-color-neutral-800: #27272B; --light-scheme-color-neutral-900: #09090A; --light-scheme-color-primary-100: #def2ff; --light-scheme-color-primary-200: #b6e7ff; --light-scheme-color-primary-300: #75d5ff; --light-scheme-color-primary-400: #2cc1ff; --light-scheme-color-primary-500: #00a2ed; --light-scheme-color-primary-600: #0087d4; --light-scheme-color-primary-700: #006bab; --light-scheme-color-primary-800: #005a8d; --light-scheme-color-primary-900: #064b74; --light-scheme-color-secondary-100: #e6fded; --light-scheme-color-secondary-200: #b3f9ca; --light-scheme-color-secondary-300: #80f5a7; --light-scheme-color-secondary-400: #4df083; --light-scheme-color-secondary-500: #00ea4e; --light-scheme-color-secondary-600: #00a437; --light-scheme-color-secondary-700: #007527; --light-scheme-color-secondary-800: #004617; --light-scheme-color-secondary-900: #001708; --light-scheme-color-success-100: #CFFDD5; --light-scheme-color-success-200: #A1FCB5; --light-scheme-color-success-300: #70F69B; --light-scheme-color-success-400: #4CED90; --light-scheme-color-success-500: #16e280; --light-scheme-color-success-600: #10C27E; --light-scheme-color-success-700: #0BA278; --light-scheme-color-success-800: #07836C; --light-scheme-color-success-900: #02311c; --light-scheme-color-warning-100: #FEF9CB; --light-scheme-color-warning-200: #FEF198; --light-scheme-color-warning-300: #FEE765; --light-scheme-color-warning-400: #FDDE3F; --light-scheme-color-warning-500: #fdce00; --light-scheme-color-warning-600: #D9AC00; --light-scheme-color-warning-700: #B68D00; --light-scheme-color-warning-800: #926E00; --light-scheme-color-warning-900: #442404; --light-scheme-color-danger-100: #FEE9CD; --light-scheme-color-danger-200: #FECC9C; --light-scheme-color-danger-300: #FCA86A; --light-scheme-color-danger-400: #FA8645; --light-scheme-color-danger-500: #f74e09; --light-scheme-color-danger-600: #D43406; --light-scheme-color-danger-700: #B11F04; --light-scheme-color-danger-800: #8F0F02; --light-scheme-color-danger-900: #441006; --dark-scheme-color-neutral-100: var(--light-scheme-color-neutral-900); --dark-scheme-color-neutral-200: var(--light-scheme-color-neutral-800); --dark-scheme-color-neutral-300: var(--light-scheme-color-neutral-700); --dark-scheme-color-neutral-400: var(--light-scheme-color-neutral-600); --dark-scheme-color-neutral-500: var(--light-scheme-color-neutral-500); --dark-scheme-color-neutral-600: var(--light-scheme-color-neutral-400); --dark-scheme-color-neutral-700: var(--light-scheme-color-neutral-300); --dark-scheme-color-neutral-800: var(--light-scheme-color-neutral-200); --dark-scheme-color-neutral-900: var(--light-scheme-color-neutral-100); --dark-scheme-color-primary-100: var(--light-scheme-color-primary-900); --dark-scheme-color-primary-200: var(--light-scheme-color-primary-800); --dark-scheme-color-primary-300: var(--light-scheme-color-primary-700); --dark-scheme-color-primary-400: var(--light-scheme-color-primary-600); --dark-scheme-color-primary-500: var(--light-scheme-color-primary-500); --dark-scheme-color-primary-600: var(--light-scheme-color-primary-400); --dark-scheme-color-primary-700: var(--light-scheme-color-primary-300); --dark-scheme-color-primary-800: var(--light-scheme-color-primary-200); --dark-scheme-color-primary-900: var(--light-scheme-color-primary-100); --dark-scheme-color-secondary-100: var(--light-scheme-color-secondary-900); --dark-scheme-color-secondary-200: var(--light-scheme-color-secondary-800); --dark-scheme-color-secondary-300: var(--light-scheme-color-secondary-700); --dark-scheme-color-secondary-400: var(--light-scheme-color-secondary-600); --dark-scheme-color-secondary-500: var(--light-scheme-color-secondary-500); --dark-scheme-color-secondary-600: var(--light-scheme-color-secondary-400); --dark-scheme-color-secondary-700: var(--light-scheme-color-secondary-300); --dark-scheme-color-secondary-800: var(--light-scheme-color-secondary-200); --dark-scheme-color-secondary-900: var(--light-scheme-color-secondary-100); --dark-scheme-color-success-100: var(--light-scheme-color-success-900); --dark-scheme-color-success-200: var(--light-scheme-color-success-800); --dark-scheme-color-success-300: var(--light-scheme-color-success-700); --dark-scheme-color-success-400: var(--light-scheme-color-success-600); --dark-scheme-color-success-500: var(--light-scheme-color-success-500); --dark-scheme-color-success-600: var(--light-scheme-color-success-400); --dark-scheme-color-success-700: var(--light-scheme-color-success-300); --dark-scheme-color-success-800: var(--light-scheme-color-success-200); --dark-scheme-color-success-900: var(--light-scheme-color-success-100); --dark-scheme-color-warning-100: var(--light-scheme-color-warning-900); --dark-scheme-color-warning-200: var(--light-scheme-color-warning-800); --dark-scheme-color-warning-300: var(--light-scheme-color-warning-700); --dark-scheme-color-warning-400: var(--light-scheme-color-warning-600); --dark-scheme-color-warning-500: var(--light-scheme-color-warning-500); --dark-scheme-color-warning-600: var(--light-scheme-color-warning-400); --dark-scheme-color-warning-700: var(--light-scheme-color-warning-300); --dark-scheme-color-warning-800: var(--light-scheme-color-warning-200); --dark-scheme-color-warning-900: var(--light-scheme-color-warning-100); --dark-scheme-color-danger-100: var(--light-scheme-color-danger-900); --dark-scheme-color-danger-200: var(--light-scheme-color-danger-800); --dark-scheme-color-danger-300: var(--light-scheme-color-danger-700); --dark-scheme-color-danger-400: var(--light-scheme-color-danger-600); --dark-scheme-color-danger-500: var(--light-scheme-color-danger-500); --dark-scheme-color-danger-600: var(--light-scheme-color-danger-400); --dark-scheme-color-danger-700: var(--light-scheme-color-danger-300); --dark-scheme-color-danger-800: var(--light-scheme-color-danger-200); --dark-scheme-color-danger-900: var(--light-scheme-color-danger-100); --theme-color-neutral-100: var(--light-scheme-color-neutral-100); --theme-color-neutral-200: var(--light-scheme-color-neutral-200); --theme-color-neutral-300: var(--light-scheme-color-neutral-300); --theme-color-neutral-400: var(--light-scheme-color-neutral-400); --theme-color-neutral-500: var(--light-scheme-color-neutral-500); --theme-color-neutral-600: var(--light-scheme-color-neutral-600); --theme-color-neutral-700: var(--light-scheme-color-neutral-700); --theme-color-neutral-800: var(--light-scheme-color-neutral-800); --theme-color-neutral-900: var(--light-scheme-color-neutral-900); --theme-color-primary-100: var(--light-scheme-color-primary-100); --theme-color-primary-200: var(--light-scheme-color-primary-200); --theme-color-primary-300: var(--light-scheme-color-primary-300); --theme-color-primary-400: var(--light-scheme-color-primary-400); --theme-color-primary-500: var(--light-scheme-color-primary-500); --theme-color-primary-600: var(--light-scheme-color-primary-600); --theme-color-primary-700: var(--light-scheme-color-primary-700); --theme-color-primary-800: var(--light-scheme-color-primary-800); --theme-color-primary-900: var(--light-scheme-color-primary-900); --theme-color-secondary-100: var(--light-scheme-color-secondary-100); --theme-color-secondary-200: var(--light-scheme-color-secondary-200); --theme-color-secondary-300: var(--light-scheme-color-secondary-300); --theme-color-secondary-400: var(--light-scheme-color-secondary-400); --theme-color-secondary-500: var(--light-scheme-color-secondary-500); --theme-color-secondary-600: var(--light-scheme-color-secondary-600); --theme-color-secondary-700: var(--light-scheme-color-secondary-700); --theme-color-secondary-800: var(--light-scheme-color-secondary-800); --theme-color-secondary-900: var(--light-scheme-color-secondary-900); --theme-color-success-100: var(--light-scheme-color-success-100); --theme-color-success-200: var(--light-scheme-color-success-200); --theme-color-success-300: var(--light-scheme-color-success-300); --theme-color-success-400: var(--light-scheme-color-success-400); --theme-color-success-500: var(--light-scheme-color-success-500); --theme-color-success-600: var(--light-scheme-color-success-600); --theme-color-success-700: var(--light-scheme-color-success-700); --theme-color-success-800: var(--light-scheme-color-success-800); --theme-color-success-900: var(--light-scheme-color-success-900); --theme-color-warning-100: var(--light-scheme-color-warning-100); --theme-color-warning-200: var(--light-scheme-color-warning-200); --theme-color-warning-300: var(--light-scheme-color-warning-300); --theme-color-warning-400: var(--light-scheme-color-warning-400); --theme-color-warning-500: var(--light-scheme-color-warning-500); --theme-color-warning-600: var(--light-scheme-color-warning-600); --theme-color-warning-700: var(--light-scheme-color-warning-700); --theme-color-warning-800: var(--light-scheme-color-warning-800); --theme-color-warning-900: var(--light-scheme-color-warning-900); --theme-color-danger-100: var(--light-scheme-color-danger-100); --theme-color-danger-200: var(--light-scheme-color-danger-200); --theme-color-danger-300: var(--light-scheme-color-danger-300); --theme-color-danger-400: var(--light-scheme-color-danger-400); --theme-color-danger-500: var(--light-scheme-color-danger-500); --theme-color-danger-600: var(--light-scheme-color-danger-600); --theme-color-danger-700: var(--light-scheme-color-danger-700); --theme-color-danger-800: var(--light-scheme-color-danger-800); --theme-color-danger-900: var(--light-scheme-color-danger-900); --color-neutral-100: var(--theme-color-neutral-100); --color-neutral-200: var(--theme-color-neutral-200); --color-neutral-300: var(--theme-color-neutral-300); --color-neutral-400: var(--theme-color-neutral-400); --color-neutral-500: var(--theme-color-neutral-500); --color-neutral-600: var(--theme-color-neutral-600); --color-neutral-700: var(--theme-color-neutral-700); --color-neutral-800: var(--theme-color-neutral-800); --color-neutral-900: var(--theme-color-neutral-900); --color-primary-100: var(--theme-color-primary-100); --color-primary-200: var(--theme-color-primary-200); --color-primary-300: var(--theme-color-primary-300); --color-primary-400: var(--theme-color-primary-400); --color-primary-500: var(--theme-color-primary-500); --color-primary-600: var(--theme-color-primary-600); --color-primary-700: var(--theme-color-primary-700); --color-primary-800: var(--theme-color-primary-800); --color-primary-900: var(--theme-color-primary-900); --color-secondary-100: var(--theme-color-secondary-100); --color-secondary-200: var(--theme-color-secondary-200); --color-secondary-300: var(--theme-color-secondary-300); --color-secondary-400: var(--theme-color-secondary-400); --color-secondary-500: var(--theme-color-secondary-500); --color-secondary-600: var(--theme-color-secondary-600); --color-secondary-700: var(--theme-color-secondary-700); --color-secondary-800: var(--theme-color-secondary-800); --color-secondary-900: var(--theme-color-secondary-900); --color-success-100: var(--theme-color-success-100); --color-success-200: var(--theme-color-success-200); --color-success-300: var(--theme-color-success-300); --color-success-400: var(--theme-color-success-400); --color-success-500: var(--theme-color-success-500); --color-success-600: var(--theme-color-success-600); --color-success-700: var(--theme-color-success-700); --color-success-800: var(--theme-color-success-800); --color-success-900: var(--theme-color-success-900); --color-warning-100: var(--theme-color-warning-100); --color-warning-200: var(--theme-color-warning-200); --color-warning-300: var(--theme-color-warning-300); --color-warning-400: var(--theme-color-warning-400); --color-warning-500: var(--theme-color-warning-500); --color-warning-600: var(--theme-color-warning-600); --color-warning-700: var(--theme-color-warning-700); --color-warning-800: var(--theme-color-warning-800); --color-warning-900: var(--theme-color-warning-900); --color-danger-100: var(--theme-color-danger-100); --color-danger-200: var(--theme-color-danger-200); --color-danger-300: var(--theme-color-danger-300); --color-danger-400: var(--theme-color-danger-400); --color-danger-500: var(--theme-color-danger-500); --color-danger-600: var(--theme-color-danger-600); --color-danger-700: var(--theme-color-danger-700); --color-danger-800: var(--theme-color-danger-800); --color-danger-900: var(--theme-color-danger-900); } :root.--scheme-dark { --theme-color-neutral-100: var(--dark-scheme-color-neutral-100); --theme-color-neutral-200: var(--dark-scheme-color-neutral-200); --theme-color-neutral-300: var(--dark-scheme-color-neutral-300); --theme-color-neutral-400: var(--dark-scheme-color-neutral-400); --theme-color-neutral-500: var(--dark-scheme-color-neutral-500); --theme-color-neutral-600: var(--dark-scheme-color-neutral-600); --theme-color-neutral-700: var(--dark-scheme-color-neutral-700); --theme-color-neutral-800: var(--dark-scheme-color-neutral-800); --theme-color-neutral-900: var(--dark-scheme-color-neutral-900); --theme-color-primary-100: var(--dark-scheme-color-primary-100); --theme-color-primary-200: var(--dark-scheme-color-primary-200); --theme-color-primary-300: var(--dark-scheme-color-primary-300); --theme-color-primary-400: var(--dark-scheme-color-primary-400); --theme-color-primary-500: var(--dark-scheme-color-primary-500); --theme-color-primary-600: var(--dark-scheme-color-primary-600); --theme-color-primary-700: var(--dark-scheme-color-primary-700); --theme-color-primary-800: var(--dark-scheme-color-primary-800); --theme-color-primary-900: var(--dark-scheme-color-primary-900); --theme-color-secondary-100: var(--dark-scheme-color-secondary-100); --theme-color-secondary-200: var(--dark-scheme-color-secondary-200); --theme-color-secondary-300: var(--dark-scheme-color-secondary-300); --theme-color-secondary-400: var(--dark-scheme-color-secondary-400); --theme-color-secondary-500: var(--dark-scheme-color-secondary-500); --theme-color-secondary-600: var(--dark-scheme-color-secondary-600); --theme-color-secondary-700: var(--dark-scheme-color-secondary-700); --theme-color-secondary-800: var(--dark-scheme-color-secondary-800); --theme-color-secondary-900: var(--dark-scheme-color-secondary-900); --theme-color-success-100: var(--dark-scheme-color-success-100); --theme-color-success-200: var(--dark-scheme-color-success-200); --theme-color-success-300: var(--dark-scheme-color-success-300); --theme-color-success-400: var(--dark-scheme-color-success-400); --theme-color-success-500: var(--dark-scheme-color-success-500); --theme-color-success-600: var(--dark-scheme-color-success-600); --theme-color-success-700: var(--dark-scheme-color-success-700); --theme-color-success-800: var(--dark-scheme-color-success-800); --theme-color-success-900: var(--dark-scheme-color-success-900); --theme-color-warning-100: var(--dark-scheme-color-warning-100); --theme-color-warning-200: var(--dark-scheme-color-warning-200); --theme-color-warning-300: var(--dark-scheme-color-warning-300); --theme-color-warning-400: var(--dark-scheme-color-warning-400); --theme-color-warning-500: var(--dark-scheme-color-warning-500); --theme-color-warning-600: var(--dark-scheme-color-warning-600); --theme-color-warning-700: var(--dark-scheme-color-warning-700); --theme-color-warning-800: var(--dark-scheme-color-warning-800); --theme-color-warning-900: var(--dark-scheme-color-warning-900); --theme-color-danger-100: var(--dark-scheme-color-danger-100); --theme-color-danger-200: var(--dark-scheme-color-danger-200); --theme-color-danger-300: var(--dark-scheme-color-danger-300); --theme-color-danger-400: var(--dark-scheme-color-danger-400); --theme-color-danger-500: var(--dark-scheme-color-danger-500); --theme-color-danger-600: var(--dark-scheme-color-danger-600); --theme-color-danger-700: var(--dark-scheme-color-danger-700); --theme-color-danger-800: var(--dark-scheme-color-danger-800); --theme-color-danger-900: var(--dark-scheme-color-danger-900); } .positive, .negative { --form-default-background-color: var(--color-neutral-100); --form-default-background-color-disabled: var(--color-neutral-200); --form-default-background-color-info: var(--color-warning-100); --form-default-background-color-error: var(--color-warning-100); --form-default-color: var(--color-neutral-800); --form-default-color-placeholder: var(--color-neutral-400); --form-default-color-hover: var(--color-neutral-900); --form-default-color-disabled: var(--color-neutral-700); --form-default-color-info: var(--color-warning-900); --form-default-color-error: var(--color-warning-900); --form-default-border-color: var(--color-neutral-200); --form-default-border-color-hover: var(--color-neutral-300); --form-default-border-color-disabled: var(--color-neutral-300); --form-default-border-color-info: var(--color-warning-500); --form-default-border-color-error: var(--color-warning-500); --form-default-outline-color-focus: var(--color-neutral-800); --form-default-outline-color-active: var(--color-primary-500); --form-default-outline-color-error: var(--color-warning-500); } .positive { --color-neutral-100: var(--theme-color-neutral-100); --color-neutral-200: var(--theme-color-neutral-200); --color-neutral-300: var(--theme-color-neutral-300); --color-neutral-400: var(--theme-color-neutral-400); --color-neutral-500: var(--theme-color-neutral-500); --color-neutral-600: var(--theme-color-neutral-600); --color-neutral-700: var(--theme-color-neutral-700); --color-neutral-800: var(--theme-color-neutral-800); --color-neutral-900: var(--theme-color-neutral-900); --color-primary-100: var(--theme-color-primary-100); --color-primary-200: var(--theme-color-primary-200); --color-primary-300: var(--theme-color-primary-300); --color-primary-400: var(--theme-color-primary-400); --color-primary-500: var(--theme-color-primary-500); --color-primary-600: var(--theme-color-primary-600); --color-primary-700: var(--theme-color-primary-700); --color-primary-800: var(--theme-color-primary-800); --color-primary-900: var(--theme-color-primary-900); --color-secondary-100: var(--theme-color-secondary-100); --color-secondary-200: var(--theme-color-secondary-200); --color-secondary-300: var(--theme-color-secondary-300); --color-secondary-400: var(--theme-color-secondary-400); --color-secondary-500: var(--theme-color-secondary-500); --color-secondary-600: var(--theme-color-secondary-600); --color-secondary-700: var(--theme-color-secondary-700); --color-secondary-800: var(--theme-color-secondary-800); --color-secondary-900: var(--theme-color-secondary-900); --color-success-100: var(--theme-color-success-100); --color-success-200: var(--theme-color-success-200); --color-success-300: var(--theme-color-success-300); --color-success-400: var(--theme-color-success-400); --color-success-500: var(--theme-color-success-500); --color-success-600: var(--theme-color-success-600); --color-success-700: var(--theme-color-success-700); --color-success-800: var(--theme-color-success-800); --color-success-900: var(--theme-color-success-900); --color-warning-100: var(--theme-color-warning-100); --color-warning-200: var(--theme-color-warning-200); --color-warning-300: var(--theme-color-warning-300); --color-warning-400: var(--theme-color-warning-400); --color-warning-500: var(--theme-color-warning-500); --color-warning-600: var(--theme-color-warning-600); --color-warning-700: var(--theme-color-warning-700); --color-warning-800: var(--theme-color-warning-800); --color-warning-900: var(--theme-color-warning-900); --color-danger-100: var(--theme-color-danger-100); --color-danger-200: var(--theme-color-danger-200); --color-danger-300: var(--theme-color-danger-300); --color-danger-400: var(--theme-color-danger-400); --color-danger-500: var(--theme-color-danger-500); --color-danger-600: var(--theme-color-danger-600); --color-danger-700: var(--theme-color-danger-700); --color-danger-800: var(--theme-color-danger-800); --color-danger-900: var(--theme-color-danger-900); } .negative { --color-neutral-100: var(--theme-color-neutral-900); --color-neutral-200: var(--theme-color-neutral-800); --color-neutral-300: var(--theme-color-neutral-700); --color-neutral-400: var(--theme-color-neutral-600); --color-neutral-500: var(--theme-color-neutral-500); --color-neutral-600: var(--theme-color-neutral-400); --color-neutral-700: var(--theme-color-neutral-300); --color-neutral-800: var(--theme-color-neutral-200); --color-neutral-900: var(--theme-color-neutral-100); --color-primary-100: var(--theme-color-primary-900); --color-primary-200: var(--theme-color-primary-800); --color-primary-300: var(--theme-color-primary-700); --color-primary-400: var(--theme-color-primary-600); --color-primary-500: var(--theme-color-primary-500); --color-primary-600: var(--theme-color-primary-400); --color-primary-700: var(--theme-color-primary-300); --color-primary-800: var(--theme-color-primary-200); --color-primary-900: var(--theme-color-primary-100); --color-secondary-100: var(--theme-color-secondary-900); --color-secondary-200: var(--theme-color-secondary-800); --color-secondary-300: var(--theme-color-secondary-700); --color-secondary-400: var(--theme-color-secondary-600); --color-secondary-500: var(--theme-color-secondary-500); --color-secondary-600: var(--theme-color-secondary-400); --color-secondary-700: var(--theme-color-secondary-300); --color-secondary-800: var(--theme-color-secondary-200); --color-secondary-900: var(--theme-color-secondary-100); --color-success-100: var(--theme-color-success-900); --color-success-200: var(--theme-color-success-800); --color-success-300: var(--theme-color-success-700); --color-success-400: var(--theme-color-success-600); --color-success-500: var(--theme-color-success-500); --color-success-600: var(--theme-color-success-400); --color-success-700: var(--theme-color-success-300); --color-success-800: var(--theme-color-success-200); --color-success-900: var(--theme-color-success-100); --color-warning-100: var(--theme-color-warning-900); --color-warning-200: var(--theme-color-warning-800); --color-warning-300: var(--theme-color-warning-700); --color-warning-400: var(--theme-color-warning-600); --color-warning-500: var(--theme-color-warning-500); --color-warning-600: var(--theme-color-warning-400); --color-warning-700: var(--theme-color-warning-300); --color-warning-800: var(--theme-color-warning-200); --color-warning-900: var(--theme-color-warning-100); --color-danger-100: var(--theme-color-danger-900); --color-danger-200: var(--theme-color-danger-800); --color-danger-300: var(--theme-color-danger-700); --color-danger-400: var(--theme-color-danger-600); --color-danger-500: var(--theme-color-danger-500); --color-danger-600: var(--theme-color-danger-400); --color-danger-700: var(--theme-color-danger-300); --color-danger-800: var(--theme-color-danger-200); --color-danger-900: var(--theme-color-danger-100); } `;