@asantemedia-org/leybold-design-system 1.0.19 → 1.0.21

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 (36) hide show
  1. package/dist/assets/search-product.png +0 -0
  2. package/dist/index.css +5559 -0
  3. package/dist/index.esm.css +5559 -0
  4. package/dist/index.esm.js +1032 -418
  5. package/dist/index.esm.js.map +1 -1
  6. package/dist/index.esm.scss +2562 -1169
  7. package/dist/index.js +1031 -416
  8. package/dist/index.js.map +1 -1
  9. package/dist/index.scss +2562 -1169
  10. package/dist/src/components/Button/Button.d.ts +1 -1
  11. package/dist/src/components/Button/Button.stories.d.ts +0 -4
  12. package/dist/src/components/Filters/Filter.types.d.ts +28 -0
  13. package/dist/src/components/Filters/FiltersPanel.d.ts +4 -0
  14. package/dist/src/components/ProductCardVertical/ProductCardVertical.d.ts +22 -0
  15. package/dist/src/components/ProductCardVertical/ProductCardVertical.types.d.ts +50 -0
  16. package/dist/src/components/ProductCardVertical/index.d.ts +2 -0
  17. package/dist/src/components/SearchBar/SearchSubmitButton.d.ts +1 -0
  18. package/dist/src/experience/algolia-dynamic-search/AlgoliaDynamicSearch.d.ts +0 -1
  19. package/dist/src/experience/federated-search/components/AssistanceBanner/AssistanceBanner.d.ts +22 -0
  20. package/dist/src/experience/federated-search/components/AssistanceBanner/AssistanceBanner.types.d.ts +29 -0
  21. package/dist/src/experience/federated-search/components/AssistanceBanner/AssistanceIcon.d.ts +2 -0
  22. package/dist/src/experience/federated-search/components/AssistanceBanner/index.d.ts +3 -0
  23. package/dist/src/experience/federated-search/components/FilterDrawer/FilterDrawer.d.ts +24 -0
  24. package/dist/src/experience/federated-search/components/FilterDrawer/FilterDrawer.types.d.ts +22 -0
  25. package/dist/src/experience/federated-search/components/FilterDrawer/index.d.ts +2 -0
  26. package/dist/src/experience/federated-search/components/TabButton/TabButton.d.ts +31 -0
  27. package/dist/src/experience/federated-search/components/TabButton/TabButton.types.d.ts +32 -0
  28. package/dist/src/experience/federated-search/components/TabButton/index.d.ts +2 -0
  29. package/dist/src/experience/qr-form-journey/QrFormJourney.d.ts +0 -1
  30. package/dist/src/experience/qr-form-journey/QrFormJourney.stories.d.ts +1 -0
  31. package/dist/src/hooks/useFederatedSearchMock.d.ts +9 -1
  32. package/dist/src/index.d.ts +1 -0
  33. package/dist/src/types/cards.d.ts +2 -0
  34. package/dist/src/types/search.d.ts +12 -4
  35. package/dist/tsconfig.tsbuildinfo +1 -1
  36. package/package.json +1 -1
package/dist/index.scss CHANGED
@@ -6,6 +6,7 @@
6
6
  --leybold-white-aluminium: #dae0e3;
7
7
  --leybold-window-gray: #99a1ab;
8
8
  --leybold-light-grey: #c5c7c4;
9
+ --leybold-very-light-grey: #f5f5f5;
9
10
  --leybold-slate-gray: #4a4e54;
10
11
  --leybold-anthracite-gray: #383e42;
11
12
  --leybold-orange: #d18e56;
@@ -73,7 +74,7 @@
73
74
  justify-content: center;
74
75
  gap: 0.5rem;
75
76
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
76
- font-weight: 600;
77
+ font-weight: 500;
77
78
  line-height: 1.5;
78
79
  text-align: center;
79
80
  text-decoration: none;
@@ -95,32 +96,32 @@
95
96
  .Button-module__button___18Bed {
96
97
  white-space: nowrap;
97
98
  }
98
- .Button-module__button--primary___VuF-P, .Button-module__button--default___MDa35 {
99
+ .Button-module__button--primary___VuF-P {
99
100
  color: #ffffff;
100
101
  background-color: #e2001a;
101
102
  border-color: #e2001a;
102
103
  }
103
- .Button-module__button--primary___VuF-P:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]), .Button-module__button--default___MDa35:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
104
- background-color: #546672;
105
- border-color: #546672;
104
+ .Button-module__button--primary___VuF-P:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
105
+ background-color: #4a4e54;
106
+ border-color: #4a4e54;
106
107
  }
107
- .Button-module__button--primary___VuF-P:active:not(.Button-module__button--disabled___IuOY8), .Button-module__button--default___MDa35:active:not(.Button-module__button--disabled___IuOY8) {
108
- background-color: #546672;
108
+ .Button-module__button--primary___VuF-P:active:not(.Button-module__button--disabled___IuOY8) {
109
+ background-color: #4a4e54;
109
110
  border-color: #000000;
110
111
  }
111
- .Button-module__button--primary___VuF-P:focus-visible:not([data-force-state]), .Button-module__button--default___MDa35:focus-visible:not([data-force-state]) {
112
- background-color: #546672;
113
- border-color: #546672;
112
+ .Button-module__button--primary___VuF-P:focus-visible:not([data-force-state]) {
113
+ background-color: #4a4e54;
114
+ border: 2px solid #4a4e54;
114
115
  outline: 2px solid #000000;
115
116
  outline-offset: 0;
116
117
  }
117
- .Button-module__button--primary___VuF-P[data-force-state=hover], .Button-module__button--default___MDa35[data-force-state=hover] {
118
- background-color: #546672;
119
- border-color: #546672;
118
+ .Button-module__button--primary___VuF-P[data-force-state=hover] {
119
+ background-color: #4a4e54;
120
+ border-color: #4a4e54;
120
121
  }
121
- .Button-module__button--primary___VuF-P[data-force-state=focus], .Button-module__button--default___MDa35[data-force-state=focus] {
122
- background-color: #546672;
123
- border-color: #546672;
122
+ .Button-module__button--primary___VuF-P[data-force-state=focus] {
123
+ background-color: #4a4e54;
124
+ border: 2px solid #4a4e54;
124
125
  outline: 2px solid #000000;
125
126
  outline-offset: 0;
126
127
  }
@@ -131,58 +132,29 @@
131
132
  }
132
133
  .Button-module__button--secondary___lD5E3:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
133
134
  color: #ffffff;
134
- background-color: #546672;
135
- border-color: #546672;
135
+ background-color: #4a4e54;
136
+ border-color: #4a4e54;
136
137
  }
137
138
  .Button-module__button--secondary___lD5E3:active:not(.Button-module__button--disabled___IuOY8) {
138
- background-color: #546672;
139
+ background-color: #4a4e54;
139
140
  border-color: #000000;
140
141
  }
141
142
  .Button-module__button--secondary___lD5E3:focus-visible:not([data-force-state]) {
142
143
  color: #ffffff;
143
- background-color: #546672;
144
- border: 2px solid #546672;
144
+ background-color: #4a4e54;
145
+ border: 2px solid #4a4e54;
145
146
  outline: 2px solid #000000;
146
147
  outline-offset: 0;
147
148
  }
148
149
  .Button-module__button--secondary___lD5E3[data-force-state=hover] {
149
150
  color: #ffffff;
150
- background-color: #546672;
151
- border-color: #546672;
151
+ background-color: #4a4e54;
152
+ border-color: #4a4e54;
152
153
  }
153
154
  .Button-module__button--secondary___lD5E3[data-force-state=focus] {
154
155
  color: #ffffff;
155
- background-color: #546672;
156
- border: 2px solid #546672;
157
- outline: 2px solid #000000;
158
- outline-offset: 0;
159
- }
160
- .Button-module__button--solid-red___YPpnL {
161
- color: #ffffff;
162
- background-color: #e2001a;
163
- border-color: #e2001a;
164
- }
165
- .Button-module__button--solid-red___YPpnL:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
166
- background-color: #546672;
167
- border-color: #546672;
168
- }
169
- .Button-module__button--solid-red___YPpnL:active:not(.Button-module__button--disabled___IuOY8) {
170
- background-color: rgb(73.1818181818, 88.8636363636, 99.3181818182);
171
- border-color: rgb(73.1818181818, 88.8636363636, 99.3181818182);
172
- }
173
- .Button-module__button--solid-red___YPpnL:focus-visible:not([data-force-state]) {
174
- background-color: #000000;
175
- border-color: #000000;
176
- outline: 2px solid #000000;
177
- outline-offset: 0;
178
- }
179
- .Button-module__button--solid-red___YPpnL[data-force-state=hover] {
180
- background-color: #546672;
181
- border-color: #546672;
182
- }
183
- .Button-module__button--solid-red___YPpnL[data-force-state=focus] {
184
- background-color: #000000;
185
- border-color: #000000;
156
+ background-color: #4a4e54;
157
+ border: 2px solid #4a4e54;
186
158
  outline: 2px solid #000000;
187
159
  outline-offset: 0;
188
160
  }
@@ -193,29 +165,29 @@
193
165
  }
194
166
  .Button-module__button--solid-grey___oRbEy:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
195
167
  color: #ffffff;
196
- background-color: #546672;
197
- border-color: #546672;
168
+ background-color: #4a4e54;
169
+ border-color: #4a4e54;
198
170
  }
199
171
  .Button-module__button--solid-grey___oRbEy:active:not(.Button-module__button--disabled___IuOY8) {
200
- background-color: #546672;
172
+ background-color: #4a4e54;
201
173
  border-color: #000000;
202
174
  }
203
175
  .Button-module__button--solid-grey___oRbEy:focus-visible:not([data-force-state]) {
204
176
  color: #ffffff;
205
- background-color: #546672;
206
- border-color: #546672;
177
+ background-color: #4a4e54;
178
+ border: 2px solid #4a4e54;
207
179
  outline: 2px solid #000000;
208
180
  outline-offset: 0;
209
181
  }
210
182
  .Button-module__button--solid-grey___oRbEy[data-force-state=hover] {
211
183
  color: #ffffff;
212
- background-color: #546672;
213
- border-color: #546672;
184
+ background-color: #4a4e54;
185
+ border-color: #4a4e54;
214
186
  }
215
187
  .Button-module__button--solid-grey___oRbEy[data-force-state=focus] {
216
188
  color: #ffffff;
217
- background-color: #546672;
218
- border-color: #546672;
189
+ background-color: #4a4e54;
190
+ border: 2px solid #4a4e54;
219
191
  outline: 2px solid #000000;
220
192
  outline-offset: 0;
221
193
  }
@@ -281,39 +253,6 @@
281
253
  outline: 2px solid #ffffff;
282
254
  outline-offset: 0;
283
255
  }
284
- .Button-module__button--outlined-red___cgZXa {
285
- color: #e2001a;
286
- background-color: transparent;
287
- border: 1.5px solid #e2001a;
288
- }
289
- .Button-module__button--outlined-red___cgZXa:hover:not(.Button-module__button--disabled___IuOY8):not([data-force-state]) {
290
- color: #ffffff;
291
- background-color: #546672;
292
- border-color: #546672;
293
- }
294
- .Button-module__button--outlined-red___cgZXa:active:not(.Button-module__button--disabled___IuOY8) {
295
- background-color: #546672;
296
- border-color: #000000;
297
- }
298
- .Button-module__button--outlined-red___cgZXa:focus-visible:not([data-force-state]) {
299
- color: #ffffff;
300
- background-color: #546672;
301
- border: 2px solid #546672;
302
- outline: 2px solid #000000;
303
- outline-offset: 0;
304
- }
305
- .Button-module__button--outlined-red___cgZXa[data-force-state=hover] {
306
- color: #ffffff;
307
- background-color: #546672;
308
- border-color: #546672;
309
- }
310
- .Button-module__button--outlined-red___cgZXa[data-force-state=focus] {
311
- color: #ffffff;
312
- background-color: #546672;
313
- border: 2px solid #546672;
314
- outline: 2px solid #000000;
315
- outline-offset: 0;
316
- }
317
256
  .Button-module__button--outlined-grey___xWGbB {
318
257
  color: #dae0e3;
319
258
  background-color: transparent;
@@ -413,7 +352,7 @@
413
352
  border: 2px solid transparent;
414
353
  padding: 0;
415
354
  text-transform: uppercase;
416
- font-weight: 600;
355
+ font-weight: 500;
417
356
  }
418
357
  .Button-module__button--link-text___R2kun:hover:not(.Button-module__button--disabled___IuOY8):not(:focus-visible):not([data-force-state]) {
419
358
  color: #000000;
@@ -461,7 +400,7 @@
461
400
  padding: 0;
462
401
  height: 44px;
463
402
  text-transform: uppercase;
464
- font-weight: 600;
403
+ font-weight: 500;
465
404
  }
466
405
  .Button-module__button--link-text-alt___1p7wH:hover:not(.Button-module__button--disabled___IuOY8):not(:focus-visible):not([data-force-state]) {
467
406
  color: #e2001a;
@@ -641,6 +580,7 @@
641
580
  --leybold-white-aluminium: #dae0e3;
642
581
  --leybold-window-gray: #99a1ab;
643
582
  --leybold-light-grey: #c5c7c4;
583
+ --leybold-very-light-grey: #f5f5f5;
644
584
  --leybold-slate-gray: #4a4e54;
645
585
  --leybold-anthracite-gray: #383e42;
646
586
  --leybold-orange: #d18e56;
@@ -1154,6 +1094,7 @@
1154
1094
  --leybold-white-aluminium: #dae0e3;
1155
1095
  --leybold-window-gray: #99a1ab;
1156
1096
  --leybold-light-grey: #c5c7c4;
1097
+ --leybold-very-light-grey: #f5f5f5;
1157
1098
  --leybold-slate-gray: #4a4e54;
1158
1099
  --leybold-anthracite-gray: #383e42;
1159
1100
  --leybold-orange: #d18e56;
@@ -1217,22 +1158,46 @@
1217
1158
 
1218
1159
  .Pagination-module__pagination___Kih79 {
1219
1160
  display: flex;
1220
- justify-content: center;
1161
+ justify-content: flex-end;
1221
1162
  align-items: center;
1222
- padding: 1rem 0;
1163
+ padding: 36px 0;
1223
1164
  -webkit-user-select: none;
1224
1165
  -moz-user-select: none;
1225
1166
  user-select: none;
1167
+ gap: 36px;
1168
+ width: 100%;
1169
+ }
1170
+ @media (max-width: 768px) {
1171
+ .Pagination-module__pagination___Kih79 {
1172
+ gap: 18px;
1173
+ padding: 24px 0;
1174
+ justify-content: center;
1175
+ }
1176
+ }
1177
+
1178
+ .Pagination-module__dividerLine___85LAX {
1179
+ flex: 1;
1180
+ height: 1px;
1181
+ background: rotate(0.198deg);
1182
+ background: #e5e7eb;
1183
+ transform: rotate(0.198deg);
1226
1184
  }
1227
1185
 
1228
1186
  .Pagination-module__paginationList___-lZpm {
1229
1187
  display: flex;
1230
1188
  align-items: center;
1231
- gap: 0.25rem;
1189
+ gap: 24px;
1232
1190
  list-style: none;
1233
1191
  margin: 0;
1234
1192
  padding: 0;
1235
1193
  }
1194
+ @media (max-width: 768px) {
1195
+ .Pagination-module__paginationList___-lZpm {
1196
+ gap: 12px;
1197
+ flex-wrap: wrap;
1198
+ justify-content: center;
1199
+ }
1200
+ }
1236
1201
 
1237
1202
  .Pagination-module__paginationItem___VsGFa {
1238
1203
  display: flex;
@@ -1244,103 +1209,85 @@
1244
1209
  display: flex;
1245
1210
  align-items: center;
1246
1211
  justify-content: center;
1247
- min-width: 32px;
1248
- height: 32px;
1249
- padding: 0.25rem 0.5rem;
1212
+ min-width: auto;
1213
+ height: auto;
1214
+ padding: 0;
1250
1215
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
1251
- font-size: 0.875rem;
1216
+ font-size: 18px;
1252
1217
  font-weight: 400;
1253
- line-height: 1.5;
1254
- color: #6c757d;
1218
+ line-height: 1;
1219
+ color: #99a1ab;
1255
1220
  background-color: transparent;
1256
1221
  border: none;
1257
- border-radius: 4px;
1222
+ border-radius: 0;
1258
1223
  cursor: pointer;
1259
1224
  transition: all 0.2s ease-in-out;
1260
1225
  text-decoration: none;
1261
1226
  }
1227
+ @media (max-width: 768px) {
1228
+ .Pagination-module__pageButton___b6UNF {
1229
+ font-size: 16px;
1230
+ }
1231
+ }
1262
1232
  .Pagination-module__pageButton___b6UNF:hover:not(:disabled) {
1263
- color: #e2001a;
1264
- background-color: rgba(226, 0, 26, 0.1);
1233
+ opacity: 0.7;
1265
1234
  }
1266
1235
  .Pagination-module__pageButton___b6UNF:focus-visible {
1267
- outline: 2px solid #e2001a;
1236
+ outline: 1px solid #000000;
1268
1237
  outline-offset: 2px;
1269
1238
  }
1270
- .Pagination-module__pageButton___b6UNF:active:not(:disabled) {
1271
- transform: scale(0.95);
1272
- }
1273
1239
  .Pagination-module__pageButton___b6UNF:disabled {
1274
1240
  cursor: default;
1275
1241
  }
1276
1242
 
1277
1243
  .Pagination-module__pageButtonActive___D9m18 {
1278
- color: #dc3545;
1279
- font-weight: 600;
1244
+ color: #e2001a;
1245
+ font-weight: 700;
1280
1246
  cursor: default;
1281
1247
  pointer-events: none;
1282
1248
  }
1283
1249
  .Pagination-module__pageButtonActive___D9m18:hover {
1284
- color: #dc3545;
1285
- background-color: transparent;
1250
+ color: #e2001a;
1251
+ opacity: 1;
1286
1252
  }
1287
1253
 
1288
1254
  .Pagination-module__navButton___ZCIai {
1289
1255
  display: flex;
1290
1256
  align-items: center;
1291
- gap: 0.25rem;
1292
- padding: 0.25rem 1rem;
1257
+ gap: 9px;
1258
+ padding: 9px;
1293
1259
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
1294
- font-size: 0.875rem;
1295
- font-weight: 400;
1296
- line-height: 1.5;
1297
- color: #6c757d;
1260
+ font-size: 14px;
1261
+ font-weight: 500;
1262
+ line-height: 1;
1263
+ color: #99a1ab;
1298
1264
  background-color: transparent;
1299
1265
  border: none;
1300
- border-radius: 4px;
1266
+ border-radius: 0;
1301
1267
  cursor: pointer;
1302
1268
  transition: all 0.2s ease-in-out;
1303
1269
  white-space: nowrap;
1304
1270
  }
1305
1271
  .Pagination-module__navButton___ZCIai:hover:not(:disabled) {
1306
- color: #e2001a;
1307
- background-color: rgba(226, 0, 26, 0.1);
1308
- }
1309
- .Pagination-module__navButton___ZCIai:hover:not(:disabled) .Pagination-module__navIcon___-BVJ3 {
1310
- color: #e2001a;
1272
+ opacity: 0.7;
1311
1273
  }
1312
1274
  .Pagination-module__navButton___ZCIai:focus-visible {
1313
- outline: 2px solid #e2001a;
1275
+ outline: 1px solid #000000;
1314
1276
  outline-offset: 2px;
1315
1277
  }
1316
- .Pagination-module__navButton___ZCIai:active:not(:disabled) {
1317
- transform: scale(0.95);
1318
- }
1319
- .Pagination-module__navButton--previous___Cy5TE .Pagination-module__navIcon___-BVJ3 {
1320
- margin-right: 2px;
1321
- }
1322
- .Pagination-module__navButton--next___kTmgK .Pagination-module__navIcon___-BVJ3 {
1323
- margin-left: 2px;
1324
- }
1325
1278
 
1326
1279
  .Pagination-module__navButtonDisabled___IZK8H {
1327
- color: #adb5bd;
1280
+ color: rgba(153, 161, 171, 0.5);
1328
1281
  cursor: not-allowed;
1329
1282
  opacity: 0.5;
1330
1283
  }
1331
1284
  .Pagination-module__navButtonDisabled___IZK8H:hover {
1332
- color: #adb5bd;
1333
- background-color: transparent;
1334
- }
1335
- .Pagination-module__navButtonDisabled___IZK8H:hover .Pagination-module__navIcon___-BVJ3 {
1336
- color: #adb5bd;
1285
+ opacity: 0.5;
1337
1286
  }
1338
1287
 
1339
1288
  .Pagination-module__navIcon___-BVJ3 {
1340
- width: 8px;
1341
- height: 12px;
1342
1289
  color: currentColor;
1343
- transition: color 0.2s ease-in-out;
1290
+ font-size: 12px;
1344
1291
  }
1345
1292
 
1346
1293
  .Pagination-module__ellipsis___iAsGN {
@@ -1392,6 +1339,7 @@
1392
1339
  --leybold-white-aluminium: #dae0e3;
1393
1340
  --leybold-window-gray: #99a1ab;
1394
1341
  --leybold-light-grey: #c5c7c4;
1342
+ --leybold-very-light-grey: #f5f5f5;
1395
1343
  --leybold-slate-gray: #4a4e54;
1396
1344
  --leybold-anthracite-gray: #383e42;
1397
1345
  --leybold-orange: #d18e56;
@@ -1471,8 +1419,16 @@
1471
1419
  flex-direction: column;
1472
1420
  gap: 0.5rem;
1473
1421
  padding: 0.5rem !important;
1474
- background-color: white;
1475
- box-shadow: 2.7px 2.7px 5px 0 rgba(0, 0, 0, 0.1);
1422
+ background-color: transparent;
1423
+ box-shadow: none;
1424
+ }
1425
+ @media (max-width: 768px) {
1426
+ .ProductCardHorizontal-module__productWrapper___gs8fn {
1427
+ flex-direction: row;
1428
+ align-items: center;
1429
+ gap: 8px;
1430
+ padding: 0 6px 0 0;
1431
+ }
1476
1432
  }
1477
1433
  .ProductCardHorizontal-module__productWrapper___gs8fn.ProductCardHorizontal-module__withImage___pPFw2 {
1478
1434
  display: grid;
@@ -1481,14 +1437,21 @@
1481
1437
  grid-template-areas: "image description description" "image description description" "image cta cta";
1482
1438
  row-gap: 0.125rem;
1483
1439
  }
1440
+ @media (max-width: 768px) {
1441
+ .ProductCardHorizontal-module__productWrapper___gs8fn.ProductCardHorizontal-module__withImage___pPFw2 {
1442
+ display: flex;
1443
+ flex-direction: row;
1444
+ align-items: center;
1445
+ }
1446
+ }
1484
1447
  .ProductCardHorizontal-module__productWrapper___gs8fn.ProductCardHorizontal-module__withImage___pPFw2 .ProductCardHorizontal-module__productTitle___xBuu7 {
1485
- font-size: clamp(12px, 1.25vw, 14px);
1448
+ font-size: 16px;
1486
1449
  }
1487
1450
  .ProductCardHorizontal-module__productWrapper___gs8fn.ProductCardHorizontal-module__withImage___pPFw2 .ProductCardHorizontal-module__productDescription___CA35O {
1488
- font-size: clamp(12px, 1.25vw, 14px);
1451
+ font-size: 16px;
1489
1452
  }
1490
1453
  .ProductCardHorizontal-module__productWrapper___gs8fn.ProductCardHorizontal-module__withImage___pPFw2 .ProductCardHorizontal-module__productPrice___lf32A {
1491
- font-size: clamp(12px, 1.25vw, 14px);
1454
+ font-size: 16px;
1492
1455
  }
1493
1456
 
1494
1457
  .ProductCardHorizontal-module__productImage___sQsUO {
@@ -1499,6 +1462,14 @@
1499
1462
  align-items: center;
1500
1463
  justify-content: center;
1501
1464
  }
1465
+ @media (max-width: 768px) {
1466
+ .ProductCardHorizontal-module__productImage___sQsUO {
1467
+ width: 45px;
1468
+ height: 45px;
1469
+ max-width: 45px;
1470
+ max-height: 45px;
1471
+ }
1472
+ }
1502
1473
 
1503
1474
  .ProductCardHorizontal-module__productContent___Np2cY {
1504
1475
  flex: 1;
@@ -1508,7 +1479,7 @@
1508
1479
  .ProductCardHorizontal-module__productTitle___xBuu7,
1509
1480
  h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1510
1481
  margin: 0 0 0.25rem 0;
1511
- font-size: clamp(12px, 1.25vw, 14px);
1482
+ font-size: 16px;
1512
1483
  font-weight: 600;
1513
1484
  color: #111827;
1514
1485
  line-height: 1.4;
@@ -1516,7 +1487,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1516
1487
 
1517
1488
  .ProductCardHorizontal-module__productId___3oOQV {
1518
1489
  margin: 0 0 0.25rem 0;
1519
- font-size: 0.875rem;
1490
+ font-size: 9px;
1520
1491
  color: #6b7280;
1521
1492
  }
1522
1493
 
@@ -1537,6 +1508,11 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1537
1508
  font-weight: 700;
1538
1509
  color: #111827;
1539
1510
  }
1511
+ @media (max-width: 768px) {
1512
+ .ProductCardHorizontal-module__productPrice___lf32A {
1513
+ display: none;
1514
+ }
1515
+ }
1540
1516
 
1541
1517
  /* ProductCardHorizontalParts */
1542
1518
  .ProductCardHorizontal-module__productTitleDescriptionWrapper___Obv-j {
@@ -1545,6 +1521,12 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1545
1521
  flex-direction: column;
1546
1522
  gap: 0.25rem;
1547
1523
  }
1524
+ @media (max-width: 768px) {
1525
+ .ProductCardHorizontal-module__productTitleDescriptionWrapper___Obv-j {
1526
+ flex: 1;
1527
+ gap: 5px;
1528
+ }
1529
+ }
1548
1530
 
1549
1531
  .ProductCardHorizontal-module__productPriceCtaWrapper___Npkfl {
1550
1532
  grid-area: cta;
@@ -1552,6 +1534,21 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1552
1534
  align-items: center;
1553
1535
  justify-content: space-between;
1554
1536
  }
1537
+ @media (max-width: 768px) {
1538
+ .ProductCardHorizontal-module__productPriceCtaWrapper___Npkfl {
1539
+ grid-area: unset;
1540
+ flex-shrink: 0;
1541
+ align-items: center;
1542
+ justify-content: center;
1543
+ }
1544
+ }
1545
+
1546
+ .ProductCardHorizontal-module__productArrowIcon___1-A76 {
1547
+ width: 14px;
1548
+ height: 20px;
1549
+ color: #e2001a;
1550
+ flex-shrink: 0;
1551
+ }
1555
1552
  .Image-module__imageContainer___iD5Kd {
1556
1553
  position: relative;
1557
1554
  display: block;
@@ -1638,6 +1635,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1638
1635
  --leybold-white-aluminium: #dae0e3;
1639
1636
  --leybold-window-gray: #99a1ab;
1640
1637
  --leybold-light-grey: #c5c7c4;
1638
+ --leybold-very-light-grey: #f5f5f5;
1641
1639
  --leybold-slate-gray: #4a4e54;
1642
1640
  --leybold-anthracite-gray: #383e42;
1643
1641
  --leybold-orange: #d18e56;
@@ -1825,6 +1823,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1825
1823
  --leybold-white-aluminium: #dae0e3;
1826
1824
  --leybold-window-gray: #99a1ab;
1827
1825
  --leybold-light-grey: #c5c7c4;
1826
+ --leybold-very-light-grey: #f5f5f5;
1828
1827
  --leybold-slate-gray: #4a4e54;
1829
1828
  --leybold-anthracite-gray: #383e42;
1830
1829
  --leybold-orange: #d18e56;
@@ -1894,7 +1893,6 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1894
1893
  transform: skewX(-10deg) translateX(200%);
1895
1894
  }
1896
1895
  }
