npm - @qite/tide-booking-component - Versions diffs - 1.4.93 → 1.4.95 - Mend

@qite/tide-booking-component 1.4.93 → 1.4.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (181) hide show

package/.prettierrc +9 -9
package/.vs/ProjectSettings.json +3 -3
package/.vs/VSWorkspaceState.json +5 -5
package/build/build-cjs/index.js +81 -27
package/build/build-cjs/src/booking-wizard/features/booking/booking-slice.d.ts +2 -1
package/build/build-cjs/src/booking-wizard/features/booking/selectors.d.ts +4 -3
package/build/build-cjs/src/booking-wizard/features/price-details/price-details-slice.d.ts +1 -0
package/build/build-cjs/src/booking-wizard/features/price-details/selectors.d.ts +1 -0
package/build/build-cjs/src/booking-wizard/features/sidebar/sidebar.d.ts +1 -0
package/build/build-cjs/src/booking-wizard/types.d.ts +1 -0
package/build/build-cjs/src/shared/utils/localization-util.d.ts +1 -0
package/build/build-esm/index.js +81 -27
package/build/build-esm/src/booking-wizard/features/booking/booking-slice.d.ts +2 -1
package/build/build-esm/src/booking-wizard/features/booking/selectors.d.ts +4 -3
package/build/build-esm/src/booking-wizard/features/price-details/price-details-slice.d.ts +1 -0
package/build/build-esm/src/booking-wizard/features/price-details/selectors.d.ts +1 -0
package/build/build-esm/src/booking-wizard/features/sidebar/sidebar.d.ts +1 -0
package/build/build-esm/src/booking-wizard/types.d.ts +1 -0
package/build/build-esm/src/shared/utils/localization-util.d.ts +1 -0
package/package.json +83 -83
package/src/booking-product/components/age-select.tsx +35 -35
package/src/booking-product/components/amount-input.tsx +51 -51
package/src/booking-product/components/date-range-picker/calendar.tsx +155 -155
package/src/booking-product/components/footer.tsx +54 -54
package/src/booking-product/components/header.tsx +57 -57
package/src/booking-product/components/icon.tsx +200 -200
package/src/booking-product/components/list-view.tsx +54 -54
package/src/booking-product/components/rating.tsx +21 -21
package/src/booking-product/components/rooms.tsx +171 -171
package/src/booking-product/constants.ts +1 -1
package/src/booking-product/index.tsx +21 -21
package/src/booking-product/settings-context.ts +16 -16
package/src/booking-product/types.ts +30 -30
package/src/booking-product/utils/api.ts +26 -26
package/src/booking-product/utils/price.ts +28 -28
package/src/booking-wizard/api-settings-slice.ts +24 -24
package/src/booking-wizard/components/icon.tsx +398 -398
package/src/booking-wizard/components/labeled-input.tsx +56 -56
package/src/booking-wizard/components/labeled-select.tsx +54 -54
package/src/booking-wizard/components/message.tsx +21 -21
package/src/booking-wizard/components/multi-range-filter.tsx +99 -99
package/src/booking-wizard/components/phone-input.tsx +146 -146
package/src/booking-wizard/components/print-offer-button.tsx +53 -53
package/src/booking-wizard/components/product-card.tsx +23 -23
package/src/booking-wizard/declarations.d.ts +4 -4
package/src/booking-wizard/features/booking/booking-self-contained.tsx +16 -1
package/src/booking-wizard/features/booking/booking-slice.ts +9 -1
package/src/booking-wizard/features/booking/booking.tsx +16 -1
package/src/booking-wizard/features/booking/selectors.ts +5 -0
package/src/booking-wizard/features/flight-options/flight-filter.tsx +371 -371
package/src/booking-wizard/features/flight-options/flight-option-flight.tsx +354 -354
package/src/booking-wizard/features/flight-options/flight-option-modal.tsx +211 -211
package/src/booking-wizard/features/flight-options/flight-option.tsx +57 -57
package/src/booking-wizard/features/flight-options/flight-utils.ts +423 -423
package/src/booking-wizard/features/price-details/price-details-api.ts +20 -20
package/src/booking-wizard/features/price-details/price-details-slice.ts +2 -0
package/src/booking-wizard/features/price-details/selectors.ts +1 -0
package/src/booking-wizard/features/price-details/util.ts +115 -115
package/src/booking-wizard/features/product-options/no-options.tsx +18 -18
package/src/booking-wizard/features/product-options/none-option.tsx +73 -73
package/src/booking-wizard/features/product-options/option-booking-airline-group.tsx +53 -53
package/src/booking-wizard/features/product-options/option-booking-group.tsx +152 -152
package/src/booking-wizard/features/product-options/option-item.tsx +236 -236
package/src/booking-wizard/features/product-options/option-pax-card.tsx +159 -159
package/src/booking-wizard/features/product-options/option-pax-group.tsx +122 -122
package/src/booking-wizard/features/product-options/option-room.tsx +226 -226
package/src/booking-wizard/features/product-options/option-unit-group.tsx +138 -138
package/src/booking-wizard/features/room-options/room-utils.ts +154 -154
package/src/booking-wizard/features/room-options/room.tsx +123 -123
package/src/booking-wizard/features/room-options/traveler-rooms.tsx +64 -64
package/src/booking-wizard/features/sidebar/index.tsx +2 -0
package/src/booking-wizard/features/sidebar/sidebar-flight.tsx +66 -66
package/src/booking-wizard/features/sidebar/sidebar.tsx +17 -1
package/src/booking-wizard/features/summary/summary-booking-option-pax.tsx +23 -23
package/src/booking-wizard/features/summary/summary-booking-option-unit.tsx +23 -23
package/src/booking-wizard/features/summary/summary-flight.tsx +36 -36
package/src/booking-wizard/features/summary/summary-per-booking-option-group.tsx +60 -60
package/src/booking-wizard/features/summary/summary-per-pax-option-group.tsx +56 -56
package/src/booking-wizard/features/summary/summary-per-unit-option-group.tsx +58 -58
package/src/booking-wizard/features/summary/summary-slice.ts +27 -27
package/src/booking-wizard/features/travelers-form/travelers-form-slice.ts +157 -157
package/src/booking-wizard/features/travelers-form/travelers-form-util.ts +10 -10
package/src/booking-wizard/features/travelers-form/type-ahead-input.tsx +85 -85
package/src/booking-wizard/features/travelers-form/validate-form.ts +178 -178
package/src/booking-wizard/index.tsx +27 -27
package/src/booking-wizard/store.ts +26 -26
package/src/booking-wizard/types.ts +1 -0
package/src/booking-wizard/use-offer-printer.ts +108 -108
package/src/content/components/LanguageSwitcher.tsx +158 -158
package/src/content/components/accordion.tsx +30 -30
package/src/content/components/contact.tsx +211 -211
package/src/content/components/personal-contact-form.tsx +809 -809
package/src/content/header/index.tsx +43 -43
package/src/content/header/types.ts +26 -26
package/src/qsm/components/date-picker/index.tsx +152 -152
package/src/qsm/components/date-range-picker/calendar-day.tsx +49 -49
package/src/qsm/components/date-range-picker/calendar.tsx +211 -211
package/src/qsm/components/date-range-picker/index.tsx +404 -404
package/src/qsm/index.tsx +26 -26
package/src/qsm/store/qsm-store.ts +13 -13
package/src/search-results/components/flight/flight-card.tsx +38 -38
package/src/search-results/components/flight/flight-leg.tsx +61 -61
package/src/search-results/components/flight/flight-path.tsx +23 -23
package/src/search-results/components/multi-range-filter.tsx +104 -104
package/src/search-results/components/search-results-container/search-results-container.tsx +2 -2
package/src/search-results/index.tsx +24 -24
package/src/search-results/search-results-configuration-context.ts +6 -6
package/src/search-results/store/search-results-store.ts +13 -13
package/src/shared/components/loader.tsx +16 -16
package/src/shared/translations/ar-SA.json +2 -1
package/src/shared/translations/da-DK.json +2 -1
package/src/shared/translations/de-DE.json +2 -1
package/src/shared/translations/en-GB.json +2 -1
package/src/shared/translations/es-ES.json +2 -1
package/src/shared/translations/fr-BE.json +2 -1
package/src/shared/translations/fr-FR.json +2 -1
package/src/shared/translations/is-IS.json +2 -1
package/src/shared/translations/it-IT.json +2 -1
package/src/shared/translations/ja-JP.json +2 -1
package/src/shared/translations/nl-BE.json +2 -1
package/src/shared/translations/nl-NL.json +2 -1
package/src/shared/translations/no-NO.json +2 -1
package/src/shared/translations/pl-PL.json +2 -1
package/src/shared/translations/pt-PT.json +2 -1
package/src/shared/translations/sv-SE.json +2 -1
package/src/shared/utils/class-util.ts +7 -7
package/src/shared/utils/query-string-util.ts +91 -91
package/src/shared/utils/tide-api-utils.ts +34 -34
package/src/shared/utils/use-media-query-util.ts +19 -19
package/styles/abstracts/_mixins.scss +74 -74
package/styles/abstracts/_variables.scss +57 -57
package/styles/base/_fonts.scss +2 -2
package/styles/base/_normalize.scss +227 -227
package/styles/base/_typography.scss +35 -35
package/styles/booking-joker-variables.scss +596 -596
package/styles/booking-product-variables.scss +330 -330
package/styles/booking-product.scss +438 -438
package/styles/booking-qsm-variables.scss +501 -501
package/styles/booking-qsm.scss +52 -52
package/styles/booking-wizard-variables.scss +603 -603
package/styles/booking-wizard.scss +61 -61
package/styles/components/_accordion.scss +67 -67
package/styles/components/_animations.scss +39 -39
package/styles/components/_base.scss +107 -107
package/styles/components/_breadcrumb.scss +92 -92
package/styles/components/_button.scss +238 -238
package/styles/components/_checkbox.scss +230 -230
package/styles/components/_contact.scss +239 -239
package/styles/components/_cta.scss +238 -238
package/styles/components/_date-list.scss +41 -41
package/styles/components/_date-range-picker.scss +223 -223
package/styles/components/_decrement-increment.scss +35 -35
package/styles/components/_dropdown.scss +72 -72
package/styles/components/_faq.scss +27 -27
package/styles/components/_flight-option.scss +1419 -1419
package/styles/components/_gallery.scss +314 -314
package/styles/components/_header.scss +113 -113
package/styles/components/_img-slider.scss +175 -175
package/styles/components/_info-message.scss +75 -75
package/styles/components/_input.scss +35 -35
package/styles/components/_list.scss +185 -185
package/styles/components/_loader.scss +70 -70
package/styles/components/_mixins.scss +579 -579
package/styles/components/_passenger-picker.scss +306 -306
package/styles/components/_phone-input.scss +8 -8
package/styles/components/_placeholders.scss +165 -165
package/styles/components/_qsm.scss +17 -17
package/styles/components/_radiobutton.scss +170 -170
package/styles/components/_select-wrapper.scss +76 -76
package/styles/components/_slider.scss +128 -128
package/styles/components/_spinner.scss +29 -29
package/styles/components/_step-indicators.scss +161 -161
package/styles/components/_table.scss +81 -81
package/styles/components/_typeahead.scss +275 -275
package/styles/components/_variables.scss +89 -89
package/styles/content-blocks-variables.scss +507 -507
package/styles/font.scss +2 -2
package/styles/qsm/_calendar.scss +274 -274
package/styles/qsm/_qsm.scss +1094 -1094
package/styles/search.scss +1200 -1200
package/tsconfig.json +24 -24

