@qite/tide-components 1.0.13-preview.0 → 1.0.14

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 (93) hide show
  1. package/build/build-cjs/index.js +1664 -2414
  2. package/build/build-cjs/src/booking-wizard/features/booking/selectors.d.ts +1 -1
  3. package/build/build-cjs/src/booking-wizard/features/travelers-form/validate-form.d.ts +2 -2
  4. package/build/build-cjs/src/booking-wizard/types.d.ts +3 -23
  5. package/build/build-cjs/src/search-results/components/flight/flight-selection/independent-flight-option.d.ts +0 -2
  6. package/build/build-cjs/src/search-results/components/itinerary/index.d.ts +0 -1
  7. package/build/build-cjs/src/search-results/components/itinerary/itinerary-utils.d.ts +0 -1
  8. package/build/build-cjs/src/search-results/types.d.ts +0 -8
  9. package/build/build-cjs/src/search-results/utils/traject-utils.d.ts +0 -7
  10. package/build/build-cjs/src/shared/booking/travelers-form.d.ts +8 -13
  11. package/build/build-esm/index.js +1666 -2416
  12. package/build/build-esm/src/booking-wizard/features/booking/selectors.d.ts +1 -1
  13. package/build/build-esm/src/booking-wizard/features/travelers-form/validate-form.d.ts +2 -2
  14. package/build/build-esm/src/booking-wizard/types.d.ts +3 -23
  15. package/build/build-esm/src/search-results/components/flight/flight-selection/independent-flight-option.d.ts +0 -2
  16. package/build/build-esm/src/search-results/components/itinerary/index.d.ts +0 -1
  17. package/build/build-esm/src/search-results/components/itinerary/itinerary-utils.d.ts +0 -1
  18. package/build/build-esm/src/search-results/types.d.ts +0 -8
  19. package/build/build-esm/src/search-results/utils/traject-utils.d.ts +0 -7
  20. package/build/build-esm/src/shared/booking/travelers-form.d.ts +8 -13
  21. package/package.json +2 -2
  22. package/styles/abstracts/_mixins.scss +74 -74
  23. package/styles/abstracts/_variables.scss +57 -57
  24. package/styles/base/_fonts.scss +2 -2
  25. package/styles/base/_normalize.scss +227 -227
  26. package/styles/base/_typography.scss +35 -35
  27. package/styles/booking-joker-variables.scss +596 -596
  28. package/styles/booking-product-variables.scss +330 -330
  29. package/styles/booking-product.scss +438 -438
  30. package/styles/booking-qsm-variables.scss +501 -501
  31. package/styles/booking-qsm.scss +52 -52
  32. package/styles/booking-search-results-variables.scss +734 -734
  33. package/styles/booking-search-results.scss +53 -53
  34. package/styles/booking-wizard-variables.scss +603 -603
  35. package/styles/booking-wizard.scss +61 -61
  36. package/styles/components/_accordion.scss +67 -67
  37. package/styles/components/_animations.scss +39 -39
  38. package/styles/components/_base.scss +107 -107
  39. package/styles/components/_booking.scss +906 -906
  40. package/styles/components/_breadcrumb.scss +92 -92
  41. package/styles/components/_button.scss +238 -238
  42. package/styles/components/_checkbox.scss +230 -230
  43. package/styles/components/_contact.scss +255 -255
  44. package/styles/components/_content.scss +336 -336
  45. package/styles/components/_cta.scss +238 -238
  46. package/styles/components/_date-list.scss +41 -41
  47. package/styles/components/_date-range-picker.scss +223 -223
  48. package/styles/components/_decrement-increment.scss +35 -35
  49. package/styles/components/_dropdown.scss +77 -77
  50. package/styles/components/_error.scss +50 -50
  51. package/styles/components/_faq.scss +30 -30
  52. package/styles/components/_flight-option.scss +1444 -1432
  53. package/styles/components/_flyin.scss +830 -830
  54. package/styles/components/_footer.scss +135 -135
  55. package/styles/components/_form.scss +1704 -1704
  56. package/styles/components/_gallery.scss +317 -317
  57. package/styles/components/_header.scss +113 -113
  58. package/styles/components/_image-with-text.scss +206 -206
  59. package/styles/components/_img-slider.scss +175 -175
  60. package/styles/components/_info-message.scss +75 -75
  61. package/styles/components/_input.scss +35 -35
  62. package/styles/components/_list.scss +185 -185
  63. package/styles/components/_loader.scss +152 -152
  64. package/styles/components/_login.scss +140 -140
  65. package/styles/components/_map-view.scss +1100 -1100
  66. package/styles/components/_mixins.scss +579 -579
  67. package/styles/components/_navbar.scss +765 -765
  68. package/styles/components/_passenger-picker.scss +306 -306
  69. package/styles/components/_phone-input.scss +8 -8
  70. package/styles/components/_placeholders.scss +165 -165
  71. package/styles/components/_pricing-summary.scss +163 -163
  72. package/styles/components/_qsm.scss +17 -17
  73. package/styles/components/_radiobutton.scss +170 -170
  74. package/styles/components/_search.scss +2197 -2197
  75. package/styles/components/_select-wrapper.scss +81 -81
  76. package/styles/components/_slider.scss +120 -120
  77. package/styles/components/_spinner.scss +29 -29
  78. package/styles/components/_step-indicators.scss +187 -187
  79. package/styles/components/_table.scss +81 -81
  80. package/styles/components/_tide-form.scss +578 -578
  81. package/styles/components/_tree.scss +648 -648
  82. package/styles/components/_typeahead.scss +275 -275
  83. package/styles/components/_variables.scss +89 -89
  84. package/styles/content-blocks-variables.scss +543 -543
  85. package/styles/content-blocks.scss +66 -66
  86. package/styles/font.scss +2 -2
  87. package/styles/qsm/_calendar.scss +274 -274
  88. package/styles/qsm/_qsm.scss +1097 -1097
  89. package/styles/search.scss +1200 -1200
  90. package/styles/tide-form-variables.scss +275 -275
  91. package/styles/tide-form.scss +56 -56
  92. package/build/build-cjs/src/search-results/utils/booked-entry-utils.d.ts +0 -20
  93. package/build/build-esm/src/search-results/utils/booked-entry-utils.d.ts +0 -20
