@qite/tide-components 1.0.9 → 1.0.10

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 (75) hide show
  1. package/build/build-cjs/index.js +290 -280
  2. package/build/build-cjs/src/search-results/types.d.ts +12 -0
  3. package/build/build-esm/index.js +290 -280
  4. package/build/build-esm/src/search-results/types.d.ts +12 -0
  5. package/package.json +2 -2
  6. package/styles/abstracts/_mixins.scss +74 -74
  7. package/styles/abstracts/_variables.scss +57 -57
  8. package/styles/base/_fonts.scss +2 -2
  9. package/styles/base/_normalize.scss +227 -227
  10. package/styles/base/_typography.scss +35 -35
  11. package/styles/booking-joker-variables.scss +596 -596
  12. package/styles/booking-product-variables.scss +330 -330
  13. package/styles/booking-product.scss +438 -438
  14. package/styles/booking-qsm-variables.scss +501 -501
  15. package/styles/booking-qsm.scss +52 -52
  16. package/styles/booking-search-results-variables.scss +734 -734
  17. package/styles/booking-search-results.scss +53 -53
  18. package/styles/booking-wizard-variables.scss +603 -603
  19. package/styles/booking-wizard.scss +61 -61
  20. package/styles/components/_accordion.scss +67 -67
  21. package/styles/components/_animations.scss +39 -39
  22. package/styles/components/_base.scss +107 -107
  23. package/styles/components/_booking.scss +906 -906
  24. package/styles/components/_breadcrumb.scss +92 -92
  25. package/styles/components/_button.scss +238 -238
  26. package/styles/components/_checkbox.scss +230 -230
  27. package/styles/components/_contact.scss +255 -255
  28. package/styles/components/_content.scss +336 -336
  29. package/styles/components/_cta.scss +238 -238
  30. package/styles/components/_date-list.scss +41 -41
  31. package/styles/components/_date-range-picker.scss +223 -223
  32. package/styles/components/_decrement-increment.scss +35 -35
  33. package/styles/components/_dropdown.scss +77 -77
  34. package/styles/components/_error.scss +50 -50
  35. package/styles/components/_faq.scss +30 -30
  36. package/styles/components/_flight-option.scss +1432 -1432
  37. package/styles/components/_flyin.scss +830 -830
  38. package/styles/components/_footer.scss +135 -135
  39. package/styles/components/_form.scss +1693 -1693
  40. package/styles/components/_gallery.scss +317 -317
  41. package/styles/components/_header.scss +113 -113
  42. package/styles/components/_image-with-text.scss +206 -206
  43. package/styles/components/_img-slider.scss +175 -175
  44. package/styles/components/_info-message.scss +75 -75
  45. package/styles/components/_input.scss +35 -35
  46. package/styles/components/_list.scss +185 -185
  47. package/styles/components/_loader.scss +152 -152
  48. package/styles/components/_login.scss +140 -140
  49. package/styles/components/_map-view.scss +1100 -1100
  50. package/styles/components/_mixins.scss +579 -579
  51. package/styles/components/_navbar.scss +765 -765
  52. package/styles/components/_passenger-picker.scss +306 -306
  53. package/styles/components/_phone-input.scss +8 -8
  54. package/styles/components/_placeholders.scss +165 -165
  55. package/styles/components/_pricing-summary.scss +163 -163
  56. package/styles/components/_qsm.scss +17 -17
  57. package/styles/components/_radiobutton.scss +170 -170
  58. package/styles/components/_search.scss +2197 -2197
  59. package/styles/components/_select-wrapper.scss +81 -81
  60. package/styles/components/_slider.scss +128 -128
  61. package/styles/components/_spinner.scss +29 -29
  62. package/styles/components/_step-indicators.scss +187 -187
  63. package/styles/components/_table.scss +81 -81
  64. package/styles/components/_tide-form.scss +578 -578
  65. package/styles/components/_tree.scss +648 -648
  66. package/styles/components/_typeahead.scss +275 -275
  67. package/styles/components/_variables.scss +89 -89
  68. package/styles/content-blocks-variables.scss +543 -543
  69. package/styles/content-blocks.scss +66 -66
  70. package/styles/font.scss +2 -2
  71. package/styles/qsm/_calendar.scss +274 -274
  72. package/styles/qsm/_qsm.scss +1097 -1097
  73. package/styles/search.scss +1200 -1200
  74. package/styles/tide-form-variables.scss +275 -275
  75. package/styles/tide-form.scss +56 -56