package/styles/booking-wizard-variables.scss CHANGED Viewed

@@ -1,603 +1,603 @@
-:root {
-  // COLOR ASSIGNMENTS
-  --tide-booking-color-primary: #333399;
-  --tide-booking-color-primary-gradient: linear-gradient(204.08deg, #333399 1.64%, #282878 84.55%);
-  --tide-booking-color-primary-fade: #ebebf8;
-  --tide-booking-color-primary-extra-fade: #f8f8fd;
-  --tide-booking-color-primary-light: #cdcdee;
-  --tide-booking-color-primary-dark: #282878;
-  --tide-booking-color-secondary: #1f9470;
-  --tide-booking-color-secondary-light: #11b684;
-  --tide-booking-color-star: #ecb911;
-  // --tide-booking-invalid: #e74c3c;
-  --tide-booking-invalid: #871d11;
-  --tide-booking-invalid-light: #fce8e6;
-  --tide-booking-invalid-dark: #871d11;
-  --tide-booking-price-increase: #e81212;
-  --tide-booking-price-decrease: #19a364;
-  --tide-booking-white: #ffffff;
-  --tide-booking-gray-light: #f5f5f5;
-  --tide-booking-gray-xlight: #fbfbfb;
-  --tide-booking-gray--medium-light: #efefef;
-  --tide-booking-gray-background-light: #e2e2e2;
-  --tide-booking-gray-border-light: #f3f3f3;
-  --tide-booking-gray-checkbox-bg: #bdbdbd;
-  --tide-booking-gray-medium: #cbcbcb;
-  --tide-booking-gray-dark: #666666;
-  --tide-booking-black: #0a0a0a;
-  --tide-booking-transparent: transparent;
-  // BACKGROUNDS
-  --tide-booking-bg: #fafafa;
-  // TYPOGRAPHY
-  --tide-booking-font-heading: 'Outfit', serif;
-  --tide-booking-font-body: 'Outfit', serif;
-  --tide-booking-font-handwritten: 'Outfit', serif;
-  --tide-booking-font-size-body: 16px;
-  --tide-booking-font-size-body-lg: 18px;
-  --tide-booking-line-height-body: 1;
-  // GRID
-  --tide-booking-container-wide: 1690px;
-  --tide-booking-container-medium: 1200px;
-  --tide-booking-container-small: 900px;
-  --tide-booking-container-article: 650px;
-  --tide-booking-gutter: 15px;
-  // MEDIA QUERIES
-  --tide-booking-screen-xs: 576px;
-  --tide-booking-screen-sm: 768px;
-  --tide-booking-screen-md: 992px;
-  --tide-booking-screen-lg: 1200px;
-  --tide-booking-screen-xl: 1650px;
-  --tide-booking-screen-xxl: 1920px;
-  //HEADINGS
-  --tide-booking-heading-color: var(--tide-booking-black);
-  //h1
-  --tide-booking-h1: 32.5px;
-  --tide-booking-h1-sm: 48px;
-  --tide-booking-h1-xl: 48px;
-  //h2
-  --tide-booking-h2: 24px;
-  --tide-booking-h2-sm: 30px;
-  --tide-booking-h2-xl: 30px;
-  //h3
-  --tide-booking-h3: 22px;
-  --tide-booking-h3-sm: 25px;
-  --tide-booking-h3-xl: 25px;
-  //h4
-  --tide-booking-h4: 18px;
-  --tide-booking-h4-sm: 23px;
-  --tide-booking-h4-xl: 23px;
-  //h5
-  --tide-booking-h5: 18px;
-  --tide-booking-h5-xl: 20px;
-  //h6
-  --tide-booking-h6: 16px;
-  --tide-booking-h6-md: 18px;
-  //a
-  --tide-booking-a-color: var(--tide-booking-color-primary);
-  --tide-booking-a-text-decoration: underline;
-  --tide-booking-a-color-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-a-text-decoration-hover: underline;
-  --tide-booking-a-color-focus: var(--tide-booking-color-primary-dark);
-  --tide-booking-a-text-decoration-focus: underline;
-  //TOGGLE-SWITCH
-  --tide-booking-toggle-switch-background: var(--tide-booking-gray-medium);
-  --tide-booking-toggle-switch-border-radius: 5px;
-  --tide-booking-toggle-switch-after-color: var(--tide-booking-white);
-  //TOGGLE-SWITCH--TOGGLED
-  --tide-booking-toggle-switch-background-toggled: var(--tide-booking-color-primary);
-  //FORM--INPUT
-  --tide-booking-form-input-background: var(--tide-booking-gray-xlight);
-  --tide-booking-form-input-border: 1.5px solid var(--tide-booking-gray--medium-light);
-  --tide-booking-form-input-border-radius: 5px;
-  --tide-booking-form-input-height: 45px;
-  //FORM--INPUT--FOCUS/ACTIVE
-  --tide-booking-form-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
-  //FORM--INPUT--PLACEHOLDER
-  --tide-booking-form-input-placeholder-color: var(--tide-booking-gray-dark);
-  --tide-booking-form-input-placeholder-font-style: normal;
-  //INPUT--LABEL
-  --tide-booking-input-label-color: var(--tide-booking-gray-dark);
-  --tide-booking-input-label-font-size: 14px;
-  --tide-booking-input-label-font-weight: 400;
-  --tide-booking-input-label-font-style: normal;
-  //RADIOBUTTON
-  --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
-  --tide-booking-radiobutton-background: var(--tide-booking-white);
-  --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
-  --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
-  --tide-booking-radiobutton-font-size: 16px;
-  --tide-booking-radiobutton-font-weight: 400;
-  //RADIOBUTTON--INPUT--CHECKED
-  --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
-  --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
-  --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
-  //CHECKBOX--INPUT--CHECKED--AFTER
-  --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
-  //CHECKBOX
-  --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
-  --tide-booking-checkbox-border-radius: 0px;
-  --tide-booking-checkbox-background: var(--tide-booking-white);
-  --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
-  --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
-  --tide-booking-checkbox-font-size: 16px;
-  --tide-booking-checkbox-font-weight: 400;
-  //CHECKBOX--INPUT--CHECKED
-  --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
-  --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
-  --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
-  --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
-  //SLIDER
-  --tide-booking-slider-track-background: var(--tide-booking-color-primary);
-  --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
-  --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
-  --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
-  //BOOKING PRODUCT
-  --tide-booking-component-background: var(--tide-booking-bg);
-  --tide-booking-component-radius: 10px;
-  --tide-booking-component-border: 1.5px solid var(--tide-booking-color-primary-fade);
-  //HEADER
-  --tide-booking-component-header-background: var(--tide-booking-color-primary-gradient);
-  --tide-booking-component-header-color: var(--tide-booking-white);
-  --tide-booking-component-header-border-radius: 10px 10px 0px 0px;
-  --tide-booking-component-header-star-rating: var(--tide-booking-color-star);
-  --tide-booking-component-header-title-color: var(--tide-booking-white);
-  --tide-booking-component-header-title-font: var(--tide-booking-font-heading);
-  --tide-booking-component-header-icon-color: var(--tide-booking-white);
-  //price header
-  --tide-booking-component-header-price-font-family: var(--tide-booking-font-body);
-  --tide-booking-component-header-price-font-size--mobile: 25px;
-  --tide-booking-component-header-price-font-size--desktop: 36px;
-  --tide-booking-component-header-price-font-weight: 400;
-  --tide-booking-component-header-price-color: var(--tide-booking-white);
-  //small fontsize
-  --tide-booking-small-font-size--mobile: 13px;
-  --tide-booking-small-font-size--desktop: 15px;
-  //CTA
-  --tide-booking-cta-height: 40px;
-  --tide-booking-cta-height-xs: 45px;
-  --tide-booking-cta-width: 100%;
-  --tide-booking-cta-width-xs: auto;
-  --tide-booking-cta-padding: 10px 20px;
-  --tide-booking-cta-color: var(--tide-booking-white);
-  --tide-booking-cta-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
-  --tide-booking-cta-font-family: var(--tide-booking-font-body);
-  --tide-booking-cta-font-size: 16px;
-  --tide-booking-cta-font-size-xs: 18px;
-  --tide-booking-cta-font-weight: 400;
-  --tide-booking-cta-text-decoration: none;
-  --tide-booking-cta-border: none;
-  --tide-booking-cta-border-radius: 5px;
-  //CTA__ICON
-  --tide-booking-cta-icon-color: var(--tide-booking-white);
-  --tide-booking-cta-icon-size: 16px;
-  //CTA__HOVER
-  --tide-booking-cta-background-hover: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
-  --tide-booking-cta-color-hover: var(--tide-booking-white);
-  --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
-  --tide-booking-cta-border-hover: none;
-  --tide-booking-cta-text-decoration-hover: none;
-  //CTA__FOCUS
-  --tide-booking-cta-background-focus: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
-  --tide-booking-cta-color-focus: var(--tide-booking-white);
-  --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
-  --tide-booking-cta-border-focus: none;
-  --tide-booking-cta-text-decoration-focus: none;
-  //CTA--SECONDARY
-  --tide-booking-cta-height-secondary: 40px;
-  --tide-booking-cta-height-xs-secondary: 45px;
-  --tide-booking-cta-width-secondary: auto;
-  --tide-booking-cta-padding-secondary: 10px 20px;
-  --tide-booking-cta-margin-secondary: 0px 0 0 0;
-  --tide-booking-cta-background-secondary: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
-  --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
-  --tide-booking-cta-border-secondary: none;
-  --tide-booking-cta-border-radius-secondary: 5px;
-  --tide-booking-cta-text-decoration-secondary: none;
-  --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
-  --tide-booking-cta-font-size-secondary: 16px;
-  --tide-booking-cta-font-size-xs-secondary: 18px;
-  --tide-booking-cta-font-weight-secondary: 400;
-  //CTA--SECONDARY__ICON
-  --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
-  --tide-booking-cta-icon-size-secondary: 16px;
-  //CTA--SECONDARY__HOVER
-  --tide-booking-cta-background-secondary-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
-  --tide-booking-cta-color-secondary-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-cta-border-secondary-hover: none;
-  --tide-booking-cta-text-decoration-secondary-hover: none;
-  //CTA--SECONDARY__FOCUS
-  --tide-booking-cta-background-secondary-focus: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
-  --tide-booking-cta-color-secondary-focus: var(--tide-booking-color-primary-dark);
-  --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-color-primary-dark);
-  --tide-booking-cta-border-secondary-focus: none;
-  --tide-booking-cta-text-decoration-secondary-focus: none;
-  //CTA--SELECT
-  --tide-booking-cta-background-select: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
-  --tide-booking-cta-color-select: var(--tide-booking-color-primary);
-  --tide-booking-cta-border-select: none;
-  --tide-booking-cta-border-radius-select: 5px;
-  //CTA--SELECT--HOVER/FOCUS/ACTIVE
-  --tide-booking-cta-background-select-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
-  --tide-booking-cta-color-select-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-cta-border-select-hover: none;
-  //CTA--SELECTED
-  --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
-  --tide-booking-cta-color-selected: var(--tide-booking-white);
-  --tide-booking-cta-border-selected: none;
-  --tide-booking-cta-border-radius-selected: 5px;
-  --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
-  //DROPDOWN
-  --tide-booking-dropdown-background: var(--tide-booking-white);
-  --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-color-primary-light);
-  --tide-booking-dropdown-border-radius: 5px;
-  --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
-  --tide-booking-dropdown-height: 45px;
-  --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary-light);
-  --tide-booking-dropdown-arrow-color: var(--tide-booking-color-primary);
-  --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
-  --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
-  //SPINNER
-  --tide-booking-spinner-border: 5px solid var(--tide-booking-color-primary);
-  --tide-booking-spinner-border-top-color: #dce1ff;
-  --tide-booking-spinner-background: var(--tide-booking-white);
-  --tide-booking-spinner-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-  //ANIMATION
-  --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
-  //BOOKING-WIZARD
-  --tide-booking-wizard-background: var(--tide-booking-bg);
-  --tide-booking-wizard-title-color: var(--tide-booking-black);
-  --tide-booking-wizard-heading-color: var(--tide-booking-black);
-  //BOOKING-WIZARD--GENERAL-STEP-COMPONENTS
-  --tide-booking-step-card-background: var(--tide-booking-white);
-  --tide-booking-step-card-border: 1.5px solid var(--tide-booking-gray-border-light);
-  --tide-booking-step-card-border-radius: 10px;
-  --tide-booking-step-toggle-btn-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
-  --tide-booking-step-toggle-btn-border: none;
-  --tide-booking-step-toggle-btn-border-radius: 5px;
-  --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
-  //HOVER,FOCUS
-  --tide-booking-step-toggle-btn-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
-  --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-step-toggle-btn-border-hover: none;
-  //STEP-INDICATORS
-  --tide-booking-step-indicators-line-trough: 2px dashed var(--tide-booking-gray-medium);
-  --tide-booking-step-indicators-icon-color: var(--tide-booking-black);
-  --tide-booking-step-indicators-icon-background: var(--tide-booking-white);
-  --tide-booking-step-indicators-icon-border: 1px solid var(--tide-booking-gray-border-light);
-  --tide-booking-step-indicators-icon-border-radius: 50%;
-  --tide-booking-step-indicators-icon-font-family: var(--tide-booking-font-heading);
-  --tide-booking-step-indicators-icon-font-size: 16px;
-  --tide-booking-step-indicators-icon-font-weight: 400;
-  --tide-booking-step-indicators-icon-color-text: var(--tide-booking-black);
-  //STEP-INDICATORS--ACTIVE
-  --tide-booking-step-indicators-icon-color-active: var(--tide-booking-white);
-  --tide-booking-step-indicators-icon-background-active: var(--tide-booking-color-primary);
-  --tide-booking-step-indicators-icon-border-active: 1px solid var(--tide-booking-color-primary);
-  --tide-booking-step-indicators-icon-check-color-active: var(--tide-booking-white);
-  --tide-booking-step-indicators-icon-color-text-active: var(--tide-booking-color-primary);
-  //STEP-INDICATORS--COMPLETED
-  --tide-booking-step-indicators-icon-color-completed: var(--tide-booking-white);
-  --tide-booking-step-indicators-icon-background-completed: var(--tide-booking-color-primary);
-  --tide-booking-step-indicators-icon-border-completed: 1px solid var(--tide-booking-color-primary);
-  --tide-booking-step-indicators-icon-check-color-completed: var(--tide-booking-white);
-  --tide-booking-step-indicators-icon-color-text-completed: var(--tide-booking-transparent);
-  //SIDEBAR
-  --tide-booking-sidebar-frame-radius: 10px;
-  //SIDEBAR--HEADER
-  --tide-booking-sidebar-header-background: var(--tide-booking-color-primary-gradient);
-  --tide-booking-sidebar-header-color: var(--tide-booking-white);
-  --tide-booking-sidebar-header-font-family: var(--tide-booking-font-heading);
-  --tide-booking-sidebar-header-font-size: 20px;
-  --tide-booking-sidebar-header-font-weight: 400;
-  --tide-booking-sidebar-header-border-radius: 10px 10px 0px 0px;
-  //MOBILE--TOGGLE
-  --tide-booking-sidebar-btn-toggle-background: rgba(255, 255, 255, 0.2);
-  --tide-booking-sidebar-btn-toggle-color: var(--tide-booking-white);
-  --tide-booking-sidebar-btn-toggle-border: none;
-  --tide-booking-sidebar-btn-toggle-border-radius: 5px;
-  //SIDEBAR--BODY
-  --tide-booking-sidebar-body-background: var(--tide-booking-white);
-  --tide-booking-sidebar-body-border: 1.5px solid var(--tide-booking-gray-border-light);
-  --tide-booking-sidebar-body-border-radius: 5px;
-  --tide-booking-sidebar-body-font-family: var(--tide-booking-font-body);
-  --tide-booking-sidebar-body-font-size: 16px;
-  --tide-booking-sidebar-body-font-weight: 400;
-  --tide-booking-sidebar-body-color: var(--tide-booking-gray-dark);
-  --tide-booking-sidebar-body-label-color: var(--tide-booking-black);
-  --tide-booking-sidebar-body-label-font-size: 16px;
-  --tide-booking-sidebar-body-label-font-weight: 400;
-  --tide-booking-sidebar-body-title-color: var(--tide-booking-black);
-  --tide-booking-sidebar-body-title-font-size: 18px;
-  --tide-booking-sidebar-body-title-font-family: var(--tide-booking-font-heading);
-  --tide-booking-sidebar-body-title-font-weight: 600;
-  --tide-booking-sidebar-body-flight-font-weight: 600;
-  --tide-booking-sidebar-body-flight-color: var(--tide-booking-gray-dark);
-  //SIDEBAR--FOOTER
-  --tide-booking-sidebar-footer-background: var(--tide-booking-white);
-  --tide-booking-sidebar-footer-border: 1.5px solid var(--tide-booking-gray-border-light);
-  --tide-booking-sidebar-footer-border-radius: 0px 0px 10px 10px;
-  --tide-booking-sidebar-footer-advance-font-size: 18px;
-  --tide-booking-sidebar-footer-advance-font-weight: 400;
-  --tide-booking-sidebar-footer-advance-color: var(--tide-booking-gray-medium);
-  --tide-booking-sidebar-footer-total-font-size: 20px;
-  --tide-booking-sidebar-footer-total-font-weight: 600;
-  --tide-booking-sidebar-footer-total-color: var(--tide-booking-color-primary);
-  --tide-booking-sidebar-footer-small-font-size: 14px;
-  --tide-booking-sidebar-footer-small-font-weight: 400;
-  --tide-booking-sidebar-footer-small-color: var(--tide-booking-gray-medium);
-  --tide-booking-sidebar-footer-small-strong-color: var(--tide-booking-gray-dark);
-  //STEP-1--FLIGHT-OPTIONS
-  --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
-  --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
-  --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
-  --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
-  --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
-  --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
-  --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
-  --tide-booking-flight-options-times-title-font-weight: 700;
-  --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
-  --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
-  --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
-  --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
-  --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
-  --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
-  --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
-  --tide-booking-flight-options-detail-card-background: var(--tide-booking-color-primary-extra-fade);
-  --tide-booking-flight-options-detail-card-border: none;
-  --tide-booking-flight-options-detail-card-border-radius: 10px;
-  --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
-  --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
-  --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
-  --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
-  //HOVER,FOCUS
-  --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
-  --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
-  --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
-  //FLIGHT-OPTIONS--FILTER
-  --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
-  --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
-  //FLIGHT-OPTIONS--FILTER--BTN
-  --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
-  --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
-  --tide-booking-flight-options-filter-btn-border: 1.5px solid var(--tide-booking-color-primary);
-  --tide-booking-flight-options-filter-btn-border-radius: 5px;
-  --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
-  --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
-  --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
-  --tide-booking-flight-options-filter-btn-hover-border: 1.5px solid var(--tide-booking-transparent);
-  --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
-  //FLIGHT-OPTIONS--FILTER--HEADER
-  --tide-booking-flight-options-filter-header-text-color: var(--tide-booking-gray-dark);
-  --tide-booking-flight-options-filter-header-text-font-weight: 300;
-  --tide-booking-flight-options-filter-header-text-strong-color: var(--tide-booking-color-secondary);
-  --tide-booking-flight-options-filter-header-text-strong-font-weight: 600;
-  --tide-booking-flight-options-filter-header-close-icon-color: var(--tide-booking-color-primary);
-  //FLIGHT-OPTIONS--FILTER--GROUP-TITLE
-  --tide-booking-flight-options-filter-group-title-text-color: var(--tide-booking-gray-dark);
-  --tide-booking-flight-options-filter-group-title-text-font-weight: 500;
-  --tide-booking-flight-options-filter-group-title-text-font-family: var(--tide-booking-font-body);
-  --tide-booking-flight-options-filter-group-title-text-border: 1.5px solid var(--tide-booking-gray-border-light);
-  --tide-booking-flight-options-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
-  --tide-booking-flight-options-filter-group-title-subtext-font-weight: 400;
-  --tide-booking-flight-options-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
-  //STEP-2--ROOM-OPTIONS
-  --tide-booking-room-options-card-background: var(--tide-booking-step-card-background);
-  --tide-booking-room-options-card-border: var(--tide-booking-step-card-border);
-  --tide-booking-room-options-card-border-radius: var(--tide-booking-step-card-border-radius);
-  --tide-booking-room-options-image-border-radius: 10px;
-  --tide-booking-room-options-usp-list-color: var(--tide-booking-gray-dark);
-  --tide-booking-room-options-usp-list-font-weight: 400;
-  --tide-booking-room-options-usp-list-icon-color: var(--tide-booking-color-primary);
-  --tide-booking-room-options-title-color: var(--tide-booking-black);
-  --tide-booking-room-options-title-font-family: var(--tide-booking-font-heading);
-  --tide-booking-room-options-title-font-weight: 500;
-  --tide-booking-room-options-dropdown-select-border: var(--tide-booking-dropdown-border);
-  --tide-booking-room-options-dropdown-select-border-radius: var(--tide-booking-dropdown-border-radius);
-  --tide-booking-room-options-dropdown-select-font-family: var(--tide-booking-dropdown-font-family);
-  --tide-booking-room-options-dropdown-select-color: var(--tide-booking-dropdown-color);
-  --tide-booking-room-options-dropdown-select-background: var(--tide-booking-dropdown-background);
-  --tide-booking-room-options-dropdown-select-border-focus: var(--tide-booking-dropdown-border-focus);
-  --tide-booking-room-options-dropdown-select-icon-color: var(--tide-booking-dropdown-arrow-color);
-  //ALTERNATIVE--ROOM-OPTIONS
-  --tide-booking-room-options-alternative-btn-color: var(--tide-booking-color-secondary);
-  --tide-booking-room-options-alternative-btn-text-decoration: underline;
-  //ALTERNATIVE--ROOM-OPTIONS--HOVER
-  --tide-booking-room-options-alternative-btn-color-hover: var(--tide-booking-color-secondary-light);
-  --tide-booking-room-options-alternative-btn-text-decoration-hover: none;
-  //ALTERNATIVE--ROOM-OPTIONS--HEADER
-  --tide-booking-room-options-alternative-header-color: var(--tide-booking-black);
-  //STEP-3 EXTA-OPTIONS
-  --tide-booking-extra-options-card-background: var(--tide-booking-step-card-background);
-  --tide-booking-extra-options-card-border: var(--tide-booking-step-card-border);
-  --tide-booking-extra-options-card-border-radius: var(--tide-booking-step-card-border-radius);
-  --tide-booking-extra-options-card-title-color: var(--tide-booking-black);
-  //TAG
-  --tide-booking-tag-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
-  --tide-booking-tag-border: none;
-  --tide-booking-tag-border-radius: 0 5px 5px 0;
-  --tide-booking-tag-color: var(--tide-booking-white);
-  --tide-booking-tag-font-family: var(--tide-booking-font-body);
-  --tide-booking-tag-font-weight: 400;
-  //INPUT--SELECTED
-  --tide-booking-input-selected-background: #667dff10;
-  --tide-booking-input-selected-border: none;
-  --tide-booking-input-selected-border-radius: 5px;
-  --tide-booking-input-selected-color: var(--tide-booking-color-primary);
-  //TOGGLE
-  --tide-booking-flight-extra-options-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
-  --tide-booking-flight-extra-options-toggle-background: var(--tide-booking-step-toggle-btn-background);
-  --tide-booking-flight-extra-options-toggle-border: var(--tide-booking-step-toggle-btn-border);
-  --tide-booking-flight-extra-options-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
-  //HOVER,FOCUS
-  --tide-booking-flight-extra-options-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
-  --tide-booking-flight-extra-options-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
-  --tide-booking-flight-extra-options-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
-  //STEP-4--FORM
-  --tide-booking-form-card-background: var(--tide-booking-step-card-background);
-  --tide-booking-form-card-border: var(--tide-booking-step-card-border);
-  --tide-booking-form-card-border-radius: var(--tide-booking-step-card-border-radius);
-  //GROUP--BORDER
-  --tide-booking-form-group-border: 1.5px solid var(--tide-booking-color-primary-fade);
-  //LABEL
-  --tide-booking-form-label-color: var(--tide-booking-gray-dark);
-  --tide-booking-form-label-font-family: var(--tide-booking-font-body);
-  --tide-booking-form-label-font-weight: 300;
-  //TYPEAHEAD--AGENT
-  --tide-booking-form-typeahead-agent-background: var(--tide-booking-gray-xlight);
-  --tide-booking-form-typeahead-agent-border: 1.5px solid var(--tide-booking-gray--medium-light);
-  --tide-booking-form-typeahead-agent-border-radius: 5px;
-  --tide-booking-form-typeahead-agent-color: var(--tide-booking-black);
-  --tide-booking-form-typeahead-agent-font-family: var(--tide-booking-font-body);
-  --tide-booking-form-typeahead-agent-icon-color: var(--tide-booking-black);
-  --tide-booking-form-typeahead-agent-clear-icon-color: var(--tide-booking-color-primary);
-  --tide-booking-form-typeahead-agent-placeholder-color: var(--tide-booking-gray-medium);
-  --tide-booking-form-typeahead-agent-placeholder-font-family: var(--tide-booking-font-body);
-  //TYPEAHEAD--AGENT--HOVER/FOCUS
-  --tide-booking-form-typeahead-agent-background-hover: var(--tide-booking-white);
-  --tide-booking-form-typeahead-agent-border-hover: 1.5px solid var(--tide-booking-color-primary);
-  --tide-booking-form-typeahead-agent-color-hover: var(--tide-booking-black);
-  --tide-booking-form-typeahead-agent-icon-color-hover: var(--tide-booking-color-primary);
-  //TYPEAHEAD--AGENT--OPTIONS
-  --tide-booking-form-typeahead-agent-options-background: var(--tide-booking-white);
-  --tide-booking-form-typeahead-agent-options-border: 1.5px solid var(--tide-booking-gray-border-light);
-  --tide-booking-form-typeahead-agent-options-border-radius: 5px;
-  --tide-booking-form-typeahead-agent-options-color: var(--tide-booking-gray-dark);
-  //TYPEAHEAD--AGENT--OPTIONS--HOVER
-  --tide-booking-form-typeahead-agent-options-background-hover: var(--tide-booking-gray-border-light);
-  --tide-booking-form-typeahead-agent-options-color-hover: var(--tide-booking-black);
-  //TYPEAHEAD--AGENT--OPTIONS--HIGHLIGHT
-  --tide-booking-form-typeahead-agent-options-color-highlight: var(--tide-booking-black);
-  --tide-booking-form-typeahead-agent-options-font-weight-highlight: 600;
-  //STEP-5--OVERVIEW
-  --tide-booking-form-summary-background: var(--tide-booking-step-card-background);
-  --tide-booking-form-summary-border: var(--tide-booking-step-card-border);
-  --tide-booking-form-summary-border-radius: var(--tide-booking-step-card-border-radius);
-  //VOUCHER--REMOVE-BTN
-  --tide-booking-form-summary-voucher-remove-btn-background: var(--tide-booking-transparent);
-  --tide-booking-form-summary-voucher-remove-btn-color: var(--tide-booking-color-primary);
-  --tide-booking-form-summary-voucher-remove-btn-border: none;
-  --tide-booking-form-summary-voucher-remove-btn-border-radius: 5px;
-  //VOUCHER--REMOVE-BTN--HOVER
-  --tide-booking-form-summary-voucher-remove-btn-background-hover: var(--tide-booking-transparent);
-  --tide-booking-form-summary-voucher-remove-btn-color-hover: var(--tide-booking-color-primary-dark);
-  --tide-booking-form-summary-voucher-remove-btn-border-hover: none;
-  //STEP-6--CONFIRMATION
-  --tide-booking-confirmation-background: var(--tide-booking-step-card-background);
-  --tide-booking-confirmation-border: var(--tide-booking-step-card-border);
-  --tide-booking-confirmation-border-radius: var(--tide-booking-step-card-border-radius);
-  --tide-booking-confirmation-icon-color: var(--tide-booking-color-secondary);
-}
+:root {
+  // COLOR ASSIGNMENTS
+  --tide-booking-color-primary: #333399;
+  --tide-booking-color-primary-gradient: linear-gradient(204.08deg, #333399 1.64%, #282878 84.55%);
+  --tide-booking-color-primary-fade: #ebebf8;
+  --tide-booking-color-primary-extra-fade: #f8f8fd;
+  --tide-booking-color-primary-light: #cdcdee;
+  --tide-booking-color-primary-dark: #282878;
+  --tide-booking-color-secondary: #1f9470;
+  --tide-booking-color-secondary-light: #11b684;
+  --tide-booking-color-star: #ecb911;
+  // --tide-booking-invalid: #e74c3c;
+  --tide-booking-invalid: #871d11;
+  --tide-booking-invalid-light: #fce8e6;
+  --tide-booking-invalid-dark: #871d11;
+  --tide-booking-price-increase: #e81212;
+  --tide-booking-price-decrease: #19a364;
+  --tide-booking-white: #ffffff;
+  --tide-booking-gray-light: #f5f5f5;
+  --tide-booking-gray-xlight: #fbfbfb;
+  --tide-booking-gray--medium-light: #efefef;
+  --tide-booking-gray-background-light: #e2e2e2;
+  --tide-booking-gray-border-light: #f3f3f3;
+  --tide-booking-gray-checkbox-bg: #bdbdbd;
+  --tide-booking-gray-medium: #cbcbcb;
+  --tide-booking-gray-dark: #666666;
+  --tide-booking-black: #0a0a0a;
+  --tide-booking-transparent: transparent;
+  // BACKGROUNDS
+  --tide-booking-bg: #fafafa;
+  // TYPOGRAPHY
+  --tide-booking-font-heading: 'Outfit', serif;
+  --tide-booking-font-body: 'Outfit', serif;
+  --tide-booking-font-handwritten: 'Outfit', serif;
+  --tide-booking-font-size-body: 16px;
+  --tide-booking-font-size-body-lg: 18px;
+  --tide-booking-line-height-body: 1;
+  // GRID
+  --tide-booking-container-wide: 1690px;
+  --tide-booking-container-medium: 1200px;
+  --tide-booking-container-small: 900px;
+  --tide-booking-container-article: 650px;
+  --tide-booking-gutter: 15px;
+  // MEDIA QUERIES
+  --tide-booking-screen-xs: 576px;
+  --tide-booking-screen-sm: 768px;
+  --tide-booking-screen-md: 992px;
+  --tide-booking-screen-lg: 1200px;
+  --tide-booking-screen-xl: 1650px;
+  --tide-booking-screen-xxl: 1920px;
+  //HEADINGS
+  --tide-booking-heading-color: var(--tide-booking-black);
+  //h1
+  --tide-booking-h1: 32.5px;
+  --tide-booking-h1-sm: 48px;
+  --tide-booking-h1-xl: 48px;
+  //h2
+  --tide-booking-h2: 24px;
+  --tide-booking-h2-sm: 30px;
+  --tide-booking-h2-xl: 30px;
+  //h3
+  --tide-booking-h3: 22px;
+  --tide-booking-h3-sm: 25px;
+  --tide-booking-h3-xl: 25px;
+  //h4
+  --tide-booking-h4: 18px;
+  --tide-booking-h4-sm: 23px;
+  --tide-booking-h4-xl: 23px;
+  //h5
+  --tide-booking-h5: 18px;
+  --tide-booking-h5-xl: 20px;
+  //h6
+  --tide-booking-h6: 16px;
+  --tide-booking-h6-md: 18px;
+  //a
+  --tide-booking-a-color: var(--tide-booking-color-primary);
+  --tide-booking-a-text-decoration: underline;
+  --tide-booking-a-color-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-a-text-decoration-hover: underline;
+  --tide-booking-a-color-focus: var(--tide-booking-color-primary-dark);
+  --tide-booking-a-text-decoration-focus: underline;
+  //TOGGLE-SWITCH
+  --tide-booking-toggle-switch-background: var(--tide-booking-gray-medium);
+  --tide-booking-toggle-switch-border-radius: 5px;
+  --tide-booking-toggle-switch-after-color: var(--tide-booking-white);
+  //TOGGLE-SWITCH--TOGGLED
+  --tide-booking-toggle-switch-background-toggled: var(--tide-booking-color-primary);
+  //FORM--INPUT
+  --tide-booking-form-input-background: var(--tide-booking-gray-xlight);
+  --tide-booking-form-input-border: 1.5px solid var(--tide-booking-gray--medium-light);
+  --tide-booking-form-input-border-radius: 5px;
+  --tide-booking-form-input-height: 45px;
+  //FORM--INPUT--FOCUS/ACTIVE
+  --tide-booking-form-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
+  //FORM--INPUT--PLACEHOLDER
+  --tide-booking-form-input-placeholder-color: var(--tide-booking-gray-dark);
+  --tide-booking-form-input-placeholder-font-style: normal;
+  //INPUT--LABEL
+  --tide-booking-input-label-color: var(--tide-booking-gray-dark);
+  --tide-booking-input-label-font-size: 14px;
+  --tide-booking-input-label-font-weight: 400;
+  --tide-booking-input-label-font-style: normal;
+  //RADIOBUTTON
+  --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
+  --tide-booking-radiobutton-background: var(--tide-booking-white);
+  --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
+  --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
+  --tide-booking-radiobutton-font-size: 16px;
+  --tide-booking-radiobutton-font-weight: 400;
+  //RADIOBUTTON--INPUT--CHECKED
+  --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
+  --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
+  --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
+  //CHECKBOX--INPUT--CHECKED--AFTER
+  --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
+  //CHECKBOX
+  --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
+  --tide-booking-checkbox-border-radius: 0px;
+  --tide-booking-checkbox-background: var(--tide-booking-white);
+  --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
+  --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
+  --tide-booking-checkbox-font-size: 16px;
+  --tide-booking-checkbox-font-weight: 400;
+  //CHECKBOX--INPUT--CHECKED
+  --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
+  --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
+  --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
+  --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
+  //SLIDER
+  --tide-booking-slider-track-background: var(--tide-booking-color-primary);
+  --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
+  --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
+  --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
+  //BOOKING PRODUCT
+  --tide-booking-component-background: var(--tide-booking-bg);
+  --tide-booking-component-radius: 10px;
+  --tide-booking-component-border: 1.5px solid var(--tide-booking-color-primary-fade);
+  //HEADER
+  --tide-booking-component-header-background: var(--tide-booking-color-primary-gradient);
+  --tide-booking-component-header-color: var(--tide-booking-white);
+  --tide-booking-component-header-border-radius: 10px 10px 0px 0px;
+  --tide-booking-component-header-star-rating: var(--tide-booking-color-star);
+  --tide-booking-component-header-title-color: var(--tide-booking-white);
+  --tide-booking-component-header-title-font: var(--tide-booking-font-heading);
+  --tide-booking-component-header-icon-color: var(--tide-booking-white);
+  //price header
+  --tide-booking-component-header-price-font-family: var(--tide-booking-font-body);
+  --tide-booking-component-header-price-font-size--mobile: 25px;
+  --tide-booking-component-header-price-font-size--desktop: 36px;
+  --tide-booking-component-header-price-font-weight: 400;
+  --tide-booking-component-header-price-color: var(--tide-booking-white);
+  //small fontsize
+  --tide-booking-small-font-size--mobile: 13px;
+  --tide-booking-small-font-size--desktop: 15px;
+  //CTA
+  --tide-booking-cta-height: 40px;
+  --tide-booking-cta-height-xs: 45px;
+  --tide-booking-cta-width: 100%;
+  --tide-booking-cta-width-xs: auto;
+  --tide-booking-cta-padding: 10px 20px;
+  --tide-booking-cta-color: var(--tide-booking-white);
+  --tide-booking-cta-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
+  --tide-booking-cta-font-family: var(--tide-booking-font-body);
+  --tide-booking-cta-font-size: 16px;
+  --tide-booking-cta-font-size-xs: 18px;
+  --tide-booking-cta-font-weight: 400;
+  --tide-booking-cta-text-decoration: none;
+  --tide-booking-cta-border: none;
+  --tide-booking-cta-border-radius: 5px;
+  //CTA__ICON
+  --tide-booking-cta-icon-color: var(--tide-booking-white);
+  --tide-booking-cta-icon-size: 16px;
+  //CTA__HOVER
+  --tide-booking-cta-background-hover: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
+  --tide-booking-cta-color-hover: var(--tide-booking-white);
+  --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
+  --tide-booking-cta-border-hover: none;
+  --tide-booking-cta-text-decoration-hover: none;
+  //CTA__FOCUS
+  --tide-booking-cta-background-focus: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
+  --tide-booking-cta-color-focus: var(--tide-booking-white);
+  --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
+  --tide-booking-cta-border-focus: none;
+  --tide-booking-cta-text-decoration-focus: none;
+  //CTA--SECONDARY
+  --tide-booking-cta-height-secondary: 40px;
+  --tide-booking-cta-height-xs-secondary: 45px;
+  --tide-booking-cta-width-secondary: auto;
+  --tide-booking-cta-padding-secondary: 10px 20px;
+  --tide-booking-cta-margin-secondary: 0px 0 0 0;
+  --tide-booking-cta-background-secondary: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
+  --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
+  --tide-booking-cta-border-secondary: none;
+  --tide-booking-cta-border-radius-secondary: 5px;
+  --tide-booking-cta-text-decoration-secondary: none;
+  --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
+  --tide-booking-cta-font-size-secondary: 16px;
+  --tide-booking-cta-font-size-xs-secondary: 18px;
+  --tide-booking-cta-font-weight-secondary: 400;
+  //CTA--SECONDARY__ICON
+  --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
+  --tide-booking-cta-icon-size-secondary: 16px;
+  //CTA--SECONDARY__HOVER
+  --tide-booking-cta-background-secondary-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
+  --tide-booking-cta-color-secondary-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-cta-border-secondary-hover: none;
+  --tide-booking-cta-text-decoration-secondary-hover: none;
+  //CTA--SECONDARY__FOCUS
+  --tide-booking-cta-background-secondary-focus: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
+  --tide-booking-cta-color-secondary-focus: var(--tide-booking-color-primary-dark);
+  --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-color-primary-dark);
+  --tide-booking-cta-border-secondary-focus: none;
+  --tide-booking-cta-text-decoration-secondary-focus: none;
+  //CTA--SELECT
+  --tide-booking-cta-background-select: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
+  --tide-booking-cta-color-select: var(--tide-booking-color-primary);
+  --tide-booking-cta-border-select: none;
+  --tide-booking-cta-border-radius-select: 5px;
+  //CTA--SELECT--HOVER/FOCUS/ACTIVE
+  --tide-booking-cta-background-select-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
+  --tide-booking-cta-color-select-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-cta-border-select-hover: none;
+  //CTA--SELECTED
+  --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
+  --tide-booking-cta-color-selected: var(--tide-booking-white);
+  --tide-booking-cta-border-selected: none;
+  --tide-booking-cta-border-radius-selected: 5px;
+  --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
+  //DROPDOWN
+  --tide-booking-dropdown-background: var(--tide-booking-white);
+  --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-color-primary-light);
+  --tide-booking-dropdown-border-radius: 5px;
+  --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
+  --tide-booking-dropdown-height: 45px;
+  --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary-light);
+  --tide-booking-dropdown-arrow-color: var(--tide-booking-color-primary);
+  --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
+  --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
+  //SPINNER
+  --tide-booking-spinner-border: 5px solid var(--tide-booking-color-primary);
+  --tide-booking-spinner-border-top-color: #dce1ff;
+  --tide-booking-spinner-background: var(--tide-booking-white);
+  --tide-booking-spinner-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+  //ANIMATION
+  --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
+  //BOOKING-WIZARD
+  --tide-booking-wizard-background: var(--tide-booking-bg);
+  --tide-booking-wizard-title-color: var(--tide-booking-black);
+  --tide-booking-wizard-heading-color: var(--tide-booking-black);
+  //BOOKING-WIZARD--GENERAL-STEP-COMPONENTS
+  --tide-booking-step-card-background: var(--tide-booking-white);
+  --tide-booking-step-card-border: 1.5px solid var(--tide-booking-gray-border-light);
+  --tide-booking-step-card-border-radius: 10px;
+  --tide-booking-step-toggle-btn-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
+  --tide-booking-step-toggle-btn-border: none;
+  --tide-booking-step-toggle-btn-border-radius: 5px;
+  --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
+  //HOVER,FOCUS
+  --tide-booking-step-toggle-btn-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
+  --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-step-toggle-btn-border-hover: none;
+  //STEP-INDICATORS
+  --tide-booking-step-indicators-line-trough: 2px dashed var(--tide-booking-gray-medium);
+  --tide-booking-step-indicators-icon-color: var(--tide-booking-black);
+  --tide-booking-step-indicators-icon-background: var(--tide-booking-white);
+  --tide-booking-step-indicators-icon-border: 1px solid var(--tide-booking-gray-border-light);
+  --tide-booking-step-indicators-icon-border-radius: 50%;
+  --tide-booking-step-indicators-icon-font-family: var(--tide-booking-font-heading);
+  --tide-booking-step-indicators-icon-font-size: 16px;
+  --tide-booking-step-indicators-icon-font-weight: 400;
+  --tide-booking-step-indicators-icon-color-text: var(--tide-booking-black);
+  //STEP-INDICATORS--ACTIVE
+  --tide-booking-step-indicators-icon-color-active: var(--tide-booking-white);
+  --tide-booking-step-indicators-icon-background-active: var(--tide-booking-color-primary);
+  --tide-booking-step-indicators-icon-border-active: 1px solid var(--tide-booking-color-primary);
+  --tide-booking-step-indicators-icon-check-color-active: var(--tide-booking-white);
+  --tide-booking-step-indicators-icon-color-text-active: var(--tide-booking-color-primary);
+  //STEP-INDICATORS--COMPLETED
+  --tide-booking-step-indicators-icon-color-completed: var(--tide-booking-white);
+  --tide-booking-step-indicators-icon-background-completed: var(--tide-booking-color-primary);
+  --tide-booking-step-indicators-icon-border-completed: 1px solid var(--tide-booking-color-primary);
+  --tide-booking-step-indicators-icon-check-color-completed: var(--tide-booking-white);
+  --tide-booking-step-indicators-icon-color-text-completed: var(--tide-booking-transparent);
+  //SIDEBAR
+  --tide-booking-sidebar-frame-radius: 10px;
+  //SIDEBAR--HEADER
+  --tide-booking-sidebar-header-background: var(--tide-booking-color-primary-gradient);
+  --tide-booking-sidebar-header-color: var(--tide-booking-white);
+  --tide-booking-sidebar-header-font-family: var(--tide-booking-font-heading);
+  --tide-booking-sidebar-header-font-size: 20px;
+  --tide-booking-sidebar-header-font-weight: 400;
+  --tide-booking-sidebar-header-border-radius: 10px 10px 0px 0px;
+  //MOBILE--TOGGLE
+  --tide-booking-sidebar-btn-toggle-background: rgba(255, 255, 255, 0.2);
+  --tide-booking-sidebar-btn-toggle-color: var(--tide-booking-white);
+  --tide-booking-sidebar-btn-toggle-border: none;
+  --tide-booking-sidebar-btn-toggle-border-radius: 5px;
+  //SIDEBAR--BODY
+  --tide-booking-sidebar-body-background: var(--tide-booking-white);
+  --tide-booking-sidebar-body-border: 1.5px solid var(--tide-booking-gray-border-light);
+  --tide-booking-sidebar-body-border-radius: 5px;
+  --tide-booking-sidebar-body-font-family: var(--tide-booking-font-body);
+  --tide-booking-sidebar-body-font-size: 16px;
+  --tide-booking-sidebar-body-font-weight: 400;
+  --tide-booking-sidebar-body-color: var(--tide-booking-gray-dark);
+  --tide-booking-sidebar-body-label-color: var(--tide-booking-black);
+  --tide-booking-sidebar-body-label-font-size: 16px;
+  --tide-booking-sidebar-body-label-font-weight: 400;
+  --tide-booking-sidebar-body-title-color: var(--tide-booking-black);
+  --tide-booking-sidebar-body-title-font-size: 18px;
+  --tide-booking-sidebar-body-title-font-family: var(--tide-booking-font-heading);
+  --tide-booking-sidebar-body-title-font-weight: 600;
+  --tide-booking-sidebar-body-flight-font-weight: 600;
+  --tide-booking-sidebar-body-flight-color: var(--tide-booking-gray-dark);
+  //SIDEBAR--FOOTER
+  --tide-booking-sidebar-footer-background: var(--tide-booking-white);
+  --tide-booking-sidebar-footer-border: 1.5px solid var(--tide-booking-gray-border-light);
+  --tide-booking-sidebar-footer-border-radius: 0px 0px 10px 10px;
+  --tide-booking-sidebar-footer-advance-font-size: 18px;
+  --tide-booking-sidebar-footer-advance-font-weight: 400;
+  --tide-booking-sidebar-footer-advance-color: var(--tide-booking-gray-medium);
+  --tide-booking-sidebar-footer-total-font-size: 20px;
+  --tide-booking-sidebar-footer-total-font-weight: 600;
+  --tide-booking-sidebar-footer-total-color: var(--tide-booking-color-primary);
+  --tide-booking-sidebar-footer-small-font-size: 14px;
+  --tide-booking-sidebar-footer-small-font-weight: 400;
+  --tide-booking-sidebar-footer-small-color: var(--tide-booking-gray-medium);
+  --tide-booking-sidebar-footer-small-strong-color: var(--tide-booking-gray-dark);
+  //STEP-1--FLIGHT-OPTIONS
+  --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
+  --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
+  --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
+  --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
+  --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
+  --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
+  --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
+  --tide-booking-flight-options-times-title-font-weight: 700;
+  --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
+  --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
+  --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
+  --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
+  --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
+  --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
+  --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
+  --tide-booking-flight-options-detail-card-background: var(--tide-booking-color-primary-extra-fade);
+  --tide-booking-flight-options-detail-card-border: none;
+  --tide-booking-flight-options-detail-card-border-radius: 10px;
+  --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
+  --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
+  --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
+  --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
+  //HOVER,FOCUS
+  --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
+  --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
+  --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
+  //FLIGHT-OPTIONS--FILTER
+  --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
+  --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
+  //FLIGHT-OPTIONS--FILTER--BTN
+  --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
+  --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
+  --tide-booking-flight-options-filter-btn-border: 1.5px solid var(--tide-booking-color-primary);
+  --tide-booking-flight-options-filter-btn-border-radius: 5px;
+  --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
+  --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
+  --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
+  --tide-booking-flight-options-filter-btn-hover-border: 1.5px solid var(--tide-booking-transparent);
+  --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
+  //FLIGHT-OPTIONS--FILTER--HEADER
+  --tide-booking-flight-options-filter-header-text-color: var(--tide-booking-gray-dark);
+  --tide-booking-flight-options-filter-header-text-font-weight: 300;
+  --tide-booking-flight-options-filter-header-text-strong-color: var(--tide-booking-color-secondary);
+  --tide-booking-flight-options-filter-header-text-strong-font-weight: 600;
+  --tide-booking-flight-options-filter-header-close-icon-color: var(--tide-booking-color-primary);
+  //FLIGHT-OPTIONS--FILTER--GROUP-TITLE
+  --tide-booking-flight-options-filter-group-title-text-color: var(--tide-booking-gray-dark);
+  --tide-booking-flight-options-filter-group-title-text-font-weight: 500;
+  --tide-booking-flight-options-filter-group-title-text-font-family: var(--tide-booking-font-body);
+  --tide-booking-flight-options-filter-group-title-text-border: 1.5px solid var(--tide-booking-gray-border-light);
+  --tide-booking-flight-options-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
+  --tide-booking-flight-options-filter-group-title-subtext-font-weight: 400;
+  --tide-booking-flight-options-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
+  //STEP-2--ROOM-OPTIONS
+  --tide-booking-room-options-card-background: var(--tide-booking-step-card-background);
+  --tide-booking-room-options-card-border: var(--tide-booking-step-card-border);
+  --tide-booking-room-options-card-border-radius: var(--tide-booking-step-card-border-radius);
+  --tide-booking-room-options-image-border-radius: 10px;
+  --tide-booking-room-options-usp-list-color: var(--tide-booking-gray-dark);
+  --tide-booking-room-options-usp-list-font-weight: 400;
+  --tide-booking-room-options-usp-list-icon-color: var(--tide-booking-color-primary);
+  --tide-booking-room-options-title-color: var(--tide-booking-black);
+  --tide-booking-room-options-title-font-family: var(--tide-booking-font-heading);
+  --tide-booking-room-options-title-font-weight: 500;
+  --tide-booking-room-options-dropdown-select-border: var(--tide-booking-dropdown-border);
+  --tide-booking-room-options-dropdown-select-border-radius: var(--tide-booking-dropdown-border-radius);
+  --tide-booking-room-options-dropdown-select-font-family: var(--tide-booking-dropdown-font-family);
+  --tide-booking-room-options-dropdown-select-color: var(--tide-booking-dropdown-color);
+  --tide-booking-room-options-dropdown-select-background: var(--tide-booking-dropdown-background);
+  --tide-booking-room-options-dropdown-select-border-focus: var(--tide-booking-dropdown-border-focus);
+  --tide-booking-room-options-dropdown-select-icon-color: var(--tide-booking-dropdown-arrow-color);
+  //ALTERNATIVE--ROOM-OPTIONS
+  --tide-booking-room-options-alternative-btn-color: var(--tide-booking-color-secondary);
+  --tide-booking-room-options-alternative-btn-text-decoration: underline;
+  //ALTERNATIVE--ROOM-OPTIONS--HOVER
+  --tide-booking-room-options-alternative-btn-color-hover: var(--tide-booking-color-secondary-light);
+  --tide-booking-room-options-alternative-btn-text-decoration-hover: none;
+  //ALTERNATIVE--ROOM-OPTIONS--HEADER
+  --tide-booking-room-options-alternative-header-color: var(--tide-booking-black);
+  //STEP-3 EXTA-OPTIONS
+  --tide-booking-extra-options-card-background: var(--tide-booking-step-card-background);
+  --tide-booking-extra-options-card-border: var(--tide-booking-step-card-border);
+  --tide-booking-extra-options-card-border-radius: var(--tide-booking-step-card-border-radius);
+  --tide-booking-extra-options-card-title-color: var(--tide-booking-black);
+  //TAG
+  --tide-booking-tag-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
+  --tide-booking-tag-border: none;
+  --tide-booking-tag-border-radius: 0 5px 5px 0;
+  --tide-booking-tag-color: var(--tide-booking-white);
+  --tide-booking-tag-font-family: var(--tide-booking-font-body);
+  --tide-booking-tag-font-weight: 400;
+  //INPUT--SELECTED
+  --tide-booking-input-selected-background: #667dff10;
+  --tide-booking-input-selected-border: none;
+  --tide-booking-input-selected-border-radius: 5px;
+  --tide-booking-input-selected-color: var(--tide-booking-color-primary);
+  //TOGGLE
+  --tide-booking-flight-extra-options-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
+  --tide-booking-flight-extra-options-toggle-background: var(--tide-booking-step-toggle-btn-background);
+  --tide-booking-flight-extra-options-toggle-border: var(--tide-booking-step-toggle-btn-border);
+  --tide-booking-flight-extra-options-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
+  //HOVER,FOCUS
+  --tide-booking-flight-extra-options-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
+  --tide-booking-flight-extra-options-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
+  --tide-booking-flight-extra-options-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
+  //STEP-4--FORM
+  --tide-booking-form-card-background: var(--tide-booking-step-card-background);
+  --tide-booking-form-card-border: var(--tide-booking-step-card-border);
+  --tide-booking-form-card-border-radius: var(--tide-booking-step-card-border-radius);
+  //GROUP--BORDER
+  --tide-booking-form-group-border: 1.5px solid var(--tide-booking-color-primary-fade);
+  //LABEL
+  --tide-booking-form-label-color: var(--tide-booking-gray-dark);
+  --tide-booking-form-label-font-family: var(--tide-booking-font-body);
+  --tide-booking-form-label-font-weight: 300;
+  //TYPEAHEAD--AGENT
+  --tide-booking-form-typeahead-agent-background: var(--tide-booking-gray-xlight);
+  --tide-booking-form-typeahead-agent-border: 1.5px solid var(--tide-booking-gray--medium-light);
+  --tide-booking-form-typeahead-agent-border-radius: 5px;
+  --tide-booking-form-typeahead-agent-color: var(--tide-booking-black);
+  --tide-booking-form-typeahead-agent-font-family: var(--tide-booking-font-body);
+  --tide-booking-form-typeahead-agent-icon-color: var(--tide-booking-black);
+  --tide-booking-form-typeahead-agent-clear-icon-color: var(--tide-booking-color-primary);
+  --tide-booking-form-typeahead-agent-placeholder-color: var(--tide-booking-gray-medium);
+  --tide-booking-form-typeahead-agent-placeholder-font-family: var(--tide-booking-font-body);
+  //TYPEAHEAD--AGENT--HOVER/FOCUS
+  --tide-booking-form-typeahead-agent-background-hover: var(--tide-booking-white);
+  --tide-booking-form-typeahead-agent-border-hover: 1.5px solid var(--tide-booking-color-primary);
+  --tide-booking-form-typeahead-agent-color-hover: var(--tide-booking-black);
+  --tide-booking-form-typeahead-agent-icon-color-hover: var(--tide-booking-color-primary);
+  //TYPEAHEAD--AGENT--OPTIONS
+  --tide-booking-form-typeahead-agent-options-background: var(--tide-booking-white);
+  --tide-booking-form-typeahead-agent-options-border: 1.5px solid var(--tide-booking-gray-border-light);
+  --tide-booking-form-typeahead-agent-options-border-radius: 5px;
+  --tide-booking-form-typeahead-agent-options-color: var(--tide-booking-gray-dark);
+  //TYPEAHEAD--AGENT--OPTIONS--HOVER
+  --tide-booking-form-typeahead-agent-options-background-hover: var(--tide-booking-gray-border-light);
+  --tide-booking-form-typeahead-agent-options-color-hover: var(--tide-booking-black);
+  //TYPEAHEAD--AGENT--OPTIONS--HIGHLIGHT
+  --tide-booking-form-typeahead-agent-options-color-highlight: var(--tide-booking-black);
+  --tide-booking-form-typeahead-agent-options-font-weight-highlight: 600;
+  //STEP-5--OVERVIEW
+  --tide-booking-form-summary-background: var(--tide-booking-step-card-background);
+  --tide-booking-form-summary-border: var(--tide-booking-step-card-border);
+  --tide-booking-form-summary-border-radius: var(--tide-booking-step-card-border-radius);
+  //VOUCHER--REMOVE-BTN
+  --tide-booking-form-summary-voucher-remove-btn-background: var(--tide-booking-transparent);
+  --tide-booking-form-summary-voucher-remove-btn-color: var(--tide-booking-color-primary);
+  --tide-booking-form-summary-voucher-remove-btn-border: none;
+  --tide-booking-form-summary-voucher-remove-btn-border-radius: 5px;
+  //VOUCHER--REMOVE-BTN--HOVER
+  --tide-booking-form-summary-voucher-remove-btn-background-hover: var(--tide-booking-transparent);
+  --tide-booking-form-summary-voucher-remove-btn-color-hover: var(--tide-booking-color-primary-dark);
+  --tide-booking-form-summary-voucher-remove-btn-border-hover: none;
+  //STEP-6--CONFIRMATION
+  --tide-booking-confirmation-background: var(--tide-booking-step-card-background);
+  --tide-booking-confirmation-border: var(--tide-booking-step-card-border);
+  --tide-booking-confirmation-border-radius: var(--tide-booking-step-card-border-radius);
+  --tide-booking-confirmation-icon-color: var(--tide-booking-color-secondary);
+}