@@ -1,734 +1,734 @@
1
- :root {
2
- // COLOR ASSIGNMENTS
3
- --tide-booking-color-primary: #333399;
4
- --tide-booking-color-primary-gradient: linear-gradient(204.08deg, #333399 1.64%, #282878 84.55%);
5
- --tide-booking-color-primary-fade: #ebebf8;
6
- --tide-booking-color-primary-extra-fade: #f8f8fd;
7
- --tide-booking-color-primary-light: #cdcdee;
8
- --tide-booking-color-primary-light-text: #3333997d;
9
- --tide-booking-color-primary-dark: #282878;
10
- --tide-booking-color-secondary: #1f9470;
11
- --tide-booking-color-secondary-light: #11b684;
12
-
13
- --tide-booking-color-star: #ecb911;
14
- --tide-booking-color-star-light: #ecd790;
15
- // --tide-booking-invalid: #e74c3c;
16
- --tide-booking-invalid: #871d11;
17
- --tide-booking-invalid-light: #fce8e6;
18
- --tide-booking-invalid-dark: #871d11;
19
- --tide-booking-price-increase: #e81212;
20
- --tide-booking-price-decrease: #19a364;
21
-
22
- --tide-booking-white: #ffffff;
23
- --tide-booking-gray-light: #f5f5f5;
24
- --tide-booking-gray-xlight: #fbfbfb;
25
- --tide-booking-gray--medium-light: #efefef;
26
- --tide-booking-gray-background-light: #e2e2e2;
27
- --tide-booking-gray-border-light: #f3f3f3;
28
- --tide-booking-gray-checkbox-bg: #bdbdbd;
29
- --tide-booking-gray-medium: #cbcbcb;
30
- --tide-booking-gray-dark: #666666;
31
- --tide-booking-black: #0a0a0a;
32
- --tide-booking-transparent: transparent;
33
-
34
- // BACKGROUNDS
35
- --tide-booking-bg: #fafafa;
36
-
37
- // TYPOGRAPHY
38
- --tide-booking-font-heading: 'Outfit', serif;
39
- --tide-booking-font-body: 'Outfit', serif;
40
- --tide-booking-font-handwritten: 'Outfit', serif;
41
-
42
- --tide-booking-font-size-body: 14px;
43
- --tide-booking-font-size-body-lg: 16px;
44
- --tide-booking-line-height-body: 1;
45
-
46
- // GRID
47
- --tide-booking-container-wide: 1690px;
48
- --tide-booking-container-medium: 1200px;
49
- --tide-booking-container-small: 900px;
50
- --tide-booking-container-article: 650px;
51
- --tide-booking-gutter: 15px;
52
-
53
- // MEDIA QUERIES
54
- --tide-booking-screen-xs: 576px;
55
- --tide-booking-screen-sm: 768px;
56
- --tide-booking-screen-md: 992px;
57
- --tide-booking-screen-lg: 1200px;
58
- --tide-booking-screen-xgl: 1440px;
59
- --tide-booking-screen-xl: 1650px;
60
- --tide-booking-screen-xxl: 1920px;
61
-
62
- //HEADINGS
63
- --tide-booking-heading-color: var(--tide-booking-black);
64
-
65
- //h1
66
- --tide-booking-h1: 32px;
67
- --tide-booking-h1-sm: 40px;
68
- --tide-booking-h1-xl: 40px;
69
-
70
- //h2
71
- --tide-booking-h2: 24px;
72
- --tide-booking-h2-sm: 32px;
73
- --tide-booking-h2-xl: 32px;
74
-
75
- //h3
76
- --tide-booking-h3: 18px;
77
- --tide-booking-h3-sm: 24px;
78
- --tide-booking-h3-xl: 24px;
79
-
80
- //h4
81
- --tide-booking-h4: 16px;
82
- --tide-booking-h4-sm: 18px;
83
- --tide-booking-h4-xl: 18px;
84
-
85
- //h5
86
- --tide-booking-h5: 16px;
87
- --tide-booking-h5-xl: 18px;
88
-
89
- //h6
90
- --tide-booking-h6: 16px;
91
- --tide-booking-h6-md: 18px;
92
-
93
- //a
94
- --tide-booking-a-color: var(--tide-booking-color-primary);
95
- --tide-booking-a-text-decoration: underline;
96
- --tide-booking-a-color-hover: var(--tide-booking-color-primary-dark);
97
- --tide-booking-a-text-decoration-hover: underline;
98
- --tide-booking-a-color-focus: var(--tide-booking-color-primary-dark);
99
- --tide-booking-a-text-decoration-focus: underline;
100
-
101
- //small fontsize
102
- --tide-booking-small-font-size--mobile: 13px;
103
- --tide-booking-small-font-size--desktop: 15px;
104
-
105
- //INPUT
106
- --tide-booking-input-background: var(--tide-booking-white);
107
- --tide-booking-input-border: 1.5px solid var(--tide-booking-gray--medium-light);
108
- --tide-booking-input-border-radius: 5px;
109
- --tide-booking-input-color: var(--tide-booking-black);
110
- --tide-booking-input-height: 45px;
111
- --tide-booking-input-icon-color: var(--tide-booking-gray-dark);
112
-
113
- //INPUT--lg
114
- --tide-booking-input-height-lg: 45px;
115
-
116
- //INPUT--FOCUS/ACTIVE
117
- --tide-booking-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
118
- --tide-booking-input-icon-color-focus: var(--tide-booking-color-primary);
119
-
120
- //INPUT--PLACEHOLDER
121
- --tide-booking-input-placeholder-color: var(--tide-booking-gray-dark);
122
- --tide-booking-input-placeholder-font-style: normal;
123
-
124
- //INPUT--LABEL
125
- --tide-booking-input-label-color: var(--tide-booking-gray-dark);
126
- --tide-booking-input-label-font-size: 14px;
127
- --tide-booking-input-label-font-weight: 400;
128
- --tide-booking-input-label-font-style: normal;
129
-
130
- //INPUT--reverse-btn
131
- --tide-booking-input-reverse-btn-background: var(--tide-booking-white);
132
- --tide-booking-input-reverse-btn-border: none;
133
- --tide-booking-input-reverse-btn-border-radius: 50%;
134
- --tide-booking-input-reverse-btn-box-shadow: 0 0px 6px rgba(0, 0, 0, 0.1);
135
- --tide-booking-input-reverse-btn-fill: var(--tide-booking-gray-dark);
136
-
137
- --tide-booking-input-reverse-btn-fill-hover: var(--tide-booking-color-primary);
138
- --tide-booking-input-reverse-btn-box-shadow-hover: 0 0px 6px rgba(0, 0, 0, 0.2);
139
- --tide-booking-input-reverse-btn-border-hover: none;
140
- --tide-booking-input-reverse-btn-background-hover: var(--tide-booking-white);
141
-
142
- //RADIOBUTTON
143
- --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
144
- --tide-booking-radiobutton-background: var(--tide-booking-white);
145
- --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
146
- --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
147
- --tide-booking-radiobutton-font-size: 16px;
148
- --tide-booking-radiobutton-font-weight: 400;
149
-
150
- //RADIOBUTTON--INPUT--CHECKED
151
- --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
152
- --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
153
- --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
154
-
155
- //CHECKBOX--INPUT--CHECKED--AFTER
156
- --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
157
-
158
- //CHECKBOX
159
- --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
160
- --tide-booking-checkbox-border-radius: 0px;
161
- --tide-booking-checkbox-background: var(--tide-booking-white);
162
- --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
163
- --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
164
- --tide-booking-checkbox-font-size: 16px;
165
- --tide-booking-checkbox-font-weight: 400;
166
-
167
- //CHECKBOX--INPUT--CHECKED
168
- --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
169
- --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
170
- --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
171
- --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
172
-
173
- //SLIDER
174
- --tide-booking-slider-track-background: var(--tide-booking-color-primary);
175
- --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
176
- --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
177
- --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
178
-
179
- //STAR RATING
180
- --tide-booking-star-rating-color: var(--tide-booking-gray-light);
181
- --tide-booking-star-rating-color--filled: var(--tide-booking-color-star);
182
- --tide-booking-star-rating-color--hover: var(--tide-booking-color-star-light);
183
-
184
- //CTA
185
- --tide-booking-cta-height: 45px;
186
- --tide-booking-cta-height-xs: 45px;
187
- --tide-booking-cta-width: 100%;
188
- --tide-booking-cta-width-xs: 100%;
189
- --tide-booking-cta-padding: 10px 20px;
190
- --tide-booking-cta-color: var(--tide-booking-white);
191
- --tide-booking-cta-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
192
- --tide-booking-cta-font-family: var(--tide-booking-font-body);
193
- --tide-booking-cta-font-size: 16px;
194
- --tide-booking-cta-font-size-xs: 18px;
195
- --tide-booking-cta-font-weight: 400;
196
- --tide-booking-cta-text-decoration: none;
197
- --tide-booking-cta-border: none;
198
- --tide-booking-cta-border-radius: 5px;
199
-
200
- //CTA__ICON
201
- --tide-booking-cta-icon-color: var(--tide-booking-white);
202
- --tide-booking-cta-icon-size: 16px;
203
-
204
- //CTA__HOVER
205
- --tide-booking-cta-background-hover: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
206
- --tide-booking-cta-color-hover: var(--tide-booking-white);
207
- --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
208
- --tide-booking-cta-border-hover: none;
209
- --tide-booking-cta-text-decoration-hover: none;
210
-
211
- //CTA__FOCUS
212
- --tide-booking-cta-background-focus: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
213
- --tide-booking-cta-color-focus: var(--tide-booking-white);
214
- --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
215
- --tide-booking-cta-border-focus: none;
216
- --tide-booking-cta-text-decoration-focus: none;
217
-
218
- //CTA--SECONDARY
219
- --tide-booking-cta-height-secondary: 25px;
220
- --tide-booking-cta-height-xs-secondary: 30px;
221
- --tide-booking-cta-width-secondary: auto;
222
- --tide-booking-cta-padding-secondary: 0px;
223
- --tide-booking-cta-margin-secondary: 0px 0 0 0;
224
- --tide-booking-cta-background-secondary: var(--tide-booking-transparent);
225
- --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
226
- --tide-booking-cta-border-secondary: none;
227
- --tide-booking-cta-border-radius-secondary: 5px;
228
- --tide-booking-cta-text-decoration-secondary: underline;
229
- --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
230
- --tide-booking-cta-font-size-secondary: 16px;
231
- --tide-booking-cta-font-size-xs-secondary: 18px;
232
- --tide-booking-cta-font-weight-secondary: 400;
233
-
234
- //CTA--SECONDARY__ICON
235
- --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
236
- --tide-booking-cta-icon-size-secondary: 16px;
237
-
238
- //CTA--SECONDARY__HOVER
239
- --tide-booking-cta-background-secondary-hover: var(--tide-booking-transparent);
240
- --tide-booking-cta-color-secondary-hover: var(--tide-booking-color-primary-dark);
241
- --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-color-primary-dark);
242
- --tide-booking-cta-border-secondary-hover: none;
243
- --tide-booking-cta-text-decoration-secondary-hover: underline;
244
-
245
- //CTA--SECONDARY__FOCUS
246
- --tide-booking-cta-background-secondary-focus: var(--tide-booking-transparent);
247
- --tide-booking-cta-color-secondary-focus: var(--tide-booking-color-primary-dark);
248
- --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-color-primary-dark);
249
- --tide-booking-cta-border-secondary-focus: none;
250
- --tide-booking-cta-text-decoration-secondary-focus: underline;
251
-
252
- //CTA--SELECT
253
- --tide-booking-cta-background-select: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
254
- --tide-booking-cta-color-select: var(--tide-booking-color-primary);
255
- --tide-booking-cta-border-select: none;
256
- --tide-booking-cta-border-radius-select: 5px;
257
-
258
- //CTA--SELECT--HOVER/FOCUS/ACTIVE
259
- --tide-booking-cta-background-select-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
260
- --tide-booking-cta-color-select-hover: var(--tide-booking-color-primary-dark);
261
- --tide-booking-cta-border-select-hover: none;
262
-
263
- //CTA--SELECTED
264
- --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
265
- --tide-booking-cta-color-selected: var(--tide-booking-white);
266
- --tide-booking-cta-border-selected: none;
267
- --tide-booking-cta-border-radius-selected: 5px;
268
- --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
269
-
270
- //CTA--remove
271
- --tide-booking-cta-height-remove: auto;
272
- --tide-booking-cta-width-remove: auto;
273
- --tide-booking-cta-padding-remove: 0px;
274
- --tide-booking-cta-background-remove: var(--tide-booking-transparent);
275
- --tide-booking-cta-color-remove: var(--tide-booking-gray-medium);
276
- --tide-booking-cta-border-remove: none;
277
- --tide-booking-cta-border-radius-remove: 5px;
278
- --tide-booking-cta-text-decoration-remove: underline;
279
-
280
- //CTA--remove__ICON
281
- --tide-booking-cta-icon-color-remove: var(--tide-booking-invalid);
282
- --tide-booking-cta-icon-size-remove: 16px;
283
-
284
- //CTA--remove__HOVER, __focus
285
- --tide-booking-cta-background-remove-hover: var(--tide-booking-transparent);
286
- --tide-booking-cta-color-remove-hover: var(--tide-booking-gray-dark);
287
- --tide-booking-cta-icon-color-remove-hover: var(--tide-booking-gray-dark);
288
- --tide-booking-cta-border-remove-hover: none;
289
- --tide-booking-cta-text-decoration-remove-hover: underline;
290
-
291
- //INCREMENT__DECREMENT
292
- //INCREMENT__DECREMENT--btns
293
- --tide-booking-decrement-increment-width: 30px;
294
- --tide-booking-decrement-increment-height: 30px;
295
- --tide-booking-decrement-increment-border-radius: 5px;
296
- --tide-booking-decrement-increment-border: 0px solid var(--tide-booking-color-primary-fade);
297
- --tide-booking-decrement-increment-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
298
- --tide-booking-decrement-increment-color: var(--tide-booking-color-primary);
299
-
300
- //INCREMENT__DECREMENT--btns--icon
301
- --tide-booking-decrement-increment-icon-width: 15px;
302
- --tide-booking-decrement-increment-icon-height: 15px;
303
- --tide-booking-decrement-increment-icon-color: var(--tide-booking-color-primary);
304
-
305
- //INCREMENT__DECREMENT--btns--hover
306
- --tide-booking-decrement-increment-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
307
- --tide-booking-decrement-increment-color-hover: var(--tide-booking-color-primary-dark);
308
- --tide-booking-decrement-increment-border-hover: 0px solid var(--tide-booking-color-primary-fade);
309
-
310
- //INCREMENT__DECREMENT--btns--icon--hover
311
- --tide-booking-decrement-increment-icon-color-hover: var(--tide-booking-color-primary-dark);
312
-
313
- //INCREMENT__DECREMENT--btns--focus
314
- --tide-booking-decrement-increment-background-focus: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
315
- --tide-booking-decrement-increment-color-focus: var(--tide-booking-color-primary);
316
- --tide-booking-decrement-increment-border-focus: 0px solid var(--tide-booking-color-primary-fade);
317
-
318
- //INCREMENT__DECREMENT--btns--icon--focus
319
- --tide-booking-decrement-increment-icon-color-focus: var(--tide-booking-color-primary-dark);
320
-
321
- //INCREMENT__DECREMENT--LABEL
322
- --tide-booking-decrement-increment-label-font: var(--tide-booking-font-size-body);
323
- --tide-booking-decrement-increment-label-font-weight: 400;
324
- --tide-booking-decrement-increment-label-color: var(--tide-booking-black);
325
-
326
- //INCREMENT__DECREMENT--NUMBER
327
- --tide-booking-decrement-increment-number-font: var(--tide-booking-font-size-body);
328
- --tide-booking-decrement-increment-number-font-weight: 400;
329
- --tide-booking-decrement-increment-number-color: var(--tide-booking-color-primary);
330
-
331
- //DROPDOWN
332
- --tide-booking-dropdown-background: var(--tide-booking-white);
333
- --tide-booking-dropdown-color: var(--tide-booking-gray-dark);
334
- --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-gray-light);
335
- --tide-booking-dropdown-border-radius: 5px;
336
- --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
337
-
338
- //DROPDOWN--HOVER
339
- --tide-booking-dropdown-border-hover: 1.5px solid var(--tide-booking-color-primary-light);
340
- --tide-booking-dropdown-color-hover: var(--tide-booking-color-primary);
341
- --tide-booking-dropdown-background-hover: var(--tide-booking-white);
342
-
343
- //DROPDOWN--focus
344
- --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary);
345
- --tide-booking-dropdown-color-focus: var(--tide-booking-color-primary);
346
- --tide-booking-dropdown-background-focus: var(--tide-booking-white);
347
-
348
- --tide-booking-dropdown-arrow-color: var(--tide-booking-black);
349
- --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
350
-
351
- --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
352
-
353
- //DROPDOWN--menu
354
- --tide-booking-dropdown-menu-background: var(--tide-booking-white);
355
- --tide-booking-dropdown-menu-border: 1.5px solid var(--tide-booking-gray-border-light);
356
- --tide-booking-dropdown-menu-border-radius: 5px;
357
- --tide-booking-dropdown-menu-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
358
-
359
- --tide-booking-dropdown-menu-option-color: var(--tide-booking-gray-dark);
360
- --tide-booking-dropdown-menu-option-background-hover: var(--tide-booking-gray-light);
361
- --tide-booking-dropdown-menu-option-color-hover: var(--tide-booking-color-primary);
362
- --tide-booking-dropdown-menu-option-background-selected: var(--tide-booking-color-primary);
363
- --tide-booking-dropdown-menu-option-color-selected: var(--tide-booking-white);
364
-
365
- //DATEPICKER
366
- --tide-booking-datepicker-container-background: rgba(255, 255, 255, 0.97);
367
- --tide-booking-datepicker-container-border: 1.5px solid var(--tide-booking-gray-border-light);
368
- --tide-booking-datepicker-close-color: var(--tide-booking-color-primary);
369
-
370
- --tide-booking-datepicker-prev-next-color: var(--tide-booking-color-primary);
371
- --tide-booking-datepicker-prev-next-background: var(--tide-booking-transparent);
372
-
373
- --tide-booking-datepicker-day-labels-color: var(--tide-booking-black);
374
-
375
- --tide-booking-datepicker-month-color: var(--tide-booking-black);
376
- --tide-booking-datepicker-month-font: var(--tide-booking-font-heading);
377
-
378
- //DATEPICKER--DAY
379
- --tide-booking-datepicker-day-color: var(--tide-booking-gray-dark);
380
- --tide-booking-datepicker-day-background: var(--tide-booking-white);
381
- --tide-booking-datepicker-day-border: 1.5px solid var(--tide-booking-gray-border-light);
382
- --tide-booking-datepicker-day-border-radius: 5px;
383
-
384
- //DATEPICKER--DAY--HOVER
385
- --tide-booking-datepicker-day-border-hover: 1.5px solid var(--tide-booking-color-primary);
386
- --tide-booking-datepicker-day-background-hover: var(--tide-booking-color-primary-fade);
387
- --tide-booking-datepicker-day-color-hover: var(--tide-booking-color-primary);
388
-
389
- //DATEPICKER--DAY--SELECTED
390
- --tide-booking-datepicker-day-border-selected: 1.5px solid var(--tide-booking-color-primary);
391
- --tide-booking-datepicker-day-background-selected: var(--tide-booking-color-primary);
392
- --tide-booking-datepicker-day-color-selected: var(--tide-booking-white);
393
-
394
- //DATEPICKER--DAY--SELECTED--HOVER
395
- --tide-booking-datepicker-day-border-selected-hover: 1.5px solid var(--tide-booking-color-primary-light);
396
- --tide-booking-datepicker-day-background-selected-hover: var(--tide-booking-color-primary-light);
397
- --tide-booking-datepicker-day-color-selected-hover: var(--tide-booking-white);
398
-
399
- //DATEPICKER--DAY--DISABLED
400
- --tide-booking-datepicker-day-color-disabled: var(--tide-booking-gray-medium);
401
- --tide-booking-datepicker-day-background-disabled: var(--tide-booking-gray-xlight);
402
- --tide-booking-datepicker-day-border-disabled: 1.5px solid var(--tide-booking-gray-border-light);
403
-
404
- //DATEPICKER--DAY--OUTSIDE-MONTH
405
- --tide-booking-datepicker-day-color-outside-month: var(--tide-booking-gray-medium);
406
- --tide-booking-datepicker-day-background-outside-month: var(--tide-booking-gray-xlight);
407
- --tide-booking-datepicker-day-border-outside-month: 1.5px solid var(--tide-booking-gray-border-light);
408
- --tide-booking-datepicker-day-opacity-outside-month: 0.6;
409
-
410
- //DATEPICKER--INPUT
411
- --tide-booking-datepicker-input-height: 45px;
412
- --tide-booking-datepicker-input-height-lg: 55px;
413
- --tide-booking-datepicker-input-background: var(--tide-booking-white);
414
- --tide-booking-datepicker-input-border: 1.5px solid var(--tide-booking-gray-border-light);
415
- --tide-booking-datepicker-input-border-radius: 5px;
416
- --tide-booking-datepicker-input-color: var(--tide-booking-black);
417
-
418
- --tide-booking-datepicker-input-label-color: var(--tide-booking-color-primary-dark);
419
-
420
- //SPINNER
421
- --tide-booking-spinner-border: 5px solid rgba(255, 255, 255, 0.2);
422
- --tide-booking-spinner-border-top-color: #dce1ff;
423
-
424
- //ANIMATION
425
- --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
426
-
427
- //SEARCH
428
- --tide-booking-search-results-background: var(--tide-booking-bg);
429
-
430
- //SEARCH RESET
431
- --tide-booking-search-reset-background: var(--tide-booking-transparent);
432
- --tide-booking-search-reset-color: var(--tide-booking-color-primary);
433
- --tide-booking-search-reset-text-decoration: underline;
434
- --tide-booking-search-reset-font-weight: 400;
435
- --tide-booking-search-reset-font-size: 16px;
436
-
437
- //SEARCH FILTER
438
- --tide-booking-search-filter-background: var(--tide-booking-white);
439
- --tide-booking-search-filter-border: 1.5px solid var(--tide-booking-gray-border-light);
440
- --tide-booking-search-filter-border-radius: 10px;
441
-
442
- --tide-booking-search-reset-color: var(--tide-booking-color-primary);
443
- --tide-booking-search-reset-text-decoration: underline;
444
-
445
- --tide-booking-search-filter-group-title-text-color: var(--tide-booking-gray-dark);
446
- --tide-booking-search-filter-group-title-text-font-weight: 500;
447
- --tide-booking-search-filter-group-title-text-font-family: var(--tide-booking-font-body);
448
- --tide-booking-search-filter-group-title-text-border: 1.5px solid var(--tide-booking-gray-border-light);
449
-
450
- --tide-booking-search-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
451
- --tide-booking-search-filter-group-title-subtext-font-weight: 400;
452
- --tide-booking-search-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
453
-
454
- //SEARCH FILTER MOBILE BTN
455
- --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
456
- --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
457
- --tide-booking-flight-options-filter-btn-border: 2px solid var(--tide-booking-color-primary);
458
- --tide-booking-flight-options-filter-btn-border-radius: 4px;
459
- --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
460
-
461
- --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
462
- --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
463
- --tide-booking-flight-options-filter-btn-hover-border: 2px solid var(--tide-booking-transparent);
464
- --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
465
-
466
- //SEARCH FILTER IMG
467
- --tide-booking-search-filter-img-border-radius: 5px;
468
- --tide-booking-search-filter-img-text-color: var(--tide-booking-white);
469
- --tide-booking-search-filter-img-text-font-weight: 300;
470
- --tide-booking-search-filter-img-text-font-family: var(--tide-booking-font-body);
471
- --tide-booking-search-filter-img-title-color: var(--tide-booking-white);
472
- --tide-booking-search-filter-img-title-font-weight: 600;
473
- --tide-booking-search-filter-img-title-font-family: var(--tide-booking-font-heading);
474
-
475
- //SEARCH FILTER PRICE
476
- --tide-booking-search-filter-price-amount-font-family: var(--tide-booking-font-heading);
477
- --tide-booking-search-filter-price-amount-font-weight: 600;
478
- --tide-booking-search-filter-price-amount-color: var(--tide-booking-color-primary);
479
-
480
- --tide-booking-search-filter-price-text-font-family: var(--tide-booking-font-body);
481
- --tide-booking-search-filter-price-text-font-weight: 400;
482
- --tide-booking-search-filter-price-text-color: var(--tide-booking-gray-dark);
483
-
484
- --tide-booking-search-filter-price-total-font-weight: 600;
485
- --tide-booking-search-filter-price-total-color: var(--tide-booking-black);
486
-
487
- //SEARCH ITINERARY FILTER
488
- --tide-booking-search-itinerary-filter-title-font-family: var(--tide-booking-font-heading);
489
- --tide-booking-search-itinerary-filter-title-font-weight: 500;
490
- --tide-booking-search-itinerary-filter-title-color: var(--tide-booking-gray-dark);
491
-
492
- //--COUNTRY
493
- --tide-booking-search-itinerary-filter-country-background: transparent;
494
- --tide-booking-search-itinerary-filter-country-border: none;
495
- --tide-booking-search-itinerary-filter-country-border-radius: 5px;
496
- --tide-booking-search-itinerary-filter-country-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.08);
497
-
498
- --tide-booking-search-itinerary-filter-country-icon-color: var(--tide-booking-gray-dark);
499
-
500
- --tide-booking-search-itinerary-filter-country-title-font-family: var(--tide-booking-font-heading);
501
- --tide-booking-search-itinerary-filter-country-title-font-weight: 600;
502
- --tide-booking-search-itinerary-filter-country-title-color: var(--tide-booking-black);
503
-
504
- --tide-booking-search-itinerary-filter-country-text-font-family: var(--tide-booking-font-body);
505
- --tide-booking-search-itinerary-filter-country-text-font-weight: 400;
506
- --tide-booking-search-itinerary-filter-country-text-color: var(--tide-booking-gray-dark);
507
-
508
- --tide-booking-search-itinerary-filter-country-text-bold-font-weight: 600;
509
- --tide-booking-search-itinerary-filter-country-text-bold-color: var(--tide-booking-black);
510
-
511
- //--TRANSPORT
512
- --tide-booking-search-itinerary-filter-transport-background: transparent;
513
- --tide-booking-search-itinerary-filter-transport-border: none;
514
- --tide-booking-search-itinerary-filter-transport-border-radius: none;
515
- --tide-booking-search-itinerary-filter-transport-box-shadow: none;
516
-
517
- --tide-booking-search-itinerary-filter-transport-timeline: 1px dashed var(--tide-booking-gray-dark);
518
-
519
- --tide-booking-search-itinerary-filter-transport-badge-icon-background-color: var(--tide-booking-white);
520
- --tide-booking-search-itinerary-filter-transport-badge-icon-color: var(--tide-booking-color-primary);
521
-
522
- --tide-booking-search-itinerary-filter-transport-date-day-font-weight: 600;
523
- --tide-booking-search-itinerary-filter-transport-date-day-color: var(--tide-booking-black);
524
-
525
- --tide-booking-search-itinerary-filter-transport-date-month-font-weight: 400;
526
- --tide-booking-search-itinerary-filter-transport-date-month-color: var(--tide-booking-black);
527
-
528
- --tide-booking-search-itinerary-filter-transport-title-font-weight: 600;
529
- --tide-booking-search-itinerary-filter-transport-title-color: var(--tide-booking-black);
530
-
531
- --tide-booking-search-itinerary-filter-transport-plane-font-weight: 600;
532
- --tide-booking-search-itinerary-filter-transport-plane-color: var(--tide-booking-black);
533
- --tide-booking-search-itinerary-filter-transport-plane-icon-color: var(--tide-booking-gray-medium);
534
-
535
- //--SEGMENT
536
- --tide-booking-search-itinerary-filter-segments-background: transparent;
537
- --tide-booking-search-itinerary-filter-segments-border: none;
538
- --tide-booking-search-itinerary-filter-segments-border-radius: 5px;
539
- --tide-booking-search-itinerary-filter-segments-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.08);
540
-
541
- --tide-booking-search-itinerary-filter-segment-timeline: 1px dashed var(--tide-booking-gray-dark);
542
-
543
- --tide-booking-search-itinerary-filter-segment-badge-icon-background-color: var(--tide-booking-color-primary);
544
- --tide-booking-search-itinerary-filter-segment-badge-icon-color: var(--tide-booking-white);
545
- --tide-booking-search-itinerary-filter-segment-badge--secondary-icon-background-color: orangered;
546
- --tide-booking-search-itinerary-filter-segment-badge--secondary-icon-color: var(--tide-booking-white);
547
-
548
- --tide-booking-search-itinerary-service-flight-color: #99a9ff;
549
- --tide-booking-search-itinerary-service-hotel-color: #3f9bff;
550
- --tide-booking-search-itinerary-service-excursion-color: #f39c12;
551
- --tide-booking-search-itinerary-service-poi-color: #3ec758;
552
- --tide-booking-search-itinerary-service-restaurant-color: #ffcc00;
553
-
554
- --tide-booking-search-itinerary-filter-segment-date-day-font-weight: 600;
555
- --tide-booking-search-itinerary-filter-segment-date-day-color: var(--tide-booking-black);
556
-
557
- --tide-booking-search-itinerary-filter-segment-date-month-font-weight: 400;
558
- --tide-booking-search-itinerary-filter-segment-date-month-color: var(--tide-booking-black);
559
-
560
- --tide-booking-search-itinerary-filter-segment-title-font-weight: 600;
561
- --tide-booking-search-itinerary-filter-segment-title-color: var(--tide-booking-black);
562
-
563
- --tide-booking-search-itinerary-filter-segment-text-font-weight: 400;
564
- --tide-booking-search-itinerary-filter-segment-text-color: var(--tide-booking-gray-dark);
565
-
566
- //SEARCH RESULTS LABEL
567
- --tide-booking-search-results-label-background: var(--tide-booking-transparent);
568
- --tide-booking-search-results-label-border: 1.5px solid var(--tide-booking-gray-medium);
569
- --tide-booking-search-results-label-border-radius: 5px;
570
- --tide-booking-search-results-label-box-shadow: none;
571
-
572
- --tide-booking-search-results-label-title-font-weight: 400;
573
- --tide-booking-search-results-label-title-color: var(--tide-booking-gray-dark);
574
- --tide-booking-search-results-label-title-bold-font-weight: 600;
575
- --tide-booking-search-results-label-title-bold-color: var(--tide-booking-black);
576
-
577
- --tide-booking-search-results-label-date-background: var(--tide-booking-gray-dark);
578
- --tide-booking-search-results-label-date-border: 1.5px solid var(--tide-booking-gray-dark);
579
-
580
- --tide-booking-search-results-label-date-background--secondary: var(--tide-booking-color-secondary);
581
- --tide-booking-search-results-label-date-border--secondary: 1.5px solid var(--tide-booking-color-secondary);
582
-
583
- --tide-booking-search-results-label-date-day-font-weight: 600;
584
- --tide-booking-search-results-label-date-day-color: var(--tide-booking-white);
585
-
586
- --tide-booking-search-results-label-date-month-font-weight: 400;
587
- --tide-booking-search-results-label-date-month-color: var(--tide-booking-white);
588
-
589
- //SEARCH MORE OPTIONS
590
- --tide-booking-search-more-options-background: var(--tide-booking-gray-border-light);
591
- --tide-booking-search-more-options-border: 1px solid var(--tide-booking-gray-border-light);
592
- --tide-booking-search-more-options-border-radius: 5px;
593
- --tide-booking-search-more-options-box-shadow: none;
594
- --tide-booking-search-more-options-color: var(--tide-booking-gray-dark);
595
-
596
- //SEARCH TAB-VIEW
597
- --tide-booking-search-tab-view-background: var(--tide-booking-transparent);
598
- --tide-booking-search-tab-view-border: 2px solid var(--tide-booking-gray-border-light);
599
- --tide-booking-search-tab-view-color: var(--tide-booking-gray-dark);
600
- //HOVER
601
- --tide-booking-search-tab-view-hover-background: var(--tide-booking-transparent);
602
- --tide-booking-search-tab-view-hover-border: 2px solid var(--tide-booking-color-primary-light);
603
- --tide-booking-search-tab-view-hover-color: var(--tide-booking-gray-dark);
604
-
605
- //--ACTIVE
606
- --tide-booking-search-tab-view-active-background: var(--tide-booking-transparent);
607
- --tide-booking-search-tab-view-active-border: 2px solid var(--tide-booking-color-primary);
608
- --tide-booking-search-tab-view-active-color: var(--tide-booking-black);
609
-
610
- //SEARCH HOTEL CARD
611
- --tide-booking-search-hotel-card-background: var(--tide-booking-white);
612
- --tide-booking-search-hotel-card-border: 1.5px solid var(--tide-booking-gray-border-light);
613
- --tide-booking-search-hotel-card-border-radius: 8px;
614
- --tide-booking-search-hotel-card-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
615
-
616
- //SEARCH HOTEL CARD--title
617
- --tide-booking-search-hotel-card-title-font-family: var(--tide-booking-font-heading);
618
- --tide-booking-search-hotel-card-title-font-weight: 500;
619
- --tide-booking-search-hotel-card-title-color: var(--tide-booking-black);
620
-
621
- //SEARCH HOTEL CARD--starrating
622
- --tide-booking-search-hotel-card-starrating-color: var(--tide-booking-star-rating-color--filled);
623
-
624
- //SEARCH HOTEL CARD--location
625
- --tide-booking-search-hotel-card-location-text-decoration: var(--tide-booking-font-body);
626
- --tide-booking-search-hotel-card-location-font-weight: 500;
627
- --tide-booking-search-hotel-card-location-color: var(--tide-booking-gray-dark);
628
- --tide-booking-search-hotel-card-location-icon-color: var(--tide-booking-gray-dark);
629
-
630
- //SEARCH HOTEL CARD--price
631
- --tide-booking-search-hotel-card-price-font-family: var(--tide-booking-font-heading);
632
- --tide-booking-search-hotel-card-price-font-weight: 600;
633
- --tide-booking-search-hotel-card-price-color: var(--tide-booking-black);
634
- --tide-booking-search-hotel-card-price-background-color: rgba(255, 255, 255, 0.85);
635
- --tide-booking-search-hotel-card-price-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
636
-
637
- --tide-booking-search-hotel-card-price-label-font-weight: 300;
638
- --tide-booking-search-hotel-card-price-label-color: var(--tide-booking-gray-dark);
639
-
640
- //SEARCH HOTEL CARD--option
641
- --tide-booking-search-hotel-card-option-font-weight: 300;
642
- --tide-booking-search-hotel-card-option-color: var(--tide-booking-black);
643
- --tide-booking-search-hotel-card-option-icon-color: var(--tide-booking-black);
644
-
645
- //SEARCH HOTEL CARD--description
646
- --tide-booking-search-hotel-card-description-font-weight: 300;
647
- --tide-booking-search-hotel-card-description-color: var(--tide-booking-gray-dark);
648
-
649
- //SEARCH HOTEL CARD ALLOTMENTS
650
- --tide-booking-search-hotel-card-allotments-background: var(--tide-booking-white);
651
- --tide-booking-search-hotel-card-allotments-border: none;
652
- --tide-booking-search-hotel-card-allotments-border-radius: 24px;
653
- --tide-booking-search-hotel-card-allotments-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
654
- --tide-booking-search-hotel-card-allotments-font-weight: 400;
655
- --tide-booking-search-hotel-card-allotments-color: var(--tide-booking-invalid);
656
-
657
- --tide-booking-search-hotel-card-allotments-title-font-weight: 500;
658
- --tide-booking-search-hotel-card-allotments-title-color: var(--tide-booking-black);
659
-
660
- --tide-booking-search-hotel-card-allotments-date-font-weight: 600;
661
- --tide-booking-search-hotel-card-allotments-date-color: var(--tide-booking-color-secondary);
662
-
663
- --tide-booking-search-hotel-card-allotments-price-font-weight: 600;
664
- --tide-booking-search-hotel-card-allotments-price-color: var(--tide-booking-color-primary);
665
-
666
- --tide-booking-search-hotel-card-allotments-badge-background: var(--tide-booking-price-decrease);
667
- --tide-booking-search-hotel-card-allotments-badge-border: none;
668
- --tide-booking-search-hotel-card-allotments-badge-border-radius: 5px;
669
- --tide-booking-search-hotel-card-allotments-badge-color: var(--tide-booking-white);
670
- --tide-booking-search-hotel-card-allotments-badge-font-weight: 400;
671
-
672
- --tide-booking-search-hotel-card-allotments-badge--secondary-background: orangered;
673
- --tide-booking-search-hotel-card-allotments-badge--secondary-border: none;
674
- --tide-booking-search-hotel-card-allotments-badge--secondary-color: var(--tide-booking-white);
675
-
676
- --tide-booking-search-hotel-card-allotments-persons-font-weight: 400;
677
- --tide-booking-search-hotel-card-allotments-persons-color: var(--tide-booking-color-primary);
678
- --tide-booking-search-hotel-card-allotments-persons-number-color: var(--tide-booking-gray-dark);
679
-
680
- //TOGGLE BTN
681
- --tide-booking-step-card-background: var(--tide-booking-white);
682
- --tide-booking-step-card-border: 1.5px solid var(--tide-booking-gray-border-light);
683
- --tide-booking-step-card-border-radius: 10px;
684
-
685
- --tide-booking-step-toggle-btn-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
686
- --tide-booking-step-toggle-btn-border: none;
687
- --tide-booking-step-toggle-btn-border-radius: 5px;
688
- --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
689
- //HOVER,FOCUS
690
- --tide-booking-step-toggle-btn-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
691
- --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary-dark);
692
- --tide-booking-step-toggle-btn-border-hover: none;
693
-
694
- //SEARCH FLIGHT OPTIONS
695
- --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
696
- --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
697
- --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
698
-
699
- --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
700
- --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
701
-
702
- --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
703
- --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
704
- --tide-booking-flight-options-times-title-font-weight: 700;
705
-
706
- --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
707
- --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
708
-
709
- --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
710
-
711
- --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
712
- --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
713
- --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
714
- --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
715
-
716
- --tide-booking-flight-options-detail-card-background: var(--tide-booking-color-primary-extra-fade);
717
- --tide-booking-flight-options-detail-card-border: none;
718
- --tide-booking-flight-options-detail-card-border-radius: 10px;
719
-
720
- //FLIGHT-OPTIONS--DETAIL-TOGGLE
721
- --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
722
- --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
723
- --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
724
- --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
725
-
726
- //HOVER,FOCUS
727
- --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
728
- --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
729
- --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
730
-
731
- //FLIGHT-OPTIONS--FILTER
732
- --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
733
- --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
734
- }
1
+ :root {
2
+ // COLOR ASSIGNMENTS
3
+ --tide-booking-color-primary: #333399;
4
+ --tide-booking-color-primary-gradient: linear-gradient(204.08deg, #333399 1.64%, #282878 84.55%);
5
+ --tide-booking-color-primary-fade: #ebebf8;
6
+ --tide-booking-color-primary-extra-fade: #f8f8fd;
7
+ --tide-booking-color-primary-light: #cdcdee;
8
+ --tide-booking-color-primary-light-text: #3333997d;
9
+ --tide-booking-color-primary-dark: #282878;
10
+ --tide-booking-color-secondary: #1f9470;
11
+ --tide-booking-color-secondary-light: #11b684;
12
+
13
+ --tide-booking-color-star: #ecb911;
14
+ --tide-booking-color-star-light: #ecd790;
15
+ // --tide-booking-invalid: #e74c3c;
16
+ --tide-booking-invalid: #871d11;
17
+ --tide-booking-invalid-light: #fce8e6;
18
+ --tide-booking-invalid-dark: #871d11;
19
+ --tide-booking-price-increase: #e81212;
20
+ --tide-booking-price-decrease: #19a364;
21
+
22
+ --tide-booking-white: #ffffff;
23
+ --tide-booking-gray-light: #f5f5f5;
24
+ --tide-booking-gray-xlight: #fbfbfb;
25
+ --tide-booking-gray--medium-light: #efefef;
26
+ --tide-booking-gray-background-light: #e2e2e2;
27
+ --tide-booking-gray-border-light: #f3f3f3;
28
+ --tide-booking-gray-checkbox-bg: #bdbdbd;
29
+ --tide-booking-gray-medium: #cbcbcb;
30
+ --tide-booking-gray-dark: #666666;
31
+ --tide-booking-black: #0a0a0a;
32
+ --tide-booking-transparent: transparent;
33
+
34
+ // BACKGROUNDS
35
+ --tide-booking-bg: #fafafa;
36
+
37
+ // TYPOGRAPHY
38
+ --tide-booking-font-heading: 'Outfit', serif;
39
+ --tide-booking-font-body: 'Outfit', serif;
40
+ --tide-booking-font-handwritten: 'Outfit', serif;
41
+
42
+ --tide-booking-font-size-body: 14px;
43
+ --tide-booking-font-size-body-lg: 16px;
44
+ --tide-booking-line-height-body: 1;
45
+
46
+ // GRID
47
+ --tide-booking-container-wide: 1690px;
48
+ --tide-booking-container-medium: 1200px;
49
+ --tide-booking-container-small: 900px;
50
+ --tide-booking-container-article: 650px;
51
+ --tide-booking-gutter: 15px;
52
+
53
+ // MEDIA QUERIES
54
+ --tide-booking-screen-xs: 576px;
55
+ --tide-booking-screen-sm: 768px;
56
+ --tide-booking-screen-md: 992px;
57
+ --tide-booking-screen-lg: 1200px;
58
+ --tide-booking-screen-xgl: 1440px;
59
+ --tide-booking-screen-xl: 1650px;
60
+ --tide-booking-screen-xxl: 1920px;
61
+
62
+ //HEADINGS
63
+ --tide-booking-heading-color: var(--tide-booking-black);
64
+
65
+ //h1
66
+ --tide-booking-h1: 32px;
67
+ --tide-booking-h1-sm: 40px;
68
+ --tide-booking-h1-xl: 40px;
69
+
70
+ //h2
71
+ --tide-booking-h2: 24px;
72
+ --tide-booking-h2-sm: 32px;
73
+ --tide-booking-h2-xl: 32px;
74
+
75
+ //h3
76
+ --tide-booking-h3: 18px;
77
+ --tide-booking-h3-sm: 24px;
78
+ --tide-booking-h3-xl: 24px;
79
+
80
+ //h4
81
+ --tide-booking-h4: 16px;
82
+ --tide-booking-h4-sm: 18px;
83
+ --tide-booking-h4-xl: 18px;
84
+
85
+ //h5
86
+ --tide-booking-h5: 16px;
87
+ --tide-booking-h5-xl: 18px;
88
+
89
+ //h6
90
+ --tide-booking-h6: 16px;
91
+ --tide-booking-h6-md: 18px;
92
+
93
+ //a
94
+ --tide-booking-a-color: var(--tide-booking-color-primary);
95
+ --tide-booking-a-text-decoration: underline;
96
+ --tide-booking-a-color-hover: var(--tide-booking-color-primary-dark);
97
+ --tide-booking-a-text-decoration-hover: underline;
98
+ --tide-booking-a-color-focus: var(--tide-booking-color-primary-dark);
99
+ --tide-booking-a-text-decoration-focus: underline;
100
+
101
+ //small fontsize
102
+ --tide-booking-small-font-size--mobile: 13px;
103
+ --tide-booking-small-font-size--desktop: 15px;
104
+
105
+ //INPUT
106
+ --tide-booking-input-background: var(--tide-booking-white);
107
+ --tide-booking-input-border: 1.5px solid var(--tide-booking-gray--medium-light);
108
+ --tide-booking-input-border-radius: 5px;
109
+ --tide-booking-input-color: var(--tide-booking-black);
110
+ --tide-booking-input-height: 45px;
111
+ --tide-booking-input-icon-color: var(--tide-booking-gray-dark);
112
+
113
+ //INPUT--lg
114
+ --tide-booking-input-height-lg: 45px;
115
+
116
+ //INPUT--FOCUS/ACTIVE
117
+ --tide-booking-input-border-focus: 1.5px solid var(--tide-booking-color-primary);
118
+ --tide-booking-input-icon-color-focus: var(--tide-booking-color-primary);
119
+
120
+ //INPUT--PLACEHOLDER
121
+ --tide-booking-input-placeholder-color: var(--tide-booking-gray-dark);
122
+ --tide-booking-input-placeholder-font-style: normal;
123
+
124
+ //INPUT--LABEL
125
+ --tide-booking-input-label-color: var(--tide-booking-gray-dark);
126
+ --tide-booking-input-label-font-size: 14px;
127
+ --tide-booking-input-label-font-weight: 400;
128
+ --tide-booking-input-label-font-style: normal;
129
+
130
+ //INPUT--reverse-btn
131
+ --tide-booking-input-reverse-btn-background: var(--tide-booking-white);
132
+ --tide-booking-input-reverse-btn-border: none;
133
+ --tide-booking-input-reverse-btn-border-radius: 50%;
134
+ --tide-booking-input-reverse-btn-box-shadow: 0 0px 6px rgba(0, 0, 0, 0.1);
135
+ --tide-booking-input-reverse-btn-fill: var(--tide-booking-gray-dark);
136
+
137
+ --tide-booking-input-reverse-btn-fill-hover: var(--tide-booking-color-primary);
138
+ --tide-booking-input-reverse-btn-box-shadow-hover: 0 0px 6px rgba(0, 0, 0, 0.2);
139
+ --tide-booking-input-reverse-btn-border-hover: none;
140
+ --tide-booking-input-reverse-btn-background-hover: var(--tide-booking-white);
141
+
142
+ //RADIOBUTTON
143
+ --tide-booking-radiobutton-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
144
+ --tide-booking-radiobutton-background: var(--tide-booking-white);
145
+ --tide-booking-radiobutton-color-text: var(--tide-booking-gray-dark);
146
+ --tide-booking-radiobutton-font-family: var(--tide-booking-font-body);
147
+ --tide-booking-radiobutton-font-size: 16px;
148
+ --tide-booking-radiobutton-font-weight: 400;
149
+
150
+ //RADIOBUTTON--INPUT--CHECKED
151
+ --tide-booking-radiobutton-input-checked-color-text: var(--tide-booking-color-primary);
152
+ --tide-booking-radiobutton-input-checked-background: var(--tide-booking-white);
153
+ --tide-booking-radiobutton-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
154
+
155
+ //CHECKBOX--INPUT--CHECKED--AFTER
156
+ --tide-booking-radiobutton-input-checked-after-color: var(--tide-booking-color-primary);
157
+
158
+ //CHECKBOX
159
+ --tide-booking-checkbox-border: 1.5px solid var(--tide-booking-gray-checkbox-bg);
160
+ --tide-booking-checkbox-border-radius: 0px;
161
+ --tide-booking-checkbox-background: var(--tide-booking-white);
162
+ --tide-booking-checkbox-color-text: var(--tide-booking-gray-dark);
163
+ --tide-booking-checkbox-font-family: var(--tide-booking-font-body);
164
+ --tide-booking-checkbox-font-size: 16px;
165
+ --tide-booking-checkbox-font-weight: 400;
166
+
167
+ //CHECKBOX--INPUT--CHECKED
168
+ --tide-booking-checkbox-input-checked-check-color: var(--tide-booking-white);
169
+ --tide-booking-checkbox-input-checked-color-text: var(--tide-booking-color-primary);
170
+ --tide-booking-checkbox-input-checked-background: var(--tide-booking-color-primary);
171
+ --tide-booking-checkbox-input-checked-border: 1.5px solid var(--tide-booking-color-primary);
172
+
173
+ //SLIDER
174
+ --tide-booking-slider-track-background: var(--tide-booking-color-primary);
175
+ --tide-booking-slider-range-background: var(--tide-booking-gray-medium);
176
+ --tide-booking-slider-thumb-border-color: var(--tide-booking-white);
177
+ --tide-booking-slider-thumb-background: var(--tide-booking-color-primary);
178
+
179
+ //STAR RATING
180
+ --tide-booking-star-rating-color: var(--tide-booking-gray-light);
181
+ --tide-booking-star-rating-color--filled: var(--tide-booking-color-star);
182
+ --tide-booking-star-rating-color--hover: var(--tide-booking-color-star-light);
183
+
184
+ //CTA
185
+ --tide-booking-cta-height: 45px;
186
+ --tide-booking-cta-height-xs: 45px;
187
+ --tide-booking-cta-width: 100%;
188
+ --tide-booking-cta-width-xs: 100%;
189
+ --tide-booking-cta-padding: 10px 20px;
190
+ --tide-booking-cta-color: var(--tide-booking-white);
191
+ --tide-booking-cta-background: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
192
+ --tide-booking-cta-font-family: var(--tide-booking-font-body);
193
+ --tide-booking-cta-font-size: 16px;
194
+ --tide-booking-cta-font-size-xs: 18px;
195
+ --tide-booking-cta-font-weight: 400;
196
+ --tide-booking-cta-text-decoration: none;
197
+ --tide-booking-cta-border: none;
198
+ --tide-booking-cta-border-radius: 5px;
199
+
200
+ //CTA__ICON
201
+ --tide-booking-cta-icon-color: var(--tide-booking-white);
202
+ --tide-booking-cta-icon-size: 16px;
203
+
204
+ //CTA__HOVER
205
+ --tide-booking-cta-background-hover: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
206
+ --tide-booking-cta-color-hover: var(--tide-booking-white);
207
+ --tide-booking-cta-icon-color-hover: var(--tide-booking-white);
208
+ --tide-booking-cta-border-hover: none;
209
+ --tide-booking-cta-text-decoration-hover: none;
210
+
211
+ //CTA__FOCUS
212
+ --tide-booking-cta-background-focus: linear-gradient(204.08deg, #11b684 1.64%, #1f9470 84.55%);
213
+ --tide-booking-cta-color-focus: var(--tide-booking-white);
214
+ --tide-booking-cta-icon-color-focus: var(--tide-booking-white);
215
+ --tide-booking-cta-border-focus: none;
216
+ --tide-booking-cta-text-decoration-focus: none;
217
+
218
+ //CTA--SECONDARY
219
+ --tide-booking-cta-height-secondary: 25px;
220
+ --tide-booking-cta-height-xs-secondary: 30px;
221
+ --tide-booking-cta-width-secondary: auto;
222
+ --tide-booking-cta-padding-secondary: 0px;
223
+ --tide-booking-cta-margin-secondary: 0px 0 0 0;
224
+ --tide-booking-cta-background-secondary: var(--tide-booking-transparent);
225
+ --tide-booking-cta-color-secondary: var(--tide-booking-color-primary);
226
+ --tide-booking-cta-border-secondary: none;
227
+ --tide-booking-cta-border-radius-secondary: 5px;
228
+ --tide-booking-cta-text-decoration-secondary: underline;
229
+ --tide-booking-cta-font-family-secondary: var(--tide-booking-font-body);
230
+ --tide-booking-cta-font-size-secondary: 16px;
231
+ --tide-booking-cta-font-size-xs-secondary: 18px;
232
+ --tide-booking-cta-font-weight-secondary: 400;
233
+
234
+ //CTA--SECONDARY__ICON
235
+ --tide-booking-cta-icon-color-secondary: var(--tide-booking-color-primary);
236
+ --tide-booking-cta-icon-size-secondary: 16px;
237
+
238
+ //CTA--SECONDARY__HOVER
239
+ --tide-booking-cta-background-secondary-hover: var(--tide-booking-transparent);
240
+ --tide-booking-cta-color-secondary-hover: var(--tide-booking-color-primary-dark);
241
+ --tide-booking-cta-icon-color-secondary-hover: var(--tide-booking-color-primary-dark);
242
+ --tide-booking-cta-border-secondary-hover: none;
243
+ --tide-booking-cta-text-decoration-secondary-hover: underline;
244
+
245
+ //CTA--SECONDARY__FOCUS
246
+ --tide-booking-cta-background-secondary-focus: var(--tide-booking-transparent);
247
+ --tide-booking-cta-color-secondary-focus: var(--tide-booking-color-primary-dark);
248
+ --tide-booking-cta-icon-color-secondary-focus: var(--tide-booking-color-primary-dark);
249
+ --tide-booking-cta-border-secondary-focus: none;
250
+ --tide-booking-cta-text-decoration-secondary-focus: underline;
251
+
252
+ //CTA--SELECT
253
+ --tide-booking-cta-background-select: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
254
+ --tide-booking-cta-color-select: var(--tide-booking-color-primary);
255
+ --tide-booking-cta-border-select: none;
256
+ --tide-booking-cta-border-radius-select: 5px;
257
+
258
+ //CTA--SELECT--HOVER/FOCUS/ACTIVE
259
+ --tide-booking-cta-background-select-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
260
+ --tide-booking-cta-color-select-hover: var(--tide-booking-color-primary-dark);
261
+ --tide-booking-cta-border-select-hover: none;
262
+
263
+ //CTA--SELECTED
264
+ --tide-booking-cta-background-selected: var(--tide-booking-color-primary-gradient);
265
+ --tide-booking-cta-color-selected: var(--tide-booking-white);
266
+ --tide-booking-cta-border-selected: none;
267
+ --tide-booking-cta-border-radius-selected: 5px;
268
+ --tide-booking-cta-color-selected-icon: var(--tide-booking-white);
269
+
270
+ //CTA--remove
271
+ --tide-booking-cta-height-remove: auto;
272
+ --tide-booking-cta-width-remove: auto;
273
+ --tide-booking-cta-padding-remove: 0px;
274
+ --tide-booking-cta-background-remove: var(--tide-booking-transparent);
275
+ --tide-booking-cta-color-remove: var(--tide-booking-gray-medium);
276
+ --tide-booking-cta-border-remove: none;
277
+ --tide-booking-cta-border-radius-remove: 5px;
278
+ --tide-booking-cta-text-decoration-remove: underline;
279
+
280
+ //CTA--remove__ICON
281
+ --tide-booking-cta-icon-color-remove: var(--tide-booking-invalid);
282
+ --tide-booking-cta-icon-size-remove: 16px;
283
+
284
+ //CTA--remove__HOVER, __focus
285
+ --tide-booking-cta-background-remove-hover: var(--tide-booking-transparent);
286
+ --tide-booking-cta-color-remove-hover: var(--tide-booking-gray-dark);
287
+ --tide-booking-cta-icon-color-remove-hover: var(--tide-booking-gray-dark);
288
+ --tide-booking-cta-border-remove-hover: none;
289
+ --tide-booking-cta-text-decoration-remove-hover: underline;
290
+
291
+ //INCREMENT__DECREMENT
292
+ //INCREMENT__DECREMENT--btns
293
+ --tide-booking-decrement-increment-width: 30px;
294
+ --tide-booking-decrement-increment-height: 30px;
295
+ --tide-booking-decrement-increment-border-radius: 5px;
296
+ --tide-booking-decrement-increment-border: 0px solid var(--tide-booking-color-primary-fade);
297
+ --tide-booking-decrement-increment-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
298
+ --tide-booking-decrement-increment-color: var(--tide-booking-color-primary);
299
+
300
+ //INCREMENT__DECREMENT--btns--icon
301
+ --tide-booking-decrement-increment-icon-width: 15px;
302
+ --tide-booking-decrement-increment-icon-height: 15px;
303
+ --tide-booking-decrement-increment-icon-color: var(--tide-booking-color-primary);
304
+
305
+ //INCREMENT__DECREMENT--btns--hover
306
+ --tide-booking-decrement-increment-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
307
+ --tide-booking-decrement-increment-color-hover: var(--tide-booking-color-primary-dark);
308
+ --tide-booking-decrement-increment-border-hover: 0px solid var(--tide-booking-color-primary-fade);
309
+
310
+ //INCREMENT__DECREMENT--btns--icon--hover
311
+ --tide-booking-decrement-increment-icon-color-hover: var(--tide-booking-color-primary-dark);
312
+
313
+ //INCREMENT__DECREMENT--btns--focus
314
+ --tide-booking-decrement-increment-background-focus: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
315
+ --tide-booking-decrement-increment-color-focus: var(--tide-booking-color-primary);
316
+ --tide-booking-decrement-increment-border-focus: 0px solid var(--tide-booking-color-primary-fade);
317
+
318
+ //INCREMENT__DECREMENT--btns--icon--focus
319
+ --tide-booking-decrement-increment-icon-color-focus: var(--tide-booking-color-primary-dark);
320
+
321
+ //INCREMENT__DECREMENT--LABEL
322
+ --tide-booking-decrement-increment-label-font: var(--tide-booking-font-size-body);
323
+ --tide-booking-decrement-increment-label-font-weight: 400;
324
+ --tide-booking-decrement-increment-label-color: var(--tide-booking-black);
325
+
326
+ //INCREMENT__DECREMENT--NUMBER
327
+ --tide-booking-decrement-increment-number-font: var(--tide-booking-font-size-body);
328
+ --tide-booking-decrement-increment-number-font-weight: 400;
329
+ --tide-booking-decrement-increment-number-color: var(--tide-booking-color-primary);
330
+
331
+ //DROPDOWN
332
+ --tide-booking-dropdown-background: var(--tide-booking-white);
333
+ --tide-booking-dropdown-color: var(--tide-booking-gray-dark);
334
+ --tide-booking-dropdown-border: 1.5px solid var(--tide-booking-gray-light);
335
+ --tide-booking-dropdown-border-radius: 5px;
336
+ --tide-booking-dropdown-font-family: var(--tide-booking-font-body);
337
+
338
+ //DROPDOWN--HOVER
339
+ --tide-booking-dropdown-border-hover: 1.5px solid var(--tide-booking-color-primary-light);
340
+ --tide-booking-dropdown-color-hover: var(--tide-booking-color-primary);
341
+ --tide-booking-dropdown-background-hover: var(--tide-booking-white);
342
+
343
+ //DROPDOWN--focus
344
+ --tide-booking-dropdown-border-focus: 1.5px solid var(--tide-booking-color-primary);
345
+ --tide-booking-dropdown-color-focus: var(--tide-booking-color-primary);
346
+ --tide-booking-dropdown-background-focus: var(--tide-booking-white);
347
+
348
+ --tide-booking-dropdown-arrow-color: var(--tide-booking-black);
349
+ --tide-booking-dropdown-arrow-color-hover: var(--tide-booking-color-primary);
350
+
351
+ --tide-booking-dropdown-arrow-color-disabled: var(--tide-booking-gray-medium);
352
+
353
+ //DROPDOWN--menu
354
+ --tide-booking-dropdown-menu-background: var(--tide-booking-white);
355
+ --tide-booking-dropdown-menu-border: 1.5px solid var(--tide-booking-gray-border-light);
356
+ --tide-booking-dropdown-menu-border-radius: 5px;
357
+ --tide-booking-dropdown-menu-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
358
+
359
+ --tide-booking-dropdown-menu-option-color: var(--tide-booking-gray-dark);
360
+ --tide-booking-dropdown-menu-option-background-hover: var(--tide-booking-gray-light);
361
+ --tide-booking-dropdown-menu-option-color-hover: var(--tide-booking-color-primary);
362
+ --tide-booking-dropdown-menu-option-background-selected: var(--tide-booking-color-primary);
363
+ --tide-booking-dropdown-menu-option-color-selected: var(--tide-booking-white);
364
+
365
+ //DATEPICKER
366
+ --tide-booking-datepicker-container-background: rgba(255, 255, 255, 0.97);
367
+ --tide-booking-datepicker-container-border: 1.5px solid var(--tide-booking-gray-border-light);
368
+ --tide-booking-datepicker-close-color: var(--tide-booking-color-primary);
369
+
370
+ --tide-booking-datepicker-prev-next-color: var(--tide-booking-color-primary);
371
+ --tide-booking-datepicker-prev-next-background: var(--tide-booking-transparent);
372
+
373
+ --tide-booking-datepicker-day-labels-color: var(--tide-booking-black);
374
+
375
+ --tide-booking-datepicker-month-color: var(--tide-booking-black);
376
+ --tide-booking-datepicker-month-font: var(--tide-booking-font-heading);
377
+
378
+ //DATEPICKER--DAY
379
+ --tide-booking-datepicker-day-color: var(--tide-booking-gray-dark);
380
+ --tide-booking-datepicker-day-background: var(--tide-booking-white);
381
+ --tide-booking-datepicker-day-border: 1.5px solid var(--tide-booking-gray-border-light);
382
+ --tide-booking-datepicker-day-border-radius: 5px;
383
+
384
+ //DATEPICKER--DAY--HOVER
385
+ --tide-booking-datepicker-day-border-hover: 1.5px solid var(--tide-booking-color-primary);
386
+ --tide-booking-datepicker-day-background-hover: var(--tide-booking-color-primary-fade);
387
+ --tide-booking-datepicker-day-color-hover: var(--tide-booking-color-primary);
388
+
389
+ //DATEPICKER--DAY--SELECTED
390
+ --tide-booking-datepicker-day-border-selected: 1.5px solid var(--tide-booking-color-primary);
391
+ --tide-booking-datepicker-day-background-selected: var(--tide-booking-color-primary);
392
+ --tide-booking-datepicker-day-color-selected: var(--tide-booking-white);
393
+
394
+ //DATEPICKER--DAY--SELECTED--HOVER
395
+ --tide-booking-datepicker-day-border-selected-hover: 1.5px solid var(--tide-booking-color-primary-light);
396
+ --tide-booking-datepicker-day-background-selected-hover: var(--tide-booking-color-primary-light);
397
+ --tide-booking-datepicker-day-color-selected-hover: var(--tide-booking-white);
398
+
399
+ //DATEPICKER--DAY--DISABLED
400
+ --tide-booking-datepicker-day-color-disabled: var(--tide-booking-gray-medium);
401
+ --tide-booking-datepicker-day-background-disabled: var(--tide-booking-gray-xlight);
402
+ --tide-booking-datepicker-day-border-disabled: 1.5px solid var(--tide-booking-gray-border-light);
403
+
404
+ //DATEPICKER--DAY--OUTSIDE-MONTH
405
+ --tide-booking-datepicker-day-color-outside-month: var(--tide-booking-gray-medium);
406
+ --tide-booking-datepicker-day-background-outside-month: var(--tide-booking-gray-xlight);
407
+ --tide-booking-datepicker-day-border-outside-month: 1.5px solid var(--tide-booking-gray-border-light);
408
+ --tide-booking-datepicker-day-opacity-outside-month: 0.6;
409
+
410
+ //DATEPICKER--INPUT
411
+ --tide-booking-datepicker-input-height: 45px;
412
+ --tide-booking-datepicker-input-height-lg: 55px;
413
+ --tide-booking-datepicker-input-background: var(--tide-booking-white);
414
+ --tide-booking-datepicker-input-border: 1.5px solid var(--tide-booking-gray-border-light);
415
+ --tide-booking-datepicker-input-border-radius: 5px;
416
+ --tide-booking-datepicker-input-color: var(--tide-booking-black);
417
+
418
+ --tide-booking-datepicker-input-label-color: var(--tide-booking-color-primary-dark);
419
+
420
+ //SPINNER
421
+ --tide-booking-spinner-border: 5px solid rgba(255, 255, 255, 0.2);
422
+ --tide-booking-spinner-border-top-color: #dce1ff;
423
+
424
+ //ANIMATION
425
+ --tide-booking-spinner-animation-color: var(--tide-booking-color-primary);
426
+
427
+ //SEARCH
428
+ --tide-booking-search-results-background: var(--tide-booking-bg);
429
+
430
+ //SEARCH RESET
431
+ --tide-booking-search-reset-background: var(--tide-booking-transparent);
432
+ --tide-booking-search-reset-color: var(--tide-booking-color-primary);
433
+ --tide-booking-search-reset-text-decoration: underline;
434
+ --tide-booking-search-reset-font-weight: 400;
435
+ --tide-booking-search-reset-font-size: 16px;
436
+
437
+ //SEARCH FILTER
438
+ --tide-booking-search-filter-background: var(--tide-booking-white);
439
+ --tide-booking-search-filter-border: 1.5px solid var(--tide-booking-gray-border-light);
440
+ --tide-booking-search-filter-border-radius: 10px;
441
+
442
+ --tide-booking-search-reset-color: var(--tide-booking-color-primary);
443
+ --tide-booking-search-reset-text-decoration: underline;
444
+
445
+ --tide-booking-search-filter-group-title-text-color: var(--tide-booking-gray-dark);
446
+ --tide-booking-search-filter-group-title-text-font-weight: 500;
447
+ --tide-booking-search-filter-group-title-text-font-family: var(--tide-booking-font-body);
448
+ --tide-booking-search-filter-group-title-text-border: 1.5px solid var(--tide-booking-gray-border-light);
449
+
450
+ --tide-booking-search-filter-group-title-subtext-color: var(--tide-booking-gray-dark);
451
+ --tide-booking-search-filter-group-title-subtext-font-weight: 400;
452
+ --tide-booking-search-filter-group-title-subtext-font-family: var(--tide-booking-font-body);
453
+
454
+ //SEARCH FILTER MOBILE BTN
455
+ --tide-booking-flight-options-filter-btn-background: var(--tide-booking-transparent);
456
+ --tide-booking-flight-options-filter-btn-color: var(--tide-booking-color-primary);
457
+ --tide-booking-flight-options-filter-btn-border: 2px solid var(--tide-booking-color-primary);
458
+ --tide-booking-flight-options-filter-btn-border-radius: 4px;
459
+ --tide-booking-flight-options-filter-btn-icon-color: var(--tide-booking-color-primary);
460
+
461
+ --tide-booking-flight-options-filter-btn-hover-background: var(--tide-booking-color-primary-gradient);
462
+ --tide-booking-flight-options-filter-btn-hover-color: var(--tide-booking-white);
463
+ --tide-booking-flight-options-filter-btn-hover-border: 2px solid var(--tide-booking-transparent);
464
+ --tide-booking-flight-options-filter-btn-hover-icon-color: var(--tide-booking-white);
465
+
466
+ //SEARCH FILTER IMG
467
+ --tide-booking-search-filter-img-border-radius: 5px;
468
+ --tide-booking-search-filter-img-text-color: var(--tide-booking-white);
469
+ --tide-booking-search-filter-img-text-font-weight: 300;
470
+ --tide-booking-search-filter-img-text-font-family: var(--tide-booking-font-body);
471
+ --tide-booking-search-filter-img-title-color: var(--tide-booking-white);
472
+ --tide-booking-search-filter-img-title-font-weight: 600;
473
+ --tide-booking-search-filter-img-title-font-family: var(--tide-booking-font-heading);
474
+
475
+ //SEARCH FILTER PRICE
476
+ --tide-booking-search-filter-price-amount-font-family: var(--tide-booking-font-heading);
477
+ --tide-booking-search-filter-price-amount-font-weight: 600;
478
+ --tide-booking-search-filter-price-amount-color: var(--tide-booking-color-primary);
479
+
480
+ --tide-booking-search-filter-price-text-font-family: var(--tide-booking-font-body);
481
+ --tide-booking-search-filter-price-text-font-weight: 400;
482
+ --tide-booking-search-filter-price-text-color: var(--tide-booking-gray-dark);
483
+
484
+ --tide-booking-search-filter-price-total-font-weight: 600;
485
+ --tide-booking-search-filter-price-total-color: var(--tide-booking-black);
486
+
487
+ //SEARCH ITINERARY FILTER
488
+ --tide-booking-search-itinerary-filter-title-font-family: var(--tide-booking-font-heading);
489
+ --tide-booking-search-itinerary-filter-title-font-weight: 500;
490
+ --tide-booking-search-itinerary-filter-title-color: var(--tide-booking-gray-dark);
491
+
492
+ //--COUNTRY
493
+ --tide-booking-search-itinerary-filter-country-background: transparent;
494
+ --tide-booking-search-itinerary-filter-country-border: none;
495
+ --tide-booking-search-itinerary-filter-country-border-radius: 5px;
496
+ --tide-booking-search-itinerary-filter-country-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.08);
497
+
498
+ --tide-booking-search-itinerary-filter-country-icon-color: var(--tide-booking-gray-dark);
499
+
500
+ --tide-booking-search-itinerary-filter-country-title-font-family: var(--tide-booking-font-heading);
501
+ --tide-booking-search-itinerary-filter-country-title-font-weight: 600;
502
+ --tide-booking-search-itinerary-filter-country-title-color: var(--tide-booking-black);
503
+
504
+ --tide-booking-search-itinerary-filter-country-text-font-family: var(--tide-booking-font-body);
505
+ --tide-booking-search-itinerary-filter-country-text-font-weight: 400;
506
+ --tide-booking-search-itinerary-filter-country-text-color: var(--tide-booking-gray-dark);
507
+
508
+ --tide-booking-search-itinerary-filter-country-text-bold-font-weight: 600;
509
+ --tide-booking-search-itinerary-filter-country-text-bold-color: var(--tide-booking-black);
510
+
511
+ //--TRANSPORT
512
+ --tide-booking-search-itinerary-filter-transport-background: transparent;
513
+ --tide-booking-search-itinerary-filter-transport-border: none;
514
+ --tide-booking-search-itinerary-filter-transport-border-radius: none;
515
+ --tide-booking-search-itinerary-filter-transport-box-shadow: none;
516
+
517
+ --tide-booking-search-itinerary-filter-transport-timeline: 1px dashed var(--tide-booking-gray-dark);
518
+
519
+ --tide-booking-search-itinerary-filter-transport-badge-icon-background-color: var(--tide-booking-white);
520
+ --tide-booking-search-itinerary-filter-transport-badge-icon-color: var(--tide-booking-color-primary);
521
+
522
+ --tide-booking-search-itinerary-filter-transport-date-day-font-weight: 600;
523
+ --tide-booking-search-itinerary-filter-transport-date-day-color: var(--tide-booking-black);
524
+
525
+ --tide-booking-search-itinerary-filter-transport-date-month-font-weight: 400;
526
+ --tide-booking-search-itinerary-filter-transport-date-month-color: var(--tide-booking-black);
527
+
528
+ --tide-booking-search-itinerary-filter-transport-title-font-weight: 600;
529
+ --tide-booking-search-itinerary-filter-transport-title-color: var(--tide-booking-black);
530
+
531
+ --tide-booking-search-itinerary-filter-transport-plane-font-weight: 600;
532
+ --tide-booking-search-itinerary-filter-transport-plane-color: var(--tide-booking-black);
533
+ --tide-booking-search-itinerary-filter-transport-plane-icon-color: var(--tide-booking-gray-medium);
534
+
535
+ //--SEGMENT
536
+ --tide-booking-search-itinerary-filter-segments-background: transparent;
537
+ --tide-booking-search-itinerary-filter-segments-border: none;
538
+ --tide-booking-search-itinerary-filter-segments-border-radius: 5px;
539
+ --tide-booking-search-itinerary-filter-segments-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.08);
540
+
541
+ --tide-booking-search-itinerary-filter-segment-timeline: 1px dashed var(--tide-booking-gray-dark);
542
+
543
+ --tide-booking-search-itinerary-filter-segment-badge-icon-background-color: var(--tide-booking-color-primary);
544
+ --tide-booking-search-itinerary-filter-segment-badge-icon-color: var(--tide-booking-white);
545
+ --tide-booking-search-itinerary-filter-segment-badge--secondary-icon-background-color: orangered;
546
+ --tide-booking-search-itinerary-filter-segment-badge--secondary-icon-color: var(--tide-booking-white);
547
+
548
+ --tide-booking-search-itinerary-service-flight-color: #99a9ff;
549
+ --tide-booking-search-itinerary-service-hotel-color: #3f9bff;
550
+ --tide-booking-search-itinerary-service-excursion-color: #f39c12;
551
+ --tide-booking-search-itinerary-service-poi-color: #3ec758;
552
+ --tide-booking-search-itinerary-service-restaurant-color: #ffcc00;
553
+
554
+ --tide-booking-search-itinerary-filter-segment-date-day-font-weight: 600;
555
+ --tide-booking-search-itinerary-filter-segment-date-day-color: var(--tide-booking-black);
556
+
557
+ --tide-booking-search-itinerary-filter-segment-date-month-font-weight: 400;
558
+ --tide-booking-search-itinerary-filter-segment-date-month-color: var(--tide-booking-black);
559
+
560
+ --tide-booking-search-itinerary-filter-segment-title-font-weight: 600;
561
+ --tide-booking-search-itinerary-filter-segment-title-color: var(--tide-booking-black);
562
+
563
+ --tide-booking-search-itinerary-filter-segment-text-font-weight: 400;
564
+ --tide-booking-search-itinerary-filter-segment-text-color: var(--tide-booking-gray-dark);
565
+
566
+ //SEARCH RESULTS LABEL
567
+ --tide-booking-search-results-label-background: var(--tide-booking-transparent);
568
+ --tide-booking-search-results-label-border: 1.5px solid var(--tide-booking-gray-medium);
569
+ --tide-booking-search-results-label-border-radius: 5px;
570
+ --tide-booking-search-results-label-box-shadow: none;
571
+
572
+ --tide-booking-search-results-label-title-font-weight: 400;
573
+ --tide-booking-search-results-label-title-color: var(--tide-booking-gray-dark);
574
+ --tide-booking-search-results-label-title-bold-font-weight: 600;
575
+ --tide-booking-search-results-label-title-bold-color: var(--tide-booking-black);
576
+
577
+ --tide-booking-search-results-label-date-background: var(--tide-booking-gray-dark);
578
+ --tide-booking-search-results-label-date-border: 1.5px solid var(--tide-booking-gray-dark);
579
+
580
+ --tide-booking-search-results-label-date-background--secondary: var(--tide-booking-color-secondary);
581
+ --tide-booking-search-results-label-date-border--secondary: 1.5px solid var(--tide-booking-color-secondary);
582
+
583
+ --tide-booking-search-results-label-date-day-font-weight: 600;
584
+ --tide-booking-search-results-label-date-day-color: var(--tide-booking-white);
585
+
586
+ --tide-booking-search-results-label-date-month-font-weight: 400;
587
+ --tide-booking-search-results-label-date-month-color: var(--tide-booking-white);
588
+
589
+ //SEARCH MORE OPTIONS
590
+ --tide-booking-search-more-options-background: var(--tide-booking-gray-border-light);
591
+ --tide-booking-search-more-options-border: 1px solid var(--tide-booking-gray-border-light);
592
+ --tide-booking-search-more-options-border-radius: 5px;
593
+ --tide-booking-search-more-options-box-shadow: none;
594
+ --tide-booking-search-more-options-color: var(--tide-booking-gray-dark);
595
+
596
+ //SEARCH TAB-VIEW
597
+ --tide-booking-search-tab-view-background: var(--tide-booking-transparent);
598
+ --tide-booking-search-tab-view-border: 2px solid var(--tide-booking-gray-border-light);
599
+ --tide-booking-search-tab-view-color: var(--tide-booking-gray-dark);
600
+ //HOVER
601
+ --tide-booking-search-tab-view-hover-background: var(--tide-booking-transparent);
602
+ --tide-booking-search-tab-view-hover-border: 2px solid var(--tide-booking-color-primary-light);
603
+ --tide-booking-search-tab-view-hover-color: var(--tide-booking-gray-dark);
604
+
605
+ //--ACTIVE
606
+ --tide-booking-search-tab-view-active-background: var(--tide-booking-transparent);
607
+ --tide-booking-search-tab-view-active-border: 2px solid var(--tide-booking-color-primary);
608
+ --tide-booking-search-tab-view-active-color: var(--tide-booking-black);
609
+
610
+ //SEARCH HOTEL CARD
611
+ --tide-booking-search-hotel-card-background: var(--tide-booking-white);
612
+ --tide-booking-search-hotel-card-border: 1.5px solid var(--tide-booking-gray-border-light);
613
+ --tide-booking-search-hotel-card-border-radius: 8px;
614
+ --tide-booking-search-hotel-card-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
615
+
616
+ //SEARCH HOTEL CARD--title
617
+ --tide-booking-search-hotel-card-title-font-family: var(--tide-booking-font-heading);
618
+ --tide-booking-search-hotel-card-title-font-weight: 500;
619
+ --tide-booking-search-hotel-card-title-color: var(--tide-booking-black);
620
+
621
+ //SEARCH HOTEL CARD--starrating
622
+ --tide-booking-search-hotel-card-starrating-color: var(--tide-booking-star-rating-color--filled);
623
+
624
+ //SEARCH HOTEL CARD--location
625
+ --tide-booking-search-hotel-card-location-text-decoration: var(--tide-booking-font-body);
626
+ --tide-booking-search-hotel-card-location-font-weight: 500;
627
+ --tide-booking-search-hotel-card-location-color: var(--tide-booking-gray-dark);
628
+ --tide-booking-search-hotel-card-location-icon-color: var(--tide-booking-gray-dark);
629
+
630
+ //SEARCH HOTEL CARD--price
631
+ --tide-booking-search-hotel-card-price-font-family: var(--tide-booking-font-heading);
632
+ --tide-booking-search-hotel-card-price-font-weight: 600;
633
+ --tide-booking-search-hotel-card-price-color: var(--tide-booking-black);
634
+ --tide-booking-search-hotel-card-price-background-color: rgba(255, 255, 255, 0.85);
635
+ --tide-booking-search-hotel-card-price-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
636
+
637
+ --tide-booking-search-hotel-card-price-label-font-weight: 300;
638
+ --tide-booking-search-hotel-card-price-label-color: var(--tide-booking-gray-dark);
639
+
640
+ //SEARCH HOTEL CARD--option
641
+ --tide-booking-search-hotel-card-option-font-weight: 300;
642
+ --tide-booking-search-hotel-card-option-color: var(--tide-booking-black);
643
+ --tide-booking-search-hotel-card-option-icon-color: var(--tide-booking-black);
644
+
645
+ //SEARCH HOTEL CARD--description
646
+ --tide-booking-search-hotel-card-description-font-weight: 300;
647
+ --tide-booking-search-hotel-card-description-color: var(--tide-booking-gray-dark);
648
+
649
+ //SEARCH HOTEL CARD ALLOTMENTS
650
+ --tide-booking-search-hotel-card-allotments-background: var(--tide-booking-white);
651
+ --tide-booking-search-hotel-card-allotments-border: none;
652
+ --tide-booking-search-hotel-card-allotments-border-radius: 24px;
653
+ --tide-booking-search-hotel-card-allotments-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
654
+ --tide-booking-search-hotel-card-allotments-font-weight: 400;
655
+ --tide-booking-search-hotel-card-allotments-color: var(--tide-booking-invalid);
656
+
657
+ --tide-booking-search-hotel-card-allotments-title-font-weight: 500;
658
+ --tide-booking-search-hotel-card-allotments-title-color: var(--tide-booking-black);
659
+
660
+ --tide-booking-search-hotel-card-allotments-date-font-weight: 600;
661
+ --tide-booking-search-hotel-card-allotments-date-color: var(--tide-booking-color-secondary);
662
+
663
+ --tide-booking-search-hotel-card-allotments-price-font-weight: 600;
664
+ --tide-booking-search-hotel-card-allotments-price-color: var(--tide-booking-color-primary);
665
+
666
+ --tide-booking-search-hotel-card-allotments-badge-background: var(--tide-booking-price-decrease);
667
+ --tide-booking-search-hotel-card-allotments-badge-border: none;
668
+ --tide-booking-search-hotel-card-allotments-badge-border-radius: 5px;
669
+ --tide-booking-search-hotel-card-allotments-badge-color: var(--tide-booking-white);
670
+ --tide-booking-search-hotel-card-allotments-badge-font-weight: 400;
671
+
672
+ --tide-booking-search-hotel-card-allotments-badge--secondary-background: orangered;
673
+ --tide-booking-search-hotel-card-allotments-badge--secondary-border: none;
674
+ --tide-booking-search-hotel-card-allotments-badge--secondary-color: var(--tide-booking-white);
675
+
676
+ --tide-booking-search-hotel-card-allotments-persons-font-weight: 400;
677
+ --tide-booking-search-hotel-card-allotments-persons-color: var(--tide-booking-color-primary);
678
+ --tide-booking-search-hotel-card-allotments-persons-number-color: var(--tide-booking-gray-dark);
679
+
680
+ //TOGGLE BTN
681
+ --tide-booking-step-card-background: var(--tide-booking-white);
682
+ --tide-booking-step-card-border: 1.5px solid var(--tide-booking-gray-border-light);
683
+ --tide-booking-step-card-border-radius: 10px;
684
+
685
+ --tide-booking-step-toggle-btn-background: linear-gradient(8.14deg, #dce1ff 19.75%, #e5e8fb 65.25%);
686
+ --tide-booking-step-toggle-btn-border: none;
687
+ --tide-booking-step-toggle-btn-border-radius: 5px;
688
+ --tide-booking-step-toggle-btn-color: var(--tide-booking-color-primary);
689
+ //HOVER,FOCUS
690
+ --tide-booking-step-toggle-btn-background-hover: linear-gradient(8.14deg, #b4c0ff 19.75%, #c2caf6 65.25%);
691
+ --tide-booking-step-toggle-btn-color-hover: var(--tide-booking-color-primary-dark);
692
+ --tide-booking-step-toggle-btn-border-hover: none;
693
+
694
+ //SEARCH FLIGHT OPTIONS
695
+ --tide-booking-flight-options-card-background: var(--tide-booking-step-card-background);
696
+ --tide-booking-flight-options-card-border: var(--tide-booking-step-card-border);
697
+ --tide-booking-flight-options-card-border-radius: var(--tide-booking-step-card-border-radius);
698
+
699
+ --tide-booking-flight-options-card-header-background: var(--tide-booking-step-card-background);
700
+ --tide-booking-flight-options-card-header-border: var(--tide-booking-step-card-border);
701
+
702
+ --tide-booking-flight-options-times-title-font-family: var(--tide-booking-font-body);
703
+ --tide-booking-flight-options-times-title-color: var(--tide-booking-black);
704
+ --tide-booking-flight-options-times-title-font-weight: 700;
705
+
706
+ --tide-booking-flight-options-times-font-family: var(--tide-booking-font-body);
707
+ --tide-booking-flight-options-times-color: var(--tide-booking-gray-dark);
708
+
709
+ --tide-booking-flight-options-dapart-arrive-icon--color: var(--tide-booking-color-primary);
710
+
711
+ --tide-booking-flight-options-stops-line-color: var(--tide-booking-color-primary);
712
+ --tide-booking-flight-options-stop-color: var(--tide-booking-color-primary);
713
+ --tide-booking-flight-options-stop-border: 3px solid var(--tide-booking-white);
714
+ --tide-booking-flight-options-stoptime-border-color: var(--tide-booking-black);
715
+
716
+ --tide-booking-flight-options-detail-card-background: var(--tide-booking-color-primary-extra-fade);
717
+ --tide-booking-flight-options-detail-card-border: none;
718
+ --tide-booking-flight-options-detail-card-border-radius: 10px;
719
+
720
+ //FLIGHT-OPTIONS--DETAIL-TOGGLE
721
+ --tide-booking-flight-options-detail-toggle-icon-color: var(--tide-booking-step-toggle-btn-color);
722
+ --tide-booking-flight-options-detail-toggle-background: var(--tide-booking-step-toggle-btn-background);
723
+ --tide-booking-flight-options-detail-toggle-border: var(--tide-booking-step-toggle-btn-border);
724
+ --tide-booking-flight-options-detail-toggle-border-radius: var(--tide-booking-step-toggle-btn-border-radius);
725
+
726
+ //HOVER,FOCUS
727
+ --tide-booking-flight-options-detail-toggle-icon-color-hover: var(--tide-booking-step-toggle-btn-color-hover);
728
+ --tide-booking-flight-options-detail-toggle-background-hover: var(--tide-booking-step-toggle-btn-background-hover);
729
+ --tide-booking-flight-options-detail-toggle-border-hover: var(--tide-booking-step-toggle-btn-border-hover);
730
+
731
+ //FLIGHT-OPTIONS--FILTER
732
+ --tide-booking-flight-options-filter-container-background: var(--tide-booking-white);
733
+ --tide-booking-flight-options-filter-container-box-shadow: 0px 0px 5px rgba(158, 158, 158, 0.447);
734
+ }