/* stylelint-disable */

/* reference tokens */
:root {
  --ref-font-family-primary: 'Open Sans', Verdana, Geneva, sans-serif;
  --ref-font-family-symbol: symbolFont, sans-serif;

  --ref-font-size-title-xxl: 2.5rem;
  --ref-line-height-title-xxl: 1.25;
  --ref-font-size-subtitle-xxl: 2rem;
  --ref-line-height-subtitle-xxl: 1.25;
  --ref-font-size-title-xl: 2rem;
  --ref-line-height-title-xl: 1.25;
  --ref-font-size-subtitle-xl: 1.5rem;
  --ref-line-height-subtitle-xl: 1.25;
  --ref-font-size-title-lg: 1.5rem;
  --ref-line-height-title-lg: 1.25;
  --ref-font-size-subtitle-lg: 1.25rem;
  --ref-line-height-subtitle-lg: 1.5;
  --ref-font-size-title-md: 1.25rem;
  --ref-line-height-title-md: 1.25;
  --ref-font-size-subtitle-md: 1.125rem;
  --ref-line-height-subtitle-md: 1.2222;
  --ref-font-size-title-sm: 1.125rem;
  --ref-line-height-title-sm: 1.25;
  --ref-font-size-subtitle-sm: 1rem;
  --ref-line-height-subtitle-sm: 1.25;
  --ref-font-size-body: 1rem;
  --ref-line-height-body: 1.5;
  --ref-font-size-small: 0.875rem;
  --ref-line-height-small: 1.5;
  --ref-font-size-caption: 0.75rem;
  --ref-line-height-caption: 1.5;
  --ref-font-size-superscript: 0.5rem;
  --ref-line-height-superscript: 1.5;

  --ref-font-weight-extraBold: 800;
  --ref-font-weight-bold: 700;
  --ref-font-weight-medium: 600;
  --ref-font-weight-regular: 400;

  --ref-border-radius-none: 0;
  --ref-border-radius-sm: 0.125rem;
  --ref-border-radius-default: 0.25rem;
  --ref-border-radius-lg: 0.5rem;
  --ref-border-radius-3xl: 1.5rem;
  --ref-border-radius-full: 9999px;

  --ref-box-shadow-elevation-1: 0 1px 4px rgb(78 81 98 / 25%);
  --ref-box-shadow-elevation-2: 0 2px 8px rgb(78 81 98 / 25%);
  --ref-box-shadow-elevation-3: 0 3px 12px rgb(78 81 98 / 30%);
  --ref-box-shadow-elevation-4: 0 4px 16px rgb(78 81 98 / 30%);

  --ref-glyph-play-circle: '\23f5';
  --ref-glyph-phone-app: '\1f4f2';
  --ref-glyph-weddings: '\e900';
  --ref-glyph-logo: '\e901';
  --ref-glyph-brand: '\e905';
  --ref-glyph-logo-cta: '\3e';
  --ref-glyph-search: '\2315';
  --ref-glyph-star: '\2605';
  --ref-glyph-star-half: '\2729';
  --ref-glyph-bed: '\2124';
  --ref-glyph-yes: '\2713';
  --ref-glyph-no: '\2715';
  --ref-glyph-yes-em: '\2714';
  --ref-glyph-no-em: '\2716';
  --ref-glyph-deal: '\27b3';
  --ref-glyph-fenced: '\27bd';
  --ref-glyph-mark: '\2352';
  --ref-glyph-left: '\2190';
  --ref-glyph-up: '\2191';
  --ref-glyph-right: '\2192';
  --ref-glyph-down: '\2193';
  --ref-glyph-left-em: '\25c0';
  --ref-glyph-up-em: '\25b2';
  --ref-glyph-right-em: '\25b6';
  --ref-glyph-down-em: '\25bc';
  --ref-glyph-chat: '\270d';
  --ref-glyph-mail: '\2709';
  --ref-glyph-my-account: '\270c';
  --ref-glyph-phone: '\2706';
  --ref-glyph-people: '\263b';
  --ref-glyph-nav: '\2261';
  --ref-glyph-home: '\2302';
  --ref-glyph-dropdown: '\21b2';
  --ref-glyph-suitcase: '\2318';
  --ref-glyph-hotel: '\25a4';
  --ref-glyph-tour: '\2601';
  --ref-glyph-club: '\263e';
  --ref-glyph-air: '\2708';
  --ref-glyph-event: '\2604';
  --ref-glyph-like: '\2764';
  --ref-glyph-dislike: '\2620';
  --ref-glyph-zoom-in: '\2295';
  --ref-glyph-zoom-out: '\2296';
  --ref-glyph-bullet: '\2022';
  --ref-glyph-blank: '\2001';
  --ref-glyph-dollar: '\0024';
  --ref-glyph-lock: '\232e';
  --ref-glyph-lock-2: '\e600';
  --ref-glyph-mic: '\e91e';
  --ref-glyph-facebook-em: '\ff46';
  --ref-glyph-facebook: '\24d5';
  --ref-glyph-twitter: '\24e3';
  --ref-glyph-pinterest: '\24df';
  --ref-glyph-google-plus: '\24d6';
  --ref-glyph-instagram: '\24d8';
  --ref-glyph-calendar: '\25A6';
  --ref-glyph-plus: '\002B';
  --ref-glyph-minus: '\2212';
  --ref-glyph-key: '\2767';
  --ref-glyph-clock: '\231A';
  --ref-glyph-print: '\229F';
  --ref-glyph-eat: '\229a';
  --ref-glyph-attraction: '\e601';
  --ref-glyph-cart: '\2584';
  --ref-glyph-hearts: '\2665';
  --ref-glyph-more: '\2026';
  --ref-glyph-in: '\2348';
  --ref-glyph-out: '\2347';
  --ref-glyph-question: '\003f';
  --ref-glyph-brand-lock: '\e903';
  --ref-glyph-female: '\2640';
  --ref-glyph-male: '\2642';
  --ref-glyph-filter: '\1f50d';
  --ref-glyph-info: '\e906';
  --ref-glyph-heart-on: '\1f49c';
  --ref-glyph-heart-off: '\1f49f';
  --ref-glyph-shower: '\244a';
  --ref-glyph-heart-clear: '\01F49F';
  --ref-glyph-moon: '\263D';
  --ref-glyph-tickets: '\2604';
  --ref-glyph-drink: '\263e';
  --ref-glyph-plane: '\2708';
  --ref-glyph-ferris-wheel: '\e601';
  --ref-glyph-helicopter: '\2601';
}