1897
-
1898
1896
  .cmpAlgoliaDynamicSearchWidget {
1899
1897
  position: relative;
1900
1898
  padding: 2rem 1rem;
@@ -1912,6 +1910,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1912
1910
  opacity: 0;
1913
1911
  z-index: -1;
1914
1912
  }
1913
+
1915
1914
  .cmpAlgoliaDynamicSearchWidget__container {
1916
1915
  margin-left: auto;
1917
1916
  margin-right: auto;
@@ -1926,6 +1925,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1926
1925
  max-width: 1280px;
1927
1926
  }
1928
1927
  }
1928
+
1929
1929
  .cmpAlgoliaDynamicSearchWidget__header {
1930
1930
  display: flex;
1931
1931
  flex-direction: column;
@@ -1948,6 +1948,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1948
1948
  margin: 0;
1949
1949
  color: #546672;
1950
1950
  }
1951
+
1951
1952
  .cmpAlgoliaDynamicSearchWidget__header__text {
1952
1953
  display: flex;
1953
1954
  flex-direction: column;
@@ -1958,6 +1959,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1958
1959
  max-width: 75%;
1959
1960
  }
1960
1961
  }
1962
+
1961
1963
  .cmpAlgoliaDynamicSearchWidget__cards {
1962
1964
  display: grid;
1963
1965
  gap: 1rem;
@@ -1973,6 +1975,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1973
1975
  grid-template-columns: repeat(3, 1fr);
1974
1976
  }
1975
1977
  }
1978
+
1976
1979
  .cmpAlgoliaDynamicSearchWidget.isQueryContent .cmpAlgoliaDynamicSearchWidget__cards {
1977
1980
  grid-template-columns: repeat(2, 1fr);
1978
1981
  }
@@ -1981,9 +1984,11 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
1981
1984
  grid-template-columns: repeat(4, 1fr);
1982
1985
  }
1983
1986
  }
1987
+
1984
1988
  .cmpAlgoliaDynamicSearchWidget.hasStyleSilverGradientBackground {
1985
1989
  background: #3f6a98;
1986
1990
  }
1991
+
1987
1992
  .cmpAlgoliaDynamicSearchWidget.hasStyleGreyBackground {
1988
1993
  background: #546672;
1989
1994
  }
@@ -2012,6 +2017,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
2012
2017
  background-color: #546672;
2013
2018
  transition: opacity 0.5s;
2014
2019
  }
2020
+
2015
2021
  .cmpAlgoliaDynamicSearchWidget__placeholder__loading::before {
2016
2022
  content: "";
2017
2023
  position: absolute;
@@ -2030,6 +2036,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
2030
2036
  --leybold-white-aluminium: #dae0e3;
2031
2037
  --leybold-window-gray: #99a1ab;
2032
2038
  --leybold-light-grey: #c5c7c4;
2039
+ --leybold-very-light-grey: #f5f5f5;
2033
2040
  --leybold-slate-gray: #4a4e54;
2034
2041
  --leybold-anthracite-gray: #383e42;
2035
2042
  --leybold-orange: #d18e56;
@@ -2773,609 +2780,470 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
2773
2780
  position: relative;
2774
2781
  top: 0;
2775
2782
  }
2776
- .SearchModal-module__overlay___Vbvg9 {
2777
- position: fixed;
2778
- top: 0;
2779
- left: 0;
2780
- right: 0;
2781
- bottom: 0;
2782
- background-color: rgba(0, 0, 0, 0.5);
2783
- display: flex;
2784
- align-items: flex-start;
2785
- justify-content: center;
2786
- padding: 2rem 1rem;
2787
- z-index: 1000;
2788
- overflow-y: auto;
2789
- }
2790
-
2791
- .SearchModal-module__modal___1k5gO {
2792
- background-color: #ffffff;
2793
- border-radius: 0.5rem;
2794
- box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
2795
- width: 100%;
2796
- max-width: 1200px;
2797
- max-height: calc(100vh - 4rem);
2798
- display: flex;
2799
- flex-direction: column;
2800
- outline: none;
2801
- }
2802
- .SearchModal-module__modal___1k5gO:focus-visible {
2803
- box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.5), 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
2804
- }
2805
-
2806
- .SearchModal-module__header___I79uH {
2807
- display: flex;
2808
- align-items: center;
2809
- justify-content: space-between;
2810
- padding: 1.5rem;
2811
- border-bottom: 1px solid #e5e7eb;
2812
- }
2813
-
2814
- .SearchModal-module__title___VlmEk {
2815
- margin: 0;
2816
- font-size: 1.5rem;
2817
- font-weight: 600;
2818
- color: #111827;
2819
- }
2820
2783
 
