@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";
  font-display: block;
  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";
  font-display: block;
  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";
  font-display: block;
  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;
}

.nectary-theme-base {
  --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: #D63F3F;
  --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-22) 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;
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-border: var(--sinch-sys-color-basic-transparent);
  --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-600);
  --sinch-comp-avatar-container-color-gray-background: var(--sinch-ref-color-neutral-600);
  --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-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-20)/var(--sinch-ref-typography-line-height-24) var(--sinch-ref-typography-font-family-main);
  --sinch-comp-avatar-container-font-size-m-text: 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-comp-avatar-container-font-size-s-text: var(--sinch-ref-typography-font-weight-600) var(--sinch-ref-typography-font-size-10)/var(--sinch-ref-typography-line-height-16) var(--sinch-ref-typography-font-family-main);
  --sinch-comp-avatar-container-size-border: 0;
  --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-border: var(--sinch-sys-color-basic-pure);
  --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);
}

.nectary-theme-base {
  --sinch-comp-badge-color-background: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-badge-color-border: var(--sinch-sys-color-basic-pure);
  --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);
}

.nectary-theme-base {
  --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-button-spacing-gap-l: 12px;
  --sinch-comp-button-spacing-gap-m: 12px;
  --sinch-comp-button-spacing-gap-s: 12px;
  --sinch-comp-button-spacing-gap-xs: 8px;
  --sinch-comp-button-spacing-icon-only-padding-l: 8px;
  --sinch-comp-button-spacing-icon-only-padding-m: 8px;
  --sinch-comp-button-spacing-icon-only-padding-s: 4px;
  --sinch-comp-button-spacing-icon-only-padding-xs: 4px;
  --sinch-comp-button-spacing-padding-l: 16px;
  --sinch-comp-button-spacing-padding-m: 16px;
  --sinch-comp-button-spacing-padding-s: 16px;
  --sinch-comp-button-spacing-padding-xs: 8px;
}

.nectary-theme-base {
  --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;
}

.nectary-theme-base {
  --sinch-comp-card-v2-color-default-background-active: var(--sinch-sys-color-surface-primary-active);
  --sinch-comp-card-v2-color-default-background-disabled: var(--sinch-sys-color-surface-primary-disabled);
  --sinch-comp-card-v2-color-default-background-hover: var(--sinch-sys-color-surface-primary-hover);
  --sinch-comp-card-v2-color-default-background-initial: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-card-v2-color-default-border-active: var(--sinch-sys-color-border-default);
  --sinch-comp-card-v2-color-default-border-disabled: var(--sinch-sys-color-border-disabled);
  --sinch-comp-card-v2-color-default-border-hover: var(--sinch-sys-color-border-default);
  --sinch-comp-card-v2-color-default-border-initial: var(--sinch-sys-color-border-default);
  --sinch-comp-card-v2-color-default-description-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-default-description-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-color-default-icon-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-default-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-color-default-title-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-default-title-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-color-selected-background-active: var(--sinch-ref-color-ocean-200);
  --sinch-comp-card-v2-color-selected-background-disabled: var(--sinch-ref-color-ocean-50);
  --sinch-comp-card-v2-color-selected-background-hover: var(--sinch-ref-color-ocean-100);
  --sinch-comp-card-v2-color-selected-background-initial: var(--sinch-ref-color-ocean-100);
  --sinch-comp-card-v2-color-selected-border-active: var(--sinch-ref-color-ocean-400);
  --sinch-comp-card-v2-color-selected-border-disabled: var(--sinch-ref-color-ocean-200);
  --sinch-comp-card-v2-color-selected-border-hover: var(--sinch-ref-color-ocean-350);
  --sinch-comp-card-v2-color-selected-border-initial: var(--sinch-ref-color-ocean-300);
  --sinch-comp-card-v2-color-selected-description-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-selected-description-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-color-selected-icon-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-selected-icon-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-color-selected-title-disabled: var(--sinch-sys-color-text-disabled);
  --sinch-comp-card-v2-color-selected-title-initial: var(--sinch-sys-color-text-default);
  --sinch-comp-card-v2-font-description: var(--sinch-sys-font-body-m);
  --sinch-comp-card-v2-font-title: var(--sinch-sys-font-desktop-title-l);
  --sinch-comp-card-v2-shadow-active: var(--sinch-ref-shadow-level-0);
  --sinch-comp-card-v2-shadow-disabled: var(--sinch-ref-shadow-level-0);
  --sinch-comp-card-v2-shadow-hover: var(--sinch-ref-shadow-level-2);
  --sinch-comp-card-v2-shadow-initial: var(--sinch-ref-shadow-level-0);
  --sinch-comp-card-v2-shape-radius: var(--sinch-sys-shape-radius-l);
  --sinch-comp-card-v2-size-icon: var(--sinch-sys-size-l);
}