/* system tokens */
:root {
  --sys-color-scrollbar: rgba(0, 0, 0, 0.5) transparent;
}

:root {
  /* colors (No Aliasing is allowed) */
  --colorAirFreshener: #7c8034;
  --colorAstroturf: #39b449;
  --colorBarfly: #333333;
  --colorBananaHammock: #fbf555;
  --colorBlackjack: #010101;
  --colorBlush: #e1372d;
  --colorCougar: #d9dcd5;
  --colorDesertRose: #78353a;
  --colorDragQueen: #da1b5c;
  --colorDumbBlonde: #f7e498;
  --colorEyeshadow: #64295c;
  --colorHangover: #949198;
  --colorLastCall: #468cca;
  --colorLobsterBuffet: #c13831;
  --colorMargarita: #bbd035;
  --colorMidnight: #302b2b;
  --colorMirage: #07aae1;
  --colorNicotine: #e6a550;
  --colorNightDress: #343434;
  --colorOasis: #21b094;
  --colorOxygenTank: #e4ebf2;
  --colorSilverFox: #9fa5aa;
  --colorSkinnyDip: #8eb9a9;
  --colorSpraytan: #d5ab3b;
  --colorSuedeShoes: #113558;
  --colorSunburn: #d91638;
  --colorTumbleweed: #603a2a;
  --colorVegasOrange: #f15f2a;
  --colorVegasOrangeLite: #f9941e;
  --colorFadedOrange: #fdefe9;
  --colorWedding: #fefefe;
  --colorYucca: #9d9c8c;
  --colorVegasBlue: #2595cd;
  --colorVegasPink: #f6209b;
  --colorSeatSectionA: #cb1009;
  --colorSeatSectionB: #f96611;
  --colorSeatSectionC: #fdcc12;
  --colorSeatSectionD: #cc79a7;
  --colorSeatSectionE: #09f;
  --colorSeatSectionF: #895e93;
  --colorForest: #2e6800;
  --colorLightBackdrop: #fde5ec;

  /* color variants */
  --colorHangover900: #050506;
  --colorHangover800: #1F1F23;
  --colorHangover700: #383940;
  --colorHangover600: #52525D;
  --colorHangover500: #6B6C7A;
  --colorHangover400: #878893;
  --colorHangover300: #A3A4AD;
  --colorHangover200: #BFC0C6;
  --colorHangover100: #DCDCDF;
  --colorHangover50: #F8F8F8;
  --colorVegascomOrange900: #330F00;
  --colorVegascomOrange800: #662600;
  --colorVegascomOrange700: #994300;
  --colorVegascomOrange600: #CC6405;
  --colorVegascomOrange500: #F48721;
  --colorVegascomOrange400: #FFA438;
  --colorVegascomOrange300: #FFC05C;
  --colorVegascomOrange200: #FFDA8A;
  --colorVegascomOrange100: #FFEEB8;
  --colorVegascomOrange50: #FFFBE6;
  --colorLobsterBuffet900: #330000;
  --colorLobsterBuffet800: #660301;
  --colorLobsterBuffet700: #910C0D;
  --colorLobsterBuffet600: #B21F25;
  --colorLobsterBuffet500: #CC3944;
  --colorLobsterBuffet400: #E1515F;
  --colorLobsterBuffet300: #F16E7E;
  --colorLobsterBuffet200: #FC90A0;
  --colorLobsterBuffet100: #FFB8C5;
  --colorLobsterBuffet50: #FFE6EA;
  --colorSprayTan900: #332400;
  --colorSprayTan800: #664800;
  --colorSprayTan700: #996A00;
  --colorSprayTan600: #C48B11;
  --colorSprayTan500: #DEA82B;
  --colorSprayTan400: #F3C243;
  --colorSprayTan300: #FFD960;
  --colorSprayTan200: #FFEB8A;
  --colorSprayTan100: #FFF8B8;
  --colorSprayTan50: #FFFFE6;
  --colorSuedeShoes900: #020A2E;
  --colorSuedeShoes800: #091A56;
  --colorSuedeShoes700: #152F79;
  --colorSuedeShoes600: #274896;
  --colorSuedeShoes500: #3F63AE;
  --colorSuedeShoes400: #5980C6;
  --colorSuedeShoes300: #769ED9;
  --colorSuedeShoes200: #97BCE9;
  --colorSuedeShoes100: #BDD8F5;
  --colorSuedeShoes50: #E6F2FC;
  --colorOasis900: #002724;
  --colorOasis800: #004840;
  --colorOasis700: #006455;
  --colorOasis600: #027965;
  --colorOasis500: #118870;
  --colorOasis400: #32A78B;
  --colorOasis300: #5CC2A4;
  --colorOasis200: #8AD9BD;
  --colorOasis100: #B8EBD5;
  --colorOasis50: #E6F9F0;
  --colorEyeshadow900: #220E23;
  --colorEyeshadow800: #401E43;
  --colorEyeshadow700: #5A3060;
  --colorEyeshadow600: #73467B;
  --colorEyeshadow500: #895E93;
  --colorEyeshadow400: #9F77AB;
  --colorEyeshadow300: #B491C1;
  --colorEyeshadow200: #C9AED5;
  --colorEyeshadow100: #DDCCE7;
  --colorEyeshadow50: #F3ECF7;
  --colorDragQueen500: #EA2690;
  --colorBananaHammock500: #F2EA24;
  --colorMirage500: #28A7DF;
  --colorAstroturf500: #6CBF60;
  /* theming color vars */
  --colorBrand: var(--colorVegasOrange, var(--colorvegasorange));
  --colorBrandBackground: var(--colorVegasOrange, var(--colorvegasorange));
  --colorPrimaryPageBackground: var(--colorWedding, var(--colorwedding));
  --colorFramingBackground: var(--colorSilverFox, var(--colorsilverfox));
  --color-primary-text-desktop: var(--colorMidnight, var(--colormidnight));
  --colorPrimaryText: var(--colorMidnight, var(--colormidnight));
  --colorPrimaryTextInverse: var(--colorWedding, var(--colorwedding));
  --colorPrimaryTextLink: var(--colorSuedeShoes, var(--colorsuedeshoes));
  --colorPrimaryBackground: var(--colorSuedeShoes, var(--colorsuedeshoes));
  --colorPrimaryBackgroundInverse: var(--colorWedding, var(--colorwedding));
  --colorSecondaryText: var(--colorEyeshadow, var(--coloreyeshadow));
  --colorSecondaryBackground: var(--colorEyeshadow, var(--coloreyeshadow));
  --colorLinkHover: var(--colorMirage, var(--colormirage));
  --colorLinkInactive: var(--colorOxygenTank, var(--coloroxygentank));
  --colorBorderPrimary: var(--colorCougar, var(--colorcougar));
  --colorBorderActive: var(--colorVegasOrange, var(--colorvegasorange));
  --colorBorderInactive: var(--colorOxygenTank, var(--coloroxygentank));
  --colorBase: var(--colorMidnight, var(--colormidnight));
  --colorMuted: var(--colorHangover, var(--colorhangover));
  --colorBannerPrimary: var(--colorWedding, var(--colorwedding));
  /* glyphs */
  --glyphPlayCircle: '\23f5';
  --glyphPhoneApp: '\1f4f2';
  --glyphWeddings: '\e900';
  --glyphLogo: '\e901';
  --glyphBrand: '\e905';
  --glyphLogoCta: '\e902';
  --glyphSearch: '\2315';
  --glyphStar: '\2605';
  --glyphStarHalf: '\2729';
  --glyphBed: '\2124';
  --glyphYes: '\2713';
  --glyphNo: '\2715';
  --glyphYesem: '\2714';
  --glyphNoem: '\2716';
  --glyphDeal: '\27b3';
  --glyphFenced: '\e904';
  --glyphMark: '\2352';
  --glyphLeft: '\2190';
  --glyphUp: '\2191';
  --glyphRight: '\2192';
  --glyphDown: '\2193';
  --glyphLeftem: '\25c0';
  --glyphUpem: '\25b2';
  --glyphRightem: '\25b6';
  --glyphDownem: '\25bc';
  --glyphChat: '\270d';
  --glyphMyAccount: '\270c';
  --glyphPhone: '\2706';
  --glyphPeople: '\263b';
  --glyphNav: '\2261';
  --glyphHome: '\2302';
  --glyphDropdown: '\21b2';
  --glyphSuitcase: '\2318';
  --glyphHotel: '\25a4';
  --glyphTour: '\2601';
  --glyphClub: '\263e';
  --glyphAir: '\2708';
  --glyphEvent: '\2604';
  --glyphLike: '\2764';
  --glyphDislike: '\2620';
  --glyphZoomIn: '\2295';
  --glyphZoomOut: '\2296';
  --glyphBullet: '\2022';
  --glyphBlank: '\2001';
  --glyphDollar: '\0024';
  --glyphLock: '\232e';
  --glyphLock2: '\e600';
  --glyphMic: '\e91e';
  --glyphFacebookem: '\ff46';
  --glyphFacebook: '\24d5';
  --glyphTwitter: '\24e3';
  --glyphPinterest: '\24df';
  --glyphGooglePlus: '\24d6';
  --glyphInstagram: '\24d8';
  --glyphCalendar: '\25A6';
  --glyphPlus: '\002B';
  --glyphMinus: '\2212';
  --glyphKey: '\2767';
  --glyphClock: '\231A';
  --glyphPrint: '\229F';
  --glyphEat: '\229a';
  --glyphAttraction: '\e601';
  --glyphCart: '\2584';
  --glyphHearts: '\2665';
  --glyphMore: '\2026';
  --glyphIn: '\2348';
  --glyphOut: '\2347';
  --glyphQuestion: '\003f';
  --glyphBrandLock: '\e903';
  --glyphFemale: '\2640';
  --glyphMale: '\2642';
  --glyphFilter: '\1f50d';
  --glyphInfo: '\e906';
  --glyphHeartOn: '\1f49c';
  --glyphHeartOff: '\1f49f';
  --glyphHeartClear: '\01F49F';
  --glyphMoon: '\263D';
  --glyphTickets: '\2604';
  --glyphDrink: '\263e';
  --glyphPlane: '\2708';
  --glyphFerrisWheel: '\e601';
  --glyphHelicopter: '\2601';
  /* layout */
  --layoutLineHeightBase: 1.15;
  --layoutPageMaxWidth: 980;
  --layoutGridColumns: 24;
  --layoutGridGutterWidth: 12;
  --layoutSpacingLg: 8;
  --layoutSpacingMd: 4;
  --layoutSpacingSm: 2;
  --layoutContainerLg: 1152;
  --layoutContainerMd: 987;
  --layoutContainerSm: 756;
  --layoutContainerXs: 478;
  /* fonts */
  --fontPrimaryFamily: 'Open Sans', Verdana, Geneva, sans-serif;
  --fontHeaderFamily: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  --fontIconFamily: symbolFont, sans-serif;
  --fontBaseSize: 16;
  --fontBaseSizePx: 16px;
  --fontFakeIE: InternetExplorerNeedsHelpInC3;

  /* === System Tokens === */
  /* #region */

  /* background */
  /* #region */

  --sys-color-background-base-default: var(--ref-color-neutral-gray-100);
  --sys-color-background-scrim: var(--ref-color-neutral-black-transparent38);

  --sys-color-background-inverse: var(--ref-color-neutral-hangover-900);
  --sys-color-background-inverse-subtle: var(--ref-color-neutral-gray-900);
  --sys-color-background-inverse-extra-subtle: var(--ref-color-neutral-gray-800);
  --sys-color-background-inverse-super-subtle: var(--ref-color-neutral-hangover-500);
  --sys-color-background-inverse-surface: var(--ref-color-neutral-black-transparent50);

  --sys-color-background-surface: var(--ref-color-neutral-white);
  --sys-color-background-surface-subtle: var(--ref-color-neutral-gray-100);
  --sys-color-background-surface-extra-subtle: var(--ref-color-neutral-gray-200);
  --sys-color-background-surface-varient: var(--ref-color-secondary-50);
  --sys-color-background-surface-hovered: var(--ref-color-secondary-50);

  --sys-color-background-primary: var(--ref-color-primary-brand-500);
  --sys-color-background-primary-bolder: var(--ref-color-primary-brand-700);
  --sys-color-background-primary-fill: var(--ref-color-primary-brand-500);
  --sys-color-background-primary-fill-hovered: var(--ref-color-primary-brand-600);
  --sys-color-background-primary-fill-pressed: var(--ref-color-primary-brand-700);
  --sys-color-background-primary-tonal: var(--ref-color-primary-brand-50);
  --sys-color-background-primary-tonal-hovered: var(--ref-color-primary-brand-100);
  --sys-color-background-primary-tonal-pressed: var(--ref-color-primary-brand-200);
  --sys-color-background-primary-hovered: var(--ref-color-primary-brand-50);
  --sys-color-background-primary-pressed: var(--ref-color-primary-brand-100);

  --sys-color-background-secondary: var(--ref-color-secondary-500);
  --sys-color-background-secondary-bold: var(--ref-color-secondary-600);
  --sys-color-background-secondary-bolder: var(--ref-color-secondary-400);
  --sys-color-background-secondary-fill: var(--ref-color-secondary-700);
  --sys-color-background-secondary-fill-hovered: var(--ref-color-secondary-600);
  --sys-color-background-secondary-fill-pressed: var(--ref-color-secondary-500);
  --sys-color-background-secondary-tonal: var(--ref-color-secondary-50);
  --sys-color-background-secondary-tonal-hovered: var(--ref-color-secondary-100);
  --sys-color-background-secondary-tonal-pressed: var(--ref-color-secondary-200);
  --sys-color-background-secondary-hovered: var(--ref-color-secondary-50);
  --sys-color-background-secondary-pressed: var(--ref-color-secondary-100);

  --sys-color-background-neutral-fill: var(--ref-color-neutral-hangover-700);
  --sys-color-background-neutral-fill-hovered: var(--ref-color-neutral-hangover-800);
  --sys-color-background-neutral-fill-pressed: var(--ref-color-neutral-hangover-900);
  --sys-color-background-neutral-tonal: var(--ref-color-neutral-hangover-50);
  --sys-color-background-neutral-tonal-hovered: var(--ref-color-neutral-hangover-100);
  --sys-color-background-neutral-tonal-pressed: var(--ref-color-neutral-hangover-200);
  --sys-color-background-neutral-hovered: var(--ref-color-neutral-hangover-50);
  --sys-color-background-neutral-pressed: var(--ref-color-neutral-hangover-100);
  --sys-color-background-neutral-bolder: var(--ref-color-neutral-hangover-900);

  --sys-color-background-neutral-subtle-fill: var(--ref-color-neutral-gray-500);
  --sys-color-background-neutral-subtle-fill-hovered: var(--ref-color-neutral-gray-600);
  --sys-color-background-neutral-subtle-fill-pressed: var(--ref-color-neutral-gray-700);
  --sys-color-background-neutral-subtle-tonal: var(--ref-color-neutral-gray-100);
  --sys-color-background-neutral-subtle-tonal-hovered: var(--ref-color-neutral-gray-200);
  --sys-color-background-neutral-subtle-tonal-pressed: var(--ref-color-neutral-gray-300);
  --sys-color-background-neutral-subtle-hovered: var(--ref-color-neutral-gray-100);
  --sys-color-background-neutral-subtle-pressed: var(--ref-color-neutral-gray-200);
  --sys-color-background-neutral-subtle-bolder: var(--ref-color-neutral-gray-900);

  --sys-color-background-neutral-inverse-fill: var(--ref-color-neutral-white);
  --sys-color-background-neutral-inverse-fill-hovered: var(--ref-color-neutral-gray-100);
  --sys-color-background-neutral-inverse-fill-pressed: var(--ref-color-neutral-gray-200);
  --sys-color-background-neutral-inverse-tonal: var(--ref-color-neutral-gray-300);
  --sys-color-background-neutral-inverse-tonal-hovered: var(--ref-color-neutral-gray-400);
  --sys-color-background-neutral-inverse-tonal-pressed: var(--ref-color-neutral-gray-500);
  --sys-color-background-neutral-inverse-hovered: var(--ref-color-neutral-white-transparent12);
  --sys-color-background-neutral-inverse-pressed: var(--ref-color-neutral-white-transparent38);
  --sys-color-background-neutral-inverse-bolder: var(--ref-color-neutral-gray-500);

  --sys-color-background-info-fill: var(--ref-color-secondary-500);
  --sys-color-background-info-fill-hovered: var(--ref-color-secondary-600);
  --sys-color-background-info-fill-pressed: var(--ref-color-secondary-700);
  --sys-color-background-info-tonal: var(--ref-color-secondary-50);
  --sys-color-background-info-tonal-hovered: var(--ref-color-secondary-100);
  --sys-color-background-info-tonal-pressed: var(--ref-color-secondary-200);
  --sys-color-background-info-hovered: var(--ref-color-secondary-50);
  --sys-color-background-info-pressed: var(--ref-color-secondary-100);
  --sys-color-background-info-bolder: var(--ref-color-secondary-700);

  --sys-color-background-success-fill: var(--ref-color-green-500);
  --sys-color-background-success-fill-hovered: var(--ref-color-green-600);
  --sys-color-background-success-fill-pressed: var(--ref-color-green-700);
  --sys-color-background-success-tonal: var(--ref-color-green-50);
  --sys-color-background-success-tonal-hovered: var(--ref-color-green-100);
  --sys-color-background-success-tonal-pressed: var(--ref-color-green-200);
  --sys-color-background-success-hovered: var(--ref-color-green-50);
  --sys-color-background-success-pressed: var(--ref-color-green-100);
  --sys-color-background-success-bolder: var(--ref-color-green-700);

  --sys-color-background-urgency-fill: var(--ref-color-red-500);
  --sys-color-background-urgency-fill-hovered: var(--ref-color-red-600);
  --sys-color-background-urgency-fill-pressed: var(--ref-color-red-700);
  --sys-color-background-urgency-tonal: var(--ref-color-red-50);
  --sys-color-background-urgency-tonal-hovered: var(--ref-color-red-100);
  --sys-color-background-urgency-tonal-pressed: var(--ref-color-red-200);
  --sys-color-background-urgency-bolder: var(--ref-color-red-700);
  --sys-color-background-urgency-hovered: var(--ref-color-red-50);
  --sys-color-background-urgency-pressed: var(--ref-color-red-100);

  --sys-color-background-warning-fill: var(--ref-color-orange-500);
  --sys-color-background-warning-fill-hovered: var(--ref-color-orange-600);
  --sys-color-background-warning-fill-pressed: var(--ref-color-orange-700);
  --sys-color-background-warning-tonal: var(--ref-color-orange-50);
  --sys-color-background-warning-tonal-hovered: var(--ref-color-orange-100);
  --sys-color-background-warning-tonal-pressed: var(--ref-color-orange-200);
  --sys-color-background-warning-hovered: var(--ref-color-orange-50);
  --sys-color-background-warning-pressed: var(--ref-color-orange-100);
  --sys-color-background-warning-bolder: var(--ref-color-orange-700);

  --sys-color-background-deal-fill: var(--ref-color-oasis-500);
  --sys-color-background-deal-fill-hovered: var(--ref-color-oasis-600);
  --sys-color-background-deal-fill-pressed: var(--ref-color-oasis-700);
  --sys-color-background-deal-tonal: var(--ref-color-oasis-50);
  --sys-color-background-deal-tonal-hovered: var(--ref-color-oasis-100);
  --sys-color-background-deal-tonal-pressed: var(--ref-color-oasis-200);
  --sys-color-background-deal-hovered: var(--ref-color-oasis-50);
  --sys-color-background-deal-pressed: var(--ref-color-oasis-100);
  --sys-color-background-deal-bolder: var(--ref-color-oasis-700);

  --sys-color-background-disable-fill: var(--ref-color-neutral-gray-200);
  --sys-color-background-loading-fill: var(--ref-color-neutral-gray-200);

  /* #endregion */

  /* border */
  /* #region */

  --sys-color-border-surface: var(--ref-color-neutral-hangover-100);
  --sys-color-border-surface-subtle: var(--ref-color-neutral-gray-200);

  --sys-color-border-inverse: var(--ref-color-neutral-gray-800);
  --sys-color-border-primary: var(--ref-color-primary-brand-500-transparent50);
  --sys-color-border-secondary: var(--ref-color-secondary-500-transparent50);
  --sys-color-border-neutral: var(--ref-color-neutral-hangover-500-transparent50);
  --sys-color-border-neutral-subtle: var(--ref-color-neutral-gray-500-transparent50);
  --sys-color-border-neutral-inverse: var(--ref-color-neutral-white-transparent50);

  --sys-color-border-info: var(--ref-color-secondary-500-transparent50);
  --sys-color-border-success: var(--ref-color-green-500-transparent50);
  --sys-color-border-urgency: var(--ref-color-red-500-transparent50);
  --sys-color-border-error: var(--ref-color-red-500-transparent50);
  --sys-color-border-warning: var(--ref-color-orange-500-transparent50);
  --sys-color-border-green: var(--ref-color-oasis-500-transparent50);

  --sys-color-border-disable: var(--ref-color-neutral-black-transparent12);
  --sys-color-border-loading: var(--ref-color-neutral-black-transparent12);

  /* #endregion */

  /* content */
  /* #region */

  --sys-color-content-default: var(--ref-color-neutral-black);
  --sys-color-content-default-subtle: var(--ref-color-neutral-gray-800);
  --sys-color-content-default-subtler: var(--ref-color-neutral-gray-600);
  --sys-color-content-default-subtlest: var(--ref-color-neutral-gray-400);
  --sys-color-content-default-inverse-subtler: var(--ref-color-neutral-hangover-200);
  --sys-color-content-default-inverse-subtle: var(--ref-color-neutral-hangover-100);
  --sys-color-content-default-inverse: var(--ref-color-neutral-white);
  --sys-color-content-primary: var(--ref-color-primary-brand-500);
  --sys-color-content-secondary: var(--ref-color-secondary-500);
  --sys-color-content-secondary-bold: var(--ref-color-secondary-700);
  --sys-color-content-link: var(--ref-color-secondary-500);
  --sys-color-content-link-subtle: var(--ref-color-secondary-100);
  --sys-color-content-icon-default: var(--ref-color-neutral-gray-500);
  --sys-color-content-icon-hover: var(--ref-color-secondary-500);
  --sys-color-content-neutral: var(--ref-color-neutral-hangover-700);
  --sys-color-content-neutral-subtle: var(--ref-color-neutral-gray-500);
  --sys-color-content-disable: var(--ref-color-neutral-gray-400);
  --sys-color-content-loading: var(--ref-color-neutral-gray-400);
  --sys-color-content-info: var(--ref-color-secondary-500);
  --sys-color-content-urgency: var(--ref-color-red-500);
  --sys-color-content-error: var(--ref-color-red-500);
  --sys-color-content-warning: var(--ref-color-orange-500);
  --sys-color-content-success: var(--ref-color-green-500);
  --sys-color-content-nature: var(--ref-color-oasis-500);
  --sys-color-content-deal: var(--ref-color-oasis-500);

  /* #endregion */

  /* #endregion */

  /* === Component Tokens === */
  /* #region */

  /* input */
  /* #region */

  --comp-color-input-bg-surface: var(--ref-color-neutral-white);
  --comp-color-input-bg-hovered: var(--ref-color-secondary-50);
  --comp-color-input-bg-disable: var(--sys-color-background-disable-fill);
  --comp-color-input-border: var(--sys-color-border-surface);
  --comp-color-input-border-error: var(--sys-color-border-error);
  --comp-color-input-border-focus: var(--sys-color-border-secondary);
  --comp-color-input-border-disable: var(--sys-color-border-disable);
  --comp-color-input-content: var(--sys-color-content-default-subtler);
  --comp-color-input-content-icon: var(--sys-color-content-default-subtlest);
  --comp-color-input-content-state: var(--sys-color-content-default-subtle);
  --comp-color-input-content-error: var(--sys-color-content-error);
  --comp-color-input-content-disable: var(--sys-color-content-disable);

  /* #endregion */

  /* header */
  /* #region */

  --comp-color-header-background-main: var(--sys-color-background-surface);
  --comp-color-header-background-variant: var(--sys-color-background-surface-subtle);
  --comp-color-header-nav-item-content: var(--sys-color-content-default);
  --comp-color-header-nav-item-content-inverse: var(--sys-color-content-default-inverse);
  --comp-color-header-nav-item-content-hover: var(--sys-color-content-primary);
  --comp-color-header-nav-item-bg-hover: var(--ref-color-primary-brand-500-transparent12);
  --comp-color-header-dropdown-bg: var(--sys-color-background-inverse-extra-subtle);
  --comp-color-header-dropdown-bg-variant: var(--sys-color-background-surface);
  --comp-color-header-divider: var(--ref-color-neutral-gray-200);
  --comp-color-header-border: var(--ref-color-neutral-gray-100);

  /* #endregion */
}