*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
.\!visible {
  visibility: visible !important;
}
.visible {
  visibility: visible;
}
.collapse {
  visibility: collapse;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.bottom-0 {
  bottom: 0px;
}
.left-4 {
  left: 1rem;
}
.right-0 {
  right: 0px;
}
.top-0 {
  top: 0px;
}
.z-0 {
  z-index: 0;
}
.z-10 {
  z-index: 10;
}
.m-2 {
  margin: 0.5rem;
}
.m-5 {
  margin: 1.25rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.mb-0 {
  margin-bottom: 0px;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.ml-12 {
  margin-left: 3rem;
}
.ml-4 {
  margin-left: 1rem;
}
.ml-auto {
  margin-left: auto;
}
.mt-0 {
  margin-top: 0px;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.flex {
  display: flex;
}
.table {
  display: table;
}
.h-16 {
  height: 4rem;
}
.h-5 {
  height: 1.25rem;
}
.h-52 {
  height: 13rem;
}
.h-6 {
  height: 1.5rem;
}
.h-8 {
  height: 2rem;
}
.h-full {
  height: 100%;
}
.h-screen {
  height: 100vh;
}
.max-h-60 {
  max-height: 15rem;
}
.min-h-0 {
  min-height: 0px;
}
.min-h-\[700px\] {
  min-height: 700px;
}
.w-5 {
  width: 1.25rem;
}
.w-52 {
  width: 13rem;
}
.w-6 {
  width: 1.5rem;
}
.w-8 {
  width: 2rem;
}
.w-\[1px\] {
  width: 1px;
}
.w-full {
  width: 100%;
}
.w-px {
  width: 1px;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-80 {
  max-width: 20rem;
}
.max-w-fit {
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-none {
  flex: none;
}
.flex-grow {
  flex-grow: 1;
}
.basis-full {
  flex-basis: 100%;
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes spin {

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.items-center {
  align-items: center;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-3 {
  gap: 0.75rem;
}
.space-x-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(1rem * var(--tw-space-x-reverse));
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.self-center {
  align-self: center;
}
.overflow-auto {
  overflow: auto;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-md {
  border-radius: 0.375rem;
}
.rounded-xl {
  border-radius: 0.75rem;
}
.rounded-b-lg {
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.rounded-r-lg {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
.border-\[1px\] {
  border-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-b-\[1px\] {
  border-bottom-width: 1px;
}
.border-t-\[1px\] {
  border-top-width: 1px;
}
.border-\[var\(--sinch-ref-color-neutral-200\)\] {
  border-color: var(--sinch-ref-color-neutral-200);
}
.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}
.bg-\[var\(--sinch-ref-color-neutral-200\)\] {
  background-color: var(--sinch-ref-color-neutral-200);
}
.bg-\[var\(--sinch-ref-color-neutral-50\)\] {
  background-color: var(--sinch-ref-color-neutral-50);
}
.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}
.bg-gray-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));
}
.bg-green-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));
}
.bg-red-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-yellow-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 249 195 / var(--tw-bg-opacity, 1));
}
.p-16 {
  padding: 4rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pt-0 {
  padding-top: 0px;
}
.pt-2 {
  padding-top: 0.5rem;
}
.text-center {
  text-align: center;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-5xl {
  font-size: 3rem;
  line-height: 1;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.text-green-500 {
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}
.text-red-500 {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-yellow-500 {
  --tw-text-opacity: 1;
  color: rgb(234 179 8 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

* {
    font-family: 'DM Sans', sans-serif;
}
@font-face {
  font-family: "DM Sans";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src:
    local("DMSans-Regular"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-400.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-400.woff") format("woff");
}

@font-face {
  font-family: "DM Sans";
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src:
    local("DMSans-Medium"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-500.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-500.woff") format("woff");
}

@font-face {
  font-family: "DM Sans";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src:
    local("DMSans-Bold"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-700.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-700.woff") format("woff");
}

@font-face {
  font-family: "DM Sans";
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src:
    local("DMSans-Italic"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-400-italic.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-400-italic.woff") format("woff");
}

@font-face {
  font-family: "DM Sans";
  font-weight: 500;
  font-style: italic;
  font-display: swap;
  src:
    local("DMSans-MediumItalic"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-500-italic.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-500-italic.woff") format("woff");
}

@font-face {
  font-family: "DM Sans";
  font-weight: 700;
  font-style: italic;
  font-display: swap;
  src:
    local("DMSans-BoldItalic"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-700-italic.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Sans-700-italic.woff") format("woff");
}

@font-face {
  font-family: "DM Mono";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src:
    local("DMMono-Regular"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Mono-400.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/DM-Mono-400.woff") format("woff");
}

@font-face {
  font-family: "Sinch Icons Zero To D";
  src:
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-zeroToD.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-zeroToD.woff") format("woff");
}

@font-face {
  font-family: "Sinch Icons E To O";
  src:
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-eToO.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-eToO.woff") format("woff");
}

@font-face {
  font-family: "Sinch Icons P To Z";
  src:
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-pToZ.woff2") format("woff2"),
    url("https://d2vu40klajma73.cloudfront.net/sinch-icon-pToZ.woff") format("woff");
}

/* https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:FILL@0..1 */

/* https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:FILL@1 */

/* https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined */

@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src:
    local("MaterialSymbolsRoundedFilled24pt-Regular"),
    url("https://fonts.gstatic.com/s/materialsymbolsrounded/v109/syl0-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190FjpZIvDmUSVOK7BDJ_vb9vUSzq3wzLK-P0J-V_Zs-QtQth3-jOcbTCVpeRL2w5rwZu2rIelXxeJKJBiCa8.woff2") format("woff2");
}

.nectary-theme-base {
  --sinch-ref-color-candy-100: #FFE5F7;
  --sinch-ref-color-candy-200: #FFD6F3;
  --sinch-ref-color-candy-300: #FFBDEC;
  --sinch-ref-color-candy-350: #FAA5E3;
  --sinch-ref-color-candy-400: #EB83CF;
  --sinch-ref-color-candy-50: #FFF5FC;
  --sinch-ref-color-candy-500: #D15CB4;
  --sinch-ref-color-candy-600: #A3488E;
  --sinch-ref-color-candy-700: #8A3778;
  --sinch-ref-color-candy-800: #472140;
  --sinch-ref-color-candy-900: #2E192A;
  --sinch-ref-color-grass-100: #D7F5D7;
  --sinch-ref-color-grass-200: #C2EDC5;
  --sinch-ref-color-grass-300: #99E0A2;
  --sinch-ref-color-grass-350: #77D486;
  --sinch-ref-color-grass-400: #53BD69;
  --sinch-ref-color-grass-50: #ECFFEB;
  --sinch-ref-color-grass-500: #3D9956;
  --sinch-ref-color-grass-600: #2B7845;
  --sinch-ref-color-grass-700: #23613C;
  --sinch-ref-color-grass-800: #163323;
  --sinch-ref-color-grass-900: #102419;
  --sinch-ref-color-honey-100: #FCECCB;
  --sinch-ref-color-honey-200: #FFDD99;
  --sinch-ref-color-honey-300: #FFCA61;
  --sinch-ref-color-honey-350: #FFBE3C;
  --sinch-ref-color-honey-400: #EB9605;
  --sinch-ref-color-honey-50: #FFF9EB;
  --sinch-ref-color-honey-500: #C77904;
  --sinch-ref-color-honey-600: #9E5A00;
  --sinch-ref-color-honey-700: #824703;
  --sinch-ref-color-honey-800: #472706;
  --sinch-ref-color-honey-900: #331B06;
  --sinch-ref-color-neutral-100: #EBEEF0;
  --sinch-ref-color-neutral-200: #DCE2E5;
  --sinch-ref-color-neutral-300: #C9D1D6;
  --sinch-ref-color-neutral-350: #B7C1C7;
  --sinch-ref-color-neutral-400: #9EA9B0;
  --sinch-ref-color-neutral-50: #F7F9FA;
  --sinch-ref-color-neutral-500: #808A91;
  --sinch-ref-color-neutral-600: #626C73;
  --sinch-ref-color-neutral-700: #4B575E;
  --sinch-ref-color-neutral-800: #272F36;
  --sinch-ref-color-neutral-900: #1A2126;
  --sinch-ref-color-neutral-950: #14181C;
  --sinch-ref-color-ocean-100: #E0F1FF;
  --sinch-ref-color-ocean-200: #C7E5FF;
  --sinch-ref-color-ocean-300: #A8D4FF;
  --sinch-ref-color-ocean-350: #8AC4FF;
  --sinch-ref-color-ocean-400: #61ABFF;
  --sinch-ref-color-ocean-50: #F2F9FF;
  --sinch-ref-color-ocean-500: #3089F0;
  --sinch-ref-color-ocean-600: #0D68D1;
  --sinch-ref-color-ocean-700: #1454A8;
  --sinch-ref-color-ocean-800: #112F57;
  --sinch-ref-color-ocean-900: #0F2138;
  --sinch-ref-color-pumpkin-100: #FFE9D6;
  --sinch-ref-color-pumpkin-200: #FFD9BD;
  --sinch-ref-color-pumpkin-300: #FFC299;
  --sinch-ref-color-pumpkin-350: #FFAD75;
  --sinch-ref-color-pumpkin-400: #F58B4E;
  --sinch-ref-color-pumpkin-50: #FFF7F0;
  --sinch-ref-color-pumpkin-500: #D66A33;
  --sinch-ref-color-pumpkin-600: #AD4E24;
  --sinch-ref-color-pumpkin-700: #8F3D1F;
  --sinch-ref-color-pumpkin-800: #4D2215;
  --sinch-ref-color-pumpkin-900: #361811;
  --sinch-ref-color-raspberry-100: #FFE5E3;
  --sinch-ref-color-raspberry-200: #FFD8D6;
  --sinch-ref-color-raspberry-300: #FFBDBD;
  --sinch-ref-color-raspberry-350: #FFA8A8;
  --sinch-ref-color-raspberry-400: #FF8080;
  --sinch-ref-color-raspberry-50: #FFF6F5;
  --sinch-ref-color-raspberry-500: #EB5454;
  --sinch-ref-color-raspberry-600: #BD3C41;
  --sinch-ref-color-raspberry-700: #993138;
  --sinch-ref-color-raspberry-800: #57181C;
  --sinch-ref-color-raspberry-900: #3D1215;
  --sinch-ref-color-tropical-100: #E2F0E8;
  --sinch-ref-color-tropical-200: #CEE5DA;
  --sinch-ref-color-tropical-300: #AFDBCD;
  --sinch-ref-color-tropical-350: #80CFBC;
  --sinch-ref-color-tropical-400: #51B8A6;
  --sinch-ref-color-tropical-50: #F0FAF4;
  --sinch-ref-color-tropical-500: #06998B;
  --sinch-ref-color-tropical-600: #007874;
  --sinch-ref-color-tropical-700: #006063;
  --sinch-ref-color-tropical-800: #0C333B;
  --sinch-ref-color-tropical-900: #0E2329;
  --sinch-ref-color-violet-100: #EFEBFF;
  --sinch-ref-color-violet-200: #E2DBFF;
  --sinch-ref-color-violet-300: #D0C8FA;
  --sinch-ref-color-violet-350: #C1B6FA;
  --sinch-ref-color-violet-400: #A89BFA;
  --sinch-ref-color-violet-50: #F8F5FF;
  --sinch-ref-color-violet-500: #857AEB;
  --sinch-ref-color-violet-600: #645DC2;
  --sinch-ref-color-violet-700: #4D4AA8;
  --sinch-ref-color-violet-800: #2A2A54;
  --sinch-ref-color-violet-900: #1E1E33;
  --sinch-ref-shadow-level-0: none;
  --sinch-ref-shadow-level-1: 1px 2px 6px #0A273D1A;
  --sinch-ref-shadow-level-2: 1px 4px 8px #0A273D1A;
  --sinch-ref-shadow-level-3: 1px 6px 12px #0A273D26;
  --sinch-ref-shadow-level-4: 0 8px 16px #0A273D1A;
  --sinch-ref-typography-font-family-main: "DM Sans", "Arial", sans-serif;
  --sinch-ref-typography-font-family-mono: "DM Mono", monospace;
  --sinch-ref-typography-font-size-10: 10px;
  --sinch-ref-typography-font-size-12: 12px;
  --sinch-ref-typography-font-size-14: 14px;
  --sinch-ref-typography-font-size-16: 16px;
  --sinch-ref-typography-font-size-18: 18px;
  --sinch-ref-typography-font-size-20: 20px;
  --sinch-ref-typography-font-size-24: 24px;
  --sinch-ref-typography-font-size-40: 40px;
  --sinch-ref-typography-font-size-56: 56px;
  --sinch-ref-typography-font-weight-300: 300;
  --sinch-ref-typography-font-weight-400: 400;
  --sinch-ref-typography-font-weight-500: 500;
  --sinch-ref-typography-font-weight-600: 600;
  --sinch-ref-typography-font-weight-700: 700;
  --sinch-ref-typography-letter-spacing-body: 0;
  --sinch-ref-typography-letter-spacing-title: -2%;
  --sinch-ref-typography-line-height-14: 14px;
  --sinch-ref-typography-line-height-16: 16px;
  --sinch-ref-typography-line-height-20: 20px;
  --sinch-ref-typography-line-height-22: 22px;
  --sinch-ref-typography-line-height-24: 24px;
  --sinch-ref-typography-line-height-28: 28px;
  --sinch-ref-typography-line-height-32: 32px;
  --sinch-ref-typography-line-height-48: 48px;
  --sinch-ref-typography-line-height-72: 72px;
  --sinch-ref-typography-paragraph-spacing-0: 0;
  --sinch-ref-typography-paragraph-spacing-1: 12;
  --sinch-ref-typography-text-case-none: none;
  --sinch-ref-typography-text-decoration-none: none;
  --sinch-ref-typography-text-decoration-underline: underline;
  --sinch-sys-color-basic-pure: #FFFFFF;
  --sinch-sys-color-basic-pure-inverted: #000000;
  --sinch-sys-color-basic-transparent: transparent;
  --sinch-sys-color-border-default: var(--sinch-ref-color-neutral-350);
  --sinch-sys-color-border-disabled: var(--sinch-ref-color-neutral-100);
  --sinch-sys-color-border-strong: var(--sinch-ref-color-neutral-400);
  --sinch-sys-color-border-subtle: var(--sinch-ref-color-neutral-200);
  --sinch-sys-color-feedback-danger-default: var(--sinch-ref-color-raspberry-500);
  --sinch-sys-color-feedback-danger-strong: var(--sinch-ref-color-raspberry-700);
  --sinch-sys-color-feedback-danger-subtle: var(--sinch-ref-color-raspberry-200);
  --sinch-sys-color-feedback-info-default: var(--sinch-ref-color-ocean-500);
  --sinch-sys-color-feedback-info-strong: var(--sinch-ref-color-ocean-700);
  --sinch-sys-color-feedback-info-subtle: var(--sinch-ref-color-ocean-200);
  --sinch-sys-color-feedback-neutral-default: var(--sinch-ref-color-neutral-500);
  --sinch-sys-color-feedback-neutral-strong: var(--sinch-ref-color-neutral-700);
  --sinch-sys-color-feedback-neutral-subtle: var(--sinch-ref-color-neutral-200);
  --sinch-sys-color-feedback-success-default: var(--sinch-ref-color-grass-400);
  --sinch-sys-color-feedback-success-strong: var(--sinch-ref-color-grass-700);
  --sinch-sys-color-feedback-success-subtle: var(--sinch-ref-color-grass-200);
  --sinch-sys-color-feedback-warning-default: var(--sinch-ref-color-pumpkin-400);
  --sinch-sys-color-feedback-warning-strong: var(--sinch-ref-color-pumpkin-700);
  --sinch-sys-color-feedback-warning-subtle: var(--sinch-ref-color-pumpkin-200);
  --sinch-sys-color-focus: var(--sinch-ref-color-ocean-400);
  --sinch-sys-color-primary-active: var(--sinch-ref-color-tropical-800);
  --sinch-sys-color-primary-default: var(--sinch-ref-color-tropical-700);
  --sinch-sys-color-primary-disabled: var(--sinch-ref-color-tropical-400);
  --sinch-sys-color-primary-foreground: var(--sinch-sys-color-basic-pure);
  --sinch-sys-color-primary-hover: var(--sinch-ref-color-tropical-600);
  --sinch-sys-color-surface-canvas: var(--sinch-ref-color-neutral-100);
  --sinch-sys-color-surface-primary-active: var(--sinch-ref-color-neutral-100);
  --sinch-sys-color-surface-primary-default: var(--sinch-sys-color-basic-pure);
  --sinch-sys-color-surface-primary-disabled: var(--sinch-sys-color-basic-pure);
  --sinch-sys-color-surface-primary-hover: var(--sinch-ref-color-neutral-50);
  --sinch-sys-color-surface-secondary-active: var(--sinch-ref-color-neutral-200);
  --sinch-sys-color-surface-secondary-default: var(--sinch-ref-color-neutral-50);
  --sinch-sys-color-surface-secondary-disabled: var(--sinch-ref-color-neutral-50);
  --sinch-sys-color-surface-secondary-hover: var(--sinch-ref-color-neutral-100);
  --sinch-sys-color-surface-tertiary-active: var(--sinch-ref-color-neutral-300);
  --sinch-sys-color-surface-tertiary-default: var(--sinch-ref-color-neutral-100);
  --sinch-sys-color-surface-tertiary-disabled: var(--sinch-ref-color-neutral-50);
  --sinch-sys-color-surface-tertiary-hover: var(--sinch-ref-color-neutral-200);
  --sinch-sys-color-surface-transparent-active: #1A212633;
  --sinch-sys-color-surface-transparent-default: var(--sinch-sys-color-basic-transparent);
  --sinch-sys-color-surface-transparent-disabled: var(--sinch-sys-color-basic-transparent);
  --sinch-sys-color-surface-transparent-hover: #1A21261A;
  --sinch-sys-color-text-caption: var(--sinch-ref-color-neutral-700);
  --sinch-sys-color-text-default: var(--sinch-ref-color-neutral-900);
  --sinch-sys-color-text-disabled: var(--sinch-ref-color-neutral-400);
  --sinch-sys-color-text-muted: var(--sinch-ref-color-neutral-600);
  --sinch-sys-font-body-emphasize: var(--sinch-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-16)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-emphasize-s: var(--sinch-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-14)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-emphasize-xs: var(--sinch-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-12)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-link: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-16)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-m: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-16)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-monospace-m: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-16)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-mono);
  --sinch-sys-font-body-monospace-s: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-14)/var(--sinch-ref-typography-line-height-22) var(--sinch-ref-typography-font-family-mono);
  --sinch-sys-font-body-monospace-xs: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-12)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-mono);
  --sinch-sys-font-body-monospace-xxs: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-10)/var(--sinch-ref-typography-line-height-16) var(--sinch-ref-typography-font-family-mono);
  --sinch-sys-font-body-s: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-14)/var(--sinch-ref-typography-line-height-22) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-xs: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-12)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-body-xxs: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-10)/var(--sinch-ref-typography-line-height-16) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-hero: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-56)/var(--sinch-ref-typography-line-height-72) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-l: var(--sinch-ref-typography-font-weight-500) var(--sinch-ref-typography-font-size-24)/var(--sinch-ref-typography-line-height-32) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-m: var(--sinch-ref-typography-font-weight-500) var(--sinch-ref-typography-font-size-20)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-s: var(--sinch-ref-typography-font-weight-500) var(--sinch-ref-typography-font-size-16)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-xl: var(--sinch-ref-typography-font-weight-400) var(--sinch-ref-typography-font-size-40)/var(--sinch-ref-typography-line-height-48) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-font-desktop-title-xs: var(--sinch-ref-typography-font-weight-500) var(--sinch-ref-typography-font-size-14)/var(--sinch-ref-typography-line-height-22) var(--sinch-ref-typography-font-family-main);
  --sinch-sys-shape-radius-full: 9999px;
  --sinch-sys-shape-radius-l: 14px;
  --sinch-sys-shape-radius-m: 10px;
  --sinch-sys-shape-radius-s: 6px;
  --sinch-sys-shape-radius-xs: 2px;
  --sinch-sys-size-l: 48px;
  --sinch-sys-size-m: 40px;
  --sinch-sys-size-s: 32px;
  --sinch-sys-size-xs: 24px;
  --sinch-comp-accordion-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-accordion-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-accordion-color-default-optional-text-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-accordion-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-accordion-color-default-status-error: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-accordion-color-default-status-info: var(--sinch-sys-color-feedback-info-default);
  --sinch-comp-accordion-color-default-status-success: var(--sinch-sys-color-feedback-success-default);
  --sinch-comp-accordion-color-default-status-warning: var(--sinch-sys-color-feedback-warning-default);
  --sinch-comp-accordion-color-default-title-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-accordion-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-accordion-color-disabled-optional-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-accordion-color-disabled-title-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-accordion-font-optional-text: var(--sinch-sys-font-body-s);
  --sinch-comp-accordion-font-title: var(--sinch-sys-font-desktop-title-m);
  --sinch-comp-accordion-size-icon: var(--sinch-sys-size-xs);
  --sinch-comp-action-menu-color-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-action-menu-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-action-menu-color-default-background-selected: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-action-menu-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-action-menu-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-action-menu-color-disabled-background-initial: var(--sinch-sys-color-surface-transparent-disabled);
  --sinch-comp-action-menu-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-action-menu-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-action-menu-font-option: var(--sinch-sys-font-body-m);
  --sinch-comp-action-menu-size-icon: var(--sinch-sys-size-xs);
  --sinch-comp-alert-color-error-default-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-alert-color-error-default-icon: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-alert-color-error-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-alert-color-info-default-background: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-alert-color-info-default-icon: var(--sinch-sys-color-feedback-info-default);
  --sinch-comp-alert-color-info-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-alert-color-warning-default-background: var(--sinch-sys-color-feedback-warning-subtle);
  --sinch-comp-alert-color-warning-default-icon: var(--sinch-sys-color-feedback-warning-default);
  --sinch-comp-alert-color-warning-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-alert-font-body: var(--sinch-sys-font-body-m);
  --sinch-comp-avatar-border-color-default-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-avatar-container-color-blue-background: var(--sinch-ref-color-ocean-700);
  --sinch-comp-avatar-container-color-blue-foreground: var(--sinch-sys-color-basic-pure);
  --sinch-comp-avatar-container-color-dark-blue-background: var(--sinch-ref-color-ocean-800);
  --sinch-comp-avatar-container-color-dark-blue-foreground: var(--sinch-ref-color-ocean-100);
  --sinch-comp-avatar-container-color-dark-gray-background: var(--sinch-ref-color-neutral-800);
  --sinch-comp-avatar-container-color-dark-gray-foreground: var(--sinch-ref-color-neutral-200);
  --sinch-comp-avatar-container-color-dark-green-background: var(--sinch-ref-color-grass-700);
  --sinch-comp-avatar-container-color-dark-green-foreground: var(--sinch-ref-color-grass-200);
  --sinch-comp-avatar-container-color-dark-orange-background: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-avatar-container-color-dark-orange-foreground: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-avatar-container-color-dark-pink-background: var(--sinch-ref-color-candy-700);
  --sinch-comp-avatar-container-color-dark-pink-foreground: var(--sinch-ref-color-candy-200);
  --sinch-comp-avatar-container-color-dark-red-background: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-avatar-container-color-dark-red-foreground: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-avatar-container-color-dark-violet-background: var(--sinch-ref-color-violet-700);
  --sinch-comp-avatar-container-color-dark-violet-foreground: var(--sinch-ref-color-violet-200);
  --sinch-comp-avatar-container-color-dark-yellow-background: var(--sinch-ref-color-honey-700);
  --sinch-comp-avatar-container-color-dark-yellow-foreground: var(--sinch-ref-color-honey-200);
  --sinch-comp-avatar-container-color-default-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-avatar-container-color-default-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-avatar-container-color-gray-background: var(--sinch-ref-color-neutral-500);
  --sinch-comp-avatar-container-color-gray-foreground: var(--sinch-sys-color-basic-pure);
  --sinch-comp-avatar-container-color-green-background: var(--sinch-ref-color-grass-400);
  --sinch-comp-avatar-container-color-green-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-avatar-container-color-light-blue-background: var(--sinch-ref-color-ocean-100);
  --sinch-comp-avatar-container-color-light-blue-foreground: var(--sinch-ref-color-ocean-800);
  --sinch-comp-avatar-container-color-light-gray-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-avatar-container-color-light-gray-foreground: var(--sinch-ref-color-neutral-800);
  --sinch-comp-avatar-container-color-light-green-background: var(--sinch-ref-color-grass-200);
  --sinch-comp-avatar-container-color-light-green-foreground: var(--sinch-ref-color-grass-700);
  --sinch-comp-avatar-container-color-light-orange-background: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-avatar-container-color-light-orange-foreground: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-avatar-container-color-light-pink-background: var(--sinch-ref-color-candy-200);
  --sinch-comp-avatar-container-color-light-pink-foreground: var(--sinch-ref-color-candy-700);
  --sinch-comp-avatar-container-color-light-red-background: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-avatar-container-color-light-red-foreground: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-avatar-container-color-light-violet-background: var(--sinch-ref-color-violet-200);
  --sinch-comp-avatar-container-color-light-violet-foreground: var(--sinch-ref-color-violet-700);
  --sinch-comp-avatar-container-color-light-yellow-background: var(--sinch-ref-color-honey-200);
  --sinch-comp-avatar-container-color-light-yellow-foreground: var(--sinch-ref-color-honey-700);
  --sinch-comp-avatar-container-color-orange-background: var(--sinch-ref-color-pumpkin-400);
  --sinch-comp-avatar-container-color-orange-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-avatar-container-color-pink-background: var(--sinch-ref-color-candy-400);
  --sinch-comp-avatar-container-color-pink-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-avatar-container-color-red-background: var(--sinch-ref-color-raspberry-400);
  --sinch-comp-avatar-container-color-red-foreground: var(--sinch-ref-color-raspberry-900);
  --sinch-comp-avatar-container-color-violet-background: var(--sinch-ref-color-violet-400);
  --sinch-comp-avatar-container-color-violet-foreground: var(--sinch-sys-color-basic-pure-inverted);
  --sinch-comp-avatar-container-color-yellow-background: var(--sinch-ref-color-honey-400);
  --sinch-comp-avatar-container-color-yellow-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-avatar-container-font-size-l-text: var(--sinch-sys-font-desktop-title-m);
  --sinch-comp-avatar-container-font-size-m-text: var(--sinch-sys-font-desktop-title-s);
  --sinch-comp-avatar-container-font-size-s-text: var(--sinch-sys-font-body-xxs);
  --sinch-comp-avatar-shape-radius: var(--sinch-sys-shape-radius-full);
  --sinch-comp-avatar-size-l: 56px;
  --sinch-comp-avatar-size-m: 40px;
  --sinch-comp-avatar-size-s: 24px;
  --sinch-comp-avatar-status-color-away-default-background: var(--sinch-sys-color-feedback-warning-default);
  --sinch-comp-avatar-status-color-busy-default-background: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-avatar-status-color-offline-default-background: var(--sinch-sys-color-feedback-neutral-default);
  --sinch-comp-avatar-status-color-online-default-background: var(--sinch-sys-color-feedback-success-default);
  --sinch-comp-badge-color-background: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-badge-color-border: var(--sinch-sys-color-border-subtle);
  --sinch-comp-badge-color-text: var(--sinch-sys-color-basic-pure);
  --sinch-comp-badge-font-size-l: var(--sinch-ref-typography-font-weight-400) 14px/20px var(--sinch-ref-typography-font-family-mono);
  --sinch-comp-badge-font-size-m: var(--sinch-ref-typography-font-weight-400) 12px/14px var(--sinch-ref-typography-font-family-mono);
  --sinch-comp-badge-shape-radius: var(--sinch-sys-shape-radius-full);
  --sinch-comp-button-color-cta-primary-default-background-active: var(--sinch-ref-color-honey-300);
  --sinch-comp-button-color-cta-primary-default-background-hover: var(--sinch-ref-color-honey-200);
  --sinch-comp-button-color-cta-primary-default-background-initial: var(--sinch-ref-color-honey-350);
  --sinch-comp-button-color-cta-primary-default-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-cta-primary-default-icon-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-button-color-cta-primary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-cta-primary-default-text-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-button-color-cta-primary-disabled-background-initial: var(--sinch-ref-color-honey-50);
  --sinch-comp-button-color-cta-primary-disabled-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-cta-primary-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-cta-primary-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-cta-secondary-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-button-color-cta-secondary-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-button-color-cta-secondary-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-button-color-cta-secondary-default-border-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-button-color-cta-secondary-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-button-color-cta-secondary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-cta-secondary-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-button-color-cta-secondary-disabled-background-initial: var(--sinch-sys-color-surface-primary-disabled);
  --sinch-comp-button-color-cta-secondary-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-button-color-cta-secondary-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-cta-secondary-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-danger-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-button-color-danger-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-button-color-danger-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-button-color-danger-default-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-button-color-danger-default-icon-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-button-color-danger-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-danger-default-text-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-button-color-danger-disabled-background-initial: var(--sinch-sys-color-surface-primary-disabled);
  --sinch-comp-button-color-danger-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-button-color-danger-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-danger-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-primary-default-background-active: var(--sinch-sys-color-primary-active);
  --sinch-comp-button-color-primary-default-background-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-button-color-primary-default-background-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-primary-default-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-primary-default-icon-initial: var(--sinch-sys-color-primary-foreground);
  --sinch-comp-button-color-primary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-primary-default-text-initial: var(--sinch-sys-color-primary-foreground);
  --sinch-comp-button-color-primary-disabled-background-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-primary-disabled-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-primary-disabled-icon-initial: var(--sinch-sys-color-primary-foreground);
  --sinch-comp-button-color-primary-disabled-text-initial: var(--sinch-sys-color-primary-foreground);
  --sinch-comp-button-color-secondary-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-button-color-secondary-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-button-color-secondary-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-button-color-secondary-default-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-secondary-default-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-secondary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-secondary-default-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-secondary-disabled-background-initial: var(--sinch-sys-color-surface-primary-disabled);
  --sinch-comp-button-color-secondary-disabled-border-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-secondary-disabled-icon-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-secondary-disabled-text-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-subtle-primary-default-background-active: var(--sinch-sys-color-surface-transparent-active);
  --sinch-comp-button-color-subtle-primary-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-button-color-subtle-primary-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-button-color-subtle-primary-default-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-subtle-primary-default-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-subtle-primary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-subtle-primary-default-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-button-color-subtle-primary-disabled-background-initial: var(--sinch-sys-color-surface-transparent-disabled);
  --sinch-comp-button-color-subtle-primary-disabled-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-subtle-primary-disabled-icon-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-subtle-primary-disabled-text-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-button-color-subtle-primary-toggled-background-active: #24242433;
  --sinch-comp-button-color-subtle-primary-toggled-background-hover: #24242426;
  --sinch-comp-button-color-subtle-primary-toggled-background-initial: #2424241A;
  --sinch-comp-button-color-subtle-secondary-default-background-active: var(--sinch-sys-color-surface-transparent-active);
  --sinch-comp-button-color-subtle-secondary-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-button-color-subtle-secondary-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-button-color-subtle-secondary-default-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-subtle-secondary-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-button-color-subtle-secondary-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-button-color-subtle-secondary-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-button-color-subtle-secondary-disabled-background-initial: var(--sinch-sys-color-surface-transparent-disabled);
  --sinch-comp-button-color-subtle-secondary-disabled-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-button-color-subtle-secondary-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-subtle-secondary-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-button-color-subtle-secondary-toggled-background-active: #24242433;
  --sinch-comp-button-color-subtle-secondary-toggled-background-hover: #24242426;
  --sinch-comp-button-color-subtle-secondary-toggled-background-initial: #2424241A;
  --sinch-comp-button-font-size-l-text: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-button-font-size-m-text: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-button-font-size-s-text: var(--sinch-sys-font-body-emphasize-s);
  --sinch-comp-button-font-size-xs-text: var(--sinch-sys-font-body-emphasize-s);
  --sinch-comp-button-shadow-cta-primary-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-primary-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-primary-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-primary-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-primary-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-secondary-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-secondary-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-secondary-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-secondary-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-cta-secondary-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-danger-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-danger-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-danger-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-danger-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-danger-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-primary-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-primary-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-primary-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-primary-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-primary-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-secondary-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-secondary-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-secondary-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-secondary-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-secondary-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-subtle-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-subtle-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-subtle-focus: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-subtle-hover: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shadow-subtle-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-button-shape-radius-size-l: var(--sinch-sys-shape-radius-l);
  --sinch-comp-button-shape-radius-size-m: var(--sinch-sys-shape-radius-m);
  --sinch-comp-button-shape-radius-size-s: var(--sinch-sys-shape-radius-s);
  --sinch-comp-button-shape-radius-size-xs: var(--sinch-sys-shape-radius-xs);
  --sinch-comp-button-size-container-l: var(--sinch-sys-size-l);
  --sinch-comp-button-size-container-m: var(--sinch-sys-size-m);
  --sinch-comp-button-size-container-s: var(--sinch-sys-size-s);
  --sinch-comp-button-size-container-xs: var(--sinch-sys-size-xs);
  --sinch-comp-button-size-icon-l: 32px;
  --sinch-comp-button-size-icon-m: 24px;
  --sinch-comp-button-size-icon-s: 24px;
  --sinch-comp-button-size-icon-xs: 16px;
  --sinch-comp-card-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-card-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-card-color-default-description-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-color-default-title-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-font-description: var(--sinch-sys-font-body-m);
  --sinch-comp-card-font-label: var(--sinch-sys-font-desktop-title-xs);
  --sinch-comp-card-font-title: var(--sinch-sys-font-desktop-title-m);
  --sinch-comp-card-shadow-hover: var(--sinch-ref-shadow-level-1);
  --sinch-comp-card-shadow-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-card-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-card-size-icon: 48px;
  --sinch-comp-chat-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-checkbox-color-checked-background-active: var(--sinch-sys-color-primary-active);
  --sinch-comp-checkbox-color-checked-background-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-checkbox-color-checked-background-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-checkbox-color-checked-border-active: var(--sinch-sys-color-primary-active);
  --sinch-comp-checkbox-color-checked-border-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-checkbox-color-checked-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-checkbox-color-checked-disabled-background-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-checkbox-color-checked-disabled-border-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-checkbox-color-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-checkbox-color-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-checkbox-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-checkbox-color-default-border-active: var(--sinch-sys-color-border-strong);
  --sinch-comp-checkbox-color-default-border-hover: var(--sinch-sys-color-border-strong);
  --sinch-comp-checkbox-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-checkbox-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-checkbox-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-checkbox-color-disabled-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-checkbox-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-checkbox-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-checkbox-color-invalid-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-checkbox-color-invalid-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-checkbox-color-invalid-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-checkbox-color-invalid-border-active: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-checkbox-color-invalid-border-hover: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-checkbox-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-checkbox-color-invalid-text-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-checkbox-font-label: var(--sinch-sys-font-body-m);
  --sinch-comp-checkbox-shape-radius: var(--sinch-sys-shape-radius-s);
  --sinch-comp-chip-color-blue-default-background-initial: var(--sinch-ref-color-ocean-700);
  --sinch-comp-chip-color-blue-default-foreground-initial: var(--sinch-sys-color-basic-pure);
  --sinch-comp-chip-color-danger-default-background-initial: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-chip-color-danger-default-foreground-initial: var(--sinch-sys-color-feedback-danger-strong);
  --sinch-comp-chip-color-dark-blue-default-background-initial: var(--sinch-ref-color-ocean-800);
  --sinch-comp-chip-color-dark-blue-default-foreground-initial: var(--sinch-ref-color-ocean-100);
  --sinch-comp-chip-color-dark-gray-default-background-initial: var(--sinch-ref-color-neutral-800);
  --sinch-comp-chip-color-dark-gray-default-foreground-initial: var(--sinch-ref-color-neutral-200);
  --sinch-comp-chip-color-dark-green-default-background-initial: var(--sinch-ref-color-grass-700);
  --sinch-comp-chip-color-dark-green-default-foreground-initial: var(--sinch-ref-color-grass-200);
  --sinch-comp-chip-color-dark-orange-default-background-initial: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-chip-color-dark-orange-default-foreground-initial: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-chip-color-dark-pink-default-background-initial: var(--sinch-ref-color-candy-700);
  --sinch-comp-chip-color-dark-pink-default-foreground-initial: var(--sinch-ref-color-candy-200);
  --sinch-comp-chip-color-dark-red-default-background-initial: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-chip-color-dark-red-default-foreground-initial: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-chip-color-dark-violet-default-background-initial: var(--sinch-ref-color-violet-700);
  --sinch-comp-chip-color-dark-violet-default-foreground-initial: var(--sinch-ref-color-violet-200);
  --sinch-comp-chip-color-dark-yellow-default-background-initial: var(--sinch-ref-color-honey-700);
  --sinch-comp-chip-color-dark-yellow-default-foreground-initial: var(--sinch-ref-color-honey-200);
  --sinch-comp-chip-color-gray-default-background-initial: var(--sinch-ref-color-neutral-500);
  --sinch-comp-chip-color-gray-default-foreground-initial: var(--sinch-sys-color-basic-pure);
  --sinch-comp-chip-color-green-default-background-initial: var(--sinch-ref-color-grass-400);
  --sinch-comp-chip-color-green-default-foreground-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-chip-color-info-default-background-initial: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-chip-color-info-default-foreground-initial: var(--sinch-sys-color-feedback-info-strong);
  --sinch-comp-chip-color-light-blue-default-background-initial: var(--sinch-ref-color-ocean-100);
  --sinch-comp-chip-color-light-blue-default-foreground-initial: var(--sinch-ref-color-ocean-800);
  --sinch-comp-chip-color-light-gray-default-background-initial: var(--sinch-ref-color-neutral-200);
  --sinch-comp-chip-color-light-gray-default-foreground-initial: var(--sinch-ref-color-neutral-800);
  --sinch-comp-chip-color-light-green-default-background-initial: var(--sinch-ref-color-grass-200);
  --sinch-comp-chip-color-light-green-default-foreground-initial: var(--sinch-ref-color-grass-700);
  --sinch-comp-chip-color-light-orange-default-background-initial: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-chip-color-light-orange-default-foreground-initial: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-chip-color-light-pink-default-background-initial: var(--sinch-ref-color-candy-200);
  --sinch-comp-chip-color-light-pink-default-foreground-initial: var(--sinch-ref-color-candy-700);
  --sinch-comp-chip-color-light-red-default-background-initial: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-chip-color-light-red-default-foreground-initial: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-chip-color-light-violet-default-background-initial: var(--sinch-ref-color-violet-200);
  --sinch-comp-chip-color-light-violet-default-foreground-initial: var(--sinch-ref-color-violet-700);
  --sinch-comp-chip-color-light-yellow-default-background-initial: var(--sinch-ref-color-honey-200);
  --sinch-comp-chip-color-light-yellow-default-foreground-initial: var(--sinch-ref-color-honey-700);
  --sinch-comp-chip-color-neutral-default-background-initial: var(--sinch-ref-color-neutral-200);
  --sinch-comp-chip-color-neutral-default-foreground-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-chip-color-orange-default-background-initial: var(--sinch-ref-color-pumpkin-400);
  --sinch-comp-chip-color-orange-default-foreground-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-chip-color-outiline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-chip-color-pink-default-background-initial: var(--sinch-ref-color-candy-400);
  --sinch-comp-chip-color-pink-default-foreground-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-chip-color-red-default-background-initial: var(--sinch-ref-color-raspberry-500);
  --sinch-comp-chip-color-red-default-foreground-initial: var(--sinch-ref-color-neutral-950);
  --sinch-comp-chip-color-success-default-background-initial: var(--sinch-sys-color-feedback-success-subtle);
  --sinch-comp-chip-color-success-default-foreground-initial: var(--sinch-sys-color-feedback-success-strong);
  --sinch-comp-chip-color-violet-default-background-initial: var(--sinch-ref-color-violet-400);
  --sinch-comp-chip-color-violet-default-foreground-initial: var(--sinch-sys-color-basic-pure-inverted);
  --sinch-comp-chip-color-warning-default-background-initial: var(--sinch-sys-color-feedback-warning-subtle);
  --sinch-comp-chip-color-warning-default-foreground-initial: var(--sinch-sys-color-feedback-warning-strong);
  --sinch-comp-chip-color-yellow-default-background-initial: var(--sinch-ref-color-honey-400);
  --sinch-comp-chip-color-yellow-default-foreground-initial: var(--sinch-ref-color-neutral-900);
  --sinch-comp-chip-font-size-m-label: var(--sinch-sys-font-body-xs);
  --sinch-comp-chip-font-size-s-label: var(--sinch-sys-font-body-xs);
  --sinch-comp-chip-shape-radius: var(--sinch-sys-shape-radius-full);
  --sinch-comp-chip-size-container-m: 24px;
  --sinch-comp-chip-size-container-s: 20px;
  --sinch-comp-chip-size-icon-m: 16px;
  --sinch-comp-chip-size-icon-s: 16px;
  --sinch-comp-code-snippet-color-default-background-initial: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-code-snippet-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-code-tag-color-default-background-initial: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-code-tag-color-default-border-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-code-tag-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-code-tag-font-text: var(--sinch-sys-font-body-monospace-m);
  --sinch-comp-code-tag-shape-radius: var(--sinch-sys-shape-radius-xs);
  --sinch-comp-color-menu-option-color-default-border-active: var(--sinch-ref-color-neutral-700);
  --sinch-comp-color-menu-option-color-default-border-focus: var(--sinch-sys-color-focus);
  --sinch-comp-color-menu-option-color-default-border-hover: var(--sinch-ref-color-neutral-500);
  --sinch-comp-color-menu-option-color-default-border-initial: transparent;
  --sinch-comp-color-menu-option-color-default-border-selected: var(--sinch-sys-color-basic-pure-inverted);
  --sinch-comp-color-swatch-color-blue-background: var(--sinch-ref-color-ocean-700);
  --sinch-comp-color-swatch-color-dark-blue-background: var(--sinch-ref-color-ocean-800);
  --sinch-comp-color-swatch-color-dark-gray-background: var(--sinch-ref-color-neutral-800);
  --sinch-comp-color-swatch-color-dark-green-background: var(--sinch-ref-color-grass-700);
  --sinch-comp-color-swatch-color-dark-orange-background: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-color-swatch-color-dark-pink-background: var(--sinch-ref-color-candy-700);
  --sinch-comp-color-swatch-color-dark-red-background: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-color-swatch-color-dark-violet-background: var(--sinch-ref-color-violet-700);
  --sinch-comp-color-swatch-color-dark-yellow-background: var(--sinch-ref-color-honey-700);
  --sinch-comp-color-swatch-color-default-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-color-swatch-color-gray-background: var(--sinch-ref-color-neutral-500);
  --sinch-comp-color-swatch-color-green-background: var(--sinch-ref-color-grass-400);
  --sinch-comp-color-swatch-color-light-blue-background: var(--sinch-ref-color-ocean-100);
  --sinch-comp-color-swatch-color-light-gray-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-color-swatch-color-light-green-background: var(--sinch-ref-color-grass-200);
  --sinch-comp-color-swatch-color-light-orange-background: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-color-swatch-color-light-pink-background: var(--sinch-ref-color-candy-200);
  --sinch-comp-color-swatch-color-light-red-background: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-color-swatch-color-light-violet-background: var(--sinch-ref-color-violet-200);
  --sinch-comp-color-swatch-color-light-yellow-background: var(--sinch-ref-color-honey-200);
  --sinch-comp-color-swatch-color-orange-background: var(--sinch-ref-color-pumpkin-400);
  --sinch-comp-color-swatch-color-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-color-swatch-color-pink-background: var(--sinch-ref-color-candy-400);
  --sinch-comp-color-swatch-color-red-background: var(--sinch-ref-color-raspberry-500);
  --sinch-comp-color-swatch-color-skintone-dark-background: #7C533E;
  --sinch-comp-color-swatch-color-skintone-default-background: #FFCC4D;
  --sinch-comp-color-swatch-color-skintone-light-background: #F7DECE;
  --sinch-comp-color-swatch-color-skintone-light-medium-background: #F3D2A2;
  --sinch-comp-color-swatch-color-skintone-medium-background: #D4AB88;
  --sinch-comp-color-swatch-color-skintone-medium-dark-background: #AF7E57;
  --sinch-comp-color-swatch-color-violet-background: var(--sinch-ref-color-violet-400);
  --sinch-comp-color-swatch-color-yellow-background: var(--sinch-ref-color-honey-400);
  --sinch-comp-date-picker-day-color-checked-background-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-date-picker-day-color-checked-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-date-picker-day-color-checked-text-initial: var(--sinch-sys-color-basic-pure);
  --sinch-comp-date-picker-day-color-default-background-hover: #0060631A;
  --sinch-comp-date-picker-day-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-date-picker-day-color-default-border-initial: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-date-picker-day-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-date-picker-day-color-default-range-background: #0060631A;
  --sinch-comp-date-picker-day-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-date-picker-day-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-date-picker-day-shape-radius: var(--sinch-comp-button-shape-radius-size-s);
  --sinch-comp-date-picker-font-day: var(--sinch-sys-font-body-xs);
  --sinch-comp-date-picker-font-header: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-date-picker-font-today: var(--sinch-sys-font-body-xs);
  --sinch-comp-date-picker-font-weekday: var(--sinch-sys-font-body-emphasize-xs);
  --sinch-comp-date-picker-header-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-date-picker-header-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-date-picker-today-color-checked-background-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-date-picker-today-color-checked-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-date-picker-today-color-checked-text-initial: var(--sinch-sys-color-basic-pure);
  --sinch-comp-date-picker-today-color-default-background-hover: #0060631A;
  --sinch-comp-date-picker-today-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-date-picker-today-color-default-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-date-picker-today-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-date-picker-today-color-disabled-border-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-date-picker-today-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-date-picker-weekday-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-dialog-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-dialog-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-dialog-color-default-title-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-dialog-font-title: var(--sinch-sys-font-desktop-title-m);
  --sinch-comp-dialog-shadow: var(--sinch-ref-shadow-level-2);
  --sinch-comp-dialog-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-emoji-picker-color-default-text-not-found: var(--sinch-sys-color-text-muted);
  --sinch-comp-emoji-picker-font-not-found: var(--sinch-sys-font-body-m);
  --sinch-comp-field-color-default-additional-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-field-color-default-label-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-field-color-default-optional-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-field-color-disabled-additional-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-field-color-disabled-label-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-field-color-disabled-optional-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-field-color-invalid-text-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-field-font-additional: var(--sinch-sys-font-body-xs);
  --sinch-comp-field-font-invalid: var(--sinch-sys-font-body-xs);
  --sinch-comp-field-font-label: var(--sinch-sys-font-desktop-title-s);
  --sinch-comp-field-font-optional: var(--sinch-sys-font-body-s);
  --sinch-comp-file-drop-color-default-background-active: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-file-drop-color-default-background-initial: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-drop-color-default-border-active: var(--sinch-sys-color-focus);
  --sinch-comp-file-drop-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-file-drop-color-default-placeholder-active: var(--sinch-sys-color-text-muted);
  --sinch-comp-file-drop-color-default-placeholder-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-file-drop-color-disabled-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-file-drop-color-disabled-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-file-drop-color-disabled-placeholder-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-file-drop-color-invalid-background-initial: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-drop-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-file-drop-color-invalid-placeholder-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-file-drop-font-placeholder: var(--sinch-sys-font-body-m);
  --sinch-comp-file-drop-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-file-status-color-error-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-file-status-color-error-icon: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-file-status-color-error-text: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-loading-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-status-color-loading-icon: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-loading-text: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-pending-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-status-color-pending-icon: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-pending-text: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-progress-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-status-color-progress-icon: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-progress-info: var(--sinch-sys-color-text-muted);
  --sinch-comp-file-status-color-progress-text: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-color-success-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-status-color-success-icon: var(--sinch-sys-color-feedback-success-default);
  --sinch-comp-file-status-color-success-text: var(--sinch-sys-color-text-default);
  --sinch-comp-file-status-font-body: var(--sinch-sys-font-body-m);
  --sinch-comp-file-status-font-info: var(--sinch-sys-font-body-m);
  --sinch-comp-file-status-font-title: var(--sinch-sys-font-desktop-title-s);
  --sinch-comp-file-status-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-inline-alert-color-error-default-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-inline-alert-color-error-default-icon: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-inline-alert-color-error-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-inline-alert-color-info-default-background: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-inline-alert-color-info-default-icon: var(--sinch-sys-color-feedback-info-default);
  --sinch-comp-inline-alert-color-info-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-inline-alert-color-success-default-background: var(--sinch-sys-color-feedback-success-subtle);
  --sinch-comp-inline-alert-color-success-default-icon: var(--sinch-sys-color-feedback-success-default);
  --sinch-comp-inline-alert-color-success-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-inline-alert-color-warning-default-background: var(--sinch-sys-color-feedback-warning-subtle);
  --sinch-comp-inline-alert-color-warning-default-icon: var(--sinch-sys-color-feedback-warning-default);
  --sinch-comp-inline-alert-color-warning-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-inline-alert-font-body: var(--sinch-sys-font-body-m);
  --sinch-comp-inline-alert-font-title: var(--sinch-sys-font-desktop-title-s);
  --sinch-comp-inline-alert-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-input-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-input-color-default-border-focus: var(--sinch-sys-color-focus);
  --sinch-comp-input-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-input-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-input-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-input-color-default-text-placeholder: var(--sinch-sys-color-text-muted);
  --sinch-comp-input-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-input-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-input-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-input-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-input-font-input: var(--sinch-sys-font-body-m);
  --sinch-comp-input-font-placeholder: var(--sinch-sys-font-body-m);
  --sinch-comp-input-shape-radius-size-l: var(--sinch-sys-shape-radius-l);
  --sinch-comp-input-shape-radius-size-m: var(--sinch-sys-shape-radius-m);
  --sinch-comp-input-shape-radius-size-s: var(--sinch-sys-shape-radius-s);
  --sinch-comp-input-size-container-l: var(--sinch-sys-size-l);
  --sinch-comp-input-size-container-m: var(--sinch-sys-size-m);
  --sinch-comp-input-size-container-s: var(--sinch-sys-size-s);
  --sinch-comp-input-size-icon-l: 24px;
  --sinch-comp-input-size-icon-m: 24px;
  --sinch-comp-input-size-icon-s: 24px;
  --sinch-comp-link-color-default-icon-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-link-color-default-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-link-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-link-color-default-text-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-link-color-default-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-link-color-disabled-icon-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-link-color-disabled-text-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-link-default-font-initial: var(--sinch-sys-font-body-link);
  --sinch-comp-link-default-text-decoration-disabled: none;
  --sinch-comp-link-default-text-decoration-hover: none;
  --sinch-comp-link-default-text-decoration-initial: var(--sinch-ref-typography-text-decoration-underline);
  --sinch-comp-link-standalone-font-initial: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-list-color-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-list-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-list-color-default-border-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-pagination-color-checked-background-hover: var(--sinch-sys-color-surface-transparent-active);
  --sinch-comp-pagination-color-checked-background-initial: var(--sinch-sys-color-surface-transparent-active);
  --sinch-comp-pagination-color-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-pagination-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-pagination-color-default-icon-default: var(--sinch-sys-color-text-default);
  --sinch-comp-pagination-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-pagination-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-pagination-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-pagination-font-checked-page-number: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-pagination-font-default-page-number: var(--sinch-sys-font-body-m);
  --sinch-comp-pagination-shape-radius: var(--sinch-sys-shape-radius-s);
  --sinch-comp-popover-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-popover-color-default-border-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-popover-shadow: var(--sinch-ref-shadow-level-2);
  --sinch-comp-popover-shape-radius: var(--sinch-sys-shape-radius-m);
  --sinch-comp-progress-color-default-background-initial: #00606333;
  --sinch-comp-progress-color-default-bar-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-progress-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-progress-stepper-step-color-complete-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-progress-stepper-step-color-complete-label-default: var(--sinch-sys-color-text-muted);
  --sinch-comp-progress-stepper-step-color-complete-progress-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-progress-stepper-step-color-complete-progress-bar: var(--sinch-sys-color-primary-default);
  --sinch-comp-progress-stepper-step-color-complete-current-label-default: var(--sinch-sys-color-text-default);
  --sinch-comp-progress-stepper-step-color-inactive-label-default: var(--sinch-sys-color-text-disabled);
  --sinch-comp-progress-stepper-step-color-inactive-progress-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-progress-stepper-step-color-incomplete-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-progress-stepper-step-color-incomplete-label-default: var(--sinch-sys-color-text-muted);
  --sinch-comp-progress-stepper-step-color-incomplete-progress-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-progress-stepper-step-color-incomplete-progress-bar: var(--sinch-sys-color-primary-default);
  --sinch-comp-progress-stepper-step-color-incomplete-current-label-default: var(--sinch-sys-color-text-default);
  --sinch-comp-progress-stepper-step-color-invalid-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-progress-stepper-step-color-invalid-icon-default: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-progress-stepper-step-color-invalid-label-default: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-progress-stepper-step-color-invalid-progress-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-progress-stepper-step-color-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-progress-stepper-step-font-complete-label: var(--sinch-sys-font-body-m);
  --sinch-comp-progress-stepper-step-font-complete-current-label: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-progress-stepper-step-font-inactive-label: var(--sinch-sys-font-body-m);
  --sinch-comp-progress-stepper-step-font-incomplete-label: var(--sinch-sys-font-body-m);
  --sinch-comp-progress-stepper-step-font-incomplete-current-label: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-progress-stepper-step-font-invalid-label: var(--sinch-sys-font-body-m);
  --sinch-comp-progress-stepper-step-font-invalid-current-label: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-progress-stepper-step-shape-radius: var(--sinch-sys-shape-radius-m);
  --sinch-comp-radio-color-checked-border-active: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-checked-border-hover: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-checked-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-checked-knob-active: var(--sinch-sys-color-primary-active);
  --sinch-comp-radio-color-checked-knob-hover: var(--sinch-sys-color-primary-hover);
  --sinch-comp-radio-color-checked-knob-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-radio-color-checked-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-radio-color-checked-disabled-knob-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-radio-color-checked-disabled-label-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-radio-color-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-radio-color-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-radio-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-radio-color-default-border-active: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-default-border-hover: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-radio-color-default-label-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-radio-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-radio-color-disabled-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-radio-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-radio-color-disabled-label-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-radio-color-invalid-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-radio-color-invalid-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-radio-color-invalid-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-radio-color-invalid-border-active: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-radio-color-invalid-border-hover: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-radio-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-radio-color-invalid-label-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-radio-font-label: var(--sinch-sys-font-body-m);
  --sinch-comp-segment-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-segment-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-segment-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-segment-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-segment-font-size-l-title: var(--sinch-sys-font-desktop-title-l);
  --sinch-comp-segment-font-size-m-title: var(--sinch-sys-font-desktop-title-m);
  --sinch-comp-segment-font-size-s-title: var(--sinch-sys-font-desktop-title-s);
  --sinch-comp-segment-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-segmented-control-color-checked-background-initial: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-segmented-control-color-checked-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-segmented-control-color-checked-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-segmented-control-color-checked-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-segmented-control-color-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-segmented-control-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-segmented-control-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-segmented-control-color-default-icon-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-segmented-control-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-segmented-control-color-default-text-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-segmented-control-color-disabled-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-segmented-control-color-disabled-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-segmented-control-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-segmented-control-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-segmented-control-font-label: var(--sinch-sys-font-body-m);
  --sinch-comp-segmented-control-shape-radius: var(--sinch-sys-shape-radius-s);
  --sinch-comp-segmented-control-size-icon: var(--sinch-sys-size-xs);
  --sinch-comp-select-button-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-select-button-color-default-border-focus: var(--sinch-sys-color-focus);
  --sinch-comp-select-button-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-select-button-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-select-button-color-default-placeholder-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-select-button-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-select-button-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-select-button-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-select-button-color-disabled-placeholder-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-select-button-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-select-button-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-select-button-font-input: var(--sinch-sys-font-body-m);
  --sinch-comp-select-button-font-placeholder: var(--sinch-sys-font-body-m);
  --sinch-comp-select-button-shape-radius-size-l: var(--sinch-sys-shape-radius-l);
  --sinch-comp-select-button-shape-radius-size-m: var(--sinch-sys-shape-radius-m);
  --sinch-comp-select-button-shape-radius-size-s: var(--sinch-sys-shape-radius-s);
  --sinch-comp-select-button-size-container-l: var(--sinch-sys-size-l);
  --sinch-comp-select-button-size-container-m: var(--sinch-sys-size-m);
  --sinch-comp-select-button-size-container-s: var(--sinch-sys-size-s);
  --sinch-comp-select-button-size-icon-l: 24px;
  --sinch-comp-select-button-size-icon-m: 24px;
  --sinch-comp-select-button-size-icon-s: 24px;
  --sinch-comp-select-menu-color-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-select-menu-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-select-menu-color-default-background-selected: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-select-menu-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-select-menu-color-default-not-found-text-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-select-menu-color-default-option-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-select-menu-color-disabled-background-initial: var(--sinch-sys-color-surface-transparent-disabled);
  --sinch-comp-select-menu-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-select-menu-color-disabled-option-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-select-menu-font-not-found-text: var(--sinch-sys-font-body-m);
  --sinch-comp-select-menu-font-option: var(--sinch-sys-font-body-m);
  --sinch-comp-select-menu-size-icon: var(--sinch-sys-size-xs);
  --sinch-comp-tab-color-checked-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tab-color-checked-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tab-color-checked-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tab-color-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-tab-color-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-tab-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-tab-color-default-icon-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-tab-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-tab-color-default-text-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-tab-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-tab-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-tab-font-label: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-tab-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-tab-size-icon: 16px;
  --sinch-comp-table-color-cell-default-border-initial: var(--sinch-sys-color-border-subtle);
  --sinch-comp-table-color-head-cell-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-table-color-head-cell-default-icon-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-table-color-head-cell-default-text-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-table-color-head-cell-sorted-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-table-color-head-cell-sorted-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-table-color-row-checked-background-initial: var(--sinch-sys-color-surface-transparent-active);
  --sinch-comp-table-color-row-default-background-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-table-color-row-default-background-initial: var(--sinch-sys-color-surface-transparent-default);
  --sinch-comp-table-color-row-default-background-sticky: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-tag-color-blue-background: var(--sinch-ref-color-ocean-700);
  --sinch-comp-tag-color-blue-foreground: var(--sinch-sys-color-basic-pure);
  --sinch-comp-tag-color-danger-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-tag-color-danger-foreground: var(--sinch-sys-color-feedback-danger-strong);
  --sinch-comp-tag-color-dark-blue-background: var(--sinch-ref-color-ocean-800);
  --sinch-comp-tag-color-dark-blue-foreground: var(--sinch-ref-color-ocean-100);
  --sinch-comp-tag-color-dark-gray-background: var(--sinch-ref-color-neutral-800);
  --sinch-comp-tag-color-dark-gray-foreground: var(--sinch-ref-color-neutral-200);
  --sinch-comp-tag-color-dark-green-background: var(--sinch-ref-color-grass-700);
  --sinch-comp-tag-color-dark-green-foreground: var(--sinch-ref-color-grass-200);
  --sinch-comp-tag-color-dark-orange-background: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-tag-color-dark-orange-foreground: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-tag-color-dark-pink-background: var(--sinch-ref-color-candy-700);
  --sinch-comp-tag-color-dark-pink-foreground: var(--sinch-ref-color-candy-200);
  --sinch-comp-tag-color-dark-red-background: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-tag-color-dark-red-foreground: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-tag-color-dark-violet-background: var(--sinch-ref-color-violet-700);
  --sinch-comp-tag-color-dark-violet-foreground: var(--sinch-ref-color-violet-200);
  --sinch-comp-tag-color-dark-yellow-background: var(--sinch-ref-color-honey-700);
  --sinch-comp-tag-color-dark-yellow-foreground: var(--sinch-ref-color-honey-200);
  --sinch-comp-tag-color-default-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-tag-color-default-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-color-gray-background: var(--sinch-ref-color-neutral-500);
  --sinch-comp-tag-color-gray-foreground: var(--sinch-sys-color-basic-pure);
  --sinch-comp-tag-color-green-background: var(--sinch-ref-color-grass-400);
  --sinch-comp-tag-color-green-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-color-info-background: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-tag-color-info-foreground: var(--sinch-sys-color-feedback-info-strong);
  --sinch-comp-tag-color-light-blue-background: var(--sinch-ref-color-ocean-100);
  --sinch-comp-tag-color-light-blue-foreground: var(--sinch-ref-color-ocean-800);
  --sinch-comp-tag-color-light-gray-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-tag-color-light-gray-foreground: var(--sinch-ref-color-neutral-800);
  --sinch-comp-tag-color-light-green-background: var(--sinch-ref-color-grass-200);
  --sinch-comp-tag-color-light-green-foreground: var(--sinch-ref-color-grass-700);
  --sinch-comp-tag-color-light-orange-background: var(--sinch-ref-color-pumpkin-200);
  --sinch-comp-tag-color-light-orange-foreground: var(--sinch-ref-color-pumpkin-700);
  --sinch-comp-tag-color-light-pink-background: var(--sinch-ref-color-candy-200);
  --sinch-comp-tag-color-light-pink-foreground: var(--sinch-ref-color-candy-700);
  --sinch-comp-tag-color-light-red-background: var(--sinch-ref-color-raspberry-200);
  --sinch-comp-tag-color-light-red-foreground: var(--sinch-ref-color-raspberry-700);
  --sinch-comp-tag-color-light-violet-background: var(--sinch-ref-color-violet-200);
  --sinch-comp-tag-color-light-violet-foreground: var(--sinch-ref-color-violet-700);
  --sinch-comp-tag-color-light-yellow-background: var(--sinch-ref-color-honey-200);
  --sinch-comp-tag-color-light-yellow-foreground: var(--sinch-ref-color-honey-700);
  --sinch-comp-tag-color-orange-background: var(--sinch-ref-color-pumpkin-400);
  --sinch-comp-tag-color-orange-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-color-pink-background: var(--sinch-ref-color-candy-400);
  --sinch-comp-tag-color-pink-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-color-red-background: var(--sinch-ref-color-raspberry-500);
  --sinch-comp-tag-color-red-foreground: var(--sinch-ref-color-neutral-950);
  --sinch-comp-tag-color-success-background: var(--sinch-sys-color-feedback-success-subtle);
  --sinch-comp-tag-color-success-foreground: var(--sinch-sys-color-feedback-success-strong);
  --sinch-comp-tag-color-violet-background: var(--sinch-ref-color-violet-400);
  --sinch-comp-tag-color-violet-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-color-warning-background: var(--sinch-sys-color-feedback-warning-subtle);
  --sinch-comp-tag-color-warning-foreground: var(--sinch-sys-color-feedback-warning-strong);
  --sinch-comp-tag-color-yellow-background: var(--sinch-ref-color-honey-400);
  --sinch-comp-tag-color-yellow-foreground: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tag-font-size-m-label: var(--sinch-sys-font-body-xs);
  --sinch-comp-tag-font-size-s-label: var(--sinch-sys-font-body-xs);
  --sinch-comp-tag-shape-radius: var(--sinch-sys-shape-radius-full);
  --sinch-comp-tag-size-container-m: 24px;
  --sinch-comp-tag-size-container-s: 20px;
  --sinch-comp-tag-size-icon-m: 16px;
  --sinch-comp-tag-size-icon-s: 16px;
  --sinch-comp-textarea-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-textarea-color-default-border-focus: var(--sinch-sys-color-focus);
  --sinch-comp-textarea-color-default-border-initial: var(--sinch-sys-color-border-strong);
  --sinch-comp-textarea-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-textarea-color-default-text-placeholder: var(--sinch-sys-color-text-muted);
  --sinch-comp-textarea-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-textarea-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-textarea-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-textarea-font-input: var(--sinch-sys-font-body-m);
  --sinch-comp-textarea-shape-radius: var(--sinch-comp-button-shape-radius-size-m);
  --sinch-comp-tile-control-color-checked-background-initial: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-tile-control-color-checked-border-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tile-control-color-checked-icon-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tile-control-color-checked-text-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-tile-control-color-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-tile-control-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-tile-control-color-default-border-hover: var(--sinch-sys-color-surface-transparent-hover);
  --sinch-comp-tile-control-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-tile-control-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-tile-control-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-tile-control-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-tile-control-color-disabled-background-initial: var(--sinch-sys-color-surface-primary-disabled);
  --sinch-comp-tile-control-color-disabled-border-initial: var(--sinch-sys-color-border-disabled);
  --sinch-comp-tile-control-color-disabled-icon-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-tile-control-color-disabled-text-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-tile-control-font-label: var(--sinch-sys-font-body-m);
  --sinch-comp-tile-control-shadow-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-tile-control-shadow-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-tile-control-shadow-focus: var(--sinch-ref-shadow-level-1);
  --sinch-comp-tile-control-shadow-hover: var(--sinch-ref-shadow-level-1);
  --sinch-comp-tile-control-shadow-initial: var(--sinch-ref-shadow-level-1);
  --sinch-comp-tile-control-shape-radius-l: var(--sinch-comp-select-button-shape-radius-size-l);
  --sinch-comp-tile-control-shape-radius-s: var(--sinch-comp-select-button-shape-radius-size-m);
  --sinch-comp-tile-control-size-m-icon: var(--sinch-sys-size-s);
  --sinch-comp-tile-control-size-s-icon: var(--sinch-sys-size-xs);
  --sinch-comp-time-picker-digit-color-checked-h12-default: var(--sinch-sys-color-primary-default);
  --sinch-comp-time-picker-digit-color-checked-h24-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-time-picker-digit-color-checked-minute-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-time-picker-digit-color-default-h12-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-time-picker-digit-color-default-h24-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-time-picker-digit-color-default-minute-initial: var(--sinch-sys-color-text-muted);
  --sinch-comp-time-picker-digit-font-checked-h12: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-time-picker-digit-font-checked-h24: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-time-picker-digit-font-checked-minutes: var(--sinch-sys-font-body-emphasize);
  --sinch-comp-time-picker-digit-font-default-h12: var(--sinch-sys-font-body-s);
  --sinch-comp-time-picker-digit-font-default-h24: var(--sinch-sys-font-body-xs);
  --sinch-comp-time-picker-digit-font-default-minutes: var(--sinch-sys-font-body-xs);
  --sinch-comp-time-picker-header-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-time-picker-header-color-default-text-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-time-picker-header-font: var(--sinch-sys-font-desktop-title-xl);
  --sinch-comp-time-picker-needle-color-default-background-focus: var(--sinch-sys-color-primary-default);
  --sinch-comp-time-picker-needle-color-default-background-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-time-picker-watch-face-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-time-picker-watch-face-color-default-border-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-toast-color-error-default-background: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-toast-color-error-default-icon: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-toast-color-error-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-toast-color-info-default-background: var(--sinch-sys-color-feedback-info-subtle);
  --sinch-comp-toast-color-info-default-icon: var(--sinch-sys-color-feedback-info-default);
  --sinch-comp-toast-color-info-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-toast-color-success-default-background: var(--sinch-sys-color-feedback-success-subtle);
  --sinch-comp-toast-color-success-default-icon: var(--sinch-sys-color-feedback-success-default);
  --sinch-comp-toast-color-success-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-toast-color-warning-default-background: var(--sinch-sys-color-feedback-warning-subtle);
  --sinch-comp-toast-color-warning-default-icon: var(--sinch-sys-color-feedback-warning-default);
  --sinch-comp-toast-color-warning-default-text: var(--sinch-sys-color-text-default);
  --sinch-comp-toast-font-body: var(--sinch-sys-font-body-m);
  --sinch-comp-toast-shadow: var(--sinch-ref-shadow-level-2);
  --sinch-comp-toast-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-toggle-color-checked-background-initial: var(--sinch-sys-color-primary-default);
  --sinch-comp-toggle-color-checked-disabled-background-initial: var(--sinch-sys-color-primary-disabled);
  --sinch-comp-toggle-color-default-background-initial: var(--sinch-ref-color-neutral-300);
  --sinch-comp-toggle-color-default-knob-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-toggle-color-default-label-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-toggle-color-default-outline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-toggle-color-default-text-inside-initial: var(--sinch-sys-color-basic-pure);
  --sinch-comp-toggle-color-disabled-background-initial: var(--sinch-ref-color-neutral-100);
  --sinch-comp-toggle-color-disabled-label-initial: var(--sinch-sys-color-text-disabled);
  --sinch-comp-toggle-font-size-m-inside-text: var(--sinch-sys-font-body-xxs);
  --sinch-comp-toggle-font-size-m-label: var(--sinch-sys-font-body-m);
  --sinch-comp-toggle-font-size-s-label: var(--sinch-sys-font-body-s);
  --sinch-comp-toggle-shadow-knob-default: var(--sinch-ref-shadow-level-1);
  --sinch-comp-toggle-shadow-knob-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-tooltip-color-background: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-tooltip-color-text: var(--sinch-sys-color-text-default);
  --sinch-comp-tooltip-font-body: var(--sinch-sys-font-body-xs);
  --sinch-comp-tooltip-shadow: var(--sinch-ref-shadow-level-1);
  --sinch-comp-tooltip-shape-radius: var(--sinch-sys-shape-radius-xs);
  /* --sinch-emoji-src-url: "https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/svg/%s.svg"; */
  --sinch-emoji-src-url: "https://cdn.jsdelivr.net/gh/twitter/twemoji@14.0.2/assets/svg/%s.svg";
  --sinch-flag-src-url: "https://flagcdn.com/%s.svg";
  /* Font */
  --sinch-comp-icon-font-family: "Material Icons";
  --sinch-comp-icon-font-feature-settings: "liga";
  --sinch-comp-icon-font-weight: 400;
  --sinch-comp-icon-font-family-zero-to-d: "Sinch Icons Zero To D";
  --sinch-comp-icon-font-family-e-to-o: "Sinch Icons E To O";
  --sinch-comp-icon-font-family-p-to-z: "Sinch Icons P To Z";
}
.nectary-theme-base.nectary-theme-message-media {
  --sinch-sys-color-primary-active: #114369;
  --sinch-sys-color-primary-default: #0A5D9A;
  --sinch-sys-color-primary-disabled: #C8E6F9;
  --sinch-sys-color-primary-foreground: #FFFFFF;
  --sinch-sys-color-primary-hover: #1686CB;
  --sinch-sys-shape-radius-l: 12px;
  --sinch-sys-shape-radius-m: 8px;
  --sinch-sys-shape-radius-s: 4px;
  --sinch-sys-shape-radius-xs: 0;
  --sinch-comp-button-color-secondary-default-background-active: #A1D5F5;
  --sinch-comp-button-color-secondary-default-background-hover: #C8E6F9;
  --sinch-comp-button-color-secondary-default-background-initial: #DEF2FF;
  --sinch-comp-button-color-secondary-default-border-initial: transparent;
  --sinch-comp-button-color-secondary-default-text-initial: #0A5D9A;
  --sinch-comp-button-color-secondary-disabled-background-initial: #F3FAFE;
  --sinch-comp-button-color-secondary-disabled-border-initial: transparent;
  --sinch-comp-button-color-secondary-disabled-text-initial: #A1D5F5;
  --sinch-comp-button-color-subtle-primary-default-border-initial: transparent;
  --sinch-comp-button-color-subtle-primary-disabled-background-initial: transparent;
  --sinch-comp-button-color-subtle-primary-disabled-border-initial: transparent;
  --sinch-comp-button-color-subtle-primary-disabled-text-initial: #A1D5F5;
  --sinch-comp-date-picker-day-color-default-background-hover: #DEF2FF;
  --sinch-comp-date-picker-day-color-default-range-background: #DEF2FF;
  --sinch-comp-progress-color-default-background-initial: #DEF2FF;
  --sinch-comp-tooltip-color-background: var(--sinch-ref-color-neutral-900);
  --sinch-comp-tooltip-color-text: var(--sinch-sys-color-basic-pure);
  --sinch-comp-tooltip-shape-radius: var(--sinch-sys-shape-radius-s);
}