.nectary-theme-base {
  --sinch-comp-chat-shape-radius: var(--sinch-sys-shape-radius-l);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --sinch-comp-chip-border: var(--sinch-sys-color-basic-pure);
  --sinch-comp-chip-color-blue-default-background-initial: var(--sinch-ref-color-ocean-700);
  --sinch-comp-chip-color-blue-default-foreground-initial: var(--sinch-ref-color-ocean-50);
  --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-800);
  --sinch-comp-chip-color-dark-green-default-foreground-initial: var(--sinch-ref-color-grass-100);
  --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-100);
  --sinch-comp-chip-color-dark-pink-default-background-initial: var(--sinch-ref-color-candy-800);
  --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-800);
  --sinch-comp-chip-color-dark-red-default-foreground-initial: var(--sinch-ref-color-raspberry-100);
  --sinch-comp-chip-color-dark-violet-default-background-initial: var(--sinch-ref-color-violet-800);
  --sinch-comp-chip-color-dark-violet-default-foreground-initial: var(--sinch-ref-color-violet-100);
  --sinch-comp-chip-color-dark-yellow-default-background-initial: var(--sinch-ref-color-honey-600);
  --sinch-comp-chip-color-dark-yellow-default-foreground-initial: var(--sinch-ref-color-honey-100);
  --sinch-comp-chip-color-gray-default-background-initial: var(--sinch-ref-color-neutral-600);
  --sinch-comp-chip-color-gray-default-foreground-initial: var(--sinch-ref-color-neutral-50);
  --sinch-comp-chip-color-green-default-background-initial: var(--sinch-ref-color-grass-600);
  --sinch-comp-chip-color-green-default-foreground-initial: var(--sinch-ref-color-grass-50);
  --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-pumpkin-800);
  --sinch-comp-chip-color-outiline-focus: var(--sinch-sys-color-focus);
  --sinch-comp-chip-color-pink-default-background-initial: var(--sinch-ref-color-candy-600);
  --sinch-comp-chip-color-pink-default-foreground-initial: var(--sinch-ref-color-candy-50);
  --sinch-comp-chip-color-red-default-background-initial: var(--sinch-ref-color-raspberry-600);
  --sinch-comp-chip-color-red-default-foreground-initial: var(--sinch-ref-color-raspberry-50);
  --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-600);
  --sinch-comp-chip-color-violet-default-foreground-initial: var(--sinch-ref-color-violet-50);
  --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-350);
  --sinch-comp-chip-color-yellow-default-foreground-initial: var(--sinch-ref-color-honey-900);
  --sinch-comp-chip-font-size-m-label: 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-comp-chip-font-size-s-label: var(--sinch-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-10)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-main);
  --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: 14px;
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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: var(--sinch-sys-color-basic-transparent);
  --sinch-comp-color-menu-option-color-default-border-selected: var(--sinch-sys-color-basic-pure-inverted);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-active: var(--sinch-sys-color-feedback-danger-subtle);
  --sinch-comp-file-drop-color-invalid-background-initial: var(--sinch-sys-color-surface-secondary-default);
  --sinch-comp-file-drop-color-invalid-border-active: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-file-drop-color-invalid-border-initial: var(--sinch-sys-color-feedback-danger-default);
  --sinch-comp-file-drop-color-invalid-placeholder-active: var(--sinch-sys-color-text-muted);
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --sinch-comp-grid-columns-l: 12;
  --sinch-comp-grid-columns-m: 8;
  --sinch-comp-grid-columns-s: 4;
  --sinch-comp-grid-columns-xl: 12;
  --sinch-comp-grid-gutter-l: 24px;
  --sinch-comp-grid-gutter-m: 24px;
  --sinch-comp-grid-gutter-s: 16px;
  --sinch-comp-grid-gutter-xl: 24px;
  --sinch-comp-grid-margin-l: 24px;
  --sinch-comp-grid-margin-m: 24px;
  --sinch-comp-grid-margin-s: 16px;
  --sinch-comp-grid-margin-xl: 32px;
}