2821
- .SearchModal-module__closeButton___AN0zt {
2822
- display: flex;
2823
- align-items: center;
2824
- justify-content: center;
2825
- width: 2.5rem;
2826
- height: 2.5rem;
2827
- padding: 0;
2828
- background: transparent;
2829
- border: none;
2830
- border-radius: 0.375rem;
2831
- color: #6b7280;
2832
- cursor: pointer;
2833
- transition: all 0.2s ease-in-out;
2784
+ /*IMPORTANT FUNCTIONAL STYLES*/
2785
+ .disabled-product-fields-section .qr-form-fields .qr-form-filed-wrapper.has-no-value {
2786
+ display: none;
2834
2787
  }
2835
- .SearchModal-module__closeButton___AN0zt svg {
2836
- width: 1.5rem;
2837
- height: 1.5rem;
2838
- }
2839
- .SearchModal-module__closeButton___AN0zt:hover {
2840
- background-color: #f3f4f6;
2841
- color: #111827;
2842
- }
2843
- .SearchModal-module__closeButton___AN0zt:focus-visible {
2844
- outline: 2px solid #0066cc;
2845
- outline-offset: 2px;
2788
+ :root {
2789
+ --leybold-red: #e2001a;
2790
+ --leybold-black: #000000;
2791
+ --leybold-white: #ffffff;
2792
+ --leybold-blue-grey: #546672;
2793
+ --leybold-white-aluminium: #dae0e3;
2794
+ --leybold-window-gray: #99a1ab;
2795
+ --leybold-light-grey: #c5c7c4;
2796
+ --leybold-very-light-grey: #f5f5f5;
2797
+ --leybold-slate-gray: #4a4e54;
2798
+ --leybold-anthracite-gray: #383e42;
2799
+ --leybold-orange: #d18e56;
2800
+ --leybold-yellow: #edd163;
2801
+ --leybold-green: #6ea67b;
2802
+ --leybold-purple: #732d5d;
2803
+ --leybold-purple-gray: #945e67;
2804
+ --leybold-blue: #2b4679;
2805
+ --leybold-light-blue: #3f6a98;
2806
+ --leybold-blue-green: #39788e;
2807
+ --leybold-green-gray: #6d8f9f;
2808
+ --color-primary: #e2001a;
2809
+ --color-secondary: #546672;
2810
+ --color-success: #6ea67b;
2811
+ --color-danger: #e2001a;
2812
+ --color-warning: #d18e56;
2813
+ --color-info: #3f6a98;
2814
+ --text-primary: #000000;
2815
+ --text-secondary: #4a4e54;
2816
+ --text-muted: #99a1ab;
2817
+ --text-inverse: #ffffff;
2818
+ --bg-primary: #ffffff;
2819
+ --bg-secondary: #dae0e3;
2820
+ --bg-dark: #383e42;
2821
+ --border-color: #c5c7c4;
2822
+ --border-color-dark: #4a4e54;
2823
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
2824
+ --h1-mobile-size: 32px;
2825
+ --h1-mobile-line-height: 1.2;
2826
+ --h2-mobile-size: 24px;
2827
+ --h2-mobile-line-height: 1.2;
2828
+ --h3-mobile-size: 18px;
2829
+ --h3-mobile-line-height: 1.6;
2830
+ --h4-mobile-size: 16px;
2831
+ --h4-mobile-line-height: 1.55;
2832
+ --h5-mobile-size: 14px;
2833
+ --h5-mobile-line-height: 1.5;
2834
+ --body-mobile-size: 14px;
2835
+ --body-mobile-line-height: 1.5;
2836
+ --h1-desktop-size: 55px;
2837
+ --h1-desktop-line-height: 1.15;
2838
+ --h1-desktop-letter-spacing: -0.02em;
2839
+ --h2-desktop-size: 40px;
2840
+ --h2-desktop-line-height: 1.2;
2841
+ --h2-desktop-letter-spacing: -0.01em;
2842
+ --h3-desktop-size: 32px;
2843
+ --h3-desktop-line-height: 1.2;
2844
+ --h4-desktop-size: 24px;
2845
+ --h4-desktop-line-height: 1.2;
2846
+ --h5-desktop-size: 18px;
2847
+ --h5-desktop-line-height: 1.6;
2848
+ --body-desktop-size: 18px;
2849
+ --body-desktop-line-height: 1.6;
2850
+ --text-lg-size: 27px;
2851
+ --text-lg-line-height: 1.4;
2852
+ --text-xl-size: 36px;
2853
+ --text-xl-line-height: 1.4;
2854
+ --text-xxl-size: 64px;
2855
+ --text-xxl-line-height: 1;
2846
2856
  }
2847
2857
 
2848
- .SearchModal-module__content___I2SdX {
2849
- flex: 1;
2858
+ .SearchModal-module__overlay___Vbvg9 {
2859
+ position: fixed;
2860
+ top: 0;
2861
+ left: 0;
2862
+ right: 0;
2863
+ bottom: 0;
2864
+ background-color: rgba(0, 0, 0, 0.5);
2865
+ display: flex;
2866
+ align-items: flex-start;
2867
+ justify-content: center;
2868
+ padding: 2rem 1rem;
2869
+ z-index: 1000;
2850
2870
  overflow-y: auto;
2851
- padding: 1.5rem;
2852
2871
  }
2853
2872
 
2854
- @media (max-width: 768px) {
2855
- .SearchModal-module__overlay___Vbvg9 {
2856
- padding: 1rem;
2857
- }
2858
- .SearchModal-module__modal___1k5gO {
2859
- max-height: calc(100vh - 2rem);
2860
- }
2861
- .SearchModal-module__header___I79uH {
2862
- padding: 1rem;
2863
- }
2864
- .SearchModal-module__title___VlmEk {
2865
- font-size: 1.25rem;
2866
- }
2867
- .SearchModal-module__content___I2SdX {
2868
- padding: 1rem;
2869
- }
2870
- }
2871
- .SearchBar-module__searchBar___5ak1g {
2872
- display: flex;
2873
- gap: 0.75rem;
2873
+ .SearchModal-module__modal___1k5gO {
2874
+ position: relative;
2875
+ background-color: #ffffff;
2876
+ border-radius: 0;
2877
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
2874
2878
  width: 100%;
2875
- align-items: center;
2876
- }
2877
-
2878
- .SearchBar-module__inputWrapper___-4wrM {
2879
- flex: 1;
2879
+ max-width: 1200px;
2880
+ max-height: calc(100vh - 4rem);
2880
2881
  display: flex;
2881
- align-items: center;
2882
- gap: 0.75rem;
2883
- padding: 0.75rem 1rem;
2884
- background-color: #f3f4f6;
2885
- border: 1px solid #d1d5db;
2886
- border-radius: 0.5rem;
2887
- transition: all 0.2s ease-in-out;
2882
+ flex-direction: column;
2883
+ outline: none;
2888
2884
  }
2889
- .SearchBar-module__inputWrapper___-4wrM:focus-within {
2890
- background-color: #ffffff;
2891
- border-color: #0066cc;
2892
- box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
2885
+ .SearchModal-module__modal___1k5gO:focus-visible {
2886
+ box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.5), 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
2893
2887
  }
2894
2888
 
2895
- .SearchBar-module__searchIcon___VAuDz {
2896
- width: 1.25rem;
2897
- height: 1.25rem;
2898
- color: #6b7280;
2899
- flex-shrink: 0;
2889
+ .SearchModal-module__header___I79uH {
2890
+ display: flex;
2891
+ align-items: center;
2892
+ justify-content: space-between;
2893
+ padding: 1.5rem;
2894
+ border-bottom: 1px solid #e5e7eb;
2900
2895
  }
2901
2896
 
2902
- .SearchBar-module__searchInput___1K4GN {
2903
- flex: 1;
2904
- border: none;
2905
- outline: none;
2906
- background: transparent;
2907
- font-size: 1rem;
2897
+ .SearchModal-module__title___VlmEk {
2898
+ margin: 0;
2899
+ font-size: 1.5rem;
2900
+ font-weight: 600;
2908
2901
  color: #111827;
2909
- padding: 0;
2910
- }
2911
- .SearchBar-module__searchInput___1K4GN::-moz-placeholder {
2912
- color: #9ca3af;
2913
- }
2914
- .SearchBar-module__searchInput___1K4GN::placeholder {
2915
- color: #9ca3af;
2916
2902
  }
2917
2903
 
2918
- .SearchBar-module__submitButton___DZWsQ {
2919
- padding: 0.75rem 1.5rem;
2920
- background-color: #dc2626;
2921
- color: #ffffff;
2904
+ .SearchModal-module__closeButton___AN0zt {
2905
+ display: flex;
2906
+ align-items: center;
2907
+ justify-content: center;
2908
+ width: 2.5rem;
2909
+ height: 2.5rem;
2910
+ padding: 0;
2911
+ background: transparent;
2922
2912
  border: none;
2923
- border-radius: 0.5rem;
2924
- font-size: 1rem;
2925
- font-weight: 600;
2913
+ border-radius: 0.375rem;
2914
+ color: #6b7280;
2926
2915
  cursor: pointer;
2927
2916
  transition: all 0.2s ease-in-out;
2928
- white-space: nowrap;
2929
2917
  }
2930
- .SearchBar-module__submitButton___DZWsQ:hover:not(:disabled) {
2931
- background-color: #b91c1c;
2918
+ .SearchModal-module__closeButton__icon___vISSw {
2919
+ display: flex;
2920
+ align-items: center;
2921
+ justify-content: center;
2932
2922
  }
2933
- .SearchBar-module__submitButton___DZWsQ:focus-visible {
2934
- outline: 2px solid #0066cc;
2935
- outline-offset: 2px;
2923
+ .SearchModal-module__closeButton__icon___vISSw svg {
2924
+ width: 1.5rem;
2925
+ height: 1.5rem;
2926
+ display: block;
2936
2927
  }
2937
- .SearchBar-module__submitButton___DZWsQ:active:not(:disabled) {
2938
- transform: scale(0.98);
2928
+ .SearchModal-module__closeButton__text___-4EH1 {
2929
+ display: none;
2939
2930
  }
2940
- .SearchBar-module__submitButton___DZWsQ:disabled {
2941
- opacity: 0.5;
2942
- cursor: not-allowed;
2931
+ .SearchModal-module__closeButton___AN0zt:hover {
2932
+ background-color: #f3f4f6;
2933
+ color: #111827;
2934
+ }
2935
+ .SearchModal-module__closeButton___AN0zt:focus-visible {
2936
+ outline: 2px solid #0066cc;
2937
+ outline-offset: 2px;
2943
2938
  }
2944
-
2945
2939
  @media (max-width: 768px) {
2946
- .SearchBar-module__searchBar___5ak1g {
2947
- flex-direction: column;
2948
- gap: 0.5rem;
2940
+ .SearchModal-module__closeButton___AN0zt {
2941
+ width: auto;
2942
+ height: auto;
2943
+ padding: 0;
2944
+ border-radius: 0;
2945
+ font-size: 13.5px;
2946
+ font-weight: 600;
2947
+ color: #000000;
2948
+ text-align: right;
2949
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
2950
+ text-transform: uppercase;
2951
+ align-self: flex-end;
2949
2952
  }
2950
- .SearchBar-module__inputWrapper___-4wrM {
2951
- width: 100%;
2953
+ .SearchModal-module__closeButton__icon___vISSw {
2954
+ display: none;
2952
2955
  }
2953
- .SearchBar-module__submitButton___DZWsQ {
2954
- width: 100%;
2956
+ .SearchModal-module__closeButton__text___-4EH1 {
2957
+ display: inline;
2958
+ }
2959
+ .SearchModal-module__closeButton___AN0zt:hover {
2960
+ opacity: 0.7;
2961
+ background-color: transparent;
2962
+ }
2963
+ .SearchModal-module__closeButton___AN0zt:focus-visible {
2964
+ outline: 1px solid #000000;
2965
+ outline-offset: 2px;
2955
2966
  }
2956
2967
  }
2957
- .ResultsCount-module__resultsCount___cNM6f {
2958
- font-size: 0.875rem;
2959
- color: #6b7280;
2960
- font-weight: 500;
2968
+
2969
+ .SearchModal-module__closeButtonDesktop___Lxxb0 {
2970
+ display: block;
2971
+ align-self: flex-end;
2972
+ margin-bottom: 1.5rem;
2961
2973
  }
2962
- .SeeAllLinkButton-module__seeAllButton___eAQqJ {
2963
- display: inline-flex;
2964
- align-items: center;
2965
- gap: 0.5rem;
2966
- padding: 0.5rem 0;
2967
- background: none;
2968
- border: none;
2969
- color: #dc2626;
2970
- font-size: 0.875rem;
2971
- font-weight: 600;
2972
- cursor: pointer;
2973
- transition: all 0.2s ease-in-out;
2974
+ @media (max-width: 768px) {
2975
+ .SearchModal-module__closeButtonDesktop___Lxxb0 {
2976
+ display: none;
2977
+ }
2974
2978
  }
2975
- .SeeAllLinkButton-module__seeAllButton___eAQqJ svg {
2976
- width: 1rem;
2977
- height: 1rem;
2978
- transition: transform 0.2s ease-in-out;
2979
+
2980
+ .SearchModal-module__closeButtonMobile___WIIMS {
2981
+ display: none;
2979
2982
  }
2980
- .SeeAllLinkButton-module__seeAllButton___eAQqJ:hover {
2981
- color: #b91c1c;
2983
+ @media (max-width: 768px) {
2984
+ .SearchModal-module__closeButtonMobile___WIIMS {
2985
+ display: flex;
2986
+ }
2982
2987
  }
2983
- .SeeAllLinkButton-module__seeAllButton___eAQqJ:hover svg {
2984
- transform: translateX(4px);
2988
+
2989
+ .SearchModal-module__stickyHeader___wp-gA {
2990
+ display: none;
2985
2991
  }
2986
- .SeeAllLinkButton-module__seeAllButton___eAQqJ:focus-visible {
2987
- outline: 2px solid #0066cc;
2988
- outline-offset: 2px;
2989
- border-radius: 0.25rem;
2992
+ @media (max-width: 768px) {
2993
+ .SearchModal-module__stickyHeader___wp-gA {
2994
+ display: flex;
2995
+ flex-direction: column;
2996
+ position: sticky;
2997
+ top: 0;
2998
+ background: #ffffff;
2999
+ z-index: 10;
3000
+ padding: 18px;
3001
+ gap: 18px;
3002
+ flex-shrink: 0;
3003
+ }
2990
3004
  }
2991
- .ResultsColumn-module__resultsColumn___AexF5 {
3005
+
3006
+ .SearchModal-module__scrollableContent___lrZP3 {
3007
+ flex: 1;
3008
+ overflow-y: auto;
3009
+ padding: 1.5rem;
2992
3010
  display: flex;
2993
3011
  flex-direction: column;
2994
- gap: 1rem;
2995
3012
  }
2996
-
2997
- .ResultsColumn-module__columnHeader___-aUWU {
2998
- display: flex;
2999
- align-items: center;
3000
- justify-content: space-between;
3001
- padding-bottom: 0.75rem;
3002
- border-bottom: 2px solid #e5e7eb;
3013
+ @media (max-width: 768px) {
3014
+ .SearchModal-module__scrollableContent___lrZP3 {
3015
+ padding: 0 18px 18px 18px;
3016
+ }
3017
+ .SearchModal-module__overlay___Vbvg9 {
3018
+ padding: 0;
3019
+ align-items: stretch;
3020
+ }
3021
+ .SearchModal-module__modal___1k5gO {
3022
+ width: 100vw;
3023
+ height: 100vh;
3024
+ max-width: 100vw;
3025
+ max-height: 100vh;
3026
+ border-radius: 0;
3027
+ }
3003
3028
  }
3004
-
3005
- .ResultsColumn-module__columnTitle___Gddr- {
3006
- margin: 0;
3007
- font-size: 1.125rem;
3008
- font-weight: 600;
3009
- color: #111827;
3029
+ :root {
3030
+ --leybold-red: #e2001a;
3031
+ --leybold-black: #000000;
3032
+ --leybold-white: #ffffff;
3033
+ --leybold-blue-grey: #546672;
3034
+ --leybold-white-aluminium: #dae0e3;
3035
+ --leybold-window-gray: #99a1ab;
3036
+ --leybold-light-grey: #c5c7c4;
3037
+ --leybold-very-light-grey: #f5f5f5;
3038
+ --leybold-slate-gray: #4a4e54;
3039
+ --leybold-anthracite-gray: #383e42;
3040
+ --leybold-orange: #d18e56;
3041
+ --leybold-yellow: #edd163;
3042
+ --leybold-green: #6ea67b;
3043
+ --leybold-purple: #732d5d;
3044
+ --leybold-purple-gray: #945e67;
3045
+ --leybold-blue: #2b4679;
3046
+ --leybold-light-blue: #3f6a98;
3047
+ --leybold-blue-green: #39788e;
3048
+ --leybold-green-gray: #6d8f9f;
3049
+ --color-primary: #e2001a;
3050
+ --color-secondary: #546672;
3051
+ --color-success: #6ea67b;
3052
+ --color-danger: #e2001a;
3053
+ --color-warning: #d18e56;
3054
+ --color-info: #3f6a98;
3055
+ --text-primary: #000000;
3056
+ --text-secondary: #4a4e54;
3057
+ --text-muted: #99a1ab;
3058
+ --text-inverse: #ffffff;
3059
+ --bg-primary: #ffffff;
3060
+ --bg-secondary: #dae0e3;
3061
+ --bg-dark: #383e42;
3062
+ --border-color: #c5c7c4;
3063
+ --border-color-dark: #4a4e54;
3064
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
3065
+ --h1-mobile-size: 32px;
3066
+ --h1-mobile-line-height: 1.2;
3067
+ --h2-mobile-size: 24px;
3068
+ --h2-mobile-line-height: 1.2;
3069
+ --h3-mobile-size: 18px;
3070
+ --h3-mobile-line-height: 1.6;
3071
+ --h4-mobile-size: 16px;
3072
+ --h4-mobile-line-height: 1.55;
3073
+ --h5-mobile-size: 14px;
3074
+ --h5-mobile-line-height: 1.5;
3075
+ --body-mobile-size: 14px;
3076
+ --body-mobile-line-height: 1.5;
3077
+ --h1-desktop-size: 55px;
3078
+ --h1-desktop-line-height: 1.15;
3079
+ --h1-desktop-letter-spacing: -0.02em;
3080
+ --h2-desktop-size: 40px;
3081
+ --h2-desktop-line-height: 1.2;
3082
+ --h2-desktop-letter-spacing: -0.01em;
3083
+ --h3-desktop-size: 32px;
3084
+ --h3-desktop-line-height: 1.2;
3085
+ --h4-desktop-size: 24px;
3086
+ --h4-desktop-line-height: 1.2;
3087
+ --h5-desktop-size: 18px;
3088
+ --h5-desktop-line-height: 1.6;
3089
+ --body-desktop-size: 18px;
3090
+ --body-desktop-line-height: 1.6;
3091
+ --text-lg-size: 27px;
3092
+ --text-lg-line-height: 1.4;
3093
+ --text-xl-size: 36px;
3094
+ --text-xl-line-height: 1.4;
3095
+ --text-xxl-size: 64px;
3096
+ --text-xxl-line-height: 1;
3010
3097
  }
3011
3098
 
3012
- .ResultsColumn-module__resultsList___BkEie {
3099
+ .SearchBar-module__searchBar___5ak1g {
3013
3100
  display: flex;
3014
- flex-direction: column;
3015
- gap: 0.75rem;
3101
+ gap: 18px;
3102
+ width: 100%;
3103
+ align-items: center;
3016
3104
  }
3017
-
3018
- .ResultsColumn-module__columnFooter___4zJUp {
3019
- padding-top: 0.75rem;
3020
- border-top: 1px solid #e5e7eb;
3105
+ @media (max-width: 768px) {
3106
+ .SearchBar-module__searchBar___5ak1g {
3107
+ gap: 0;
3108
+ }
3021
3109
  }
3022
3110
 
3023
- .ResultsColumn-module__loadingState___wme5F,
3024
- .ResultsColumn-module__errorState___NI4fW,
3025
- .ResultsColumn-module__emptyState___tvefj {
3111
+ .SearchBar-module__inputWrapper___-4wrM {
3112
+ flex: 1;
3026
3113
  display: flex;
3027
- flex-direction: column;
3028
3114
  align-items: center;
3029
- justify-content: center;
3030
- padding: 3rem 1rem;
3031
- text-align: center;
3032
- color: #6b7280;
3115
+ gap: 18px;
3116
+ padding: 18px 0;
3117
+ background-color: transparent;
3118
+ border: none;
3119
+ border-bottom: 1px solid rgba(0, 0, 0, 0.16);
3120
+ border-radius: 0;
3121
+ transition: all 0.2s ease-in-out;
3033
3122
  }
3034
-
3035
- .ResultsColumn-module__spinner___hhntn {
3036
- width: 2rem;
3037
- height: 2rem;
3038
- border: 3px solid #e5e7eb;
3039
- border-top-color: #dc2626;
3040
- border-radius: 50%;
3041
- animation: ResultsColumn-module__spin___orVAn 0.8s linear infinite;
3042
- margin-bottom: 1rem;
3123
+ .SearchBar-module__inputWrapper___-4wrM:focus-within {
3124
+ border-bottom-color: rgba(0, 0, 0, 0.3);
3043
3125
  }
3044
-
3045
- @keyframes ResultsColumn-module__spin___orVAn {
3046
- to {
3047
- transform: rotate(360deg);
3126
+ @media (max-width: 768px) {
3127
+ .SearchBar-module__inputWrapper___-4wrM {
3128
+ border: 1px solid rgba(0, 0, 0, 0.16);
3129
+ border-radius: 0;
3130
+ padding: 12px;
3048
3131
  }
3049
3132
  }
3050
- .ResultsColumn-module__errorState___NI4fW {
3051
- color: #dc2626;
3052
- }
3053
- .ContentCardHorizontal-module__contentCard___l-Kim {
3054
- display: flex;
3055
- flex-direction: column;
3056
- align-items: stretch;
3057
- gap: 1rem;
3058
- padding: 1rem;
3059
- background-color: #ffffff;
3060
- border: 1px solid #e5e7eb;
3061
- border-radius: 0.5rem;
3062
- text-decoration: none;
3063
- color: inherit;
3064
- transition: all 0.2s ease-in-out;
3065
- }
3066
- .ContentCardHorizontal-module__contentCard___l-Kim:hover {
3067
- border-color: #dc2626;
3068
- box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
3133
+
3134
+ .SearchBar-module__searchIcon___VAuDz {
3135
+ width: 20px;
3136
+ height: 20px;
3137
+ color: rgba(0, 0, 0, 0.5);
3138
+ flex-shrink: 0;
3069
3139
  }
3070
- .ContentCardHorizontal-module__contentCard___l-Kim:focus-visible {
3071
- outline: 2px solid #0066cc;
3072
- outline-offset: 2px;
3140
+ @media (max-width: 768px) {
3141
+ .SearchBar-module__searchIcon___VAuDz {
3142
+ width: 16px;
3143
+ height: 16px;
3144
+ }
3073
3145
  }
3074
3146
 
3075
- .ContentCardHorizontal-module__contentMeta___rEW-X {
3076
- display: flex;
3077
- align-items: center;
3078
- gap: 0.5rem;
3079
- margin-bottom: 0.5rem;
3147
+ .SearchBar-module__searchInput___1K4GN {
3148
+ flex: 1;
3149
+ border: none;
3150
+ outline: none;
3151
+ background: transparent;
3152
+ font-size: 18px;
3153
+ color: rgba(0, 0, 0, 0.75);
3154
+ padding: 0;
3155
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3156
+ font-weight: 400;
3080
3157
  }
3081
-
3082
- .ContentCardHorizontal-module__contentCategory___NssVD {
3083
- display: inline-block;
3084
- padding: 0.25rem 0.75rem;
3085
- background-color: #dc2626;
3086
- color: #ffffff;
3087
- font-size: 0.75rem;
3088
- font-weight: 600;
3089
- text-transform: uppercase;
3090
- border-radius: 0.25rem;
3091
- letter-spacing: 0.05em;
3158
+ .SearchBar-module__searchInput___1K4GN::-moz-placeholder {
3159
+ color: rgba(0, 0, 0, 0.5);
3092
3160
  }
3093
-
3094
- .ContentCardHorizontal-module__contentMetaText___muYBN {
3095
- font-size: 0.875rem;
3096
- color: #6b7280;
3161
+ .SearchBar-module__searchInput___1K4GN::placeholder {
3162
+ color: rgba(0, 0, 0, 0.5);
3097
3163
  }
3098
-
3099
- .ContentCardHorizontal-module__contentTitle___54gEo {
3100
- margin: 0 0 0.5rem 0;
3101
- font-size: 1rem;
3102
- font-weight: 600;
3103
- color: #111827;
3104
- line-height: 1.4;
3164
+ @media (max-width: 768px) {
3165
+ .SearchBar-module__searchInput___1K4GN {
3166
+ font-size: 14px;
3167
+ }
3105
3168
  }
3106
3169
 
3107
- .ContentCardHorizontal-module__contentExcerpt___tqg1v {
3108
- margin: 0;
3109
- font-size: 0.875rem;
3110
- color: #4b5563;
3111
- line-height: 1.5;
3112
- display: -webkit-box;
3113
- -webkit-line-clamp: 2;
3114
- -webkit-box-orient: vertical;
3115
- overflow: hidden;
3170
+ .SearchBar-module__clearButton___JQYg- {
3171
+ font-size: 12px;
3172
+ font-weight: 400;
3173
+ color: #4a4e54;
3174
+ text-transform: uppercase;
3175
+ background: none;
3176
+ border: none;
3177
+ padding: 2px;
3178
+ cursor: pointer;
3179
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3180
+ flex-shrink: 0;
3181
+ transition: opacity 0.2s ease-in-out;
3116
3182
  }
3117
- .InstantResults-module__instantResultsLayout___oy-o4 {
3118
- width: 100%;
3183
+ .SearchBar-module__clearButton___JQYg-:hover {
3184
+ opacity: 0.7;
3185
+ }
3186
+ .SearchBar-module__clearButton___JQYg-:focus-visible {
3187
+ outline: 1px solid #000000;
3188
+ outline-offset: 2px;
3119
3189
  }
3120
3190
 
3121
- .InstantResults-module__queryHeader___Vmbul {
3191
+ .SearchBar-module__submitButton___DZWsQ {
3192
+ padding: 18px 24px;
3193
+ background-color: #e2001a;
3194
+ color: #ffffff;
3195
+ border: none;
3196
+ border-radius: 0;
3197
+ font-size: 16px;
3198
+ font-weight: 500;
3199
+ text-transform: uppercase;
3200
+ cursor: pointer;
3201
+ transition: all 0.2s ease-in-out;
3202
+ white-space: nowrap;
3203
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3204
+ height: 57px;
3122
3205
  display: flex;
3123
3206
  align-items: center;
3124
- justify-content: space-between;
3125
- margin-bottom: 1.5rem;
3126
- padding-bottom: 1rem;
3127
- border-bottom: 1px solid #e5e7eb;
3207
+ justify-content: center;
3128
3208
  }
3129
-
3130
- .InstantResults-module__queryText___uVCCc {
3131
- margin: 0;
3132
- font-size: 1.25rem;
3133
- font-weight: 600;
3134
- color: #111827;
3209
+ .SearchBar-module__submitButton__text___WkUsL {
3210
+ display: inline;
3135
3211
  }
3136
-
3137
- .InstantResults-module__queryHighlight___C3hP1 {
3138
- color: #dc2626;
3212
+ .SearchBar-module__submitButton__icon___s-ltv {
3213
+ display: none;
3139
3214
  }
3140
-
3141
- .InstantResults-module__columnsGrid___bHRUM {
3142
- display: grid;
3143
- grid-template-columns: repeat(2, 1fr);
3144
- gap: 2rem;
3215
+ .SearchBar-module__submitButton___DZWsQ:hover:not(:disabled) {
3216
+ background-color: rgb(185.2, 0, 21.3061946903);
3145
3217
  }
3146
- @media (max-width: 768px) {
3147
- .InstantResults-module__columnsGrid___bHRUM {
3148
- grid-template-columns: 1fr;
3149
- }
3218
+ .SearchBar-module__submitButton___DZWsQ:focus-visible {
3219
+ outline: 1px solid #000000;
3220
+ outline-offset: 2px;
3150
3221
  }
3151
-
3152
- .InstantResults-module__resultsColumn___ZBSlT {
3153
- display: flex;
3154
- flex-direction: column;
3155
- gap: 1rem;
3222
+ .SearchBar-module__submitButton___DZWsQ:active:not(:disabled) {
3223
+ transform: scale(0.98);
3156
3224
  }
3157
-
3158
- .InstantResults-module__columnHeader___VYYhi {
3159
- display: flex;
3160
- align-items: center;
3161
- justify-content: space-between;
3162
- padding-bottom: 0.75rem;
3163
- border-bottom: 2px solid #e5e7eb;
3164
- }
3165
-
3166
- .InstantResults-module__columnTitle___uSvL7 {
3167
- margin: 0;
3168
- font-size: 1.125rem;
3169
- font-weight: 600;
3170
- color: #111827;
3171
- }
3172
-
3173
- .InstantResults-module__resultsCount___9VHBa {
3174
- font-size: 0.875rem;
3175
- color: #6b7280;
3176
- font-weight: 500;
3177
- }
3178
-
3179
- .InstantResults-module__resultsList___7s3PT {
3180
- display: flex;
3181
- flex-direction: column;
3182
- gap: 0.75rem;
3183
- }
3184
-
3185
- .InstantResults-module__columnFooter___wIkX1 {
3186
- padding-top: 0.75rem;
3187
- border-top: 1px solid #e5e7eb;
3188
- }
3189
-
3190
- .InstantResults-module__seeAllButton___xEDAX {
3191
- display: inline-flex;
3192
- align-items: center;
3193
- gap: 0.5rem;
3194
- padding: 0.5rem 0;
3195
- background: none;
3196
- border: none;
3197
- color: #dc2626;
3198
- font-size: 0.875rem;
3199
- font-weight: 600;
3200
- cursor: pointer;
3201
- transition: all 0.2s ease-in-out;
3202
- }
3203
- .InstantResults-module__seeAllButton___xEDAX svg {
3204
- width: 1rem;
3205
- height: 1rem;
3206
- transition: transform 0.2s ease-in-out;
3207
- }
3208
- .InstantResults-module__seeAllButton___xEDAX:hover {
3209
- color: #b91c1c;
3210
- }
3211
- .InstantResults-module__seeAllButton___xEDAX:hover svg {
3212
- transform: translateX(4px);
3213
- }
3214
- .InstantResults-module__seeAllButton___xEDAX:focus-visible {
3215
- outline: 2px solid #0066cc;
3216
- outline-offset: 2px;
3217
- border-radius: 0.25rem;
3218
- }
3219
-
3220
- .InstantResults-module__productCard___Q-OOJ,
3221
- .InstantResults-module__contentCard___-8U6I {
3222
- display: flex;
3223
- gap: 1rem;
3224
- padding: 1rem;
3225
- background-color: #ffffff;
3226
- border: 1px solid #e5e7eb;
3227
- border-radius: 0.5rem;
3228
- text-decoration: none;
3229
- color: inherit;
3230
- transition: all 0.2s ease-in-out;
3231
- }
3232
- .InstantResults-module__productCard___Q-OOJ:hover,
3233
- .InstantResults-module__contentCard___-8U6I:hover {
3234
- border-color: #dc2626;
3235
- box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
3236
- }
3237
- .InstantResults-module__productCard___Q-OOJ:focus-visible,
3238
- .InstantResults-module__contentCard___-8U6I:focus-visible {
3239
- outline: 2px solid #0066cc;
3240
- outline-offset: 2px;
3241
- }
3242
-
3243
- .InstantResults-module__productCard___Q-OOJ {
3244
- align-items: flex-start;
3245
- }
3246
-
3247
- .InstantResults-module__productImage___FWv8V {
3248
- width: 80px;
3249
- height: 80px;
3250
- flex-shrink: 0;
3251
- background-color: #f3f4f6;
3252
- border-radius: 0.375rem;
3253
- overflow: hidden;
3254
- display: flex;
3255
- align-items: center;
3256
- justify-content: center;
3257
- }
3258
- .InstantResults-module__productImage___FWv8V img {
3259
- width: 100%;
3260
- height: 100%;
3261
- -o-object-fit: cover;
3262
- object-fit: cover;
3263
- }
3264
-
3265
- .InstantResults-module__productContent___-TF0l {
3266
- flex: 1;
3267
- min-width: 0;
3268
- }
3269
-
3270
- .InstantResults-module__productTitle___6DNgP {
3271
- margin: 0 0 0.25rem 0;
3272
- font-size: 1rem;
3273
- font-weight: 600;
3274
- color: #111827;
3275
- line-height: 1.4;
3276
- }
3277
-
3278
- .InstantResults-module__productId___6Y4qb {
3279
- margin: 0 0 0.25rem 0;
3280
- font-size: 0.875rem;
3281
- color: #6b7280;
3282
- }
3283
-
3284
- .InstantResults-module__productDescription___NHd1R {
3285
- margin: 0 0 0.5rem 0;
3286
- font-size: 0.875rem;
3287
- color: #4b5563;
3288
- line-height: 1.5;
3289
- display: -webkit-box;
3290
- -webkit-line-clamp: 2;
3291
- -webkit-box-orient: vertical;
3292
- overflow: hidden;
3293
- }
3294
-
3295
- .InstantResults-module__productPrice___qdcyH {
3296
- margin: 0;
3297
- font-size: 1rem;
3298
- font-weight: 700;
3299
- color: #111827;
3300
- }
3301
-
3302
- .InstantResults-module__contentCard___-8U6I {
3303
- flex-direction: column;
3304
- align-items: stretch;
3305
- }
3306
-
3307
- .InstantResults-module__contentMeta___A94dL {
3308
- display: flex;
3309
- align-items: center;
3310
- gap: 0.5rem;
3311
- margin-bottom: 0.5rem;
3312
- }
3313
-
3314
- .InstantResults-module__contentCategory___p4flF {
3315
- display: inline-block;
3316
- padding: 0.25rem 0.75rem;
3317
- background-color: #dc2626;
3318
- color: #ffffff;
3319
- font-size: 0.75rem;
3320
- font-weight: 600;
3321
- text-transform: uppercase;
3322
- border-radius: 0.25rem;
3323
- letter-spacing: 0.05em;
3324
- }
3325
-
3326
- .InstantResults-module__contentMetaText___sJQL1 {
3327
- font-size: 0.875rem;
3328
- color: #6b7280;
3329
- }
3330
-
3331
- .InstantResults-module__contentTitle___kgC7e {
3332
- margin: 0 0 0.5rem 0;
3333
- font-size: 1rem;
3334
- font-weight: 600;
3335
- color: #111827;
3336
- line-height: 1.4;
3337
- }
3338
-
3339
- .InstantResults-module__contentExcerpt___l-JJi {
3340
- margin: 0;
3341
- font-size: 0.875rem;
3342
- color: #4b5563;
3343
- line-height: 1.5;
3344
- display: -webkit-box;
3345
- -webkit-line-clamp: 2;
3346
- -webkit-box-orient: vertical;
3347
- overflow: hidden;
3348
- }
3349
-
3350
- .InstantResults-module__loadingState___l0fMq,
3351
- .InstantResults-module__errorState___hTBbE,
3352
- .InstantResults-module__emptyState___y0gUJ {
3353
- display: flex;
3354
- flex-direction: column;
3355
- align-items: center;
3356
- justify-content: center;
3357
- padding: 3rem 1rem;
3358
- text-align: center;
3359
- color: #6b7280;
3360
- }
3361
-
3362
- .InstantResults-module__spinner___85jF- {
3363
- width: 2rem;
3364
- height: 2rem;
3365
- border: 3px solid #e5e7eb;
3366
- border-top-color: #dc2626;
3367
- border-radius: 50%;
3368
- animation: InstantResults-module__spin___2YCIr 0.8s linear infinite;
3369
- margin-bottom: 1rem;
3225
+ .SearchBar-module__submitButton___DZWsQ:disabled {
3226
+ opacity: 0.5;
3227
+ cursor: not-allowed;
3370
3228
  }
3371
-
3372
- @keyframes InstantResults-module__spin___2YCIr {
3373
- to {
3374
- transform: rotate(360deg);
3229
+ @media (max-width: 768px) {
3230
+ .SearchBar-module__submitButton___DZWsQ {
3231
+ width: auto;
3232
+ min-width: 44.5px;
3233
+ height: 44.5px;
3234
+ padding: 12px;
3235
+ }
3236
+ .SearchBar-module__submitButton__text___WkUsL {
3237
+ display: none;
3238
+ }
3239
+ .SearchBar-module__submitButton__icon___s-ltv {
3240
+ display: flex;
3241
+ }
3242
+ .SearchBar-module__submitButton__icon___s-ltv svg {
3243
+ width: 20px;
3244
+ height: 20px;
3245
+ color: #ffffff;
3375
3246
  }
3376
- }
3377
- .InstantResults-module__errorState___hTBbE {
3378
- color: #dc2626;
3379
3247
  }
3380
3248
  :root {
3381
3249
  --leybold-red: #e2001a;
@@ -3385,6 +3253,7 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
3385
3253
  --leybold-white-aluminium: #dae0e3;
3386
3254
  --leybold-window-gray: #99a1ab;
3387
3255
  --leybold-light-grey: #c5c7c4;
3256
+ --leybold-very-light-grey: #f5f5f5;
3388
3257
  --leybold-slate-gray: #4a4e54;
3389
3258
  --leybold-anthracite-gray: #383e42;
3390
3259
  --leybold-orange: #d18e56;
@@ -3446,632 +3315,2125 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
3446
3315
  --text-xxl-line-height: 1;
3447
3316
  }
3448
3317
 
3449
- .Filters-module__filtersPanel___T3SlK {
3318
+ .ContentCardHorizontal-module__contentCard___l-Kim {
3450
3319
  display: flex;
3451
3320
  flex-direction: column;
3452
- background-color: #ffffff;
3453
- border: 1px solid #e5e7eb;
3454
- border-radius: 8px;
3455
- overflow: hidden;
3321
+ align-items: stretch;
3322
+ text-decoration: none;
3323
+ color: inherit;
3324
+ transition: all 0.2s ease-in-out;
3456
3325
  }
3457
3326
 
3458
- .Filters-module__filtersPanelHeader___XOBTi {
3459
- padding: 1rem 1.5rem;
3460
- border-bottom: 1px solid #e5e7eb;
3461
- background-color: #f9fafb;
3327
+ .ContentCardHorizontal-module__contentCard--instant-view___4wK9- {
3328
+ gap: 9px;
3329
+ padding: 27px 0 20px 0;
3330
+ background-color: transparent;
3331
+ border: none;
3332
+ border-radius: 0;
3462
3333
  }
3463
-
3464
- .Filters-module__filtersPanelTitle___Mnn10 {
3465
- margin: 0;
3466
- font-size: 1.125rem;
3467
- font-weight: 600;
3468
- color: #111827;
3334
+ .ContentCardHorizontal-module__contentCard--instant-view___4wK9- .ContentCardHorizontal-module__contentExcerpt___tqg1v {
3335
+ display: none;
3469
3336
  }
3470
-
3471
- .Filters-module__filtersList___jPgkP {
3472
- display: flex;
3473
- flex-direction: column;
3337
+ @media (max-width: 768px) {
3338
+ .ContentCardHorizontal-module__contentCard--instant-view___4wK9- .ContentCardHorizontal-module__contentExcerpt___tqg1v {
3339
+ display: -webkit-box;
3340
+ }
3474
3341
  }
3475
-
3476
- .Filters-module__filterAccordion___Mf9Oe {
3477
- border-bottom: 1px solid #e5e7eb;
3342
+ .ContentCardHorizontal-module__contentCard--instant-view___4wK9-:hover {
3343
+ opacity: 0.8;
3478
3344
  }
3479
- .Filters-module__filterAccordion___Mf9Oe:last-child {
3480
- border-bottom: none;
3345
+ .ContentCardHorizontal-module__contentCard--instant-view___4wK9-:focus-visible {
3346
+ outline: 1px solid #000000;
3347
+ outline-offset: 2px;
3481
3348
  }
3482
3349
 
3483
- .Filters-module__accordionHeader___DtPJx {
3484
- display: flex;
3485
- align-items: center;
3486
- justify-content: space-between;
3487
- width: 100%;
3488
- padding: 1rem 1.5rem;
3489
- background: none;
3350
+ .ContentCardHorizontal-module__contentCard--results-view___oBP2u {
3351
+ gap: 15px;
3352
+ padding: 27px 0 20px 18px;
3353
+ background-color: transparent;
3490
3354
  border: none;
3491
- cursor: pointer;
3492
- transition: background-color 0.2s ease-in-out;
3493
- text-align: left;
3494
- }
3495
- .Filters-module__accordionHeader___DtPJx:hover {
3496
- background-color: #f9fafb;
3355
+ border-left: 4px solid transparent;
3356
+ border-radius: 0;
3497
3357
  }
3498
- .Filters-module__accordionHeader___DtPJx:focus-visible {
3499
- outline: 2px solid #e2001a;
3500
- outline-offset: -2px;
3358
+ .ContentCardHorizontal-module__contentCard--results-view___oBP2u:hover {
3359
+ border-left-color: #e2001a;
3501
3360
  }
3502
-
3503
- .Filters-module__accordionTitle___YtHXW {
3504
- font-size: 1rem;
3505
- font-weight: 600;
3506
- color: #111827;
3507
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3361
+ .ContentCardHorizontal-module__contentCard--results-view___oBP2u:focus-visible {
3362
+ outline: 1px solid #000000;
3363
+ outline-offset: 2px;
3508
3364
  }
3509
3365
 
3510
- .Filters-module__accordionIcon___zRGrv {
3511
- color: #6b7280;
3512
- transition: transform 0.2s ease-in-out;
3513
- flex-shrink: 0;
3366
+ .ContentCardHorizontal-module__contentMeta___rEW-X {
3367
+ display: flex;
3368
+ align-items: center;
3369
+ gap: 9px;
3370
+ margin-bottom: 0;
3514
3371
  }
3515
3372
 
3516
- .Filters-module__accordionIconExpanded___pkkjv {
3517
- transform: rotate(180deg);
3518
- }
3519
-
3520
- .Filters-module__accordionContent___SqhIu {
3521
- padding: 0 1.5rem 1rem 1.5rem;
3522
- animation: Filters-module__slideDown___q0ZMt 0.2s ease-out;
3373
+ .ContentCardHorizontal-module__contentCategory___NssVD {
3374
+ display: inline-flex;
3375
+ align-items: center;
3376
+ gap: 9px;
3377
+ font-size: 14px;
3378
+ font-weight: 500;
3379
+ color: #e2001a;
3380
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3381
+ padding: 0;
3382
+ background-color: transparent;
3383
+ text-transform: none;
3523
3384
  }
3524
-
3525
- @keyframes Filters-module__slideDown___q0ZMt {
3526
- from {
3527
- opacity: 0;
3528
- transform: translateY(-4px);
3529
- }
3530
- to {
3531
- opacity: 1;
3532
- transform: translateY(0);
3385
+ @media (max-width: 768px) {
3386
+ .ContentCardHorizontal-module__contentCategory___NssVD {
3387
+ font-size: 9px;
3533
3388
  }
3534
3389
  }
3535
- .Filters-module__accordionSearch___V0A74 {
3536
- margin-bottom: 0.75rem;
3390
+ .ContentCardHorizontal-module__contentCategory___NssVD::after {
3391
+ content: "|";
3392
+ color: #99a1ab;
3393
+ font-weight: 400;
3537
3394
  }
3538
3395
 
3539
- .Filters-module__filterSearch___Jc8AX {
3540
- position: relative;
3541
- display: flex;
3542
- align-items: center;
3543
- width: 100%;
3396
+ .ContentCardHorizontal-module__contentMetaText___muYBN {
3397
+ font-size: 14px;
3398
+ font-weight: 500;
3399
+ color: #99a1ab;
3400
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3544
3401
  }
3545
-
3546
- .Filters-module__searchIcon___pas1t {
3547
- position: absolute;
3548
- left: 0.75rem;
3549
- color: #9ca3af;
3550
- pointer-events: none;
3402
+ @media (max-width: 768px) {
3403
+ .ContentCardHorizontal-module__contentMetaText___muYBN {
3404
+ font-size: 9px;
3405
+ }
3551
3406
  }
3552
3407
 
3553
- .Filters-module__searchInput___nzOMK {
3554
- width: 100%;
3555
- padding: 0.5rem 2rem 0.5rem 2.5rem;
3408
+ .ContentCardHorizontal-module__contentTitle___54gEo {
3409
+ margin: 0;
3410
+ font-size: 21.5px;
3411
+ font-weight: 500;
3412
+ line-height: 1.4;
3556
3413
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3557
- font-size: 0.875rem;
3558
- color: #111827;
3559
- background-color: #f9fafb;
3560
- border: 1px solid #e5e7eb;
3561
- border-radius: 6px;
3562
- outline: none;
3563
- transition: all 0.2s ease-in-out;
3414
+ color: #4a4e54;
3564
3415
  }
3565
- .Filters-module__searchInput___nzOMK::-moz-placeholder {
3566
- color: #9ca3af;
3416
+ @media (max-width: 768px) {
3417
+ .ContentCardHorizontal-module__contentTitle___54gEo {
3418
+ font-size: 16px;
3419
+ }
3567
3420
  }
3568
- .Filters-module__searchInput___nzOMK::placeholder {
3569
- color: #9ca3af;
3421
+
3422
+ .ContentCardHorizontal-module__contentExcerpt___tqg1v {
3423
+ margin: 0;
3424
+ font-size: 0.875rem;
3425
+ color: #4a4e54;
3426
+ line-height: 1.5;
3427
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3428
+ display: -webkit-box;
3429
+ -webkit-line-clamp: 2;
3430
+ -webkit-box-orient: vertical;
3431
+ overflow: hidden;
3570
3432
  }
3571
- .Filters-module__searchInput___nzOMK:focus {
3572
- background-color: #ffffff;
3573
- border-color: #e2001a;
3574
- box-shadow: 0 0 0 3px rgba(226, 0, 26, 0.1);
3433
+ @media (max-width: 768px) {
3434
+ .ContentCardHorizontal-module__contentExcerpt___tqg1v {
3435
+ font-size: 16px;
3436
+ line-height: 27px;
3437
+ }
3438
+ }
3439
+ :root {
3440
+ --leybold-red: #e2001a;
3441
+ --leybold-black: #000000;
3442
+ --leybold-white: #ffffff;
3443
+ --leybold-blue-grey: #546672;
3444
+ --leybold-white-aluminium: #dae0e3;
3445
+ --leybold-window-gray: #99a1ab;
3446
+ --leybold-light-grey: #c5c7c4;
3447
+ --leybold-very-light-grey: #f5f5f5;
3448
+ --leybold-slate-gray: #4a4e54;
3449
+ --leybold-anthracite-gray: #383e42;
3450
+ --leybold-orange: #d18e56;
3451
+ --leybold-yellow: #edd163;
3452
+ --leybold-green: #6ea67b;
3453
+ --leybold-purple: #732d5d;
3454
+ --leybold-purple-gray: #945e67;
3455
+ --leybold-blue: #2b4679;
3456
+ --leybold-light-blue: #3f6a98;
3457
+ --leybold-blue-green: #39788e;
3458
+ --leybold-green-gray: #6d8f9f;
3459
+ --color-primary: #e2001a;
3460
+ --color-secondary: #546672;
3461
+ --color-success: #6ea67b;
3462
+ --color-danger: #e2001a;
3463
+ --color-warning: #d18e56;
3464
+ --color-info: #3f6a98;
3465
+ --text-primary: #000000;
3466
+ --text-secondary: #4a4e54;
3467
+ --text-muted: #99a1ab;
3468
+ --text-inverse: #ffffff;
3469
+ --bg-primary: #ffffff;
3470
+ --bg-secondary: #dae0e3;
3471
+ --bg-dark: #383e42;
3472
+ --border-color: #c5c7c4;
3473
+ --border-color-dark: #4a4e54;
3474
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
3475
+ --h1-mobile-size: 32px;
3476
+ --h1-mobile-line-height: 1.2;
3477
+ --h2-mobile-size: 24px;
3478
+ --h2-mobile-line-height: 1.2;
3479
+ --h3-mobile-size: 18px;
3480
+ --h3-mobile-line-height: 1.6;
3481
+ --h4-mobile-size: 16px;
3482
+ --h4-mobile-line-height: 1.55;
3483
+ --h5-mobile-size: 14px;
3484
+ --h5-mobile-line-height: 1.5;
3485
+ --body-mobile-size: 14px;
3486
+ --body-mobile-line-height: 1.5;
3487
+ --h1-desktop-size: 55px;
3488
+ --h1-desktop-line-height: 1.15;
3489
+ --h1-desktop-letter-spacing: -0.02em;
3490
+ --h2-desktop-size: 40px;
3491
+ --h2-desktop-line-height: 1.2;
3492
+ --h2-desktop-letter-spacing: -0.01em;
3493
+ --h3-desktop-size: 32px;
3494
+ --h3-desktop-line-height: 1.2;
3495
+ --h4-desktop-size: 24px;
3496
+ --h4-desktop-line-height: 1.2;
3497
+ --h5-desktop-size: 18px;
3498
+ --h5-desktop-line-height: 1.6;
3499
+ --body-desktop-size: 18px;
3500
+ --body-desktop-line-height: 1.6;
3501
+ --text-lg-size: 27px;
3502
+ --text-lg-line-height: 1.4;
3503
+ --text-xl-size: 36px;
3504
+ --text-xl-line-height: 1.4;
3505
+ --text-xxl-size: 64px;
3506
+ --text-xxl-line-height: 1;
3575
3507
  }
3576
3508
 
3577
- .Filters-module__clearButton___tHl6L {
3578
- position: absolute;
3579
- right: 0.5rem;
3580
- display: flex;
3581
- align-items: center;
3582
- justify-content: center;
3583
- padding: 0.25rem;
3584
- background: none;
3585
- border: none;
3586
- color: #6b7280;
3587
- cursor: pointer;
3588
- border-radius: 4px;
3589
- transition: all 0.2s ease-in-out;
3509
+ .InstantResults-module__instantResultsLayout___oy-o4 {
3510
+ width: 100%;
3590
3511
  }
3591
- .Filters-module__clearButton___tHl6L:hover {
3592
- color: #111827;
3593
- background-color: #e5e7eb;
3512
+
3513
+ .InstantResults-module__columnsGrid___bHRUM {
3514
+ display: grid;
3515
+ grid-template-columns: repeat(2, 1fr);
3516
+ gap: 0;
3594
3517
  }
3595
- .Filters-module__clearButton___tHl6L:focus-visible {
3596
- outline: 2px solid #e2001a;
3597
- outline-offset: 2px;
3518
+ @media (max-width: 768px) {
3519
+ .InstantResults-module__columnsGrid___bHRUM {
3520
+ grid-template-columns: 1fr;
3521
+ }
3598
3522
  }
3599
3523
 
3600
- .Filters-module__filterList___TLqBu {
3524
+ .InstantResults-module__resultsColumn___ZBSlT {
3601
3525
  display: flex;
3602
3526
  flex-direction: column;
3603
- gap: 0.5rem;
3604
- max-height: 300px;
3605
- overflow-y: auto;
3606
- }
3607
- .Filters-module__filterList___TLqBu::-webkit-scrollbar {
3608
- width: 6px;
3609
- }
3610
- .Filters-module__filterList___TLqBu::-webkit-scrollbar-track {
3611
- background: #f9fafb;
3612
- border-radius: 3px;
3527
+ gap: 18px;
3613
3528
  }
3614
- .Filters-module__filterList___TLqBu::-webkit-scrollbar-thumb {
3615
- background: #d1d5db;
3616
- border-radius: 3px;
3529
+ .InstantResults-module__resultsColumn___ZBSlT:nth-child(2) {
3530
+ padding-left: 18px;
3617
3531
  }
3618
- .Filters-module__filterList___TLqBu::-webkit-scrollbar-thumb:hover {
3619
- background: #9ca3af;
3532
+ @media (max-width: 768px) {
3533
+ .InstantResults-module__resultsColumn___ZBSlT:nth-child(2) {
3534
+ padding-left: 0;
3535
+ padding-top: 36px;
3536
+ }
3620
3537
  }
3621
3538
 
3622
- .Filters-module__filterItem___lA2rv {
3539
+ .InstantResults-module__columnHeader___VYYhi {
3623
3540
  display: flex;
3624
3541
  align-items: center;
3625
- gap: 0.5rem;
3626
- padding: 0.5rem 0.75rem;
3627
- cursor: pointer;
3628
- border-radius: 4px;
3629
- transition: background-color 0.2s ease-in-out;
3630
- -webkit-user-select: none;
3631
- -moz-user-select: none;
3632
- user-select: none;
3542
+ justify-content: space-between;
3543
+ min-width: 300px;
3544
+ width: 100%;
3545
+ margin-bottom: 0;
3633
3546
  }
3634
- .Filters-module__filterItem___lA2rv:hover {
3635
- background-color: #f9fafb;
3547
+
3548
+ .InstantResults-module__showingText___lECiA {
3549
+ font-size: 16px;
3550
+ font-weight: 400;
3551
+ color: #546672;
3552
+ text-transform: uppercase;
3553
+ margin: 0;
3554
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3636
3555
  }
3637
- .Filters-module__filterItem___lA2rv:focus-within {
3638
- outline: 2px solid #e2001a;
3639
- outline-offset: 2px;
3556
+ @media (max-width: 768px) {
3557
+ .InstantResults-module__showingText___lECiA {
3558
+ font-size: 9px;
3559
+ }
3640
3560
  }
3641
3561
 
3642
- .Filters-module__filterCheckbox___9In3q {
3643
- width: 1rem;
3644
- height: 1rem;
3562
+ .InstantResults-module__seeAllButton___xEDAX {
3563
+ display: inline-flex;
3564
+ align-items: center;
3565
+ gap: 9px;
3566
+ padding: 9px;
3567
+ background: none;
3568
+ border: none;
3569
+ color: #e2001a;
3570
+ font-size: 14px;
3571
+ font-weight: 500;
3645
3572
  cursor: pointer;
3646
- accent-color: #e2001a;
3647
- flex-shrink: 0;
3573
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3574
+ transition: opacity 0.2s ease-in-out;
3648
3575
  }
3649
- .Filters-module__filterCheckbox___9In3q:focus {
3650
- outline: none;
3576
+ .InstantResults-module__seeAllButton___xEDAX:hover {
3577
+ opacity: 0.8;
3651
3578
  }
3652
-
3653
- .Filters-module__filterLabel___w-M8J {
3654
- flex: 1;
3655
- font-size: 0.875rem;
3656
- color: #374151;
3657
- line-height: 1.25rem;
3579
+ .InstantResults-module__seeAllButton___xEDAX:focus-visible {
3580
+ outline: 1px solid #000000;
3581
+ outline-offset: 2px;
3658
3582
  }
3659
3583
 
3660
- .Filters-module__filterCount___XMsmy {
3661
- font-size: 0.875rem;
3662
- color: #9ca3af;
3663
- font-weight: 400;
3584
+ .InstantResults-module__chevronIcon___bjb3q {
3585
+ width: 12px;
3586
+ height: 6px;
3587
+ transform: rotate(270deg);
3664
3588
  flex-shrink: 0;
3589
+ stroke: currentColor;
3665
3590
  }
3666
3591
 
3667
- .Filters-module__noResults___ZdZ4V {
3668
- padding: 1rem;
3669
- text-align: center;
3670
- color: #6b7280;
3671
- font-size: 0.875rem;
3672
- }
3673
-
3674
- .Filters-module__loadingState___k6olr {
3592
+ .InstantResults-module__resultsList___7s3PT {
3675
3593
  display: flex;
3676
3594
  flex-direction: column;
3677
- align-items: center;
3678
- justify-content: center;
3679
- padding: 2rem 1.5rem;
3680
- color: #6b7280;
3595
+ gap: 0;
3681
3596
  }
3682
- .Filters-module__loadingState___k6olr p {
3683
- margin: 0.5rem 0 0 0;
3684
- font-size: 0.875rem;
3597
+
3598
+ .InstantResults-module__divider___Ky6zK {
3599
+ border: none;
3600
+ border-top: 1px solid #f5f5f5;
3601
+ margin: 0;
3602
+ height: 0;
3685
3603
  }
3686
3604
 
3687
- .Filters-module__spinner___hvTaP {
3605
+ .InstantResults-module__loadingState___l0fMq,
3606
+ .InstantResults-module__errorState___hTBbE {
3607
+ display: flex;
3608
+ flex-direction: column;
3609
+ align-items: center;
3610
+ justify-content: center;
3611
+ padding: 3rem 1rem;
3612
+ text-align: center;
3613
+ color: #99a1ab;
3614
+ }
3615
+ .InstantResults-module__loadingState___l0fMq p,
3616
+ .InstantResults-module__errorState___hTBbE p {
3617
+ margin: 0;
3618
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3619
+ }
3620
+
3621
+ .InstantResults-module__spinner___85jF- {
3688
3622
  width: 2rem;
3689
3623
  height: 2rem;
3690
- border: 3px solid #e5e7eb;
3624
+ border: 3px solid #c5c7c4;
3691
3625
  border-top-color: #e2001a;
3692
3626
  border-radius: 50%;
3693
- animation: Filters-module__spin___P-Zhk 0.8s linear infinite;
3627
+ animation: InstantResults-module__spin___2YCIr 0.8s linear infinite;
3628
+ margin-bottom: 1rem;
3694
3629
  }
3695
3630
 
3696
- @keyframes Filters-module__spin___P-Zhk {
3631
+ @keyframes InstantResults-module__spin___2YCIr {
3697
3632
  to {
3698
3633
  transform: rotate(360deg);
3699
3634
  }
3700
3635
  }
3701
- @media (max-width: 1024px) {
3702
- .Filters-module__filtersList___jPgkP {
3703
- padding: 0;
3704
- }
3705
- }
3706
- @media (prefers-reduced-motion: reduce) {
3707
- .Filters-module__accordionIcon___zRGrv,
3708
- .Filters-module__accordionContent___SqhIu,
3709
- .Filters-module__searchInput___nzOMK,
3710
- .Filters-module__filterItem___lA2rv {
3711
- transition: none;
3712
- animation: none;
3713
- }
3714
- }
3715
- @media (prefers-contrast: high) {
3716
- .Filters-module__filterItem___lA2rv {
3717
- border: 1px solid transparent;
3718
- }
3719
- .Filters-module__filterItem___lA2rv:hover {
3720
- border-color: currentColor;
3721
- }
3722
- }
3723
- .Filters-module__appliedFilters___hP4x- {
3724
- padding: 1rem 1.5rem;
3725
- background-color: #f9fafb;
3726
- border-bottom: 1px solid #e5e7eb;
3727
- }
3728
-
3729
- .Filters-module__appliedFiltersHeader___w-ZBN {
3730
- display: flex;
3731
- align-items: center;
3732
- justify-content: space-between;
3733
- margin-bottom: 0.75rem;
3636
+ .InstantResults-module__errorState___hTBbE {
3637
+ color: #e2001a;
3734
3638
  }
3735
-
3736
- .Filters-module__appliedFiltersTitle___k6VbJ {
3737
- margin: 0;
3639
+ .ResultsCount-module__resultsCount___cNM6f {
3738
3640
  font-size: 0.875rem;
3739
- font-weight: 600;
3740
- color: #111827;
3741
- display: flex;
3742
- align-items: center;
3743
- gap: 0.5rem;
3744
- }
3745
-
3746
- .Filters-module__appliedFiltersCount___UQikX {
3747
- font-size: 0.75rem;
3748
3641
  color: #6b7280;
3749
- font-weight: 400;
3750
- }
3751
-
3752
- .Filters-module__clearAllButton___yviGV {
3753
- padding: 0.25rem 0.75rem;
3754
- font-size: 0.75rem;
3755
3642
  font-weight: 500;
3756
- color: #dc2626;
3757
- background: none;
3758
- border: 1px solid #dc2626;
3759
- border-radius: 4px;
3760
- cursor: pointer;
3761
- transition: all 0.2s ease-in-out;
3762
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3763
- }
3764
- .Filters-module__clearAllButton___yviGV:hover {
3765
- background-color: #dc2626;
3766
- color: white;
3767
- }
3768
- .Filters-module__clearAllButton___yviGV:focus-visible {
3769
- outline: 2px solid #dc2626;
3770
- outline-offset: 2px;
3771
- }
3772
-
3773
- .Filters-module__appliedFiltersList___-fx9D {
3774
- display: flex;
3775
- flex-wrap: wrap;
3776
- gap: 0.5rem;
3777
3643
  }
3778
-
3779
- .Filters-module__appliedFilterTag___hd5yc {
3644
+ .SeeAllLinkButton-module__seeAllButton___eAQqJ {
3780
3645
  display: inline-flex;
3781
3646
  align-items: center;
3782
3647
  gap: 0.5rem;
3783
- padding: 0.375rem 0.75rem;
3784
- background-color: #dc2626;
3785
- color: white;
3786
- border-radius: 4px;
3787
- font-size: 0.875rem;
3788
- font-weight: 500;
3789
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3790
- line-height: 1.25;
3791
- transition: background-color 0.2s ease-in-out;
3792
- }
3793
- .Filters-module__appliedFilterTag___hd5yc:hover {
3794
- background-color: #b91c1c;
3795
- }
3796
-
3797
- .Filters-module__tagLabel___0ImQk {
3798
- -webkit-user-select: none;
3799
- -moz-user-select: none;
3800
- user-select: none;
3801
- }
3802
-
3803
- .Filters-module__tagRemoveButton___JaA8M {
3804
- display: flex;
3805
- align-items: center;
3806
- justify-content: center;
3807
- padding: 0.125rem;
3648
+ padding: 0.5rem 0;
3808
3649
  background: none;
3809
3650
  border: none;
3810
- color: white;
3651
+ color: #dc2626;
3652
+ font-size: 0.875rem;
3653
+ font-weight: 600;
3811
3654
  cursor: pointer;
3812
- border-radius: 2px;
3813
3655
  transition: all 0.2s ease-in-out;
3814
- line-height: 0;
3815
3656
  }
3816
- .Filters-module__tagRemoveButton___JaA8M:hover {
3817
- background-color: rgba(255, 255, 255, 0.2);
3657
+ .SeeAllLinkButton-module__seeAllButton___eAQqJ svg {
3658
+ width: 1rem;
3659
+ height: 1rem;
3660
+ transition: transform 0.2s ease-in-out;
3818
3661
  }
3819
- .Filters-module__tagRemoveButton___JaA8M:focus-visible {
3820
- outline: 2px solid white;
3821
- outline-offset: 1px;
3662
+ .SeeAllLinkButton-module__seeAllButton___eAQqJ:hover {
3663
+ color: #b91c1c;
3822
3664
  }
3823
- .Filters-module__tagRemoveButton___JaA8M svg {
3824
- display: block;
3665
+ .SeeAllLinkButton-module__seeAllButton___eAQqJ:hover svg {
3666
+ transform: translateX(4px);
3825
3667
  }
3826
- .ResultsView-module__resultsView___S4Wh2 {
3827
- width: 100%;
3668
+ .SeeAllLinkButton-module__seeAllButton___eAQqJ:focus-visible {
3669
+ outline: 2px solid #0066cc;
3670
+ outline-offset: 2px;
3671
+ border-radius: 0.25rem;
3672
+ }
3673
+ .ResultsColumn-module__resultsColumn___AexF5 {
3828
3674
  display: flex;
3829
3675
  flex-direction: column;
3830
- gap: 1.5rem;
3831
- }
3832
-
3833
- .ResultsView-module__searchBarWrapper___XNtwR {
3834
- width: 100%;
3676
+ gap: 1rem;
3835
3677
  }
3836
3678
 
3837
- .ResultsView-module__tabsContainer___mB-Q2 {
3679
+ .ResultsColumn-module__columnHeader___-aUWU {
3680
+ display: flex;
3681
+ align-items: center;
3682
+ justify-content: space-between;
3683
+ padding-bottom: 0.75rem;
3838
3684
  border-bottom: 2px solid #e5e7eb;
3839
3685
  }
3840
3686
 
3841
- .ResultsView-module__tabs___rOexd {
3842
- display: flex;
3843
- gap: 0.5rem;
3844
- overflow-x: auto;
3845
- -webkit-overflow-scrolling: touch;
3846
- }
3847
- .ResultsView-module__tabs___rOexd::-webkit-scrollbar {
3848
- height: 4px;
3849
- }
3850
- .ResultsView-module__tabs___rOexd::-webkit-scrollbar-thumb {
3851
- background-color: #d1d5db;
3852
- border-radius: 2px;
3687
+ .ResultsColumn-module__columnTitle___Gddr- {
3688
+ margin: 0;
3689
+ font-size: 1.125rem;
3690
+ font-weight: 600;
3691
+ color: #111827;
3853
3692
  }
3854
3693
 
3855
- .ResultsView-module__tab___IWPLf {
3694
+ .ResultsColumn-module__resultsList___BkEie {
3856
3695
  display: flex;
3857
- align-items: center;
3858
- gap: 0.5rem;
3859
- padding: 0.75rem 1.5rem;
3860
- background: none;
3861
- border: none;
3862
- border-bottom: 2px solid transparent;
3863
- color: #6b7280;
3864
- font-size: 1rem;
3865
- font-weight: 500;
3866
- cursor: pointer;
3867
- transition: all 0.2s ease-in-out;
3868
- white-space: nowrap;
3869
- margin-bottom: -2px;
3870
- }
3871
- .ResultsView-module__tab___IWPLf:hover {
3872
- color: #111827;
3873
- background-color: #f3f4f6;
3874
- }
3875
- .ResultsView-module__tab___IWPLf:focus-visible {
3876
- outline: 2px solid #0066cc;
3877
- outline-offset: -2px;
3696
+ flex-direction: column;
3697
+ gap: 0.75rem;
3878
3698
  }
3879
3699
 
3880
- .ResultsView-module__tabActive___YLWB0 {
3881
- color: #dc2626;
3882
- border-bottom-color: #dc2626;
3883
- }
3884
- .ResultsView-module__tabActive___YLWB0:hover {
3885
- color: #dc2626;
3700
+ .ResultsColumn-module__columnFooter___4zJUp {
3701
+ padding-top: 0.75rem;
3702
+ border-top: 1px solid #e5e7eb;
3886
3703
  }
3887
3704
 
3888
- .ResultsView-module__tabCount___trVav {
3889
- display: inline-flex;
3705
+ .ResultsColumn-module__loadingState___wme5F,
3706
+ .ResultsColumn-module__errorState___NI4fW,
3707
+ .ResultsColumn-module__emptyState___tvefj {
3708
+ display: flex;
3709
+ flex-direction: column;
3890
3710
  align-items: center;
3891
3711
  justify-content: center;
3892
- min-width: 1.5rem;
3893
- padding: 0.125rem 0.5rem;
3894
- background-color: #f3f4f6;
3712
+ padding: 3rem 1rem;
3713
+ text-align: center;
3895
3714
  color: #6b7280;
3896
- font-size: 0.875rem;
3897
- font-weight: 600;
3898
- border-radius: 9999px;
3899
- }
3900
- .ResultsView-module__tabActive___YLWB0 .ResultsView-module__tabCount___trVav {
3901
- background-color: #dc2626;
3902
- color: #ffffff;
3903
- }
3904
-
3905
- .ResultsView-module__resultsContainer___J4URa {
3906
- display: grid;
3907
- grid-template-columns: 250px 1fr;
3908
- gap: 2rem;
3909
- }
3910
- @media (max-width: 1024px) {
3911
- .ResultsView-module__resultsContainer___J4URa {
3912
- grid-template-columns: 1fr;
3913
- }
3914
- .ResultsView-module__sidebar___nQq5J {
3915
- display: none;
3916
- }
3917
- }
3918
-
3919
- .ResultsView-module__mainContent___S9eIG {
3920
- min-width: 0;
3921
- }
3922
-
3923
- .ResultsView-module__filtersPanel___0xfww {
3924
- padding: 1.5rem;
3925
- background-color: #f9fafb;
3926
- border-radius: 0.5rem;
3927
- border: 1px solid #e5e7eb;
3928
3715
  }
3929
3716
 
3930
- .ResultsView-module__filterTitle___gl6Il {
3931
- margin: 0 0 1.5rem 0;
3932
- font-size: 1.125rem;
3933
- font-weight: 600;
3934
- color: #111827;
3717
+ .ResultsColumn-module__spinner___hhntn {
3718
+ width: 2rem;
3719
+ height: 2rem;
3720
+ border: 3px solid #e5e7eb;
3721
+ border-top-color: #dc2626;
3722
+ border-radius: 50%;
3723
+ animation: ResultsColumn-module__spin___orVAn 0.8s linear infinite;
3724
+ margin-bottom: 1rem;
3935
3725
  }
3936
3726
 
3937
- .ResultsView-module__filterGroup___CHKU9 {
3938
- margin-bottom: 1.5rem;
3727
+ @keyframes ResultsColumn-module__spin___orVAn {
3728
+ to {
3729
+ transform: rotate(360deg);
3730
+ }
3939
3731
  }
3940
- .ResultsView-module__filterGroup___CHKU9:last-child {
3941
- margin-bottom: 0;
3732
+ .ResultsColumn-module__errorState___NI4fW {
3733
+ color: #dc2626;
3942
3734
  }
3943
-
3944
- .ResultsView-module__filterGroupTitle___XQSTa {
3945
- margin: 0 0 0.75rem 0;
3946
- font-size: 0.875rem;
3947
- font-weight: 600;
3948
- color: #111827;
3949
- text-transform: uppercase;
3950
- letter-spacing: 0.05em;
3735
+ :root {
3736
+ --leybold-red: #e2001a;
3737
+ --leybold-black: #000000;
3738
+ --leybold-white: #ffffff;
3739
+ --leybold-blue-grey: #546672;
3740
+ --leybold-white-aluminium: #dae0e3;
3741
+ --leybold-window-gray: #99a1ab;
3742
+ --leybold-light-grey: #c5c7c4;
3743
+ --leybold-very-light-grey: #f5f5f5;
3744
+ --leybold-slate-gray: #4a4e54;
3745
+ --leybold-anthracite-gray: #383e42;
3746
+ --leybold-orange: #d18e56;
3747
+ --leybold-yellow: #edd163;
3748
+ --leybold-green: #6ea67b;
3749
+ --leybold-purple: #732d5d;
3750
+ --leybold-purple-gray: #945e67;
3751
+ --leybold-blue: #2b4679;
3752
+ --leybold-light-blue: #3f6a98;
3753
+ --leybold-blue-green: #39788e;
3754
+ --leybold-green-gray: #6d8f9f;
3755
+ --color-primary: #e2001a;
3756
+ --color-secondary: #546672;
3757
+ --color-success: #6ea67b;
3758
+ --color-danger: #e2001a;
3759
+ --color-warning: #d18e56;
3760
+ --color-info: #3f6a98;
3761
+ --text-primary: #000000;
3762
+ --text-secondary: #4a4e54;
3763
+ --text-muted: #99a1ab;
3764
+ --text-inverse: #ffffff;
3765
+ --bg-primary: #ffffff;
3766
+ --bg-secondary: #dae0e3;
3767
+ --bg-dark: #383e42;
3768
+ --border-color: #c5c7c4;
3769
+ --border-color-dark: #4a4e54;
3770
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
3771
+ --h1-mobile-size: 32px;
3772
+ --h1-mobile-line-height: 1.2;
3773
+ --h2-mobile-size: 24px;
3774
+ --h2-mobile-line-height: 1.2;
3775
+ --h3-mobile-size: 18px;
3776
+ --h3-mobile-line-height: 1.6;
3777
+ --h4-mobile-size: 16px;
3778
+ --h4-mobile-line-height: 1.55;
3779
+ --h5-mobile-size: 14px;
3780
+ --h5-mobile-line-height: 1.5;
3781
+ --body-mobile-size: 14px;
3782
+ --body-mobile-line-height: 1.5;
3783
+ --h1-desktop-size: 55px;
3784
+ --h1-desktop-line-height: 1.15;
3785
+ --h1-desktop-letter-spacing: -0.02em;
3786
+ --h2-desktop-size: 40px;
3787
+ --h2-desktop-line-height: 1.2;
3788
+ --h2-desktop-letter-spacing: -0.01em;
3789
+ --h3-desktop-size: 32px;
3790
+ --h3-desktop-line-height: 1.2;
3791
+ --h4-desktop-size: 24px;
3792
+ --h4-desktop-line-height: 1.2;
3793
+ --h5-desktop-size: 18px;
3794
+ --h5-desktop-line-height: 1.6;
3795
+ --body-desktop-size: 18px;
3796
+ --body-desktop-line-height: 1.6;
3797
+ --text-lg-size: 27px;
3798
+ --text-lg-line-height: 1.4;
3799
+ --text-xl-size: 36px;
3800
+ --text-xl-line-height: 1.4;
3801
+ --text-xxl-size: 64px;
3802
+ --text-xxl-line-height: 1;
3803
+ }
3804
+
3805
+ .Filters-module__filtersPanel___T3SlK {
3806
+ display: flex;
3807
+ flex-direction: column;
3808
+ gap: 36px;
3809
+ background-color: transparent;
3810
+ border: none;
3811
+ border-radius: 0;
3812
+ overflow: visible;
3813
+ width: 300px;
3814
+ }
3815
+
3816
+ .Filters-module__filtersPanelHeader___XOBTi {
3817
+ padding: 1rem 0;
3818
+ border-bottom: none;
3819
+ background-color: transparent;
3820
+ }
3821
+
3822
+ .Filters-module__filtersPanelTitle___Mnn10 {
3823
+ margin: 0;
3824
+ font-size: 1.125rem;
3825
+ font-weight: 600;
3826
+ color: #4a4e54;
3827
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3828
+ }
3829
+
3830
+ .Filters-module__filtersList___jPgkP {
3831
+ display: flex;
3832
+ flex-direction: column;
3833
+ gap: 10px;
3834
+ }
3835
+
3836
+ .Filters-module__filterAccordion___Mf9Oe {
3837
+ background: rgba(245, 245, 245, 0.5);
3838
+ border: none;
3839
+ padding: 10px 18px 18px;
3840
+ display: flex;
3841
+ flex-direction: column;
3842
+ gap: 10px;
3843
+ }
3844
+ .Filters-module__filterAccordion___Mf9Oe:last-child {
3845
+ border-bottom: none;
3846
+ }
3847
+
3848
+ .Filters-module__accordionHeader___DtPJx {
3849
+ display: flex;
3850
+ align-items: center;
3851
+ justify-content: space-between;
3852
+ width: 100%;
3853
+ padding: 9px 0;
3854
+ background: none;
3855
+ border: none;
3856
+ cursor: pointer;
3857
+ transition: background-color 0.2s ease-in-out;
3858
+ text-align: left;
3859
+ }
3860
+ .Filters-module__accordionHeader___DtPJx:hover {
3861
+ opacity: 0.8;
3862
+ }
3863
+ .Filters-module__accordionHeader___DtPJx:focus-visible {
3864
+ outline: 1px solid #000000;
3865
+ outline-offset: 2px;
3866
+ }
3867
+
3868
+ .Filters-module__accordionTitle___YtHXW {
3869
+ font-size: 14px;
3870
+ font-weight: 500;
3871
+ color: rgba(0, 0, 0, 0.8);
3872
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3873
+ }
3874
+
3875
+ .Filters-module__accordionIcon___zRGrv {
3876
+ color: #6b7280;
3877
+ transition: transform 0.2s ease-in-out;
3878
+ flex-shrink: 0;
3879
+ }
3880
+
3881
+ .Filters-module__accordionIconExpanded___pkkjv {
3882
+ transform: rotate(180deg);
3883
+ }
3884
+
3885
+ .Filters-module__accordionContent___SqhIu {
3886
+ padding: 0;
3887
+ animation: Filters-module__slideDown___q0ZMt 0.2s ease-out;
3888
+ }
3889
+
3890
+ @keyframes Filters-module__slideDown___q0ZMt {
3891
+ from {
3892
+ opacity: 0;
3893
+ transform: translateY(-4px);
3894
+ }
3895
+ to {
3896
+ opacity: 1;
3897
+ transform: translateY(0);
3898
+ }
3899
+ }
3900
+ .Filters-module__accordionSearch___V0A74 {
3901
+ margin-bottom: 0.75rem;
3902
+ }
3903
+
3904
+ .Filters-module__filterSearch___Jc8AX {
3905
+ position: relative;
3906
+ display: flex;
3907
+ align-items: center;
3908
+ width: 100%;
3909
+ }
3910
+
3911
+ .Filters-module__searchIcon___pas1t {
3912
+ position: absolute;
3913
+ right: 0.75rem;
3914
+ color: #9ca3af;
3915
+ pointer-events: none;
3916
+ }
3917
+
3918
+ .Filters-module__searchInput___nzOMK {
3919
+ width: 100%;
3920
+ padding: 0.5rem 2.5rem 0.5rem 1rem;
3921
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
3922
+ font-size: 0.875rem;
3923
+ color: #111827;
3924
+ background-color: #ffffff;
3925
+ border: 1px solid #9ca3af;
3926
+ border-radius: 2px;
3927
+ outline: none;
3928
+ transition: all 0.2s ease-in-out;
3929
+ }
3930
+ .Filters-module__searchInput___nzOMK::-moz-placeholder {
3931
+ color: #9ca3af;
3932
+ }
3933
+ .Filters-module__searchInput___nzOMK::placeholder {
3934
+ color: #9ca3af;
3935
+ }
3936
+ .Filters-module__searchInput___nzOMK:focus {
3937
+ background-color: #ffffff;
3938
+ border-color: #000000;
3939
+ box-shadow: none;
3940
+ }
3941
+
3942
+ .Filters-module__clearButton___tHl6L {
3943
+ position: absolute;
3944
+ right: 0.5rem;
3945
+ display: flex;
3946
+ align-items: center;
3947
+ justify-content: center;
3948
+ padding: 0.25rem;
3949
+ background: none;
3950
+ border: none;
3951
+ color: #6b7280;
3952
+ cursor: pointer;
3953
+ border-radius: 4px;
3954
+ transition: all 0.2s ease-in-out;
3955
+ }
3956
+ .Filters-module__clearButton___tHl6L:hover {
3957
+ color: #111827;
3958
+ background-color: #e5e7eb;
3959
+ }
3960
+ .Filters-module__clearButton___tHl6L:focus-visible {
3961
+ outline: 2px solid #e2001a;
3962
+ outline-offset: 2px;
3963
+ }
3964
+
3965
+ .Filters-module__filterList___TLqBu {
3966
+ display: flex;
3967
+ flex-direction: column;
3968
+ gap: 0;
3969
+ max-height: 264px;
3970
+ overflow-y: auto;
3971
+ overflow-x: hidden;
3972
+ padding: 4px 7px 0 4px;
3973
+ }
3974
+ .Filters-module__filterList___TLqBu::-webkit-scrollbar {
3975
+ width: 5px;
3976
+ }
3977
+ .Filters-module__filterList___TLqBu::-webkit-scrollbar-track {
3978
+ background: transparent;
3979
+ }
3980
+ .Filters-module__filterList___TLqBu::-webkit-scrollbar-thumb {
3981
+ background: #99a1ab;
3982
+ border-radius: 5px;
3983
+ }
3984
+ .Filters-module__filterList___TLqBu::-webkit-scrollbar-thumb:hover {
3985
+ background: rgb(125.0322580645, 135.2258064516, 147.9677419355);
3986
+ }
3987
+ .Filters-module__filterList___TLqBu {
3988
+ scrollbar-width: thin;
3989
+ scrollbar-color: #99a1ab transparent;
3990
+ }
3991
+
3992
+ .Filters-module__filterItem___lA2rv {
3993
+ display: flex;
3994
+ align-items: center;
3995
+ gap: 10px;
3996
+ padding: 10px 9px;
3997
+ cursor: pointer;
3998
+ border-radius: 0;
3999
+ transition: background-color 0.2s ease-in-out;
4000
+ -webkit-user-select: none;
4001
+ -moz-user-select: none;
4002
+ user-select: none;
4003
+ }
4004
+ .Filters-module__filterItem___lA2rv:hover {
4005
+ background-color: rgba(0, 0, 0, 0.02);
4006
+ }
4007
+ .Filters-module__filterItem___lA2rv:has(:focus-visible) {
4008
+ outline: 1px solid #000000;
4009
+ outline-offset: 2px;
4010
+ }
4011
+
4012
+ .Filters-module__filterCheckboxInput___NAcGz {
4013
+ position: absolute;
4014
+ opacity: 0;
4015
+ width: 0;
4016
+ height: 0;
4017
+ pointer-events: none;
4018
+ }
4019
+
4020
+ .Filters-module__filterCheckbox___9In3q {
4021
+ width: 16px;
4022
+ height: 16px;
4023
+ flex-shrink: 0;
4024
+ border: 1px solid #99a1ab;
4025
+ background: #ffffff;
4026
+ display: flex;
4027
+ align-items: center;
4028
+ justify-content: center;
4029
+ transition: all 0.2s ease-in-out;
4030
+ }
4031
+ .Filters-module__filterCheckbox___9In3q svg {
4032
+ display: block;
4033
+ }
4034
+
4035
+ .Filters-module__filterLabel___w-M8J {
4036
+ flex: 1;
4037
+ font-size: 14px;
4038
+ font-weight: 400;
4039
+ color: #99a1ab;
4040
+ line-height: 1.25rem;
4041
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4042
+ }
4043
+
4044
+ .Filters-module__filterCount___XMsmy {
4045
+ font-size: 14px;
4046
+ color: #99a1ab;
4047
+ font-weight: 400;
4048
+ flex-shrink: 0;
4049
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4050
+ }
4051
+
4052
+ .Filters-module__filterItemMobile___bqRMi {
4053
+ display: flex;
4054
+ align-items: center;
4055
+ justify-content: space-between;
4056
+ width: 100%;
4057
+ padding: 13.5px 9px;
4058
+ background: none;
4059
+ border: none;
4060
+ cursor: pointer;
4061
+ text-align: left;
4062
+ transition: background-color 0.2s ease-in-out;
4063
+ -webkit-user-select: none;
4064
+ -moz-user-select: none;
4065
+ user-select: none;
4066
+ }
4067
+ .Filters-module__filterItemMobile___bqRMi:hover {
4068
+ background-color: rgba(0, 0, 0, 0.02);
4069
+ }
4070
+ .Filters-module__filterItemMobile___bqRMi:focus-visible {
4071
+ outline: 1px solid #000000;
4072
+ outline-offset: 2px;
4073
+ }
4074
+ .Filters-module__filterItemMobile___bqRMi:active {
4075
+ background-color: rgba(0, 0, 0, 0.05);
4076
+ }
4077
+
4078
+ .Filters-module__filterItemMobileRefined___VnLfK .Filters-module__filterLabel___w-M8J {
4079
+ font-weight: 700;
4080
+ color: #e2001a;
4081
+ }
4082
+
4083
+ .Filters-module__filterItemDesktopNoCheckbox___rX7Vy {
4084
+ display: flex;
4085
+ align-items: center;
4086
+ justify-content: space-between;
4087
+ width: 100%;
4088
+ padding: 10px 9px;
4089
+ background: none;
4090
+ border: none;
4091
+ cursor: pointer;
4092
+ text-align: left;
4093
+ transition: background-color 0.2s ease-in-out;
4094
+ -webkit-user-select: none;
4095
+ -moz-user-select: none;
4096
+ user-select: none;
4097
+ }
4098
+ .Filters-module__filterItemDesktopNoCheckbox___rX7Vy:hover {
4099
+ background-color: rgba(0, 0, 0, 0.02);
4100
+ }
4101
+ .Filters-module__filterItemDesktopNoCheckbox___rX7Vy:focus-visible {
4102
+ outline: 1px solid #000000;
4103
+ outline-offset: 2px;
4104
+ }
4105
+
4106
+ .Filters-module__filterItemDesktopRefined___XaVGp .Filters-module__filterLabel___w-M8J {
4107
+ font-weight: 700;
4108
+ color: #e2001a;
4109
+ }
4110
+
4111
+ .Filters-module__noResults___ZdZ4V {
4112
+ padding: 1rem;
4113
+ text-align: center;
4114
+ color: #6b7280;
4115
+ font-size: 0.875rem;
4116
+ }
4117
+
4118
+ .Filters-module__loadingState___k6olr {
4119
+ display: flex;
4120
+ flex-direction: column;
4121
+ align-items: center;
4122
+ justify-content: center;
4123
+ padding: 2rem 1.5rem;
4124
+ color: #6b7280;
4125
+ }
4126
+ .Filters-module__loadingState___k6olr p {
4127
+ margin: 0.5rem 0 0 0;
4128
+ font-size: 0.875rem;
4129
+ }
4130
+
4131
+ .Filters-module__spinner___hvTaP {
4132
+ width: 2rem;
4133
+ height: 2rem;
4134
+ border: 3px solid #e5e7eb;
4135
+ border-top-color: #e2001a;
4136
+ border-radius: 50%;
4137
+ animation: Filters-module__spin___P-Zhk 0.8s linear infinite;
4138
+ }
4139
+
4140
+ @keyframes Filters-module__spin___P-Zhk {
4141
+ to {
4142
+ transform: rotate(360deg);
4143
+ }
4144
+ }
4145
+ @media (max-width: 1024px) {
4146
+ .Filters-module__filtersList___jPgkP {
4147
+ padding: 0;
4148
+ }
4149
+ }
4150
+ @media (prefers-reduced-motion: reduce) {
4151
+ .Filters-module__accordionIcon___zRGrv,
4152
+ .Filters-module__accordionContent___SqhIu,
4153
+ .Filters-module__searchInput___nzOMK,
4154
+ .Filters-module__filterItem___lA2rv {
4155
+ transition: none;
4156
+ animation: none;
4157
+ }
4158
+ }
4159
+ @media (prefers-contrast: high) {
4160
+ .Filters-module__filterItem___lA2rv {
4161
+ border: 1px solid transparent;
4162
+ }
4163
+ .Filters-module__filterItem___lA2rv:hover {
4164
+ border-color: currentColor;
4165
+ }
4166
+ }
4167
+ .Filters-module__appliedFilters___hP4x- {
4168
+ display: flex;
4169
+ flex-direction: column;
4170
+ gap: 18px;
4171
+ background: transparent;
4172
+ border: none;
4173
+ }
4174
+
4175
+ .Filters-module__appliedFiltersTitle___k6VbJ {
4176
+ margin: 0;
4177
+ font-size: 13.5px;
4178
+ font-weight: 500;
4179
+ color: #4a4e54;
4180
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4181
+ }
4182
+
4183
+ .Filters-module__appliedFiltersList___-fx9D {
4184
+ display: flex;
4185
+ flex-wrap: wrap;
4186
+ gap: 9px;
4187
+ }
4188
+
4189
+ .Filters-module__appliedFilterTag___hd5yc {
4190
+ display: inline-flex;
4191
+ align-items: center;
4192
+ gap: 6px;
4193
+ padding: 9px;
4194
+ background-color: #e2001a;
4195
+ color: #ffffff;
4196
+ border-radius: 2px;
4197
+ font-size: 12px;
4198
+ font-weight: 500;
4199
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4200
+ text-transform: uppercase;
4201
+ line-height: 1;
4202
+ transition: background-color 0.2s ease-in-out;
4203
+ }
4204
+ .Filters-module__appliedFilterTag___hd5yc:hover {
4205
+ background-color: rgb(185.2, 0, 21.3061946903);
4206
+ }
4207
+
4208
+ .Filters-module__tagLabel___0ImQk {
4209
+ -webkit-user-select: none;
4210
+ -moz-user-select: none;
4211
+ user-select: none;
4212
+ }
4213
+
4214
+ .Filters-module__tagRemoveButton___JaA8M {
4215
+ display: flex;
4216
+ align-items: center;
4217
+ justify-content: center;
4218
+ padding: 0;
4219
+ background: none;
4220
+ border: none;
4221
+ color: #ffffff;
4222
+ cursor: pointer;
4223
+ border-radius: 2px;
4224
+ transition: all 0.2s ease-in-out;
4225
+ line-height: 0;
4226
+ width: 10px;
4227
+ height: 10px;
4228
+ }
4229
+ .Filters-module__tagRemoveButton___JaA8M:hover {
4230
+ opacity: 0.8;
4231
+ }
4232
+ .Filters-module__tagRemoveButton___JaA8M:focus-visible {
4233
+ outline: 1px solid #ffffff;
4234
+ outline-offset: 2px;
4235
+ }
4236
+ .Filters-module__tagRemoveButton___JaA8M svg {
4237
+ display: block;
4238
+ width: 10px;
4239
+ height: 10px;
4240
+ }
4241
+ :root {
4242
+ --leybold-red: #e2001a;
4243
+ --leybold-black: #000000;
4244
+ --leybold-white: #ffffff;
4245
+ --leybold-blue-grey: #546672;
4246
+ --leybold-white-aluminium: #dae0e3;
4247
+ --leybold-window-gray: #99a1ab;
4248
+ --leybold-light-grey: #c5c7c4;
4249
+ --leybold-very-light-grey: #f5f5f5;
4250
+ --leybold-slate-gray: #4a4e54;
4251
+ --leybold-anthracite-gray: #383e42;
4252
+ --leybold-orange: #d18e56;
4253
+ --leybold-yellow: #edd163;
4254
+ --leybold-green: #6ea67b;
4255
+ --leybold-purple: #732d5d;
4256
+ --leybold-purple-gray: #945e67;
4257
+ --leybold-blue: #2b4679;
4258
+ --leybold-light-blue: #3f6a98;
4259
+ --leybold-blue-green: #39788e;
4260
+ --leybold-green-gray: #6d8f9f;
4261
+ --color-primary: #e2001a;
4262
+ --color-secondary: #546672;
4263
+ --color-success: #6ea67b;
4264
+ --color-danger: #e2001a;
4265
+ --color-warning: #d18e56;
4266
+ --color-info: #3f6a98;
4267
+ --text-primary: #000000;
4268
+ --text-secondary: #4a4e54;
4269
+ --text-muted: #99a1ab;
4270
+ --text-inverse: #ffffff;
4271
+ --bg-primary: #ffffff;
4272
+ --bg-secondary: #dae0e3;
4273
+ --bg-dark: #383e42;
4274
+ --border-color: #c5c7c4;
4275
+ --border-color-dark: #4a4e54;
4276
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
4277
+ --h1-mobile-size: 32px;
4278
+ --h1-mobile-line-height: 1.2;
4279
+ --h2-mobile-size: 24px;
4280
+ --h2-mobile-line-height: 1.2;
4281
+ --h3-mobile-size: 18px;
4282
+ --h3-mobile-line-height: 1.6;
4283
+ --h4-mobile-size: 16px;
4284
+ --h4-mobile-line-height: 1.55;
4285
+ --h5-mobile-size: 14px;
4286
+ --h5-mobile-line-height: 1.5;
4287
+ --body-mobile-size: 14px;
4288
+ --body-mobile-line-height: 1.5;
4289
+ --h1-desktop-size: 55px;
4290
+ --h1-desktop-line-height: 1.15;
4291
+ --h1-desktop-letter-spacing: -0.02em;
4292
+ --h2-desktop-size: 40px;
4293
+ --h2-desktop-line-height: 1.2;
4294
+ --h2-desktop-letter-spacing: -0.01em;
4295
+ --h3-desktop-size: 32px;
4296
+ --h3-desktop-line-height: 1.2;
4297
+ --h4-desktop-size: 24px;
4298
+ --h4-desktop-line-height: 1.2;
4299
+ --h5-desktop-size: 18px;
4300
+ --h5-desktop-line-height: 1.6;
4301
+ --body-desktop-size: 18px;
4302
+ --body-desktop-line-height: 1.6;
4303
+ --text-lg-size: 27px;
4304
+ --text-lg-line-height: 1.4;
4305
+ --text-xl-size: 36px;
4306
+ --text-xl-line-height: 1.4;
4307
+ --text-xxl-size: 64px;
4308
+ --text-xxl-line-height: 1;
4309
+ }
4310
+
4311
+ .ProductCardVertical-module__productCardVertical___kXgmt {
4312
+ display: flex;
4313
+ flex-direction: column;
4314
+ gap: 18px;
4315
+ background: #ffffff;
4316
+ text-decoration: none;
4317
+ color: inherit;
4318
+ transition: all 0.2s ease-in-out;
4319
+ padding: 5px;
4320
+ border: none;
4321
+ width: 100%;
4322
+ height: 100%;
4323
+ cursor: pointer;
4324
+ box-shadow: none;
4325
+ }
4326
+ .ProductCardVertical-module__productCardVertical___kXgmt:hover, .ProductCardVertical-module__productCardVertical--hover___8Nsyp {
4327
+ box-shadow: 3px 2px 8.2px 2px rgba(0, 0, 0, 0.18);
4328
+ }
4329
+ .ProductCardVertical-module__productCardVertical___kXgmt:hover .ProductCardVertical-module__productCardVertical__button___oQPJG, .ProductCardVertical-module__productCardVertical--hover___8Nsyp .ProductCardVertical-module__productCardVertical__button___oQPJG {
4330
+ background: #383e42;
4331
+ color: #ffffff;
4332
+ }
4333
+ .ProductCardVertical-module__productCardVertical___kXgmt:focus-visible, .ProductCardVertical-module__productCardVertical--focus___8U57I {
4334
+ outline: none;
4335
+ border: 1.5px solid #000000;
4336
+ box-shadow: 3px 2px 8.2px 2px rgba(0, 0, 0, 0.18);
4337
+ }
4338
+ .ProductCardVertical-module__productCardVertical___kXgmt:focus-visible .ProductCardVertical-module__productCardVertical__button___oQPJG, .ProductCardVertical-module__productCardVertical--focus___8U57I .ProductCardVertical-module__productCardVertical__button___oQPJG {
4339
+ background: #383e42;
4340
+ color: #ffffff;
4341
+ }
4342
+
4343
+ .ProductCardVertical-module__productCardVertical__imageWrapper___SgKoZ {
4344
+ display: flex;
4345
+ align-items: center;
4346
+ justify-content: center;
4347
+ width: 100%;
4348
+ max-width: 150px;
4349
+ max-height: 150px;
4350
+ margin: 0 auto;
4351
+ flex-shrink: 0;
4352
+ }
4353
+
4354
+ .ProductCardVertical-module__productCardVertical__image___kg-QU {
4355
+ width: 100%;
4356
+ height: 100%;
4357
+ max-width: 150px;
4358
+ max-height: 150px;
4359
+ -o-object-fit: contain;
4360
+ object-fit: contain;
4361
+ }
4362
+
4363
+ .ProductCardVertical-module__productCardVertical__content___sZdOs {
4364
+ display: flex;
4365
+ flex-direction: column;
4366
+ gap: 9px;
4367
+ width: 100%;
4368
+ flex: 1;
4369
+ }
4370
+
4371
+ .ProductCardVertical-module__productCardVertical__title___PPKWb {
4372
+ font-size: 14px;
4373
+ font-weight: 600;
4374
+ color: #383e42;
4375
+ line-height: 1.4;
4376
+ margin: 0;
4377
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4378
+ }
4379
+
4380
+ .ProductCardVertical-module__productCardVertical__description___Ai90p {
4381
+ font-size: 12px;
4382
+ font-weight: 400;
4383
+ color: #383e42;
4384
+ line-height: 1.5;
4385
+ margin: 0;
4386
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4387
+ display: -webkit-box;
4388
+ -webkit-line-clamp: 2;
4389
+ -webkit-box-orient: vertical;
4390
+ overflow: hidden;
4391
+ }
4392
+
4393
+ .ProductCardVertical-module__productCardVertical__footer___rv6BH {
4394
+ display: flex;
4395
+ width: 100%;
4396
+ }
4397
+
4398
+ .ProductCardVertical-module__productCardVertical__button___oQPJG {
4399
+ width: 100%;
4400
+ font-size: 14px;
4401
+ font-weight: 500;
4402
+ padding: 9px 13.5px;
4403
+ justify-content: space-between;
4404
+ background: #ffffff;
4405
+ color: #383e42;
4406
+ border: none;
4407
+ text-transform: uppercase;
4408
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4409
+ transition: all 0.2s ease-in-out;
4410
+ display: flex;
4411
+ align-items: center;
4412
+ cursor: pointer;
4413
+ border-radius: 0 !important;
4414
+ }
4415
+ .ProductCardVertical-module__productCardVertical__button___oQPJG:focus-visible {
4416
+ background: #383e42;
4417
+ color: #ffffff;
4418
+ border: 1px solid #000000;
4419
+ outline: none;
4420
+ }
4421
+ .ProductCardVertical-module__productCardVertical__button___oQPJG svg {
4422
+ width: 11px;
4423
+ height: 11px;
4424
+ }
4425
+
4426
+ @media (max-width: 768px) {
4427
+ .ProductCardVertical-module__productCardVertical___kXgmt {
4428
+ padding: 9px;
4429
+ gap: 10px;
4430
+ }
4431
+ .ProductCardVertical-module__productCardVertical__imageWrapper___SgKoZ {
4432
+ max-width: 140px;
4433
+ height: 105.9px;
4434
+ }
4435
+ .ProductCardVertical-module__productCardVertical__image___kg-QU {
4436
+ max-width: 140px;
4437
+ max-height: 105.9px;
4438
+ }
4439
+ .ProductCardVertical-module__productCardVertical__title___PPKWb {
4440
+ font-size: 10.194px;
4441
+ }
4442
+ .ProductCardVertical-module__productCardVertical__description___Ai90p {
4443
+ font-size: 9px;
4444
+ }
4445
+ .ProductCardVertical-module__productCardVertical__button___oQPJG {
4446
+ background: #e2001a;
4447
+ color: #ffffff;
4448
+ font-size: 12px;
4449
+ font-weight: 500;
4450
+ padding: 9px;
4451
+ width: auto;
4452
+ align-self: flex-start;
4453
+ }
4454
+ .ProductCardVertical-module__productCardVertical__button___oQPJG svg {
4455
+ display: none;
4456
+ }
4457
+ .ProductCardVertical-module__productCardVertical__button___oQPJG:hover, .ProductCardVertical-module__productCardVertical__button___oQPJG:focus-visible {
4458
+ background: rgb(185.2, 0, 21.3061946903);
4459
+ color: #ffffff;
4460
+ }
4461
+ .ProductCardVertical-module__productCardVertical___kXgmt:hover .ProductCardVertical-module__productCardVertical__button___oQPJG,
4462
+ .ProductCardVertical-module__productCardVertical--hover___8Nsyp .ProductCardVertical-module__productCardVertical__button___oQPJG {
4463
+ background: #e2001a;
4464
+ color: #ffffff;
4465
+ }
4466
+ }
4467
+ :root {
4468
+ --leybold-red: #e2001a;
4469
+ --leybold-black: #000000;
4470
+ --leybold-white: #ffffff;
4471
+ --leybold-blue-grey: #546672;
4472
+ --leybold-white-aluminium: #dae0e3;
4473
+ --leybold-window-gray: #99a1ab;
4474
+ --leybold-light-grey: #c5c7c4;
4475
+ --leybold-very-light-grey: #f5f5f5;
4476
+ --leybold-slate-gray: #4a4e54;
4477
+ --leybold-anthracite-gray: #383e42;
4478
+ --leybold-orange: #d18e56;
4479
+ --leybold-yellow: #edd163;
4480
+ --leybold-green: #6ea67b;
4481
+ --leybold-purple: #732d5d;
4482
+ --leybold-purple-gray: #945e67;
4483
+ --leybold-blue: #2b4679;
4484
+ --leybold-light-blue: #3f6a98;
4485
+ --leybold-blue-green: #39788e;
4486
+ --leybold-green-gray: #6d8f9f;
4487
+ --color-primary: #e2001a;
4488
+ --color-secondary: #546672;
4489
+ --color-success: #6ea67b;
4490
+ --color-danger: #e2001a;
4491
+ --color-warning: #d18e56;
4492
+ --color-info: #3f6a98;
4493
+ --text-primary: #000000;
4494
+ --text-secondary: #4a4e54;
4495
+ --text-muted: #99a1ab;
4496
+ --text-inverse: #ffffff;
4497
+ --bg-primary: #ffffff;
4498
+ --bg-secondary: #dae0e3;
4499
+ --bg-dark: #383e42;
4500
+ --border-color: #c5c7c4;
4501
+ --border-color-dark: #4a4e54;
4502
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
4503
+ --h1-mobile-size: 32px;
4504
+ --h1-mobile-line-height: 1.2;
4505
+ --h2-mobile-size: 24px;
4506
+ --h2-mobile-line-height: 1.2;
4507
+ --h3-mobile-size: 18px;
4508
+ --h3-mobile-line-height: 1.6;
4509
+ --h4-mobile-size: 16px;
4510
+ --h4-mobile-line-height: 1.55;
4511
+ --h5-mobile-size: 14px;
4512
+ --h5-mobile-line-height: 1.5;
4513
+ --body-mobile-size: 14px;
4514
+ --body-mobile-line-height: 1.5;
4515
+ --h1-desktop-size: 55px;
4516
+ --h1-desktop-line-height: 1.15;
4517
+ --h1-desktop-letter-spacing: -0.02em;
4518
+ --h2-desktop-size: 40px;
4519
+ --h2-desktop-line-height: 1.2;
4520
+ --h2-desktop-letter-spacing: -0.01em;
4521
+ --h3-desktop-size: 32px;
4522
+ --h3-desktop-line-height: 1.2;
4523
+ --h4-desktop-size: 24px;
4524
+ --h4-desktop-line-height: 1.2;
4525
+ --h5-desktop-size: 18px;
4526
+ --h5-desktop-line-height: 1.6;
4527
+ --body-desktop-size: 18px;
4528
+ --body-desktop-line-height: 1.6;
4529
+ --text-lg-size: 27px;
4530
+ --text-lg-line-height: 1.4;
4531
+ --text-xl-size: 36px;
4532
+ --text-xl-line-height: 1.4;
4533
+ --text-xxl-size: 64px;
4534
+ --text-xxl-line-height: 1;
4535
+ }
4536
+
4537
+ .ResultsView-module__resultsView___S4Wh2 {
4538
+ width: 100%;
4539
+ display: flex;
4540
+ flex-direction: column;
4541
+ gap: 36px;
4542
+ }
4543
+
4544
+ .ResultsView-module__searchBarWrapper___XNtwR {
4545
+ width: 100%;
4546
+ }
4547
+
4548
+ .ResultsView-module__tabsContainer___mB-Q2 {
4549
+ display: flex;
4550
+ align-items: flex-end;
4551
+ justify-content: space-between;
4552
+ border-bottom: 2px solid #f5f5f5;
4553
+ height: 54px;
4554
+ }
4555
+ @media (max-width: 768px) {
4556
+ .ResultsView-module__tabsContainer___mB-Q2 {
4557
+ border-bottom: none;
4558
+ align-items: flex-end;
4559
+ padding: 0 18px 0 0;
4560
+ margin-bottom: 18px;
4561
+ height: auto;
4562
+ }
4563
+ }
4564
+
4565
+ .ResultsView-module__tabs___rOexd {
4566
+ display: flex;
4567
+ align-items: flex-end;
4568
+ gap: 0;
4569
+ height: 100%;
4570
+ }
4571
+ @media (max-width: 768px) {
4572
+ .ResultsView-module__tabs___rOexd {
4573
+ gap: 18px;
4574
+ flex: 1;
4575
+ align-items: center;
4576
+ padding: 0 0 9px 0;
4577
+ border-bottom: 1px solid rgba(245, 245, 245, 0.5);
4578
+ height: auto;
4579
+ }
4580
+ }
4581
+
4582
+ .ResultsView-module__tabSeparator___MSq9p {
4583
+ width: 2px;
4584
+ height: 49px;
4585
+ background: #383e42;
4586
+ align-self: flex-end;
4587
+ }
4588
+ @media (max-width: 768px) {
4589
+ .ResultsView-module__tabSeparator___MSq9p {
4590
+ display: none;
4591
+ }
4592
+ }
4593
+
4594
+ .ResultsView-module__mobileFilterButton___ZrMQY {
4595
+ display: none;
4596
+ }
4597
+ @media (max-width: 768px) {
4598
+ .ResultsView-module__mobileFilterButton___ZrMQY {
4599
+ display: inline-flex;
4600
+ align-items: center;
4601
+ gap: 8px;
4602
+ padding: 0 0 9px 0;
4603
+ background: none;
4604
+ border: none;
4605
+ color: #000000;
4606
+ font-size: 14px;
4607
+ font-weight: 400;
4608
+ cursor: pointer;
4609
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4610
+ flex-shrink: 0;
4611
+ }
4612
+ .ResultsView-module__mobileFilterButton___ZrMQY svg {
4613
+ width: 15px;
4614
+ height: 11px;
4615
+ flex-shrink: 0;
4616
+ }
4617
+ .ResultsView-module__mobileFilterButton___ZrMQY span {
4618
+ line-height: 1;
4619
+ }
4620
+ .ResultsView-module__mobileFilterButton___ZrMQY:hover {
4621
+ opacity: 0.7;
4622
+ }
4623
+ .ResultsView-module__mobileFilterButton___ZrMQY:focus-visible {
4624
+ outline: 1px solid #000000;
4625
+ outline-offset: 2px;
4626
+ }
4627
+ }
4628
+
4629
+ .ResultsView-module__resultsContainer___J4URa {
4630
+ display: grid;
4631
+ grid-template-columns: 300px 1fr;
4632
+ gap: 38px;
4633
+ }
4634
+ @media (max-width: 768px) {
4635
+ .ResultsView-module__resultsContainer___J4URa {
4636
+ grid-template-columns: 1fr;
4637
+ gap: 0;
4638
+ }
4639
+ }
4640
+
4641
+ .ResultsView-module__sidebar___nQq5J {
4642
+ display: flex;
4643
+ flex-direction: column;
4644
+ gap: 36px;
4645
+ padding-bottom: 4rem;
4646
+ }
4647
+ @media (max-width: 768px) {
4648
+ .ResultsView-module__sidebar___nQq5J {
4649
+ display: none;
4650
+ }
4651
+ }
4652
+
4653
+ .ResultsView-module__assistanceBanner___1r72a {
4654
+ margin-top: 0;
4655
+ }
4656
+
4657
+ .ResultsView-module__mainContent___S9eIG {
4658
+ min-width: 0;
4659
+ }
4660
+
4661
+ .ResultsView-module__productsGrid___gnAQ- {
4662
+ display: grid;
4663
+ grid-template-columns: repeat(4, 1fr);
4664
+ gap: 18px;
4665
+ align-items: stretch;
4666
+ }
4667
+ @media (max-width: 768px) {
4668
+ .ResultsView-module__productsGrid___gnAQ- {
4669
+ grid-template-columns: repeat(2, 1fr);
4670
+ gap: 9px;
4671
+ }
4672
+ }
4673
+ .ResultsView-module__productsGrid___gnAQ- > * {
4674
+ height: 100%;
4675
+ }
4676
+
4677
+ .ResultsView-module__contentsList___tcfNG {
4678
+ display: flex;
4679
+ flex-direction: column;
4680
+ }
4681
+
4682
+ .ResultsView-module__contentDivider___5n6sl {
4683
+ border: none;
4684
+ border-top: 1px solid #f5f5f5;
4685
+ margin: 0;
4686
+ height: 0;
4687
+ }
4688
+
4689
+ .ResultsView-module__resultsList___8eYNX {
4690
+ display: flex;
4691
+ flex-direction: column;
4692
+ gap: 2rem;
4693
+ }
4694
+
4695
+ .ResultsView-module__resultsSection___sCUaO {
4696
+ display: flex;
4697
+ flex-direction: column;
4698
+ gap: 1.5rem;
4699
+ margin-bottom: 2rem;
4700
+ }
4701
+ .ResultsView-module__resultsSection___sCUaO:last-child {
4702
+ margin-bottom: 0;
4703
+ }
4704
+
4705
+ .ResultsView-module__sectionTitle___mfvH3 {
4706
+ margin: 0;
4707
+ padding-bottom: 0.75rem;
4708
+ border-bottom: 2px solid #c5c7c4;
4709
+ font-size: 1.125rem;
4710
+ font-weight: 600;
4711
+ color: #4a4e54;
4712
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4713
+ }
4714
+
4715
+ .ResultsView-module__loadingState___W5YXx,
4716
+ .ResultsView-module__errorState___UkkG-,
4717
+ .ResultsView-module__emptyState___D0Iyn {
4718
+ display: flex;
4719
+ flex-direction: column;
4720
+ align-items: center;
4721
+ justify-content: center;
4722
+ padding: 4rem 2rem;
4723
+ text-align: center;
4724
+ }
4725
+
4726
+ .ResultsView-module__loadingState___W5YXx {
4727
+ color: #99a1ab;
4728
+ }
4729
+
4730
+ .ResultsView-module__spinner___nk8E5 {
4731
+ width: 3rem;
4732
+ height: 3rem;
4733
+ border: 4px solid #c5c7c4;
4734
+ border-top-color: #e2001a;
4735
+ border-radius: 50%;
4736
+ animation: ResultsView-module__spin___AuQLN 0.8s linear infinite;
4737
+ margin-bottom: 1rem;
4738
+ }
4739
+
4740
+ @keyframes ResultsView-module__spin___AuQLN {
4741
+ to {
4742
+ transform: rotate(360deg);
4743
+ }
4744
+ }
4745
+ .ResultsView-module__errorState___UkkG- {
4746
+ color: #e2001a;
4747
+ }
4748
+ .ResultsView-module__errorState___UkkG- p {
4749
+ margin: 0;
4750
+ font-size: 1rem;
4751
+ }
4752
+
4753
+ .ResultsView-module__emptyState___D0Iyn {
4754
+ color: #99a1ab;
4755
+ }
4756
+ .ResultsView-module__emptyState___D0Iyn h3 {
4757
+ margin: 0 0 0.5rem 0;
4758
+ font-size: 1.25rem;
4759
+ font-weight: 600;
4760
+ color: #4a4e54;
4761
+ }
4762
+ .ResultsView-module__emptyState___D0Iyn p {
4763
+ margin: 0;
4764
+ font-size: 1rem;
4765
+ max-width: 30rem;
4766
+ }
4767
+
4768
+ .ResultsView-module__emptyIcon___fes8T {
4769
+ width: 4rem;
4770
+ height: 4rem;
4771
+ margin-bottom: 1rem;
4772
+ color: #dae0e3;
4773
+ }
4774
+
4775
+ .ResultsView-module__paginationWrapper___mDTyl {
4776
+ display: flex;
4777
+ justify-content: center;
4778
+ margin-top: 2rem;
4779
+ padding: 1.5rem 0;
4780
+ }
4781
+
4782
+ .ResultsView-module__searchBarDesktopOnly___dZHUw {
4783
+ display: block;
4784
+ }
4785
+ @media (max-width: 768px) {
4786
+ .ResultsView-module__searchBarDesktopOnly___dZHUw {
4787
+ display: none;
4788
+ }
4789
+ }
4790
+
4791
+ .ResultsView-module__tabsContainerDesktopOnly___-MQpa {
4792
+ display: flex;
4793
+ }
4794
+ @media (max-width: 768px) {
4795
+ .ResultsView-module__tabsContainerDesktopOnly___-MQpa {
4796
+ display: none;
4797
+ }
4798
+ }
4799
+ :root {
4800
+ --leybold-red: #e2001a;
4801
+ --leybold-black: #000000;
4802
+ --leybold-white: #ffffff;
4803
+ --leybold-blue-grey: #546672;
4804
+ --leybold-white-aluminium: #dae0e3;
4805
+ --leybold-window-gray: #99a1ab;
4806
+ --leybold-light-grey: #c5c7c4;
4807
+ --leybold-very-light-grey: #f5f5f5;
4808
+ --leybold-slate-gray: #4a4e54;
4809
+ --leybold-anthracite-gray: #383e42;
4810
+ --leybold-orange: #d18e56;
4811
+ --leybold-yellow: #edd163;
4812
+ --leybold-green: #6ea67b;
4813
+ --leybold-purple: #732d5d;
4814
+ --leybold-purple-gray: #945e67;
4815
+ --leybold-blue: #2b4679;
4816
+ --leybold-light-blue: #3f6a98;
4817
+ --leybold-blue-green: #39788e;
4818
+ --leybold-green-gray: #6d8f9f;
4819
+ --color-primary: #e2001a;
4820
+ --color-secondary: #546672;
4821
+ --color-success: #6ea67b;
4822
+ --color-danger: #e2001a;
4823
+ --color-warning: #d18e56;
4824
+ --color-info: #3f6a98;
4825
+ --text-primary: #000000;
4826
+ --text-secondary: #4a4e54;
4827
+ --text-muted: #99a1ab;
4828
+ --text-inverse: #ffffff;
4829
+ --bg-primary: #ffffff;
4830
+ --bg-secondary: #dae0e3;
4831
+ --bg-dark: #383e42;
4832
+ --border-color: #c5c7c4;
4833
+ --border-color-dark: #4a4e54;
4834
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
4835
+ --h1-mobile-size: 32px;
4836
+ --h1-mobile-line-height: 1.2;
4837
+ --h2-mobile-size: 24px;
4838
+ --h2-mobile-line-height: 1.2;
4839
+ --h3-mobile-size: 18px;
4840
+ --h3-mobile-line-height: 1.6;
4841
+ --h4-mobile-size: 16px;
4842
+ --h4-mobile-line-height: 1.55;
4843
+ --h5-mobile-size: 14px;
4844
+ --h5-mobile-line-height: 1.5;
4845
+ --body-mobile-size: 14px;
4846
+ --body-mobile-line-height: 1.5;
4847
+ --h1-desktop-size: 55px;
4848
+ --h1-desktop-line-height: 1.15;
4849
+ --h1-desktop-letter-spacing: -0.02em;
4850
+ --h2-desktop-size: 40px;
4851
+ --h2-desktop-line-height: 1.2;
4852
+ --h2-desktop-letter-spacing: -0.01em;
4853
+ --h3-desktop-size: 32px;
4854
+ --h3-desktop-line-height: 1.2;
4855
+ --h4-desktop-size: 24px;
4856
+ --h4-desktop-line-height: 1.2;
4857
+ --h5-desktop-size: 18px;
4858
+ --h5-desktop-line-height: 1.6;
4859
+ --body-desktop-size: 18px;
4860
+ --body-desktop-line-height: 1.6;
4861
+ --text-lg-size: 27px;
4862
+ --text-lg-line-height: 1.4;
4863
+ --text-xl-size: 36px;
4864
+ --text-xl-line-height: 1.4;
4865
+ --text-xxl-size: 64px;
4866
+ --text-xxl-line-height: 1;
4867
+ }
4868
+
4869
+ .TabButton-module__tabButton___cMU45 {
4870
+ cursor: pointer;
4871
+ border: none;
4872
+ font-size: 14px;
4873
+ font-weight: 500;
4874
+ text-transform: uppercase;
4875
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
4876
+ transition: all 0.2s ease-in-out;
4877
+ position: relative;
4878
+ }
4879
+ .TabButton-module__tabButton___cMU45:focus-visible {
4880
+ outline: 1px solid #000000;
4881
+ outline-offset: 2px;
4882
+ }
4883
+
4884
+ .TabButton-module__tabButton__count___nlS1p {
4885
+ display: inline-block;
4886
+ }
4887
+ @media (max-width: 768px) {
4888
+ .TabButton-module__tabButton__count___nlS1p {
4889
+ display: none;
4890
+ }
4891
+ }
4892
+
4893
+ .TabButton-module__tabButton__label___YGpiC {
4894
+ display: inline-block;
4895
+ }
4896
+
4897
+ .TabButton-module__tabButton__results___Nr6gr {
4898
+ display: inline;
4899
+ }
4900
+ @media (max-width: 768px) {
4901
+ .TabButton-module__tabButton__results___Nr6gr {
4902
+ display: none;
4903
+ }
4904
+ }
4905
+
4906
+ .TabButton-module__tabButton--desktop___fbAaC {
4907
+ padding: 13.5px 27px;
4908
+ border-top-left-radius: 5px;
4909
+ border-top-right-radius: 5px;
4910
+ }
4911
+ .TabButton-module__tabButton--desktop___fbAaC:not(.TabButton-module__tabButton--active___gj6Jp) {
4912
+ background: #99a1ab;
4913
+ color: #ffffff;
4914
+ height: 44px;
4915
+ }
4916
+ .TabButton-module__tabButton--desktop___fbAaC:not(.TabButton-module__tabButton--active___gj6Jp):hover {
4917
+ background: rgb(139.0161290323, 148.1129032258, 159.4838709677);
4918
+ }
4919
+ .TabButton-module__tabButton--desktop___fbAaC.TabButton-module__tabButton--active___gj6Jp {
4920
+ background: rgb(245, 245, 245);
4921
+ color: #e2001a;
4922
+ height: 54px;
4923
+ }
4924
+ .TabButton-module__tabButton--desktop___fbAaC.TabButton-module__tabButton--active___gj6Jp::before {
4925
+ content: "";
4926
+ position: absolute;
4927
+ top: 0;
4928
+ left: 50%;
4929
+ transform: translateX(-50%);
4930
+ width: 100%;
4931
+ height: 5px;
4932
+ background: #e2001a;
4933
+ border-top-left-radius: 5px;
4934
+ border-top-right-radius: 5px;
4935
+ }
4936
+ @media (max-width: 768px) {
4937
+ .TabButton-module__tabButton--desktop___fbAaC {
4938
+ padding: 0;
4939
+ background: transparent !important;
4940
+ border-radius: 0;
4941
+ height: auto;
4942
+ border-bottom: none;
4943
+ }
4944
+ .TabButton-module__tabButton--desktop___fbAaC:not(.TabButton-module__tabButton--active___gj6Jp) {
4945
+ color: #4a4e54;
4946
+ }
4947
+ .TabButton-module__tabButton--desktop___fbAaC:not(.TabButton-module__tabButton--active___gj6Jp):hover {
4948
+ background: transparent;
4949
+ color: rgb(50.1139240506, 52.8227848101, 56.8860759494);
4950
+ }
4951
+ .TabButton-module__tabButton--desktop___fbAaC.TabButton-module__tabButton--active___gj6Jp {
4952
+ background: transparent !important;
4953
+ color: #e2001a;
4954
+ border-bottom: none;
4955
+ }
4956
+ .TabButton-module__tabButton--desktop___fbAaC.TabButton-module__tabButton--active___gj6Jp::before {
4957
+ display: none;
4958
+ }
4959
+ }
4960
+
4961
+ .TabButton-module__tabButton--mobile___AnLwy {
4962
+ padding: 13.5px 0;
4963
+ background: transparent;
4964
+ border-bottom: 1px solid transparent;
4965
+ height: auto;
4966
+ }
4967
+ .TabButton-module__tabButton--mobile___AnLwy:not(.TabButton-module__tabButton--active___gj6Jp) {
4968
+ color: #4a4e54;
4969
+ }
4970
+ .TabButton-module__tabButton--mobile___AnLwy:not(.TabButton-module__tabButton--active___gj6Jp):hover {
4971
+ color: rgb(50.1139240506, 52.8227848101, 56.8860759494);
4972
+ }
4973
+ .TabButton-module__tabButton--mobile___AnLwy.TabButton-module__tabButton--active___gj6Jp {
4974
+ color: #e2001a;
4975
+ border-bottom-color: #e2001a;
4976
+ }
4977
+ :root {
4978
+ --leybold-red: #e2001a;
4979
+ --leybold-black: #000000;
4980
+ --leybold-white: #ffffff;
4981
+ --leybold-blue-grey: #546672;
4982
+ --leybold-white-aluminium: #dae0e3;
4983
+ --leybold-window-gray: #99a1ab;
4984
+ --leybold-light-grey: #c5c7c4;
4985
+ --leybold-very-light-grey: #f5f5f5;
4986
+ --leybold-slate-gray: #4a4e54;
4987
+ --leybold-anthracite-gray: #383e42;
4988
+ --leybold-orange: #d18e56;
4989
+ --leybold-yellow: #edd163;
4990
+ --leybold-green: #6ea67b;
4991
+ --leybold-purple: #732d5d;
4992
+ --leybold-purple-gray: #945e67;
4993
+ --leybold-blue: #2b4679;
4994
+ --leybold-light-blue: #3f6a98;
4995
+ --leybold-blue-green: #39788e;
4996
+ --leybold-green-gray: #6d8f9f;
4997
+ --color-primary: #e2001a;
4998
+ --color-secondary: #546672;
4999
+ --color-success: #6ea67b;
5000
+ --color-danger: #e2001a;
5001
+ --color-warning: #d18e56;
5002
+ --color-info: #3f6a98;
5003
+ --text-primary: #000000;
5004
+ --text-secondary: #4a4e54;
5005
+ --text-muted: #99a1ab;
5006
+ --text-inverse: #ffffff;
5007
+ --bg-primary: #ffffff;
5008
+ --bg-secondary: #dae0e3;
5009
+ --bg-dark: #383e42;
5010
+ --border-color: #c5c7c4;
5011
+ --border-color-dark: #4a4e54;
5012
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
5013
+ --h1-mobile-size: 32px;
5014
+ --h1-mobile-line-height: 1.2;
5015
+ --h2-mobile-size: 24px;
5016
+ --h2-mobile-line-height: 1.2;
5017
+ --h3-mobile-size: 18px;
5018
+ --h3-mobile-line-height: 1.6;
5019
+ --h4-mobile-size: 16px;
5020
+ --h4-mobile-line-height: 1.55;
5021
+ --h5-mobile-size: 14px;
5022
+ --h5-mobile-line-height: 1.5;
5023
+ --body-mobile-size: 14px;
5024
+ --body-mobile-line-height: 1.5;
5025
+ --h1-desktop-size: 55px;
5026
+ --h1-desktop-line-height: 1.15;
5027
+ --h1-desktop-letter-spacing: -0.02em;
5028
+ --h2-desktop-size: 40px;
5029
+ --h2-desktop-line-height: 1.2;
5030
+ --h2-desktop-letter-spacing: -0.01em;
5031
+ --h3-desktop-size: 32px;
5032
+ --h3-desktop-line-height: 1.2;
5033
+ --h4-desktop-size: 24px;
5034
+ --h4-desktop-line-height: 1.2;
5035
+ --h5-desktop-size: 18px;
5036
+ --h5-desktop-line-height: 1.6;
5037
+ --body-desktop-size: 18px;
5038
+ --body-desktop-line-height: 1.6;
5039
+ --text-lg-size: 27px;
5040
+ --text-lg-line-height: 1.4;
5041
+ --text-xl-size: 36px;
5042
+ --text-xl-line-height: 1.4;
5043
+ --text-xxl-size: 64px;
5044
+ --text-xxl-line-height: 1;
5045
+ }
5046
+
5047
+ .AssistanceBanner-module__assistanceBanner___b97es {
5048
+ background: #ffffff;
5049
+ padding: 18px;
5050
+ display: flex;
5051
+ flex-direction: column;
5052
+ gap: 25px;
5053
+ box-shadow: 3px 3px 8px 0px rgba(64, 66, 75, 0.1);
5054
+ width: 300px;
5055
+ }
5056
+
5057
+ .AssistanceBanner-module__assistanceBanner__icon___8NzJj {
5058
+ width: 87px;
5059
+ height: 87px;
5060
+ color: #546672;
5061
+ flex-shrink: 0;
5062
+ }
5063
+
5064
+ .AssistanceBanner-module__assistanceBanner__title___Wtkkt {
5065
+ font-size: 36px;
5066
+ font-weight: 400;
5067
+ color: #4a4e54;
5068
+ margin: 0;
5069
+ line-height: 1.2;
5070
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
5071
+ }
5072
+
5073
+ .AssistanceBanner-module__assistanceBanner__description___AjoOr {
5074
+ font-size: 18px;
5075
+ font-weight: 400;
5076
+ color: #4a4e54;
5077
+ margin: 0;
5078
+ line-height: 1.5;
5079
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
5080
+ }
5081
+
5082
+ .AssistanceBanner-module__assistanceBanner__link___5L45N {
5083
+ display: inline-flex;
5084
+ align-items: center;
5085
+ gap: 9px;
5086
+ padding: 9px 9px 9px 0;
5087
+ color: #99a1ab;
5088
+ font-size: 18px;
5089
+ font-weight: 500;
5090
+ text-decoration: none;
5091
+ background: none;
5092
+ border: none;
5093
+ cursor: pointer;
5094
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
5095
+ transition: color 0.2s ease-in-out;
5096
+ width: -moz-fit-content;
5097
+ width: fit-content;
5098
+ }
5099
+ .AssistanceBanner-module__assistanceBanner__link___5L45N:hover {
5100
+ color: #4a4e54;
5101
+ }
5102
+ .AssistanceBanner-module__assistanceBanner__link___5L45N:focus-visible {
5103
+ outline: 1px solid #000000;
5104
+ outline-offset: 2px;
5105
+ }
5106
+
5107
+ .AssistanceBanner-module__assistanceBanner__chevron___4km-f {
5108
+ width: 12px;
5109
+ height: 6px;
5110
+ color: #000000;
5111
+ transform: rotate(270deg);
5112
+ flex-shrink: 0;
5113
+ transition: transform 0.2s ease-in-out;
5114
+ }
5115
+ .AssistanceBanner-module__assistanceBanner__link___5L45N:hover .AssistanceBanner-module__assistanceBanner__chevron___4km-f {
5116
+ transform: rotate(270deg) translateY(2px);
5117
+ }
5118
+ :root {
5119
+ --leybold-red: #e2001a;
5120
+ --leybold-black: #000000;
5121
+ --leybold-white: #ffffff;
5122
+ --leybold-blue-grey: #546672;
5123
+ --leybold-white-aluminium: #dae0e3;
5124
+ --leybold-window-gray: #99a1ab;
5125
+ --leybold-light-grey: #c5c7c4;
5126
+ --leybold-very-light-grey: #f5f5f5;
5127
+ --leybold-slate-gray: #4a4e54;
5128
+ --leybold-anthracite-gray: #383e42;
5129
+ --leybold-orange: #d18e56;
5130
+ --leybold-yellow: #edd163;
5131
+ --leybold-green: #6ea67b;
5132
+ --leybold-purple: #732d5d;
5133
+ --leybold-purple-gray: #945e67;
5134
+ --leybold-blue: #2b4679;
5135
+ --leybold-light-blue: #3f6a98;
5136
+ --leybold-blue-green: #39788e;
5137
+ --leybold-green-gray: #6d8f9f;
5138
+ --color-primary: #e2001a;
5139
+ --color-secondary: #546672;
5140
+ --color-success: #6ea67b;
5141
+ --color-danger: #e2001a;
5142
+ --color-warning: #d18e56;
5143
+ --color-info: #3f6a98;
5144
+ --text-primary: #000000;
5145
+ --text-secondary: #4a4e54;
5146
+ --text-muted: #99a1ab;
5147
+ --text-inverse: #ffffff;
5148
+ --bg-primary: #ffffff;
5149
+ --bg-secondary: #dae0e3;
5150
+ --bg-dark: #383e42;
5151
+ --border-color: #c5c7c4;
5152
+ --border-color-dark: #4a4e54;
5153
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
5154
+ --h1-mobile-size: 32px;
5155
+ --h1-mobile-line-height: 1.2;
5156
+ --h2-mobile-size: 24px;
5157
+ --h2-mobile-line-height: 1.2;
5158
+ --h3-mobile-size: 18px;
5159
+ --h3-mobile-line-height: 1.6;
5160
+ --h4-mobile-size: 16px;
5161
+ --h4-mobile-line-height: 1.55;
5162
+ --h5-mobile-size: 14px;
5163
+ --h5-mobile-line-height: 1.5;
5164
+ --body-mobile-size: 14px;
5165
+ --body-mobile-line-height: 1.5;
5166
+ --h1-desktop-size: 55px;
5167
+ --h1-desktop-line-height: 1.15;
5168
+ --h1-desktop-letter-spacing: -0.02em;
5169
+ --h2-desktop-size: 40px;
5170
+ --h2-desktop-line-height: 1.2;
5171
+ --h2-desktop-letter-spacing: -0.01em;
5172
+ --h3-desktop-size: 32px;
5173
+ --h3-desktop-line-height: 1.2;
5174
+ --h4-desktop-size: 24px;
5175
+ --h4-desktop-line-height: 1.2;
5176
+ --h5-desktop-size: 18px;
5177
+ --h5-desktop-line-height: 1.6;
5178
+ --body-desktop-size: 18px;
5179
+ --body-desktop-line-height: 1.6;
5180
+ --text-lg-size: 27px;
5181
+ --text-lg-line-height: 1.4;
5182
+ --text-xl-size: 36px;
5183
+ --text-xl-line-height: 1.4;
5184
+ --text-xxl-size: 64px;
5185
+ --text-xxl-line-height: 1;
5186
+ }
5187
+
5188
+ .FilterDrawer-module__drawerOverlay___P6M4y {
5189
+ position: fixed;
5190
+ inset: 0;
5191
+ background: rgba(0, 0, 0, 0.95);
5192
+ z-index: 1001;
5193
+ opacity: 0;
5194
+ pointer-events: none;
5195
+ transition: opacity 0.3s ease-out;
5196
+ }
5197
+ .FilterDrawer-module__drawerOverlay--open___blJZo {
5198
+ opacity: 1;
5199
+ pointer-events: auto;
3951
5200
  }
3952
5201
 
3953
- .ResultsView-module__filterOptions___riqHE {
5202
+ .FilterDrawer-module__drawerPanel___35h-U {
5203
+ position: fixed;
5204
+ top: 0;
5205
+ left: 0;
5206
+ bottom: 0;
5207
+ width: 300px;
5208
+ background: #f5f5f5;
5209
+ transform: translateX(-100%);
5210
+ transition: transform 0.3s ease-out;
5211
+ overflow-y: auto;
3954
5212
  display: flex;
3955
5213
  flex-direction: column;
3956
- gap: 0.5rem;
5214
+ outline: none;
5215
+ }
5216
+ .FilterDrawer-module__drawerPanel--open___Fw1SY {
5217
+ transform: translateX(0);
5218
+ }
5219
+ .FilterDrawer-module__drawerPanel___35h-U:focus-visible {
5220
+ outline: none;
3957
5221
  }
3958
5222
 
3959
- .ResultsView-module__filterOption___uteZj {
5223
+ .FilterDrawer-module__drawerCloseButton___cfMmf {
5224
+ position: fixed;
5225
+ top: 18px;
5226
+ right: 18px;
5227
+ z-index: 1002;
5228
+ color: #ffffff;
5229
+ background: transparent;
5230
+ border: none;
5231
+ cursor: pointer;
5232
+ padding: 0.5rem;
3960
5233
  display: flex;
3961
5234
  align-items: center;
3962
- gap: 0.5rem;
3963
- cursor: pointer;
3964
- color: #4b5563;
3965
- font-size: 0.875rem;
5235
+ justify-content: center;
3966
5236
  }
3967
- .ResultsView-module__filterOption___uteZj input[type=checkbox] {
3968
- width: 1rem;
3969
- height: 1rem;
3970
- cursor: pointer;
5237
+ .FilterDrawer-module__drawerCloseButton___cfMmf svg {
5238
+ stroke: #ffffff;
5239
+ fill: none;
5240
+ width: 1.5rem;
5241
+ height: 1.5rem;
3971
5242
  }
3972
- .ResultsView-module__filterOption___uteZj:hover {
3973
- color: #111827;
5243
+ .FilterDrawer-module__drawerCloseButton___cfMmf:hover {
5244
+ background-color: rgba(255, 255, 255, 0.1);
5245
+ border-radius: 0.375rem;
3974
5246
  }
3975
-
3976
- .ResultsView-module__resultsList___8eYNX {
3977
- display: flex;
3978
- flex-direction: column;
3979
- gap: 1rem;
5247
+ .FilterDrawer-module__drawerCloseButton___cfMmf:focus-visible {
5248
+ outline: 1px solid #ffffff;
5249
+ outline-offset: 2px;
3980
5250
  }
3981
5251
 
3982
- .ResultsView-module__resultsSection___sCUaO {
3983
- display: flex;
3984
- flex-direction: column;
3985
- gap: 1rem;
3986
- margin-bottom: 2rem;
5252
+ .FilterDrawer-module__drawerContent___KBff6 {
5253
+ flex: 1;
5254
+ overflow-y: auto;
5255
+ overflow-x: hidden;
5256
+ padding: 18px;
3987
5257
  }
3988
- .ResultsView-module__resultsSection___sCUaO:last-child {
3989
- margin-bottom: 0;
5258
+ .FilterDrawer-module__drawerContent___KBff6 > * {
5259
+ width: 100%;
3990
5260
  }
3991
5261
 
3992
- .ResultsView-module__sectionTitle___mfvH3 {
3993
- margin: 0;
3994
- padding-bottom: 0.75rem;
3995
- border-bottom: 2px solid #e5e7eb;
3996
- font-size: 1.125rem;
3997
- font-weight: 600;
3998
- color: #111827;
5262
+ @media (min-width: 769px) {
5263
+ .FilterDrawer-module__drawerOverlay___P6M4y,
5264
+ .FilterDrawer-module__drawerPanel___35h-U {
5265
+ display: none;
5266
+ }
3999
5267
  }
4000
-
4001
- .ResultsView-module__loadingState___W5YXx,
4002
- .ResultsView-module__errorState___UkkG-,
4003
- .ResultsView-module__emptyState___D0Iyn {
4004
- display: flex;
4005
- flex-direction: column;
4006
- align-items: center;
4007
- justify-content: center;
4008
- padding: 4rem 2rem;
4009
- text-align: center;
5268
+ :root {
5269
+ --leybold-red: #e2001a;
5270
+ --leybold-black: #000000;
5271
+ --leybold-white: #ffffff;
5272
+ --leybold-blue-grey: #546672;
5273
+ --leybold-white-aluminium: #dae0e3;
5274
+ --leybold-window-gray: #99a1ab;
5275
+ --leybold-light-grey: #c5c7c4;
5276
+ --leybold-very-light-grey: #f5f5f5;
5277
+ --leybold-slate-gray: #4a4e54;
5278
+ --leybold-anthracite-gray: #383e42;
5279
+ --leybold-orange: #d18e56;
5280
+ --leybold-yellow: #edd163;
5281
+ --leybold-green: #6ea67b;
5282
+ --leybold-purple: #732d5d;
5283
+ --leybold-purple-gray: #945e67;
5284
+ --leybold-blue: #2b4679;
5285
+ --leybold-light-blue: #3f6a98;
5286
+ --leybold-blue-green: #39788e;
5287
+ --leybold-green-gray: #6d8f9f;
5288
+ --color-primary: #e2001a;
5289
+ --color-secondary: #546672;
5290
+ --color-success: #6ea67b;
5291
+ --color-danger: #e2001a;
5292
+ --color-warning: #d18e56;
5293
+ --color-info: #3f6a98;
5294
+ --text-primary: #000000;
5295
+ --text-secondary: #4a4e54;
5296
+ --text-muted: #99a1ab;
5297
+ --text-inverse: #ffffff;
5298
+ --bg-primary: #ffffff;
5299
+ --bg-secondary: #dae0e3;
5300
+ --bg-dark: #383e42;
5301
+ --border-color: #c5c7c4;
5302
+ --border-color-dark: #4a4e54;
5303
+ --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
5304
+ --h1-mobile-size: 32px;
5305
+ --h1-mobile-line-height: 1.2;
5306
+ --h2-mobile-size: 24px;
5307
+ --h2-mobile-line-height: 1.2;
5308
+ --h3-mobile-size: 18px;
5309
+ --h3-mobile-line-height: 1.6;
5310
+ --h4-mobile-size: 16px;
5311
+ --h4-mobile-line-height: 1.55;
5312
+ --h5-mobile-size: 14px;
5313
+ --h5-mobile-line-height: 1.5;
5314
+ --body-mobile-size: 14px;
5315
+ --body-mobile-line-height: 1.5;
5316
+ --h1-desktop-size: 55px;
5317
+ --h1-desktop-line-height: 1.15;
5318
+ --h1-desktop-letter-spacing: -0.02em;
5319
+ --h2-desktop-size: 40px;
5320
+ --h2-desktop-line-height: 1.2;
5321
+ --h2-desktop-letter-spacing: -0.01em;
5322
+ --h3-desktop-size: 32px;
5323
+ --h3-desktop-line-height: 1.2;
5324
+ --h4-desktop-size: 24px;
5325
+ --h4-desktop-line-height: 1.2;
5326
+ --h5-desktop-size: 18px;
5327
+ --h5-desktop-line-height: 1.6;
5328
+ --body-desktop-size: 18px;
5329
+ --body-desktop-line-height: 1.6;
5330
+ --text-lg-size: 27px;
5331
+ --text-lg-line-height: 1.4;
5332
+ --text-xl-size: 36px;
5333
+ --text-xl-line-height: 1.4;
5334
+ --text-xxl-size: 64px;
5335
+ --text-xxl-line-height: 1;
4010
5336
  }
4011
5337
 
4012
- .ResultsView-module__loadingState___W5YXx {
4013
- color: #6b7280;
5338
+ .FederatedSearchExperience-module__searchExperience___gug9X {
5339
+ width: 100%;
5340
+ min-height: 400px;
4014
5341
  }
4015
5342
 
4016
- .ResultsView-module__spinner___nk8E5 {
4017
- width: 3rem;
4018
- height: 3rem;
4019
- border: 4px solid #e5e7eb;
4020
- border-top-color: #dc2626;
4021
- border-radius: 50%;
4022
- animation: ResultsView-module__spin___AuQLN 0.8s linear infinite;
4023
- margin-bottom: 1rem;
5343
+ .FederatedSearchExperience-module__searchBarSection___f0Ykq {
5344
+ margin-bottom: 2rem;
4024
5345
  }
4025
5346
 
4026
- @keyframes ResultsView-module__spin___AuQLN {
4027
- to {
4028
- transform: rotate(360deg);
5347
+ .FederatedSearchExperience-module__searchBarDesktopOnly___CetKZ {
5348
+ display: block;
5349
+ }
5350
+ @media (max-width: 768px) {
5351
+ .FederatedSearchExperience-module__searchBarDesktopOnly___CetKZ {
5352
+ display: none;
4029
5353
  }
4030
5354
  }
4031
- .ResultsView-module__errorState___UkkG- {
4032
- color: #dc2626;
5355
+
5356
+ .FederatedSearchExperience-module__searchBarMobileOnly___Ityxp {
5357
+ display: none;
4033
5358
  }
4034
- .ResultsView-module__errorState___UkkG- p {
4035
- margin: 0;
4036
- font-size: 1rem;
5359
+ @media (max-width: 768px) {
5360
+ .FederatedSearchExperience-module__searchBarMobileOnly___Ityxp {
5361
+ display: block;
5362
+ }
4037
5363
  }
4038
5364
 
4039
- .ResultsView-module__emptyState___D0Iyn {
4040
- color: #6b7280;
4041
- }
4042
- .ResultsView-module__emptyState___D0Iyn h3 {
4043
- margin: 0 0 0.5rem 0;
4044
- font-size: 1.25rem;
4045
- font-weight: 600;
4046
- color: #111827;
5365
+ .FederatedSearchExperience-module__resultsHeaderMobileOnly___09ef- {
5366
+ display: none;
4047
5367
  }
4048
- .ResultsView-module__emptyState___D0Iyn p {
4049
- margin: 0;
4050
- font-size: 1rem;
4051
- max-width: 30rem;
5368
+ @media (max-width: 768px) {
5369
+ .FederatedSearchExperience-module__resultsHeaderMobileOnly___09ef- {
5370
+ display: flex;
5371
+ flex-direction: column;
5372
+ gap: 18px;
5373
+ width: 100%;
5374
+ margin-bottom: -18px;
5375
+ }
4052
5376
  }
4053
5377
 
4054
- .ResultsView-module__emptyIcon___fes8T {
4055
- width: 4rem;
4056
- height: 4rem;
4057
- margin-bottom: 1rem;
4058
- color: #d1d5db;
5378
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 {
5379
+ display: none;
4059
5380
  }
4060
-
4061
- .ResultsView-module__paginationWrapper___mDTyl {
5381
+ @media (max-width: 768px) {
5382
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 {
5383
+ display: flex;
5384
+ align-items: center;
5385
+ justify-content: space-between;
5386
+ width: 100%;
5387
+ }
5388
+ }
5389
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__tabs___Vatv8 {
4062
5390
  display: flex;
4063
- justify-content: center;
4064
- margin-top: 2rem;
4065
- padding: 1.5rem 0;
4066
- border-top: 1px solid #e5e7eb;
5391
+ gap: 18px;
5392
+ flex: 1;
5393
+ align-items: center;
5394
+ padding: 0 0 9px 0;
5395
+ border-bottom: 1px solid rgba(245, 245, 245, 0.5);
4067
5396
  }
4068
- .FederatedSearchExperience-module__searchExperience___gug9X {
4069
- width: 100%;
4070
- min-height: 400px;
5397
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__tabSeparator___AUjhW {
5398
+ display: none;
4071
5399
  }
4072
-
4073
- .FederatedSearchExperience-module__searchBarSection___f0Ykq {
4074
- margin-bottom: 2rem;
5400
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__mobileFilterButtonWrapper___JkRtk {
5401
+ position: relative;
5402
+ flex-shrink: 0;
5403
+ }
5404
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__mobileFilterButton___sRc-w {
5405
+ display: inline-flex;
5406
+ align-items: center;
5407
+ gap: 8px;
5408
+ padding: 0 0 9px 0;
5409
+ background: none;
5410
+ border: none;
5411
+ color: #000000;
5412
+ font-size: 14px;
5413
+ font-weight: 400;
5414
+ cursor: pointer;
5415
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
5416
+ }
5417
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__mobileFilterButton___sRc-w svg {
5418
+ width: 15px;
5419
+ height: 11px;
5420
+ }
5421
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__mobileFilterButton___sRc-w:hover {
5422
+ opacity: 0.7;
5423
+ }
5424
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__mobileFilterButton___sRc-w:focus-visible {
5425
+ outline: 1px solid #000000;
5426
+ outline-offset: 2px;
5427
+ }
5428
+ .FederatedSearchExperience-module__tabsContainerSticky___-HdY5 .FederatedSearchExperience-module__filterIndicatorDot___vqVi2 {
5429
+ position: absolute;
5430
+ top: 0;
5431
+ left: 10px;
5432
+ width: 10px;
5433
+ height: 10px;
5434
+ background: #e2001a;
5435
+ border-radius: 50%;
5436
+ pointer-events: none;
4075
5437
  }
4076
5438
 
4077
5439
  .FederatedSearchExperience-module__instantResultsSection___AG3qn,
@@ -4079,6 +5441,37 @@ h3.ProductCardHorizontal-module__productTitle___xBuu7 {
4079
5441
  width: 100%;
4080
5442
  }
4081
5443
 
5444
+ .FederatedSearchExperience-module__mobileCloseWrapper___lxLio {
5445
+ display: none;
5446
+ }
5447
+ @media (max-width: 768px) {
5448
+ .FederatedSearchExperience-module__mobileCloseWrapper___lxLio {
5449
+ display: block;
5450
+ padding: 18px;
5451
+ text-align: right;
5452
+ }
5453
+ }
5454
+
5455
+ .FederatedSearchExperience-module__closeTextButton___nU0Tt {
5456
+ font-size: 13.5px;
5457
+ font-weight: 600;
5458
+ color: #000000;
5459
+ background: none;
5460
+ border: none;
5461
+ text-transform: uppercase;
5462
+ cursor: pointer;
5463
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
5464
+ padding: 0;
5465
+ transition: opacity 0.2s ease-in-out;
5466
+ }
5467
+ .FederatedSearchExperience-module__closeTextButton___nU0Tt:hover {
5468
+ opacity: 0.7;
5469
+ }
5470
+ .FederatedSearchExperience-module__closeTextButton___nU0Tt:focus-visible {
5471
+ outline: 1px solid #000000;
5472
+ outline-offset: 2px;
5473
+ }
5474
+
4082
5475
  .FederatedSearchExperience-module__emptyState___JGJTN {
4083
5476
  display: flex;
4084
5477
  flex-direction: column;