package/styles/booking-joker-variables.scss CHANGED
@@ -1,596 +1,596 @@
1
- :root {
2
- // COLOR ASSIGNMENTS
3
- --tide-booking-color-primary: #2b5d2e;
4
- --tide-booking-color-primary-gradient: #2b5d2e;
5
- --tide-booking-color-primary-fade: #e3f1f2;
6
- --tide-booking-color-primary-extra-fade: #f8f8fd;
7
- --tide-booking-color-primary-light: #cdcdee;
8
- --tide-booking-color-primary-dark: #2c4a28;
9
- --tide-booking-color-secondary: #9fb5a0;
10
- --tide-booking-color-secondary-light: #dae2db;
11
-
12
- --tide-booking-color-star: #ecb911;
13
- --tide-booking-link-green-color: #367c5b;
14
- // --tide-booking-invalid: #e74c3c;
15
- --tide-booking-invalid: #dc4d28;
16
- --tide-booking-invalid-light: #ffe1d9;
17
- --tide-booking-invalid-dark: #dc4d28;
18
- --tide-booking-price-increase: #dc4d28;
19
- --tide-booking-price-decrease: #367c5b;
20
-
21
- --tide-booking-white: #ffffff;
22
- --tide-booking-gray-light: #f5f5f5;
23
- --tide-booking-gray-xlight: #fbfbfb;
24
- --tide-booking-gray--medium-light: #efefef;
25
- --tide-booking-gray-background-light: #e2e2e2;
26
- --tide-booking-gray-border-light: #f3f3f3;
27
- --tide-booking-gray-checkbox-bg: #bdbdbd;
28
- --tide-booking-gray-medium: #cbcbcb;
29
- --tide-booking-gray-dark: #666666;
30
- --tide-booking-black: #333333;
31
- --tide-booking-transparent: transparent;
32
-
33
- // BACKGROUNDS
34
- --tide-booking-bg: #f4f8f7;
35
-
36
- // TYPOGRAPHY
37
- --tide-booking-font-heading: museo-sans, sans-serif;
38
- --tide-booking-font-body: museo-sans, sans-serif;
39
- --tide-booking-font-handwritten: museo-sans, sans-serif;
40
-
41
- --tide-booking-font-size-body: 15px;
42
- --tide-booking-font-size-body-lg: 18px;
43
- --tide-booking-line-height-body: 1;
44
-
45
- // GRID
46
- --tide-booking-container-wide: 1690px;
47
- --tide-booking-container-medium: 1200px;
48
- --tide-booking-container-small: 900px;
49
- --tide-booking-container-article: 650px;
50
- --tide-booking-gutter: 15px;
51
-
52
- // MEDIA QUERIES
53
- --tide-booking-screen-xs: 576px;
54
- --tide-booking-screen-sm: 768px;
55
- --tide-booking-screen-md: 992px;
56
- --tide-booking-screen-lg: 1200px;
57
- --tide-booking-screen-xl: 1650px;
58
- --tide-booking-screen-xxl: 1920px;
59
-
60
- //HEADINGS
61
- --tide-booking-heading-color: var(--tide-booking-black);
62
-
63
- //h1
64
- --tide-booking-h1: 32.5px;
65
- --tide-booking-h1-sm: 48px;
66
- --tide-booking-h1-xl: 48px;
67
-
68
- //h2
69
- --tide-booking-h2: 24px;
70
- --tide-booking-h2-sm: 30px;
71
- --tide-booking-h2-xl: 30px;
72
-
73
- //h3
74
- --tide-booking-h3: 22px;
75
- --tide-booking-h3-sm: 25px;
76
- --tide-booking-h3-xl: 25px;
77
-
78
- //h4
79
- --tide-booking-h4: 18px;
80
- --tide-booking-h4-sm: 23px;
81
- --tide-booking-h4-xl: 23px;
82
-
83
- //h5
84
- --tide-booking-h5: 18px;
85
- --tide-booking-h5-xl: 20px;
86
-
87
- //h6
88
- --tide-booking-h6: 16px;
89
- --tide-booking-h6-md: 18px;
90
-
91
- //a
92
- --tide-booking-a-color: var(--tide-booking-link-green-color);
93
- --tide-booking-a-text-decoration: underline;
94
- --tide-booking-a-color-hover: var(--tide-booking-color-primary);
95
- --tide-booking-a-text-decoration-hover: underline;
96
- --tide-booking-a-color-focus: var(--tide-booking-color-primary);
97
- --tide-booking-a-text-decoration-focus: underline;
98
-
99
- //TOGGLE-SWITCH
100
- --tide-booking-toggle-switch-background: var(--tide-booking-gray-medium);
101
- --tide-booking-toggle-switch-border-radius: 5px;
102
- --tide-booking-toggle-switch-after-color: var(--tide-booking-white);
103
-
104
- //TOGGLE-SWITCH--TOGGLED
105
- --tide-booking-toggle-switch-background-toggled: var(--tide-booking-color-primary);
106
-
107
- //FORM--INPUT
108
- --tide-booking-form-input-background: var(--tide-booking-gray-xlight);
109
- --tide-booking-form-input-border: 1.5px solid var(--tide-booking-color-primary-fade);
110
- --tide-booking-form-input-border-radius: 5px;
111
-
112
- //FORM--INPUT--FOCUS/ACTIVE
113
- --tide-booking-form-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
114
-
115
- //FORM--INPUT--PLACEHOLDER
116
- --tide-booking-form-input-placeholder-color: var(--tide-booking-gray-dark);
117
- --tide-booking-form-input-placeholder-font-style: normal;
118
-
119
- //RADIOBUTTON
120
- --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
121
- --tide-booking-radiobutton-background: var(--tide-booking-white);
122
- --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
123
- --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
124
- --tide-booking-radiobutton-font-size: 16px;
125
- --tide-booking-radiobutton-font-weight: 400;
126
-
127
- //RADIOBUTTON--INPUT--CHECKED
128
- --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
129
- --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
130
- --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
131
-
132
- //CHECKBOX--INPUT--CHECKED--AFTER
133
- --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
134
-
135
- //CHECKBOX
136
- --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-color-primary-fade);
137
- --tide-booking-checkbox-border-radius: 0px;
138
- --tide-booking-checkbox-background: var(--tide-booking-white);
139
- --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
140
- --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
141
- --tide-booking-checkbox-font-size: 16px;
142
- --tide-booking-checkbox-font-weight: 400;
143
-
144
- //CHECKBOX--INPUT--CHECKED
145
- --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
146
- --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
147
- --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
148
- --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
149
-
150
- //SLIDER
151
- --tide-booking-slider-track-background: var(--tide-booking-color-primary);
152
- --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
153
- --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
154
- --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
155
-
156
- //BOOKING PRODUCT
157
- --tide-booking-component-background: var(--tide-booking-bg);
158
- --tide-booking-component-radius: 10px;
159
- --tide-booking-component-border: 1.5px solid var(--tide-booking-color-primary-fade);
160
-
161
- //HEADER
162
- --tide-booking-component-header-background: var(--tide-booking-color-primary-gradient);
163
- --tide-booking-component-header-color: var(--tide-booking-white);
164
- --tide-booking-component-header-border-radius: 10px 10px 0px 0px;
165
-
166
- --tide-booking-component-header-star-rating: var(--tide-booking-color-star);
167
- --tide-booking-component-header-title-color: var(--tide-booking-white);
168
- --tide-booking-component-header-title-font: var(--tide-booking-font-heading);
169
- --tide-booking-component-header-icon-color: var(--tide-booking-white);
170
-
171
- //price header
172
- --tide-booking-component-header-price-font-family: var(--tide-booking-font-body);
173
- --tide-booking-component-header-price-font-size--mobile: 25px;
174
- --tide-booking-component-header-price-font-size--desktop: 36px;
175
- --tide-booking-component-header-price-font-weight: 400;
176
- --tide-booking-component-header-price-color: var(--tide-booking-white);
177
-
178
- //small fontsize
179
- --tide-booking-small-font-size--mobile: 13px;
180
- --tide-booking-small-font-size--desktop: 15px;
181
-
182
- //CTA
183
- --tide-booking-cta-height: 40px;
184
- --tide-booking-cta-height-xs: 45px;
185
- --tide-booking-cta-width: auto;
186
- --tide-booking-cta-width-xs: auto;
187
- --tide-booking-cta-padding: 10px 20px;
188
- --tide-booking-cta-color: var(--tide-booking-white);
189
- --tide-booking-cta-background: var(--tide-booking-color-primary);
190
- --tide-booking-cta-font-family: var(--tide-booking-font-body);
191
- --tide-booking-cta-font-size: 16px;
192
- --tide-booking-cta-font-size-xs: 18px;
193
- --tide-booking-cta-font-weight: 900;
194
- --tide-booking-cta-text-decoration: none;
195
- --tide-booking-cta-border: none;
196
- --tide-booking-cta-border-radius: 5px;
197
-
198
- //CTA__ICON
199
- --tide-booking-cta-icon-color: var(--tide-booking-white);
200
- --tide-booking-cta-icon-size: 16px;
201
-
202
- //CTA__HOVER
203
- --tide-booking-cta-background-hover: var(--tide-booking-color-primary-dark);
204
- --tide-booking-cta-color-hover: var(--tide-booking-white);
205
- --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
206
- --tide-booking-cta-border-hover: none;
207
- --tide-booking-cta-text-decoration-hover: none;
208
-
209
- //CTA__FOCUS
210
- --tide-booking-cta-background-focus: var(--tide-booking-color-primary-dark);
211
- --tide-booking-cta-color-focus: var(--tide-booking-white);
212
- --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
213
- --tide-booking-cta-border-focus: none;
214
- --tide-booking-cta-text-decoration-focus: none;
215
-
216
- //CTA--SECONDARY
217
- --tide-booking-cta-height-secondary: 40px;
218
- --tide-booking-cta-height-xs-secondary: 45px;
219
- --tide-booking-cta-width-secondary: auto;
220
- --tide-booking-cta-padding-secondary: 10px 20px;
221
- --tide-booking-cta-margin-secondary: 0px 0 0 0;
222
- --tide-booking-cta-background-secondary: transparant;
223
- --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
224
- --tide-booking-cta-border-secondary: 2px solid var(--tide-booking-color-primary);
225
- --tide-booking-cta-border-radius-secondary: 4px;
226
- --tide-booking-cta-text-decoration-secondary: none;
227
- --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
228
- --tide-booking-cta-font-size-secondary: 16px;
229
- --tide-booking-cta-font-size-xs-secondary: 18px;
230
- --tide-booking-cta-font-weight-secondary: 400;
231
-
232
- //CTA--SECONDARY__ICON
233
- --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
234
- --tide-booking-cta-icon-size-secondary: 16px;
235
-
236
- //CTA--SECONDARY__HOVER
237
- --tide-booking-cta-background-secondary-hover: var(--tide-booking-color-primary);
238
- --tide-booking-cta-color-secondary-hover: var(--tide-booking-white);
239
- --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-white);
240
- --tide-booking-cta-border-secondary-hover: 2px solid var(--tide-booking-color-primary);
241
- --tide-booking-cta-text-decoration-secondary-hover: none;
242
-
243
- //CTA--SECONDARY__FOCUS
244
- --tide-booking-cta-background-secondary-focus: var(--tide-booking-color-primary);
245
- --tide-booking-cta-color-secondary-focus: var(--tide-booking-white);
246
- --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-white);
247
- --tide-booking-cta-border-secondary-focus: 2px solid var(--tide-booking-color-primary);
248
- --tide-booking-cta-text-decoration-secondary-focus: none;
249
-
250
- //CTA--SELECT
251
- --tide-booking-cta-background-select: var(--tide-booking-white);
252
- --tide-booking-cta-color-select: var(--tide-booking-color-primary);
253
- --tide-booking-cta-border-select: 2px solid var(--tide-booking-color-primary);
254
- --tide-booking-cta-border-radius-select: 4px;
255
-
256
- //CTA--SELECT--HOVER/FOCUS/ACTIVE
257
- --tide-booking-cta-background-select-hover: var(--tide-booking-color-primary);
258
- --tide-booking-cta-color-select-hover: var(--tide-booking-white);
259
- --tide-booking-cta-border-select-hover: 2px solid var(--tide-booking-color-primary);
260
-
261
- //CTA--SELECTED
262
- --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
263
- --tide-booking-cta-color-selected: var(--tide-booking-white);
264
- --tide-booking-cta-border-selected: none;
265
- --tide-booking-cta-border-radius-selected: 4px;
266
- --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
267
-
268
- //DROPDOWN
269
- --tide-booking-dropdown-background: var(--tide-booking-white);
270
- --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-color-primary-fade);
271
- --tide-booking-dropdown-border-radius: 4px;
272
- --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
273
-
274
- --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary);
275
-
276
- --tide-booking-dropdown-arrow-color: var(--tide-booking-color-primary);
277
- --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
278
-
279
- --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
280
-
281
- //SPINNER
282
- --tide-booking-spinner-border: 5px solid var(--tide-booking-color-primary);
283
- --tide-booking-spinner-border-top-color: var(--tide-booking-color-secondary-light);
284
-
285
- --tide-booking-spinner-background: var(--tide-booking-white);
286
- --tide-booking-spinner-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
287
-
288
- //ANIMATION
289
- --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
290
-
291
- //BOOKING-WIZARD
292
- --tide-booking-wizard-background: var(--tide-booking-bg);
293
- --tide-booking-wizard-title-color: var(--tide-booking-black);
294
- --tide-booking-wizard-heading-color: var(--tide-booking-black);
295
-
296
- //BOOKING-WIZARD--GENERAL-STEP-COMPONENTS
297
- --tide-booking-step-card-background: var(--tide-booking-white);
298
- --tide-booking-step-card-border: 1.5px solid var(--tide-booking-color-secondary-light);
299
- --tide-booking-step-card-border-radius: 10px;
300
-
301
- --tide-booking-step-toggle-btn-background: var(--tide-booking-color-secondary-light);
302
- --tide-booking-step-toggle-btn-border: none;
303
- --tide-booking-step-toggle-btn-border-radius: 4px;
304
- --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
305
-
306
- //HOVER,FOCUS
307
- --tide-booking-step-toggle-btn-background-hover: var(--tide-booking-color-secondary);
308
- --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary);
309
- --tide-booking-step-toggle-btn-border-hover: none;
310
-
311
- //STEP-INDICATORS
312
- --tide-booking-step-indicators-line-trough: 2px dashed var(--tide-booking-gray-medium);
313
-
314
- --tide-booking-step-indicators-icon-color: var(--tide-booking-black);
315
- --tide-booking-step-indicators-icon-background: var(--tide-booking-white);
316
- --tide-booking-step-indicators-icon-border: 1px solid var(--tide-booking-gray-border-light);
317
- --tide-booking-step-indicators-icon-border-radius: 50%;
318
- --tide-booking-step-indicators-icon-font-family: var(--tide-booking-font-heading);
319
- --tide-booking-step-indicators-icon-font-size: 16px;
320
- --tide-booking-step-indicators-icon-font-weight: 400;
321
- --tide-booking-step-indicators-icon-color-text: var(--tide-booking-black);
322
-
323
- //STEP-INDICATORS--ACTIVE
324
- --tide-booking-step-indicators-icon-color-active: var(--tide-booking-white);
325
- --tide-booking-step-indicators-icon-background-active: var(--tide-booking-color-primary);
326
- --tide-booking-step-indicators-icon-border-active: 1px solid var(--tide-booking-color-primary);
327
- --tide-booking-step-indicators-icon-check-color-active: var(--tide-booking-white);
328
- --tide-booking-step-indicators-icon-color-text-active: var(--tide-booking-color-primary);
329
-
330
- //STEP-INDICATORS--COMPLETED
331
- --tide-booking-step-indicators-icon-color-completed: var(--tide-booking-white);
332
- --tide-booking-step-indicators-icon-background-completed: var(--tide-booking-color-primary);
333
- --tide-booking-step-indicators-icon-border-completed: 1px solid var(--tide-booking-color-primary);
334
- --tide-booking-step-indicators-icon-check-color-completed: var(--tide-booking-white);
335
- --tide-booking-step-indicators-icon-color-text-completed: var(--tide-booking-transparent);
336
-
337
- //SIDEBAR
338
- --tide-booking-sidebar-frame-radius: 10px;
339
- //SIDEBAR--HEADER
340
- --tide-booking-sidebar-header-background: var(--tide-booking-color-primary-gradient);
341
- --tide-booking-sidebar-header-color: var(--tide-booking-white);
342
- --tide-booking-sidebar-header-font-family: var(--tide-booking-font-heading);
343
- --tide-booking-sidebar-header-font-size: 20px;
344
- --tide-booking-sidebar-header-font-weight: 400;
345
- --tide-booking-sidebar-header-border-radius: 10px 10px 0px 0px;
346
-
347
- //MOBILE--TOGGLE
348
- --tide-booking-sidebar-btn-toggle-background: rgba(255, 255, 255, 0.2);
349
- --tide-booking-sidebar-btn-toggle-color: var(--tide-booking-white);
350
- --tide-booking-sidebar-btn-toggle-border: none;
351
- --tide-booking-sidebar-btn-toggle-border-radius: 5px;
352
-
353
- //SIDEBAR--BODY
354
- --tide-booking-sidebar-body-background: var(--tide-booking-white);
355
- --tide-booking-sidebar-body-border: 1.5px solid var(--tide-booking-gray-border-light);
356
- --tide-booking-sidebar-body-border-radius: 5px;
357
- --tide-booking-sidebar-body-font-family: var(--tide-booking-font-body);
358
- --tide-booking-sidebar-body-font-size: 16px;
359
- --tide-booking-sidebar-body-font-weight: 400;
360
- --tide-booking-sidebar-body-color: var(--tide-booking-gray-dark);
361
-
362
- --tide-booking-sidebar-body-label-color: var(--tide-booking-black);
363
- --tide-booking-sidebar-body-label-font-size: 16px;
364
- --tide-booking-sidebar-body-label-font-weight: 400;
365
-
366
- --tide-booking-sidebar-body-title-color: var(--tide-booking-black);
367
- --tide-booking-sidebar-body-title-font-size: 18px;
368
- --tide-booking-sidebar-body-title-font-family: var(--tide-booking-font-heading);
369
- --tide-booking-sidebar-body-title-font-weight: 600;
370
-
371
- --tide-booking-sidebar-body-flight-font-weight: 600;
372
- --tide-booking-sidebar-body-flight-color: var(--tide-booking-gray-dark);
373
-
374
- //SIDEBAR--FOOTER
375
- --tide-booking-sidebar-footer-background: var(--tide-booking-white);
376
- --tide-booking-sidebar-footer-border: 1.5px solid var(--tide-booking-gray-border-light);
377
- --tide-booking-sidebar-footer-border-radius: 0px 0px 10px 10px;
378
-
379
- --tide-booking-sidebar-footer-advance-font-size: 18px;
380
- --tide-booking-sidebar-footer-advance-font-weight: 400;
381
- --tide-booking-sidebar-footer-advance-color: var(--tide-booking-gray-medium);
382
-
383
- --tide-booking-sidebar-footer-total-font-size: 20px;
384
- --tide-booking-sidebar-footer-total-font-weight: 600;
385
- --tide-booking-sidebar-footer-total-color: var(--tide-booking-color-primary);
386
-
387
- --tide-booking-sidebar-footer-small-font-size: 14px;
388
- --tide-booking-sidebar-footer-small-font-weight: 400;
389
- --tide-booking-sidebar-footer-small-color: var(--tide-booking-gray-medium);
390
- --tide-booking-sidebar-footer-small-strong-color: var(--tide-booking-gray-dark);
391
-
392
- //STEP-1--FLIGHT-OPTIONS
393
- --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
394
- --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
395
- --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
396
-
397
- --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
398
- --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
399
-
400
- --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
401
- --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
402
- --tide-booking-flight-options-times-title-font-weight: 700;
403
-
404
- --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
405
- --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
406
-
407
- --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
408
-
409
- --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
410
- --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
411
- --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
412
- --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
413
-
414
- --tide-booking-flight-options-detail-card-background: var(--tide-booking-bg);
415
- --tide-booking-flight-options-detail-card-border: none;
416
- --tide-booking-flight-options-detail-card-border-radius: 10px;
417
-
418
- --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
419
- --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
420
- --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
421
- --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
422
-
423
- //HOVER,FOCUS
424
- --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
425
- --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
426
- --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
427
-
428
- //FLIGHT-OPTIONS--FILTER
429
- --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
430
- --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
431
-
432
- //FLIGHT-OPTIONS--FILTER--BTN
433
- --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
434
- --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
435
- --tide-booking-flight-options-filter-btn-border: 2px solid var(--tide-booking-color-primary);
436
- --tide-booking-flight-options-filter-btn-border-radius: 4px;
437
- --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
438
-
439
- --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
440
- --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
441
- --tide-booking-flight-options-filter-btn-hover-border: 2px solid var(--tide-booking-transparent);
442
- --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
443
-
444
- //FLIGHT-OPTIONS--FILTER--HEADER
445
- --tide-booking-flight-options-filter-header-text-color: var(--tide-booking-gray-dark);
446
- --tide-booking-flight-options-filter-header-text-font-weight: 300;
447
- --tide-booking-flight-options-filter-header-text-strong-color: var(--tide-booking-color-secondary);
448
- --tide-booking-flight-options-filter-header-text-strong-font-weight: 600;
449
- --tide-booking-flight-options-filter-header-close-icon-color: var(--tide-booking-color-primary);
450
-
451
- //FLIGHT-OPTIONS--FILTER--GROUP-TITLE
452
- --tide-booking-flight-options-filter-group-title-text-color: var(--tide-booking-gray-dark);
453
- --tide-booking-flight-options-filter-group-title-text-font-weight: 500;
454
- --tide-booking-flight-options-filter-group-title-text-font-family: var(--tide-booking-font-body);
455
- --tide-booking-flight-options-filter-group-title-text-border: 1.5px solid var(--tide-booking-color-secondary-light);
456
-
457
- --tide-booking-flight-options-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
458
- --tide-booking-flight-options-filter-group-title-subtext-font-weight: 400;
459
- --tide-booking-flight-options-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
460
-
461
- //STEP-2--ROOM-OPTIONS
462
-
463
- --tide-booking-room-options-card-background: var(--tide-booking-step-card-background);
464
- --tide-booking-room-options-card-border: var(--tide-booking-step-card-border);
465
- --tide-booking-room-options-card-border-radius: var(--tide-booking-step-card-border-radius);
466
-
467
- --tide-booking-room-options-image-border-radius: 10px;
468
-
469
- --tide-booking-room-options-usp-list-color: var(--tide-booking-gray-dark);
470
- --tide-booking-room-options-usp-list-font-weight: 400;
471
- --tide-booking-room-options-usp-list-icon-color: var(--tide-booking-color-primary);
472
-
473
- --tide-booking-room-options-title-color: var(--tide-booking-black);
474
- --tide-booking-room-options-title-font-family: var(--tide-booking-font-heading);
475
- --tide-booking-room-options-title-font-weight: 500;
476
-
477
- --tide-booking-room-options-dropdown-select-border: var(--tide-booking-dropdown-border);
478
- --tide-booking-room-options-dropdown-select-border-radius: var(--tide-booking-dropdown-border-radius);
479
- --tide-booking-room-options-dropdown-select-font-family: var(--tide-booking-dropdown-font-family);
480
- --tide-booking-room-options-dropdown-select-color: var(--tide-booking-dropdown-color);
481
- --tide-booking-room-options-dropdown-select-background: var(--tide-booking-dropdown-background);
482
- --tide-booking-room-options-dropdown-select-border-focus: var(--tide-booking-dropdown-border-focus);
483
-
484
- --tide-booking-room-options-dropdown-select-icon-color: var(--tide-booking-dropdown-arrow-color);
485
-
486
- //ALTERNATIVE--ROOM-OPTIONS
487
- --tide-booking-room-options-alternative-btn-color: var(--tide-booking-link-green-color);
488
- --tide-booking-room-options-alternative-btn-text-decoration: underline;
489
-
490
- //ALTERNATIVE--ROOM-OPTIONS--HOVER
491
- --tide-booking-room-options-alternative-btn-color-hover: var(--tide-booking-color-primary);
492
- --tide-booking-room-options-alternative-btn-text-decoration-hover: none;
493
-
494
- //ALTERNATIVE--ROOM-OPTIONS--HEADER
495
- --tide-booking-room-options-alternative-header-color: var(--tide-booking-black);
496
-
497
- //STEP-3 EXTA-OPTIONS
498
- --tide-booking-extra-options-card-background: var(--tide-booking-step-card-background);
499
- --tide-booking-extra-options-card-border: var(--tide-booking-step-card-border);
500
- --tide-booking-extra-options-card-border-radius: var(--tide-booking-step-card-border-radius);
501
-
502
- --tide-booking-extra-options-card-title-color: var(--tide-booking-black);
503
-
504
- //TAG
505
- --tide-booking-tag-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
506
- --tide-booking-tag-border: none;
507
- --tide-booking-tag-border-radius: 0 5px 5px 0;
508
- --tide-booking-tag-color: var(--tide-booking-white);
509
- --tide-booking-tag-font-family: var(--tide-booking-font-body);
510
- --tide-booking-tag-font-weight: 400;
511
-
512
- //INPUT--SELECTED
513
- --tide-booking-input-selected-background: var(--tide-booking-bg);
514
- --tide-booking-input-selected-border: none;
515
- --tide-booking-input-selected-border-radius: 5px;
516
- --tide-booking-input-selected-color: var(--tide-booking-color-primary);
517
-
518
- //TOGGLE
519
- --tide-booking-flight-extra-options-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
520
- --tide-booking-flight-extra-options-toggle-background: var(--tide-booking-step-toggle-btn-background);
521
- --tide-booking-flight-extra-options-toggle-border: var(--tide-booking-step-toggle-btn-border);
522
- --tide-booking-flight-extra-options-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
523
-
524
- //HOVER,FOCUS
525
- --tide-booking-flight-extra-options-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
526
- --tide-booking-flight-extra-options-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
527
- --tide-booking-flight-extra-options-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
528
-
529
- //STEP-4--FORM
530
- --tide-booking-form-card-background: var(--tide-booking-step-card-background);
531
- --tide-booking-form-card-border: var(--tide-booking-step-card-border);
532
- --tide-booking-form-card-border-radius: var(--tide-booking-step-card-border-radius);
533
-
534
- //GROUP--BORDER
535
- --tide-booking-form-group-border: 1.5px solid var(--tide-booking-color-secondary-light);
536
-
537
- //LABEL
538
- --tide-booking-form-label-color: var(--tide-booking-gray-dark);
539
- --tide-booking-form-label-font-family: var(--tide-booking-font-body);
540
- --tide-booking-form-label-font-weight: 300;
541
-
542
- //TYPEAHEAD--AGENT
543
- --tide-booking-form-typeahead-agent-background: var(--tide-booking-gray-xlight);
544
- --tide-booking-form-typeahead-agent-border: 1.5px solid var(--tide-booking-gray--medium-light);
545
- --tide-booking-form-typeahead-agent-border-radius: 5px;
546
- --tide-booking-form-typeahead-agent-color: var(--tide-booking-black);
547
- --tide-booking-form-typeahead-agent-font-family: var(--tide-booking-font-body);
548
- --tide-booking-form-typeahead-agent-icon-color: var(--tide-booking-black);
549
- --tide-booking-form-typeahead-agent-clear-icon-color: var(--tide-booking-color-primary);
550
-
551
- --tide-booking-form-typeahead-agent-placeholder-color: var(--tide-booking-gray-medium);
552
- --tide-booking-form-typeahead-agent-placeholder-font-family: var(--tide-booking-font-body);
553
-
554
- //TYPEAHEAD--AGENT--HOVER/FOCUS
555
- --tide-booking-form-typeahead-agent-background-hover: var(--tide-booking-white);
556
- --tide-booking-form-typeahead-agent-border-hover: 1.5px solid var(--tide-booking-color-primary);
557
- --tide-booking-form-typeahead-agent-color-hover: var(--tide-booking-black);
558
- --tide-booking-form-typeahead-agent-icon-color-hover: var(--tide-booking-color-primary);
559
-
560
- //TYPEAHEAD--AGENT--OPTIONS
561
- --tide-booking-form-typeahead-agent-options-background: var(--tide-booking-white);
562
- --tide-booking-form-typeahead-agent-options-border: 1.5px solid var(--tide-booking-gray-border-light);
563
- --tide-booking-form-typeahead-agent-options-border-radius: 5px;
564
- --tide-booking-form-typeahead-agent-options-color: var(--tide-booking-gray-dark);
565
-
566
- //TYPEAHEAD--AGENT--OPTIONS--HOVER
567
- --tide-booking-form-typeahead-agent-options-background-hover: var(--tide-booking-gray-border-light);
568
- --tide-booking-form-typeahead-agent-options-color-hover: var(--tide-booking-black);
569
-
570
- //TYPEAHEAD--AGENT--OPTIONS--HIGHLIGHT
571
- --tide-booking-form-typeahead-agent-options-color-highlight: var(--tide-booking-black);
572
- --tide-booking-form-typeahead-agent-options-font-weight-highlight: 600;
573
-
574
- //STEP-5--OVERVIEW
575
- --tide-booking-form-summary-background: var(--tide-booking-step-card-background);
576
- --tide-booking-form-summary-border: var(--tide-booking-step-card-border);
577
- --tide-booking-form-summary-border-radius: var(--tide-booking-step-card-border-radius);
578
-
579
- //VOUCHER--REMOVE-BTN
580
- --tide-booking-form-summary-voucher-remove-btn-background: var(--tide-booking-transparent);
581
- --tide-booking-form-summary-voucher-remove-btn-color: var(--tide-booking-color-primary);
582
- --tide-booking-form-summary-voucher-remove-btn-border: none;
583
- --tide-booking-form-summary-voucher-remove-btn-border-radius: 5px;
584
-
585
- //VOUCHER--REMOVE-BTN--HOVER
586
- --tide-booking-form-summary-voucher-remove-btn-background-hover: var(--tide-booking-transparent);
587
- --tide-booking-form-summary-voucher-remove-btn-color-hover: var(--tide-booking-color-primary-dark);
588
- --tide-booking-form-summary-voucher-remove-btn-border-hover: none;
589
-
590
- //STEP-6--CONFIRMATION
591
- --tide-booking-confirmation-background: var(--tide-booking-step-card-background);
592
- --tide-booking-confirmation-border: var(--tide-booking-step-card-border);
593
- --tide-booking-confirmation-border-radius: var(--tide-booking-step-card-border-radius);
594
-
595
- --tide-booking-confirmation-icon-color: var(--tide-booking-color-secondary);
596
- }
1
+ :root {
2
+ // COLOR ASSIGNMENTS
3
+ --tide-booking-color-primary: #2b5d2e;
4
+ --tide-booking-color-primary-gradient: #2b5d2e;
5
+ --tide-booking-color-primary-fade: #e3f1f2;
6
+ --tide-booking-color-primary-extra-fade: #f8f8fd;
7
+ --tide-booking-color-primary-light: #cdcdee;
8
+ --tide-booking-color-primary-dark: #2c4a28;
9
+ --tide-booking-color-secondary: #9fb5a0;
10
+ --tide-booking-color-secondary-light: #dae2db;
11
+
12
+ --tide-booking-color-star: #ecb911;
13
+ --tide-booking-link-green-color: #367c5b;
14
+ // --tide-booking-invalid: #e74c3c;
15
+ --tide-booking-invalid: #dc4d28;
16
+ --tide-booking-invalid-light: #ffe1d9;
17
+ --tide-booking-invalid-dark: #dc4d28;
18
+ --tide-booking-price-increase: #dc4d28;
19
+ --tide-booking-price-decrease: #367c5b;
20
+
21
+ --tide-booking-white: #ffffff;
22
+ --tide-booking-gray-light: #f5f5f5;
23
+ --tide-booking-gray-xlight: #fbfbfb;
24
+ --tide-booking-gray--medium-light: #efefef;
25
+ --tide-booking-gray-background-light: #e2e2e2;
26
+ --tide-booking-gray-border-light: #f3f3f3;
27
+ --tide-booking-gray-checkbox-bg: #bdbdbd;
28
+ --tide-booking-gray-medium: #cbcbcb;
29
+ --tide-booking-gray-dark: #666666;
30
+ --tide-booking-black: #333333;
31
+ --tide-booking-transparent: transparent;
32
+
33
+ // BACKGROUNDS
34
+ --tide-booking-bg: #f4f8f7;
35
+
36
+ // TYPOGRAPHY
37
+ --tide-booking-font-heading: museo-sans, sans-serif;
38
+ --tide-booking-font-body: museo-sans, sans-serif;
39
+ --tide-booking-font-handwritten: museo-sans, sans-serif;
40
+
41
+ --tide-booking-font-size-body: 15px;
42
+ --tide-booking-font-size-body-lg: 18px;
43
+ --tide-booking-line-height-body: 1;
44
+
45
+ // GRID
46
+ --tide-booking-container-wide: 1690px;
47
+ --tide-booking-container-medium: 1200px;
48
+ --tide-booking-container-small: 900px;
49
+ --tide-booking-container-article: 650px;
50
+ --tide-booking-gutter: 15px;
51
+
52
+ // MEDIA QUERIES
53
+ --tide-booking-screen-xs: 576px;
54
+ --tide-booking-screen-sm: 768px;
55
+ --tide-booking-screen-md: 992px;
56
+ --tide-booking-screen-lg: 1200px;
57
+ --tide-booking-screen-xl: 1650px;
58
+ --tide-booking-screen-xxl: 1920px;
59
+
60
+ //HEADINGS
61
+ --tide-booking-heading-color: var(--tide-booking-black);
62
+
63
+ //h1
64
+ --tide-booking-h1: 32.5px;
65
+ --tide-booking-h1-sm: 48px;
66
+ --tide-booking-h1-xl: 48px;
67
+
68
+ //h2
69
+ --tide-booking-h2: 24px;
70
+ --tide-booking-h2-sm: 30px;
71
+ --tide-booking-h2-xl: 30px;
72
+
73
+ //h3
74
+ --tide-booking-h3: 22px;
75
+ --tide-booking-h3-sm: 25px;
76
+ --tide-booking-h3-xl: 25px;
77
+
78
+ //h4
79
+ --tide-booking-h4: 18px;
80
+ --tide-booking-h4-sm: 23px;
81
+ --tide-booking-h4-xl: 23px;
82
+
83
+ //h5
84
+ --tide-booking-h5: 18px;
85
+ --tide-booking-h5-xl: 20px;
86
+
87
+ //h6
88
+ --tide-booking-h6: 16px;
89
+ --tide-booking-h6-md: 18px;
90
+
91
+ //a
92
+ --tide-booking-a-color: var(--tide-booking-link-green-color);
93
+ --tide-booking-a-text-decoration: underline;
94
+ --tide-booking-a-color-hover: var(--tide-booking-color-primary);
95
+ --tide-booking-a-text-decoration-hover: underline;
96
+ --tide-booking-a-color-focus: var(--tide-booking-color-primary);
97
+ --tide-booking-a-text-decoration-focus: underline;
98
+
99
+ //TOGGLE-SWITCH
100
+ --tide-booking-toggle-switch-background: var(--tide-booking-gray-medium);
101
+ --tide-booking-toggle-switch-border-radius: 5px;
102
+ --tide-booking-toggle-switch-after-color: var(--tide-booking-white);
103
+
104
+ //TOGGLE-SWITCH--TOGGLED
105
+ --tide-booking-toggle-switch-background-toggled: var(--tide-booking-color-primary);
106
+
107
+ //FORM--INPUT
108
+ --tide-booking-form-input-background: var(--tide-booking-gray-xlight);
109
+ --tide-booking-form-input-border: 1.5px solid var(--tide-booking-color-primary-fade);
110
+ --tide-booking-form-input-border-radius: 5px;
111
+
112
+ //FORM--INPUT--FOCUS/ACTIVE
113
+ --tide-booking-form-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
114
+
115
+ //FORM--INPUT--PLACEHOLDER
116
+ --tide-booking-form-input-placeholder-color: var(--tide-booking-gray-dark);
117
+ --tide-booking-form-input-placeholder-font-style: normal;
118
+
119
+ //RADIOBUTTON
120
+ --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
121
+ --tide-booking-radiobutton-background: var(--tide-booking-white);
122
+ --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
123
+ --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
124
+ --tide-booking-radiobutton-font-size: 16px;
125
+ --tide-booking-radiobutton-font-weight: 400;
126
+
127
+ //RADIOBUTTON--INPUT--CHECKED
128
+ --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
129
+ --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
130
+ --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
131
+
132
+ //CHECKBOX--INPUT--CHECKED--AFTER
133
+ --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
134
+
135
+ //CHECKBOX
136
+ --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-color-primary-fade);
137
+ --tide-booking-checkbox-border-radius: 0px;
138
+ --tide-booking-checkbox-background: var(--tide-booking-white);
139
+ --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
140
+ --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
141
+ --tide-booking-checkbox-font-size: 16px;
142
+ --tide-booking-checkbox-font-weight: 400;
143
+
144
+ //CHECKBOX--INPUT--CHECKED
145
+ --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
146
+ --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
147
+ --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
148
+ --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
149
+
150
+ //SLIDER
151
+ --tide-booking-slider-track-background: var(--tide-booking-color-primary);
152
+ --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
153
+ --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
154
+ --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
155
+
156
+ //BOOKING PRODUCT
157
+ --tide-booking-component-background: var(--tide-booking-bg);
158
+ --tide-booking-component-radius: 10px;
159
+ --tide-booking-component-border: 1.5px solid var(--tide-booking-color-primary-fade);
160
+
161
+ //HEADER
162
+ --tide-booking-component-header-background: var(--tide-booking-color-primary-gradient);
163
+ --tide-booking-component-header-color: var(--tide-booking-white);
164
+ --tide-booking-component-header-border-radius: 10px 10px 0px 0px;
165
+
166
+ --tide-booking-component-header-star-rating: var(--tide-booking-color-star);
167
+ --tide-booking-component-header-title-color: var(--tide-booking-white);
168
+ --tide-booking-component-header-title-font: var(--tide-booking-font-heading);
169
+ --tide-booking-component-header-icon-color: var(--tide-booking-white);
170
+
171
+ //price header
172
+ --tide-booking-component-header-price-font-family: var(--tide-booking-font-body);
173
+ --tide-booking-component-header-price-font-size--mobile: 25px;
174
+ --tide-booking-component-header-price-font-size--desktop: 36px;
175
+ --tide-booking-component-header-price-font-weight: 400;
176
+ --tide-booking-component-header-price-color: var(--tide-booking-white);
177
+
178
+ //small fontsize
179
+ --tide-booking-small-font-size--mobile: 13px;
180
+ --tide-booking-small-font-size--desktop: 15px;
181
+
182
+ //CTA
183
+ --tide-booking-cta-height: 40px;
184
+ --tide-booking-cta-height-xs: 45px;
185
+ --tide-booking-cta-width: auto;
186
+ --tide-booking-cta-width-xs: auto;
187
+ --tide-booking-cta-padding: 10px 20px;
188
+ --tide-booking-cta-color: var(--tide-booking-white);
189
+ --tide-booking-cta-background: var(--tide-booking-color-primary);
190
+ --tide-booking-cta-font-family: var(--tide-booking-font-body);
191
+ --tide-booking-cta-font-size: 16px;
192
+ --tide-booking-cta-font-size-xs: 18px;
193
+ --tide-booking-cta-font-weight: 900;
194
+ --tide-booking-cta-text-decoration: none;
195
+ --tide-booking-cta-border: none;
196
+ --tide-booking-cta-border-radius: 5px;
197
+
198
+ //CTA__ICON
199
+ --tide-booking-cta-icon-color: var(--tide-booking-white);
200
+ --tide-booking-cta-icon-size: 16px;
201
+
202
+ //CTA__HOVER
203
+ --tide-booking-cta-background-hover: var(--tide-booking-color-primary-dark);
204
+ --tide-booking-cta-color-hover: var(--tide-booking-white);
205
+ --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
206
+ --tide-booking-cta-border-hover: none;
207
+ --tide-booking-cta-text-decoration-hover: none;
208
+
209
+ //CTA__FOCUS
210
+ --tide-booking-cta-background-focus: var(--tide-booking-color-primary-dark);
211
+ --tide-booking-cta-color-focus: var(--tide-booking-white);
212
+ --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
213
+ --tide-booking-cta-border-focus: none;
214
+ --tide-booking-cta-text-decoration-focus: none;
215
+
216
+ //CTA--SECONDARY
217
+ --tide-booking-cta-height-secondary: 40px;
218
+ --tide-booking-cta-height-xs-secondary: 45px;
219
+ --tide-booking-cta-width-secondary: auto;
220
+ --tide-booking-cta-padding-secondary: 10px 20px;
221
+ --tide-booking-cta-margin-secondary: 0px 0 0 0;
222
+ --tide-booking-cta-background-secondary: transparant;
223
+ --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
224
+ --tide-booking-cta-border-secondary: 2px solid var(--tide-booking-color-primary);
225
+ --tide-booking-cta-border-radius-secondary: 4px;
226
+ --tide-booking-cta-text-decoration-secondary: none;
227
+ --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
228
+ --tide-booking-cta-font-size-secondary: 16px;
229
+ --tide-booking-cta-font-size-xs-secondary: 18px;
230
+ --tide-booking-cta-font-weight-secondary: 400;
231
+
232
+ //CTA--SECONDARY__ICON
233
+ --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
234
+ --tide-booking-cta-icon-size-secondary: 16px;
235
+
236
+ //CTA--SECONDARY__HOVER
237
+ --tide-booking-cta-background-secondary-hover: var(--tide-booking-color-primary);
238
+ --tide-booking-cta-color-secondary-hover: var(--tide-booking-white);
239
+ --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-white);
240
+ --tide-booking-cta-border-secondary-hover: 2px solid var(--tide-booking-color-primary);
241
+ --tide-booking-cta-text-decoration-secondary-hover: none;
242
+
243
+ //CTA--SECONDARY__FOCUS
244
+ --tide-booking-cta-background-secondary-focus: var(--tide-booking-color-primary);
245
+ --tide-booking-cta-color-secondary-focus: var(--tide-booking-white);
246
+ --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-white);
247
+ --tide-booking-cta-border-secondary-focus: 2px solid var(--tide-booking-color-primary);
248
+ --tide-booking-cta-text-decoration-secondary-focus: none;
249
+
250
+ //CTA--SELECT
251
+ --tide-booking-cta-background-select: var(--tide-booking-white);
252
+ --tide-booking-cta-color-select: var(--tide-booking-color-primary);
253
+ --tide-booking-cta-border-select: 2px solid var(--tide-booking-color-primary);
254
+ --tide-booking-cta-border-radius-select: 4px;
255
+
256
+ //CTA--SELECT--HOVER/FOCUS/ACTIVE
257
+ --tide-booking-cta-background-select-hover: var(--tide-booking-color-primary);
258
+ --tide-booking-cta-color-select-hover: var(--tide-booking-white);
259
+ --tide-booking-cta-border-select-hover: 2px solid var(--tide-booking-color-primary);
260
+
261
+ //CTA--SELECTED
262
+ --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
263
+ --tide-booking-cta-color-selected: var(--tide-booking-white);
264
+ --tide-booking-cta-border-selected: none;
265
+ --tide-booking-cta-border-radius-selected: 4px;
266
+ --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
267
+
268
+ //DROPDOWN
269
+ --tide-booking-dropdown-background: var(--tide-booking-white);
270
+ --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-color-primary-fade);
271
+ --tide-booking-dropdown-border-radius: 4px;
272
+ --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
273
+
274
+ --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary);
275
+
276
+ --tide-booking-dropdown-arrow-color: var(--tide-booking-color-primary);
277
+ --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
278
+
279
+ --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
280
+
281
+ //SPINNER
282
+ --tide-booking-spinner-border: 5px solid var(--tide-booking-color-primary);
283
+ --tide-booking-spinner-border-top-color: var(--tide-booking-color-secondary-light);
284
+
285
+ --tide-booking-spinner-background: var(--tide-booking-white);
286
+ --tide-booking-spinner-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
287
+
288
+ //ANIMATION
289
+ --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
290
+
291
+ //BOOKING-WIZARD
292
+ --tide-booking-wizard-background: var(--tide-booking-bg);
293
+ --tide-booking-wizard-title-color: var(--tide-booking-black);
294
+ --tide-booking-wizard-heading-color: var(--tide-booking-black);
295
+
296
+ //BOOKING-WIZARD--GENERAL-STEP-COMPONENTS
297
+ --tide-booking-step-card-background: var(--tide-booking-white);
298
+ --tide-booking-step-card-border: 1.5px solid var(--tide-booking-color-secondary-light);
299
+ --tide-booking-step-card-border-radius: 10px;
300
+
301
+ --tide-booking-step-toggle-btn-background: var(--tide-booking-color-secondary-light);
302
+ --tide-booking-step-toggle-btn-border: none;
303
+ --tide-booking-step-toggle-btn-border-radius: 4px;
304
+ --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
305
+
306
+ //HOVER,FOCUS
307
+ --tide-booking-step-toggle-btn-background-hover: var(--tide-booking-color-secondary);
308
+ --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary);
309
+ --tide-booking-step-toggle-btn-border-hover: none;
310
+
311
+ //STEP-INDICATORS
312
+ --tide-booking-step-indicators-line-trough: 2px dashed var(--tide-booking-gray-medium);
313
+
314
+ --tide-booking-step-indicators-icon-color: var(--tide-booking-black);
315
+ --tide-booking-step-indicators-icon-background: var(--tide-booking-white);
316
+ --tide-booking-step-indicators-icon-border: 1px solid var(--tide-booking-gray-border-light);
317
+ --tide-booking-step-indicators-icon-border-radius: 50%;
318
+ --tide-booking-step-indicators-icon-font-family: var(--tide-booking-font-heading);
319
+ --tide-booking-step-indicators-icon-font-size: 16px;
320
+ --tide-booking-step-indicators-icon-font-weight: 400;
321
+ --tide-booking-step-indicators-icon-color-text: var(--tide-booking-black);
322
+
323
+ //STEP-INDICATORS--ACTIVE
324
+ --tide-booking-step-indicators-icon-color-active: var(--tide-booking-white);
325
+ --tide-booking-step-indicators-icon-background-active: var(--tide-booking-color-primary);
326
+ --tide-booking-step-indicators-icon-border-active: 1px solid var(--tide-booking-color-primary);
327
+ --tide-booking-step-indicators-icon-check-color-active: var(--tide-booking-white);
328
+ --tide-booking-step-indicators-icon-color-text-active: var(--tide-booking-color-primary);
329
+
330
+ //STEP-INDICATORS--COMPLETED
331
+ --tide-booking-step-indicators-icon-color-completed: var(--tide-booking-white);
332
+ --tide-booking-step-indicators-icon-background-completed: var(--tide-booking-color-primary);
333
+ --tide-booking-step-indicators-icon-border-completed: 1px solid var(--tide-booking-color-primary);
334
+ --tide-booking-step-indicators-icon-check-color-completed: var(--tide-booking-white);
335
+ --tide-booking-step-indicators-icon-color-text-completed: var(--tide-booking-transparent);
336
+
337
+ //SIDEBAR
338
+ --tide-booking-sidebar-frame-radius: 10px;
339
+ //SIDEBAR--HEADER
340
+ --tide-booking-sidebar-header-background: var(--tide-booking-color-primary-gradient);
341
+ --tide-booking-sidebar-header-color: var(--tide-booking-white);
342
+ --tide-booking-sidebar-header-font-family: var(--tide-booking-font-heading);
343
+ --tide-booking-sidebar-header-font-size: 20px;
344
+ --tide-booking-sidebar-header-font-weight: 400;
345
+ --tide-booking-sidebar-header-border-radius: 10px 10px 0px 0px;
346
+
347
+ //MOBILE--TOGGLE
348
+ --tide-booking-sidebar-btn-toggle-background: rgba(255, 255, 255, 0.2);
349
+ --tide-booking-sidebar-btn-toggle-color: var(--tide-booking-white);
350
+ --tide-booking-sidebar-btn-toggle-border: none;
351
+ --tide-booking-sidebar-btn-toggle-border-radius: 5px;
352
+
353
+ //SIDEBAR--BODY
354
+ --tide-booking-sidebar-body-background: var(--tide-booking-white);
355
+ --tide-booking-sidebar-body-border: 1.5px solid var(--tide-booking-gray-border-light);
356
+ --tide-booking-sidebar-body-border-radius: 5px;
357
+ --tide-booking-sidebar-body-font-family: var(--tide-booking-font-body);
358
+ --tide-booking-sidebar-body-font-size: 16px;
359
+ --tide-booking-sidebar-body-font-weight: 400;
360
+ --tide-booking-sidebar-body-color: var(--tide-booking-gray-dark);
361
+
362
+ --tide-booking-sidebar-body-label-color: var(--tide-booking-black);
363
+ --tide-booking-sidebar-body-label-font-size: 16px;
364
+ --tide-booking-sidebar-body-label-font-weight: 400;
365
+
366
+ --tide-booking-sidebar-body-title-color: var(--tide-booking-black);
367
+ --tide-booking-sidebar-body-title-font-size: 18px;
368
+ --tide-booking-sidebar-body-title-font-family: var(--tide-booking-font-heading);
369
+ --tide-booking-sidebar-body-title-font-weight: 600;
370
+
371
+ --tide-booking-sidebar-body-flight-font-weight: 600;
372
+ --tide-booking-sidebar-body-flight-color: var(--tide-booking-gray-dark);
373
+
374
+ //SIDEBAR--FOOTER
375
+ --tide-booking-sidebar-footer-background: var(--tide-booking-white);
376
+ --tide-booking-sidebar-footer-border: 1.5px solid var(--tide-booking-gray-border-light);
377
+ --tide-booking-sidebar-footer-border-radius: 0px 0px 10px 10px;
378
+
379
+ --tide-booking-sidebar-footer-advance-font-size: 18px;
380
+ --tide-booking-sidebar-footer-advance-font-weight: 400;
381
+ --tide-booking-sidebar-footer-advance-color: var(--tide-booking-gray-medium);
382
+
383
+ --tide-booking-sidebar-footer-total-font-size: 20px;
384
+ --tide-booking-sidebar-footer-total-font-weight: 600;
385
+ --tide-booking-sidebar-footer-total-color: var(--tide-booking-color-primary);
386
+
387
+ --tide-booking-sidebar-footer-small-font-size: 14px;
388
+ --tide-booking-sidebar-footer-small-font-weight: 400;
389
+ --tide-booking-sidebar-footer-small-color: var(--tide-booking-gray-medium);
390
+ --tide-booking-sidebar-footer-small-strong-color: var(--tide-booking-gray-dark);
391
+
392
+ //STEP-1--FLIGHT-OPTIONS
393
+ --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
394
+ --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
395
+ --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
396
+
397
+ --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
398
+ --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
399
+
400
+ --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
401
+ --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
402
+ --tide-booking-flight-options-times-title-font-weight: 700;
403
+
404
+ --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
405
+ --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
406
+
407
+ --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
408
+
409
+ --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
410
+ --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
411
+ --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
412
+ --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
413
+
414
+ --tide-booking-flight-options-detail-card-background: var(--tide-booking-bg);
415
+ --tide-booking-flight-options-detail-card-border: none;
416
+ --tide-booking-flight-options-detail-card-border-radius: 10px;
417
+
418
+ --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
419
+ --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
420
+ --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
421
+ --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
422
+
423
+ //HOVER,FOCUS
424
+ --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
425
+ --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
426
+ --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
427
+
428
+ //FLIGHT-OPTIONS--FILTER
429
+ --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
430
+ --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
431
+
432
+ //FLIGHT-OPTIONS--FILTER--BTN
433
+ --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
434
+ --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
435
+ --tide-booking-flight-options-filter-btn-border: 2px solid var(--tide-booking-color-primary);
436
+ --tide-booking-flight-options-filter-btn-border-radius: 4px;
437
+ --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
438
+
439
+ --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
440
+ --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
441
+ --tide-booking-flight-options-filter-btn-hover-border: 2px solid var(--tide-booking-transparent);
442
+ --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
443
+
444
+ //FLIGHT-OPTIONS--FILTER--HEADER
445
+ --tide-booking-flight-options-filter-header-text-color: var(--tide-booking-gray-dark);
446
+ --tide-booking-flight-options-filter-header-text-font-weight: 300;
447
+ --tide-booking-flight-options-filter-header-text-strong-color: var(--tide-booking-color-secondary);
448
+ --tide-booking-flight-options-filter-header-text-strong-font-weight: 600;
449
+ --tide-booking-flight-options-filter-header-close-icon-color: var(--tide-booking-color-primary);
450
+
451
+ //FLIGHT-OPTIONS--FILTER--GROUP-TITLE
452
+ --tide-booking-flight-options-filter-group-title-text-color: var(--tide-booking-gray-dark);
453
+ --tide-booking-flight-options-filter-group-title-text-font-weight: 500;
454
+ --tide-booking-flight-options-filter-group-title-text-font-family: var(--tide-booking-font-body);
455
+ --tide-booking-flight-options-filter-group-title-text-border: 1.5px solid var(--tide-booking-color-secondary-light);
456
+
457
+ --tide-booking-flight-options-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
458
+ --tide-booking-flight-options-filter-group-title-subtext-font-weight: 400;
459
+ --tide-booking-flight-options-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
460
+
461
+ //STEP-2--ROOM-OPTIONS
462
+
463
+ --tide-booking-room-options-card-background: var(--tide-booking-step-card-background);
464
+ --tide-booking-room-options-card-border: var(--tide-booking-step-card-border);
465
+ --tide-booking-room-options-card-border-radius: var(--tide-booking-step-card-border-radius);
466
+
467
+ --tide-booking-room-options-image-border-radius: 10px;
468
+
469
+ --tide-booking-room-options-usp-list-color: var(--tide-booking-gray-dark);
470
+ --tide-booking-room-options-usp-list-font-weight: 400;
471
+ --tide-booking-room-options-usp-list-icon-color: var(--tide-booking-color-primary);
472
+
473
+ --tide-booking-room-options-title-color: var(--tide-booking-black);
474
+ --tide-booking-room-options-title-font-family: var(--tide-booking-font-heading);
475
+ --tide-booking-room-options-title-font-weight: 500;
476
+
477
+ --tide-booking-room-options-dropdown-select-border: var(--tide-booking-dropdown-border);
478
+ --tide-booking-room-options-dropdown-select-border-radius: var(--tide-booking-dropdown-border-radius);
479
+ --tide-booking-room-options-dropdown-select-font-family: var(--tide-booking-dropdown-font-family);
480
+ --tide-booking-room-options-dropdown-select-color: var(--tide-booking-dropdown-color);
481
+ --tide-booking-room-options-dropdown-select-background: var(--tide-booking-dropdown-background);
482
+ --tide-booking-room-options-dropdown-select-border-focus: var(--tide-booking-dropdown-border-focus);
483
+
484
+ --tide-booking-room-options-dropdown-select-icon-color: var(--tide-booking-dropdown-arrow-color);
485
+
486
+ //ALTERNATIVE--ROOM-OPTIONS
487
+ --tide-booking-room-options-alternative-btn-color: var(--tide-booking-link-green-color);
488
+ --tide-booking-room-options-alternative-btn-text-decoration: underline;
489
+
490
+ //ALTERNATIVE--ROOM-OPTIONS--HOVER
491
+ --tide-booking-room-options-alternative-btn-color-hover: var(--tide-booking-color-primary);
492
+ --tide-booking-room-options-alternative-btn-text-decoration-hover: none;
493
+
494
+ //ALTERNATIVE--ROOM-OPTIONS--HEADER
495
+ --tide-booking-room-options-alternative-header-color: var(--tide-booking-black);
496
+
497
+ //STEP-3 EXTA-OPTIONS
498
+ --tide-booking-extra-options-card-background: var(--tide-booking-step-card-background);
499
+ --tide-booking-extra-options-card-border: var(--tide-booking-step-card-border);
500
+ --tide-booking-extra-options-card-border-radius: var(--tide-booking-step-card-border-radius);
501
+
502
+ --tide-booking-extra-options-card-title-color: var(--tide-booking-black);
503
+
504
+ //TAG
505
+ --tide-booking-tag-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
506
+ --tide-booking-tag-border: none;
507
+ --tide-booking-tag-border-radius: 0 5px 5px 0;
508
+ --tide-booking-tag-color: var(--tide-booking-white);
509
+ --tide-booking-tag-font-family: var(--tide-booking-font-body);
510
+ --tide-booking-tag-font-weight: 400;
511
+
512
+ //INPUT--SELECTED
513
+ --tide-booking-input-selected-background: var(--tide-booking-bg);
514
+ --tide-booking-input-selected-border: none;
515
+ --tide-booking-input-selected-border-radius: 5px;
516
+ --tide-booking-input-selected-color: var(--tide-booking-color-primary);
517
+
518
+ //TOGGLE
519
+ --tide-booking-flight-extra-options-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
520
+ --tide-booking-flight-extra-options-toggle-background: var(--tide-booking-step-toggle-btn-background);
521
+ --tide-booking-flight-extra-options-toggle-border: var(--tide-booking-step-toggle-btn-border);
522
+ --tide-booking-flight-extra-options-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
523
+
524
+ //HOVER,FOCUS
525
+ --tide-booking-flight-extra-options-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
526
+ --tide-booking-flight-extra-options-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
527
+ --tide-booking-flight-extra-options-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
528
+
529
+ //STEP-4--FORM
530
+ --tide-booking-form-card-background: var(--tide-booking-step-card-background);
531
+ --tide-booking-form-card-border: var(--tide-booking-step-card-border);
532
+ --tide-booking-form-card-border-radius: var(--tide-booking-step-card-border-radius);
533
+
534
+ //GROUP--BORDER
535
+ --tide-booking-form-group-border: 1.5px solid var(--tide-booking-color-secondary-light);
536
+
537
+ //LABEL
538
+ --tide-booking-form-label-color: var(--tide-booking-gray-dark);
539
+ --tide-booking-form-label-font-family: var(--tide-booking-font-body);
540
+ --tide-booking-form-label-font-weight: 300;
541
+
542
+ //TYPEAHEAD--AGENT
543
+ --tide-booking-form-typeahead-agent-background: var(--tide-booking-gray-xlight);
544
+ --tide-booking-form-typeahead-agent-border: 1.5px solid var(--tide-booking-gray--medium-light);
545
+ --tide-booking-form-typeahead-agent-border-radius: 5px;
546
+ --tide-booking-form-typeahead-agent-color: var(--tide-booking-black);
547
+ --tide-booking-form-typeahead-agent-font-family: var(--tide-booking-font-body);
548
+ --tide-booking-form-typeahead-agent-icon-color: var(--tide-booking-black);
549
+ --tide-booking-form-typeahead-agent-clear-icon-color: var(--tide-booking-color-primary);
550
+
551
+ --tide-booking-form-typeahead-agent-placeholder-color: var(--tide-booking-gray-medium);
552
+ --tide-booking-form-typeahead-agent-placeholder-font-family: var(--tide-booking-font-body);
553
+
554
+ //TYPEAHEAD--AGENT--HOVER/FOCUS
555
+ --tide-booking-form-typeahead-agent-background-hover: var(--tide-booking-white);
556
+ --tide-booking-form-typeahead-agent-border-hover: 1.5px solid var(--tide-booking-color-primary);
557
+ --tide-booking-form-typeahead-agent-color-hover: var(--tide-booking-black);
558
+ --tide-booking-form-typeahead-agent-icon-color-hover: var(--tide-booking-color-primary);
559
+
560
+ //TYPEAHEAD--AGENT--OPTIONS
561
+ --tide-booking-form-typeahead-agent-options-background: var(--tide-booking-white);
562
+ --tide-booking-form-typeahead-agent-options-border: 1.5px solid var(--tide-booking-gray-border-light);
563
+ --tide-booking-form-typeahead-agent-options-border-radius: 5px;
564
+ --tide-booking-form-typeahead-agent-options-color: var(--tide-booking-gray-dark);
565
+
566
+ //TYPEAHEAD--AGENT--OPTIONS--HOVER
567
+ --tide-booking-form-typeahead-agent-options-background-hover: var(--tide-booking-gray-border-light);
568
+ --tide-booking-form-typeahead-agent-options-color-hover: var(--tide-booking-black);
569
+
570
+ //TYPEAHEAD--AGENT--OPTIONS--HIGHLIGHT
571
+ --tide-booking-form-typeahead-agent-options-color-highlight: var(--tide-booking-black);
572
+ --tide-booking-form-typeahead-agent-options-font-weight-highlight: 600;
573
+
574
+ //STEP-5--OVERVIEW
575
+ --tide-booking-form-summary-background: var(--tide-booking-step-card-background);
576
+ --tide-booking-form-summary-border: var(--tide-booking-step-card-border);
577
+ --tide-booking-form-summary-border-radius: var(--tide-booking-step-card-border-radius);
578
+
579
+ //VOUCHER--REMOVE-BTN
580
+ --tide-booking-form-summary-voucher-remove-btn-background: var(--tide-booking-transparent);
581
+ --tide-booking-form-summary-voucher-remove-btn-color: var(--tide-booking-color-primary);
582
+ --tide-booking-form-summary-voucher-remove-btn-border: none;
583
+ --tide-booking-form-summary-voucher-remove-btn-border-radius: 5px;
584
+
585
+ //VOUCHER--REMOVE-BTN--HOVER
586
+ --tide-booking-form-summary-voucher-remove-btn-background-hover: var(--tide-booking-transparent);
587
+ --tide-booking-form-summary-voucher-remove-btn-color-hover: var(--tide-booking-color-primary-dark);
588
+ --tide-booking-form-summary-voucher-remove-btn-border-hover: none;
589
+
590
+ //STEP-6--CONFIRMATION
591
+ --tide-booking-confirmation-background: var(--tide-booking-step-card-background);
592
+ --tide-booking-confirmation-border: var(--tide-booking-step-card-border);
593
+ --tide-booking-confirmation-border-radius: var(--tide-booking-step-card-border-radius);
594
+
595
+ --tide-booking-confirmation-icon-color: var(--tide-booking-color-secondary);
596
+ }