.nectary-theme-base {
  --sinch-comp-icon-channel-color-apple-business-chat-bg: linear-gradient(0deg, #0CBD2A 0%, #5BF675 100%);
  --sinch-comp-icon-channel-color-apple-business-chat-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-facebook-bg: linear-gradient(180deg, #1877F2 0%, #1877F2 100%);
  --sinch-comp-icon-channel-color-facebook-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-facebook-messenger-bg: linear-gradient(45deg, #09F 0%, #A033FF 45%, #FF5280 82%, #FF7061 100%);
  --sinch-comp-icon-channel-color-facebook-messenger-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-google-business-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-google-business-layera: #EA4335;
  --sinch-comp-icon-channel-color-google-business-layerb: #FBBC05;
  --sinch-comp-icon-channel-color-google-business-layerc: #34A853;
  --sinch-comp-icon-channel-color-google-business-layerd: #4285F4;
  --sinch-comp-icon-channel-color-instagram-bg: linear-gradient(225deg, #4F3EB7 0%, #9132AE 19%, #CF288B 53%, #FFD43C 100%);
  --sinch-comp-icon-channel-color-instagram-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-line-bg: linear-gradient(180deg, #06C755 0%, #06C755 100%);
  --sinch-comp-icon-channel-color-line-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-mms-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-mms-layera: #242424;
  --sinch-comp-icon-channel-color-mms-layerb: #242424;
  --sinch-comp-icon-channel-color-notify-bg: linear-gradient(180deg, #A7D7F7 0%, #A7D7F7 100%);
  --sinch-comp-icon-channel-color-notify-layera: #E44436;
  --sinch-comp-icon-channel-color-notify-layerb: #FFFFFF;
  --sinch-comp-icon-channel-color-notify-layerc: #0076BA;
  --sinch-comp-icon-channel-color-phone-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-phone-layera: #242424;
  --sinch-comp-icon-channel-color-push-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-push-layera: #242424;
  --sinch-comp-icon-channel-color-push-layerb: #242424;
  --sinch-comp-icon-channel-color-rcs-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-rcs-layera: #242424;
  --sinch-comp-icon-channel-color-rcs-layerb: #242424;
  --sinch-comp-icon-channel-color-sms-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-sms-layera: #242424;
  --sinch-comp-icon-channel-color-sms-layerb: #242424;
  --sinch-comp-icon-channel-color-talk-bg: linear-gradient(180deg, #FFE812 0%, #FFE812 100%);
  --sinch-comp-icon-channel-color-talk-layera: #000000;
  --sinch-comp-icon-channel-color-telegram-bg: linear-gradient(180deg, #25A2E0 0%, #25A2E0 100%);
  --sinch-comp-icon-channel-color-telegram-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-twitter-bg: linear-gradient(180deg, #1D9BF0 0%, #1D9BF0 100%);
  --sinch-comp-icon-channel-color-twitter-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-viber-bg: linear-gradient(180deg, #7360F2 0%, #7360F2 100%);
  --sinch-comp-icon-channel-color-viber-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-webchat-bg: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
  --sinch-comp-icon-channel-color-webchat-layera: #242424;
  --sinch-comp-icon-channel-color-webchat-layerb: #242424;
  --sinch-comp-icon-channel-color-wechat-bg: linear-gradient(180deg, #2DC100 0%, #2DC100 100%);
  --sinch-comp-icon-channel-color-wechat-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-whatsapp-bg: linear-gradient(180deg, #25D366 0%, #25D366 100%);
  --sinch-comp-icon-channel-color-whatsapp-layera: #FFFFFF;
  --sinch-comp-icon-channel-color-x-bg: linear-gradient(180deg, #000000 0%, #000000 100%);
  --sinch-comp-icon-channel-color-x-layera: #FFFFFF;
  --sinch-comp-icon-channel-size: var(--sinch-sys-size-l);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-input-spacing-icon-gap-l: 8px;
  --sinch-comp-input-spacing-icon-gap-m: 8px;
  --sinch-comp-input-spacing-icon-gap-s: 8px;
  --sinch-comp-input-spacing-padding-l: 12px;
  --sinch-comp-input-spacing-padding-m: 12px;
  --sinch-comp-input-spacing-padding-s: 12px;
  --sinch-comp-input-spacing-slot-gap-l: 4px;
  --sinch-comp-input-spacing-slot-gap-m: 4px;
  --sinch-comp-input-spacing-slot-gap-s: 4px;
  --sinch-comp-input-spacing-slot-padding-l: 4px;
  --sinch-comp-input-spacing-slot-padding-m: 4px;
  --sinch-comp-input-spacing-slot-padding-s: 4px;
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-direction: column;
  --sinch-comp-radio-font-label: var(--sinch-sys-font-body-m);
  --sinch-comp-radio-gap: 8px;
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-button-spacing-gap-l: 8px;
  --sinch-comp-select-button-spacing-gap-m: 8px;
  --sinch-comp-select-button-spacing-gap-s: 8px;
  --sinch-comp-select-button-spacing-left-slot-gap-l: 4px;
  --sinch-comp-select-button-spacing-left-slot-gap-m: 4px;
  --sinch-comp-select-button-spacing-left-slot-gap-s: 4px;
  --sinch-comp-select-button-spacing-left-slot-offset-l: -4px;
  --sinch-comp-select-button-spacing-left-slot-offset-m: -4px;
  --sinch-comp-select-button-spacing-left-slot-offset-s: -4px;
  --sinch-comp-select-button-spacing-padding-left-l: 12px;
  --sinch-comp-select-button-spacing-padding-left-m: 12px;
  --sinch-comp-select-button-spacing-padding-left-s: 12px;
  --sinch-comp-select-button-spacing-padding-right-l: 12px;
  --sinch-comp-select-button-spacing-padding-right-m: 8px;
  --sinch-comp-select-button-spacing-padding-right-s: 4px;
}

.nectary-theme-base {
  --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-default-title-initial: var(--sinch-ref-color-neutral-400);
  --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-max-height: 85vh;
  --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);
}

.nectary-theme-base {
  --sinch-comp-sheet-animation-duration: 750ms;
  --sinch-comp-sheet-animation-easing: cubic-bezier(0.25, 1, 0.5, 1);
  --sinch-comp-sheet-color-backdrop-from: #14181C66;
  --sinch-comp-sheet-color-backdrop-to: #14181C99;
  --sinch-comp-sheet-color-background: var(--sinch-sys-color-surface-primary-default);
  --sinch-comp-sheet-color-description: var(--sinch-sys-color-text-caption);
  --sinch-comp-sheet-color-title: var(--sinch-sys-color-text-default);
  --sinch-comp-sheet-font-description: var(--sinch-sys-font-body-m);
  --sinch-comp-sheet-font-title: var(--sinch-sys-font-desktop-title-l);
  --sinch-comp-sheet-size-backdrop-blur: 2px;
  --sinch-comp-sheet-size-gap: 16px;
  --sinch-comp-sheet-size-max-horizontal: 400px;
  --sinch-comp-sheet-size-max-vertical: 85vh;
  --sinch-comp-sheet-size-padding: 16px;
}

.nectary-theme-base {
  --sinch-comp-skeleton-color-background: var(--sinch-ref-color-neutral-200);
  --sinch-comp-skeleton-color-shimmer: var(--sinch-ref-color-neutral-50);
}

.nectary-theme-base {
  --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;
}

.nectary-theme-base {
  --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-primary-active);
  --sinch-comp-table-color-row-default-background-hightlited: var(--sinch-ref-color-honey-50);
  --sinch-comp-table-color-row-default-background-hover: var(--sinch-sys-color-surface-primary-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);
}

.nectary-theme-base {
  --sinch-comp-tag-border: var(--sinch-sys-color-basic-pure);
  --sinch-comp-tag-color-blue-background: var(--sinch-ref-color-ocean-700);
  --sinch-comp-tag-color-blue-foreground: var(--sinch-ref-color-ocean-50);
  --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-800);
  --sinch-comp-tag-color-dark-green-foreground: var(--sinch-ref-color-grass-100);
  --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-100);
  --sinch-comp-tag-color-dark-pink-background: var(--sinch-ref-color-candy-800);
  --sinch-comp-tag-color-dark-pink-foreground: var(--sinch-ref-color-candy-100);
  --sinch-comp-tag-color-dark-red-background: var(--sinch-ref-color-raspberry-800);
  --sinch-comp-tag-color-dark-red-foreground: var(--sinch-ref-color-raspberry-100);
  --sinch-comp-tag-color-dark-violet-background: var(--sinch-ref-color-violet-800);
  --sinch-comp-tag-color-dark-violet-foreground: var(--sinch-ref-color-violet-100);
  --sinch-comp-tag-color-dark-yellow-background: var(--sinch-ref-color-honey-600);
  --sinch-comp-tag-color-dark-yellow-foreground: var(--sinch-ref-color-honey-100);
  --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-700);
  --sinch-comp-tag-color-gray-foreground: var(--sinch-ref-color-neutral-100);
  --sinch-comp-tag-color-green-background: var(--sinch-ref-color-grass-600);
  --sinch-comp-tag-color-green-foreground: var(--sinch-ref-color-grass-50);
  --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-pumpkin-800);
  --sinch-comp-tag-color-pink-background: var(--sinch-ref-color-candy-600);
  --sinch-comp-tag-color-pink-foreground: var(--sinch-ref-color-candy-50);
  --sinch-comp-tag-color-red-background: var(--sinch-ref-color-raspberry-600);
  --sinch-comp-tag-color-red-foreground: var(--sinch-ref-color-raspberry-50);
  --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-600);
  --sinch-comp-tag-color-violet-foreground: var(--sinch-ref-color-violet-50);
  --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-350);
  --sinch-comp-tag-color-yellow-foreground: var(--sinch-ref-color-honey-900);
  --sinch-comp-tag-font-size-m-label: 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-comp-tag-font-size-s-label: var(--sinch-ref-typography-font-weight-700) var(--sinch-ref-typography-font-size-10)/var(--sinch-ref-typography-line-height-20) var(--sinch-ref-typography-font-family-main);
  --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: 14px;
}

.nectary-theme-base {
  --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-textarea-size-resize-handle: 20px;
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  --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-600);
  --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);
}

.nectary-theme-base {
  --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);
}

.nectary-theme-base {
  /* --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";
}

.nectary-theme-base {
  --sinch-flag-src-url: "https://flagcdn.com/%s.svg";
}

.nectary-theme-base {
  /* 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";
}

