@aurodesignsystem/design-tokens 9.1.0 → 9.3.0

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 (29) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/README.md +84 -5
  3. package/dist/app/alaskaLight.json +25 -67
  4. package/dist/app/atmosLight.json +19 -61
  5. package/dist/app/hawaiianLight.json +32 -74
  6. package/dist/app/test.json +98 -140
  7. package/dist/themes/CSSCustomProperties--bundled.css +30 -10
  8. package/dist/themes/CSSCustomProperties--bundled.min.css +1 -1
  9. package/dist/web/JSONVariablesNested--alaska.json +39 -75
  10. package/dist/web/JSONVariablesNested--atmos.json +30 -66
  11. package/dist/web/JSONVariablesNested--hawaiian.json +50 -86
  12. package/dist/web/JSONVariablesNested--test.json +162 -198
  13. package/dist/web/JSObject--allTokens--alaska.js +378 -858
  14. package/dist/web/JSObject--allTokens--atmos.js +360 -840
  15. package/dist/web/JSObject--allTokens--hawaiian.js +400 -880
  16. package/dist/web/JSObject--allTokens--test.js +624 -1104
  17. package/dist/web/alaska.css +120 -164
  18. package/dist/web/alaska.min.css +1 -1
  19. package/dist/web/alaska.scss +33 -53
  20. package/dist/web/atmos.css +120 -164
  21. package/dist/web/atmos.min.css +1 -1
  22. package/dist/web/atmos.scss +24 -44
  23. package/dist/web/blueprint.css +156 -176
  24. package/dist/web/blueprint.min.css +1 -1
  25. package/dist/web/blueprint.scss +156 -176
  26. package/dist/web/hawaiian.css +120 -164
  27. package/dist/web/hawaiian.min.css +1 -1
  28. package/dist/web/hawaiian.scss +44 -64
  29. package/package.json +1 -1
package/dist/web/atmos.css CHANGED
@@ -1,5 +1,6 @@
1
1
  :root,
2
- [data-aag-theme="aag-theme-atm"] {
2
+ [data-aag-theme="aag-theme-atm"],
3
+ [data-aag-theme="aag-theme-atm-color"] {
3
4
  --ds-advanced-color-accents-accent1: #c2d5d6;
4
5
  --ds-advanced-color-accents-accent1-bold: #3d7a7d;
5
6
  --ds-advanced-color-accents-accent1-muted: #dfe9ea;
@@ -44,7 +45,7 @@
44
45
  --ds-advanced-color-button-ghost-background-hover: #0000000d;
45
46
  --ds-advanced-color-button-ghost-background-inverse-hover: #ffffff0d;
46
47
  --ds-advanced-color-button-ghost-text: #101d2c;
47
- --ds-advanced-color-button-ghost-text-disabled: #dddddd;
48
+ --ds-advanced-color-button-ghost-text-disabled: #dbdddd;
48
49
  --ds-advanced-color-button-ghost-text-inverse: #faf9f5;
49
50
  --ds-advanced-color-button-ghost-text-inverse-disabled: #7e8894;
50
51
  --ds-advanced-color-button-primary-background: #aedeff;
@@ -62,14 +63,14 @@
62
63
  --ds-advanced-color-button-primary-border-inverse-disabled: #ffffffbf;
63
64
  --ds-advanced-color-button-primary-border-inverse-hover: #ecf0f3;
64
65
  --ds-advanced-color-button-primary-text: #101d2c;
65
- --ds-advanced-color-button-primary-text-disabled: #dddddd;
66
+ --ds-advanced-color-button-primary-text-disabled: #dbdddd;
66
67
  --ds-advanced-color-button-primary-text-inverse: #101d2c;
67
68
  --ds-advanced-color-button-secondary-background: #ffffff00;
68
- --ds-advanced-color-button-secondary-background-disabled: #f7f7f7;
69
+ --ds-advanced-color-button-secondary-background-disabled: #f5f7f7;
69
70
  --ds-advanced-color-button-secondary-background-hover: #0000000d;
70
71
  --ds-advanced-color-button-secondary-background-inverse-hover: #ffffff1a;
71
72
  --ds-advanced-color-button-secondary-border: #101d2c;
72
- --ds-advanced-color-button-secondary-border-disabled: #f7f7f7;
73
+ --ds-advanced-color-button-secondary-border-disabled: #f5f7f7;
73
74
  --ds-advanced-color-button-secondary-border-hover: #101d2c;
74
75
  --ds-advanced-color-button-secondary-border-inverse: #ffffff;
75
76
  --ds-advanced-color-button-secondary-border-inverse-disabled: #e9e6d9;
@@ -107,7 +108,7 @@
107
108
  --ds-advanced-color-hyperlink-text-inverse-hover: #cfe0ef;
108
109
  --ds-advanced-color-interactive-background-hover: #00000014;
109
110
  --ds-advanced-color-interactive-background-inverse-hover: #ffffff14;
110
- --ds-advanced-color-interactive-disabled: #dddddd;
111
+ --ds-advanced-color-interactive-disabled: #dbdddd;
111
112
  --ds-advanced-color-interactive-disabled-inverse: #ffffff66;
112
113
  --ds-advanced-color-interactive-error: #e01f26;
113
114
  --ds-advanced-color-interactive-error-hover: #b1161c;
@@ -131,15 +132,15 @@
131
132
  --ds-advanced-color-shared-background-inverse: #ffffff26;
132
133
  --ds-advanced-color-shared-background-inverse-disabled: #ffffff1a;
133
134
  --ds-advanced-color-shared-background-inverse-hover: #ffffff33;
134
- --ds-advanced-color-shared-background-muted: #f7f7f7;
135
- --ds-advanced-color-shared-background-strong: #676767;
135
+ --ds-advanced-color-shared-background-muted: #f5f7f7;
136
+ --ds-advanced-color-shared-background-strong: #666767;
136
137
  --ds-advanced-color-shared-emphasized-background: #e2e8ee;
137
138
  --ds-advanced-color-shared-emphasized-background-hover: #c7d6e5;
138
139
  --ds-advanced-color-shared-scrim: #00000080;
139
140
  --ds-advanced-color-shared-text-accent: #003761;
140
141
  --ds-advanced-color-skeleton-background: #f7f8fa;
141
142
  --ds-advanced-color-skeleton-wave: #e4e8ec;
142
- --ds-advanced-color-state-background-disabled: #dddddd;
143
+ --ds-advanced-color-state-background-disabled: #dbdddd;
143
144
  --ds-advanced-color-state-background-hover: #00000014;
144
145
  --ds-advanced-color-state-background-inverse-disabled: #ffffff66;
145
146
  --ds-advanced-color-state-error-inverse: #f9a4a8;
@@ -184,44 +185,24 @@
184
185
  --ds-basic-color-brand-tertiary-bold: #dfd7c3;
185
186
  --ds-basic-color-brand-tertiary-muted: #faf9f5;
186
187
  --ds-basic-color-brand-tertiary-subtle: #e9e6d9;
187
- --ds-basic-color-fare-alaska-basic-economy-bold: #096173;
188
- --ds-basic-color-fare-alaska-basic-economy-default: #97eaf8;
189
- --ds-basic-color-fare-alaska-basic-economy-subtle: #ebfafd;
190
- --ds-basic-color-fare-alaska-economy-bold: #005fa7;
191
- --ds-basic-color-fare-alaska-economy-default: #289bee;
192
- --ds-basic-color-fare-alaska-economy-subtle: #ebf7ff;
193
- --ds-basic-color-fare-alaska-economy-extra-legroom-bold: #265688;
194
- --ds-basic-color-fare-alaska-economy-extra-legroom-default: #265688;
195
- --ds-basic-color-fare-alaska-economy-extra-legroom-subtle: #ebf3f9;
196
- --ds-basic-color-fare-alaska-first-business-bold: #005154;
197
- --ds-basic-color-fare-alaska-first-business-default: #005154;
198
- --ds-basic-color-fare-alaska-first-business-gradient-back: #00274a;
199
- --ds-basic-color-fare-alaska-first-business-gradient-front: #005154;
200
- --ds-basic-color-fare-alaska-first-business-subtle: #e9f1f1;
201
- --ds-basic-color-fare-alaska-premium-economy-bold: #00274a;
202
- --ds-basic-color-fare-alaska-premium-economy-default: #00274a;
203
- --ds-basic-color-fare-alaska-premium-economy-subtle: #ecf0f3;
188
+ --ds-basic-color-fare-basic-economy-bold: #096173;
189
+ --ds-basic-color-fare-basic-economy-default: #97eaf8;
190
+ --ds-basic-color-fare-basic-economy-subtle: #ebfafd;
204
191
  --ds-basic-color-fare-basiceconomy: #97eaf8;
205
192
  --ds-basic-color-fare-business: #002c4e;
206
193
  --ds-basic-color-fare-economy: #0074ca;
194
+ --ds-basic-color-fare-economy-extra-legroom-bold: #265688;
195
+ --ds-basic-color-fare-economy-extra-legroom-default: #265688;
196
+ --ds-basic-color-fare-economy-extra-legroom-subtle: #ebf3f9;
207
197
  --ds-basic-color-fare-first: #101d2c;
208
- --ds-basic-color-fare-hawaiian-basic-economy-bold: #515252;
209
- --ds-basic-color-fare-hawaiian-basic-economy-default: #ced0d0;
210
- --ds-basic-color-fare-hawaiian-basic-economy-subtle: #f5f7f7;
211
- --ds-basic-color-fare-hawaiian-economy-bold: #1b6976;
212
- --ds-basic-color-fare-hawaiian-economy-default: #00a5ba;
213
- --ds-basic-color-fare-hawaiian-economy-subtle: #ecf6f8;
214
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-bold: #a91770;
215
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-default: #ce0c88;
216
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-subtle: #fdf1f8;
217
- --ds-basic-color-fare-hawaiian-first-business-bold: #463c8f;
218
- --ds-basic-color-fare-hawaiian-first-business-default: #463c8f;
219
- --ds-basic-color-fare-hawaiian-first-business-gradient-back: #ce0c88;
220
- --ds-basic-color-fare-hawaiian-first-business-gradient-front: #463c8f;
221
- --ds-basic-color-fare-hawaiian-first-business-subtle: #edeaf4;
222
- --ds-basic-color-fare-hawaiian-premium-economy-bold: #831a57;
223
- --ds-basic-color-fare-hawaiian-premium-economy-default: #831a57;
224
- --ds-basic-color-fare-hawaiian-premium-economy-subtle: #fdf1f8;
198
+ --ds-basic-color-fare-first-business-bold: #005154;
199
+ --ds-basic-color-fare-first-business-default: #005154;
200
+ --ds-basic-color-fare-first-business-gradient-back: #00274a;
201
+ --ds-basic-color-fare-first-business-gradient-front: #005154;
202
+ --ds-basic-color-fare-first-business-subtle: #e9f1f1;
203
+ --ds-basic-color-fare-premium-economy-bold: #00274a;
204
+ --ds-basic-color-fare-premium-economy-default: #00274a;
205
+ --ds-basic-color-fare-premium-economy-subtle: #ecf0f3;
225
206
  --ds-basic-color-fare-premiumeconomy: #265688;
226
207
  --ds-basic-color-fare-suites-back: #101d2c;
227
208
  --ds-basic-color-fare-suites-front: #101d2c;
@@ -249,10 +230,10 @@
249
230
  --ds-basic-color-surface-neutral-subtle: #faf9f5;
250
231
  --ds-basic-color-texticon-accent1: #101d2c;
251
232
  --ds-basic-color-texticon-default: #101d2c;
252
- --ds-basic-color-texticon-disabled: #dddddd;
233
+ --ds-basic-color-texticon-disabled: #dbdddd;
253
234
  --ds-basic-color-texticon-inverse: #faf9f5;
254
235
  --ds-basic-color-texticon-inverse-disabled: #7e8894;
255
- --ds-basic-color-texticon-inverse-muted: #c5c5c5;
236
+ --ds-basic-color-texticon-inverse-muted: #c3c5c5;
256
237
  --ds-basic-color-texticon-link-default: #101d2c;
257
238
  --ds-basic-color-texticon-link-hover: #005fa7;
258
239
  --ds-basic-color-texticon-link-inverse-default: #faf9f5;
@@ -271,6 +252,11 @@
271
252
  --ds-basic-color-tier-program-oneworld-emerald: #139142;
272
253
  --ds-basic-color-tier-program-oneworld-ruby: #a41d4a;
273
254
  --ds-basic-color-tier-program-oneworld-sapphire: #015daa;
255
+ }
256
+
257
+ :root,
258
+ [data-aag-theme="aag-theme-atm"],
259
+ [data-aag-theme="aag-theme-atm-type"] {
274
260
  --ds-basic-type-brand-family-primary: "AS Circular";
275
261
  --ds-basic-type-brand-family-secondary: Teodor;
276
262
  --ds-basic-type-brand-letter-spacing-primary: 0;
@@ -309,7 +295,8 @@
309
295
  --ds-basic-type-weight-heading2: 300;
310
296
  }
311
297
 
312
- [data-aag-theme="aag-theme-as"] {
298
+ [data-aag-theme="aag-theme-as"],
299
+ [data-aag-theme="aag-theme-as-color"] {
313
300
  --ds-advanced-color-accents-accent1: #b2d583;
314
301
  --ds-advanced-color-accents-accent1-bold: #92c450;
315
302
  --ds-advanced-color-accents-accent1-muted: #deedca;
@@ -345,16 +332,16 @@
345
332
  --ds-advanced-color-boolean-istrue-hover: #00274a;
346
333
  --ds-advanced-color-boolean-istrue-inverse: #ffffff;
347
334
  --ds-advanced-color-boolean-istrue-inverse-hover: #ffffffb2;
348
- --ds-advanced-color-button-flat-text: #676767;
349
- --ds-advanced-color-button-flat-text-disabled: #d0d0d0;
350
- --ds-advanced-color-button-flat-text-hover: #525252;
335
+ --ds-advanced-color-button-flat-text: #666767;
336
+ --ds-advanced-color-button-flat-text-disabled: #ced0d0;
337
+ --ds-advanced-color-button-flat-text-hover: #515252;
351
338
  --ds-advanced-color-button-flat-text-inverse: #ffffff;
352
339
  --ds-advanced-color-button-flat-text-inverse-disabled: #7e8894;
353
- --ds-advanced-color-button-flat-text-inverse-hover: #adadad;
340
+ --ds-advanced-color-button-flat-text-inverse-hover: #abadad;
354
341
  --ds-advanced-color-button-ghost-background-hover: #0000000d;
355
342
  --ds-advanced-color-button-ghost-background-inverse-hover: #ffffff0d;
356
343
  --ds-advanced-color-button-ghost-text: #01426a;
357
- --ds-advanced-color-button-ghost-text-disabled: #d0d0d0;
344
+ --ds-advanced-color-button-ghost-text-disabled: #ced0d0;
358
345
  --ds-advanced-color-button-ghost-text-inverse: #ffffff;
359
346
  --ds-advanced-color-button-ghost-text-inverse-disabled: #7e8894;
360
347
  --ds-advanced-color-button-primary-background: #01426a;
@@ -375,14 +362,14 @@
375
362
  --ds-advanced-color-button-primary-text-disabled: #ffffff;
376
363
  --ds-advanced-color-button-primary-text-inverse: #01426a;
377
364
  --ds-advanced-color-button-secondary-background: #ffffff;
378
- --ds-advanced-color-button-secondary-background-disabled: #f7f7f7;
379
- --ds-advanced-color-button-secondary-background-hover: #f2f2f2;
365
+ --ds-advanced-color-button-secondary-background-disabled: #f5f7f7;
366
+ --ds-advanced-color-button-secondary-background-hover: #f1f3f3;
380
367
  --ds-advanced-color-button-secondary-background-inverse-hover: #ffffff1a;
381
368
  --ds-advanced-color-button-secondary-border: #01426a;
382
369
  --ds-advanced-color-button-secondary-border-disabled: #cfe0ef;
383
370
  --ds-advanced-color-button-secondary-border-hover: #00274a;
384
371
  --ds-advanced-color-button-secondary-border-inverse: #ffffff;
385
- --ds-advanced-color-button-secondary-border-inverse-disabled: #dddddd;
372
+ --ds-advanced-color-button-secondary-border-inverse-disabled: #dbdddd;
386
373
  --ds-advanced-color-button-secondary-text: #01426a;
387
374
  --ds-advanced-color-button-secondary-text-hover: #00274a;
388
375
  --ds-advanced-color-button-secondary-text-inverse: #ffffff;
@@ -417,7 +404,7 @@
417
404
  --ds-advanced-color-hyperlink-text-inverse-hover: #ebf3f9;
418
405
  --ds-advanced-color-interactive-background-hover: #00000014;
419
406
  --ds-advanced-color-interactive-background-inverse-hover: #ffffff14;
420
- --ds-advanced-color-interactive-disabled: #dddddd;
407
+ --ds-advanced-color-interactive-disabled: #dbdddd;
421
408
  --ds-advanced-color-interactive-disabled-inverse: #ffffff66;
422
409
  --ds-advanced-color-interactive-error: #e01f26;
423
410
  --ds-advanced-color-interactive-error-hover: #b1161c;
@@ -441,15 +428,15 @@
441
428
  --ds-advanced-color-shared-background-inverse: #ffffff26;
442
429
  --ds-advanced-color-shared-background-inverse-disabled: #ffffff1a;
443
430
  --ds-advanced-color-shared-background-inverse-hover: #ffffff33;
444
- --ds-advanced-color-shared-background-muted: #f7f7f7;
445
- --ds-advanced-color-shared-background-strong: #676767;
431
+ --ds-advanced-color-shared-background-muted: #f5f7f7;
432
+ --ds-advanced-color-shared-background-strong: #666767;
446
433
  --ds-advanced-color-shared-emphasized-background: #01426a1a;
447
434
  --ds-advanced-color-shared-emphasized-background-hover: #01426a33;
448
435
  --ds-advanced-color-shared-scrim: #00000080;
449
436
  --ds-advanced-color-shared-text-accent: #2875b5;
450
437
  --ds-advanced-color-skeleton-background: #f7f8fa;
451
438
  --ds-advanced-color-skeleton-wave: #e4e8ec;
452
- --ds-advanced-color-state-background-disabled: #dddddd;
439
+ --ds-advanced-color-state-background-disabled: #dbdddd;
453
440
  --ds-advanced-color-state-background-hover: #00000014;
454
441
  --ds-advanced-color-state-background-inverse-disabled: #ffffff66;
455
442
  --ds-advanced-color-state-error-inverse: #f9a4a8;
@@ -477,11 +464,11 @@
477
464
  --ds-advanced-color-switch-track-on-hover: #00274a;
478
465
  --ds-basic-color-border-bold: #585e67;
479
466
  --ds-basic-color-border-brand: #00274a;
480
- --ds-basic-color-border-default: #959595;
467
+ --ds-basic-color-border-default: #949595;
481
468
  --ds-basic-color-border-divider: #00000026;
482
469
  --ds-basic-color-border-divider-inverse: #ffffff66;
483
470
  --ds-basic-color-border-inverse: #ffffff;
484
- --ds-basic-color-border-subtle: #dddddd;
471
+ --ds-basic-color-border-subtle: #dbdddd;
485
472
  --ds-basic-color-brand-primary: #01426a;
486
473
  --ds-basic-color-brand-primary-bold: #00274a;
487
474
  --ds-basic-color-brand-primary-muted: #ebf3f9;
@@ -494,44 +481,24 @@
494
481
  --ds-basic-color-brand-tertiary-bold: #7daf3b;
495
482
  --ds-basic-color-brand-tertiary-muted: #eaf3dd;
496
483
  --ds-basic-color-brand-tertiary-subtle: #c9e1a7;
497
- --ds-basic-color-fare-alaska-basic-economy-bold: #096173;
498
- --ds-basic-color-fare-alaska-basic-economy-default: #97eaf8;
499
- --ds-basic-color-fare-alaska-basic-economy-subtle: #ebfafd;
500
- --ds-basic-color-fare-alaska-economy-bold: #005fa7;
501
- --ds-basic-color-fare-alaska-economy-default: #289bee;
502
- --ds-basic-color-fare-alaska-economy-subtle: #ebf7ff;
503
- --ds-basic-color-fare-alaska-economy-extra-legroom-bold: #265688;
504
- --ds-basic-color-fare-alaska-economy-extra-legroom-default: #265688;
505
- --ds-basic-color-fare-alaska-economy-extra-legroom-subtle: #ebf3f9;
506
- --ds-basic-color-fare-alaska-first-business-bold: #005154;
507
- --ds-basic-color-fare-alaska-first-business-default: #005154;
508
- --ds-basic-color-fare-alaska-first-business-gradient-back: #00274a;
509
- --ds-basic-color-fare-alaska-first-business-gradient-front: #005154;
510
- --ds-basic-color-fare-alaska-first-business-subtle: #e9f1f1;
511
- --ds-basic-color-fare-alaska-premium-economy-bold: #00274a;
512
- --ds-basic-color-fare-alaska-premium-economy-default: #00274a;
513
- --ds-basic-color-fare-alaska-premium-economy-subtle: #ecf0f3;
484
+ --ds-basic-color-fare-basic-economy-bold: #096173;
485
+ --ds-basic-color-fare-basic-economy-default: #97eaf8;
486
+ --ds-basic-color-fare-basic-economy-subtle: #ebfafd;
514
487
  --ds-basic-color-fare-basiceconomy: #97eaf8;
515
488
  --ds-basic-color-fare-business: #005154;
516
489
  --ds-basic-color-fare-economy: #0074ca;
490
+ --ds-basic-color-fare-economy-extra-legroom-bold: #265688;
491
+ --ds-basic-color-fare-economy-extra-legroom-default: #265688;
492
+ --ds-basic-color-fare-economy-extra-legroom-subtle: #ebf3f9;
517
493
  --ds-basic-color-fare-first: #005154;
518
- --ds-basic-color-fare-hawaiian-basic-economy-bold: #515252;
519
- --ds-basic-color-fare-hawaiian-basic-economy-default: #ced0d0;
520
- --ds-basic-color-fare-hawaiian-basic-economy-subtle: #f5f7f7;
521
- --ds-basic-color-fare-hawaiian-economy-bold: #1b6976;
522
- --ds-basic-color-fare-hawaiian-economy-default: #00a5ba;
523
- --ds-basic-color-fare-hawaiian-economy-subtle: #ecf6f8;
524
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-bold: #a91770;
525
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-default: #ce0c88;
526
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-subtle: #fdf1f8;
527
- --ds-basic-color-fare-hawaiian-first-business-bold: #463c8f;
528
- --ds-basic-color-fare-hawaiian-first-business-default: #463c8f;
529
- --ds-basic-color-fare-hawaiian-first-business-gradient-back: #ce0c88;
530
- --ds-basic-color-fare-hawaiian-first-business-gradient-front: #463c8f;
531
- --ds-basic-color-fare-hawaiian-first-business-subtle: #edeaf4;
532
- --ds-basic-color-fare-hawaiian-premium-economy-bold: #831a57;
533
- --ds-basic-color-fare-hawaiian-premium-economy-default: #831a57;
534
- --ds-basic-color-fare-hawaiian-premium-economy-subtle: #fdf1f8;
494
+ --ds-basic-color-fare-first-business-bold: #005154;
495
+ --ds-basic-color-fare-first-business-default: #005154;
496
+ --ds-basic-color-fare-first-business-gradient-back: #00274a;
497
+ --ds-basic-color-fare-first-business-gradient-front: #005154;
498
+ --ds-basic-color-fare-first-business-subtle: #e9f1f1;
499
+ --ds-basic-color-fare-premium-economy-bold: #00274a;
500
+ --ds-basic-color-fare-premium-economy-default: #00274a;
501
+ --ds-basic-color-fare-premium-economy-subtle: #ecf0f3;
535
502
  --ds-basic-color-fare-premiumeconomy: #265688;
536
503
  --ds-basic-color-fare-suites-back: #00274a;
537
504
  --ds-basic-color-fare-suites-front: #005154;
@@ -554,12 +521,12 @@
554
521
  --ds-basic-color-surface-default: #ffffff;
555
522
  --ds-basic-color-surface-inverse: #00274a;
556
523
  --ds-basic-color-surface-inverse-subtle: #2875b5;
557
- --ds-basic-color-surface-neutral: #f2f2f2;
558
- --ds-basic-color-surface-neutral-medium: #c5c5c5;
559
- --ds-basic-color-surface-neutral-subtle: #f7f7f7;
524
+ --ds-basic-color-surface-neutral: #f1f3f3;
525
+ --ds-basic-color-surface-neutral-medium: #c3c5c5;
526
+ --ds-basic-color-surface-neutral-subtle: #f5f7f7;
560
527
  --ds-basic-color-texticon-accent1: #01426a;
561
528
  --ds-basic-color-texticon-default: #2a2a2a;
562
- --ds-basic-color-texticon-disabled: #d0d0d0;
529
+ --ds-basic-color-texticon-disabled: #ced0d0;
563
530
  --ds-basic-color-texticon-inverse: #ffffff;
564
531
  --ds-basic-color-texticon-inverse-disabled: #7e8894;
565
532
  --ds-basic-color-texticon-inverse-muted: #ccd2db;
@@ -567,7 +534,7 @@
567
534
  --ds-basic-color-texticon-link-hover: #01426a;
568
535
  --ds-basic-color-texticon-link-inverse-default: #ffffff;
569
536
  --ds-basic-color-texticon-link-inverse-hover: #ebf3f9;
570
- --ds-basic-color-texticon-muted: #676767;
537
+ --ds-basic-color-texticon-muted: #666767;
571
538
  --ds-basic-color-tier-program-loungetier-lounge: #01426a;
572
539
  --ds-basic-color-tier-program-loungetier-loungeplus: #53b390;
573
540
  --ds-basic-color-tier-program-loyaltytier-gold: #fbdc7a;
@@ -581,6 +548,10 @@
581
548
  --ds-basic-color-tier-program-oneworld-emerald: #139142;
582
549
  --ds-basic-color-tier-program-oneworld-ruby: #a41d4a;
583
550
  --ds-basic-color-tier-program-oneworld-sapphire: #015daa;
551
+ }
552
+
553
+ [data-aag-theme="aag-theme-as"],
554
+ [data-aag-theme="aag-theme-as-type"] {
584
555
  --ds-basic-type-brand-family-primary: "AS Circular";
585
556
  --ds-basic-type-brand-family-secondary: "Good OT";
586
557
  --ds-basic-type-brand-letter-spacing-primary: 0;
@@ -619,7 +590,8 @@
619
590
  --ds-basic-type-weight-heading2: 450;
620
591
  }
621
592
 
622
- [data-aag-theme="aag-theme-ha"] {
593
+ [data-aag-theme="aag-theme-ha"],
594
+ [data-aag-theme="aag-theme-ha-color"] {
623
595
  --ds-advanced-color-accents-accent1: #8ec891;
624
596
  --ds-advanced-color-accents-accent1-bold: #5db060;
625
597
  --ds-advanced-color-accents-accent1-muted: #d2e9d4;
@@ -633,7 +605,7 @@
633
605
  --ds-advanced-color-accents-accent4-bold: #00a5ba;
634
606
  --ds-advanced-color-accents-accent4-muted: #cbe6ec;
635
607
  --ds-advanced-color-accents-default: #463c8f;
636
- --ds-advanced-color-accents-default-inverse: #edeaf4;
608
+ --ds-advanced-color-accents-default-inverse: #eae5f4;
637
609
  --ds-advanced-color-accents-transparency: #0000001a;
638
610
  --ds-advanced-color-accents-transparency-inverse: #ffffff33;
639
611
  --ds-advanced-color-avatar-gradient-bottom: #c0ccf1;
@@ -646,7 +618,7 @@
646
618
  --ds-advanced-color-boolean-indicator: #ffffff;
647
619
  --ds-advanced-color-boolean-indicator-inverse: #463c8f;
648
620
  --ds-advanced-color-boolean-isfalse: #ffffff;
649
- --ds-advanced-color-boolean-isfalse-border: #adadad;
621
+ --ds-advanced-color-boolean-isfalse-border: #abadad;
650
622
  --ds-advanced-color-boolean-isfalse-border-inverse: #ffffff;
651
623
  --ds-advanced-color-boolean-isfalse-hover: #0000000d;
652
624
  --ds-advanced-color-boolean-isfalse-inverse: #ffffff26;
@@ -655,16 +627,16 @@
655
627
  --ds-advanced-color-boolean-istrue-hover: #31295c;
656
628
  --ds-advanced-color-boolean-istrue-inverse: #ffffff;
657
629
  --ds-advanced-color-boolean-istrue-inverse-hover: #ffffffb2;
658
- --ds-advanced-color-button-flat-text: #676767;
659
- --ds-advanced-color-button-flat-text-disabled: #d0d0d0;
660
- --ds-advanced-color-button-flat-text-hover: #525252;
630
+ --ds-advanced-color-button-flat-text: #666767;
631
+ --ds-advanced-color-button-flat-text-disabled: #ced0d0;
632
+ --ds-advanced-color-button-flat-text-hover: #515252;
661
633
  --ds-advanced-color-button-flat-text-inverse: #ffffff;
662
634
  --ds-advanced-color-button-flat-text-inverse-disabled: #7e8894;
663
- --ds-advanced-color-button-flat-text-inverse-hover: #adadad;
635
+ --ds-advanced-color-button-flat-text-inverse-hover: #abadad;
664
636
  --ds-advanced-color-button-ghost-background-hover: #0000000d;
665
637
  --ds-advanced-color-button-ghost-background-inverse-hover: #ffffff0d;
666
638
  --ds-advanced-color-button-ghost-text: #ce0c88;
667
- --ds-advanced-color-button-ghost-text-disabled: #d0d0d0;
639
+ --ds-advanced-color-button-ghost-text-disabled: #ced0d0;
668
640
  --ds-advanced-color-button-ghost-text-inverse: #ffffff;
669
641
  --ds-advanced-color-button-ghost-text-inverse-disabled: #7e8894;
670
642
  --ds-advanced-color-button-primary-background: #ce0c88;
@@ -685,14 +657,14 @@
685
657
  --ds-advanced-color-button-primary-text-disabled: #ffffff;
686
658
  --ds-advanced-color-button-primary-text-inverse: #ce0c88;
687
659
  --ds-advanced-color-button-secondary-background: #ffffff;
688
- --ds-advanced-color-button-secondary-background-disabled: #f7f7f7;
660
+ --ds-advanced-color-button-secondary-background-disabled: #f5f7f7;
689
661
  --ds-advanced-color-button-secondary-background-hover: #0000000d;
690
662
  --ds-advanced-color-button-secondary-background-inverse-hover: #0000000d;
691
663
  --ds-advanced-color-button-secondary-border: #ce0c88;
692
- --ds-advanced-color-button-secondary-border-disabled: #f7f7f7;
664
+ --ds-advanced-color-button-secondary-border-disabled: #f5f7f7;
693
665
  --ds-advanced-color-button-secondary-border-hover: #831a57;
694
666
  --ds-advanced-color-button-secondary-border-inverse: #ffffff;
695
- --ds-advanced-color-button-secondary-border-inverse-disabled: #dddddd;
667
+ --ds-advanced-color-button-secondary-border-inverse-disabled: #dbdddd;
696
668
  --ds-advanced-color-button-secondary-text: #ce0c88;
697
669
  --ds-advanced-color-button-secondary-text-hover: #831a57;
698
670
  --ds-advanced-color-button-secondary-text-inverse: #ffffff;
@@ -703,11 +675,11 @@
703
675
  --ds-advanced-color-button-tertiary-text: #ce0c88;
704
676
  --ds-advanced-color-button-tertiary-text-hover: #831a57;
705
677
  --ds-advanced-color-button-tertiary-text-inverse: #ffffff;
706
- --ds-advanced-color-dropdown-emphasized-background: #edeaf4;
678
+ --ds-advanced-color-dropdown-emphasized-background: #eae5f4;
707
679
  --ds-advanced-color-dropdown-emphasized-background-hover: #ccc5e0;
708
680
  --ds-advanced-color-expanded-widget-background: linear-gradient(180deg, rgba(38, 32, 67, .65), rgba(38, 32, 67, 0) 65%), linear-gradient(90deg, #463c8f 25.8%, #ce0c88);
709
681
  --ds-advanced-color-flightline-indicator: #463c8f;
710
- --ds-advanced-color-flightline-line: #d0d0d0;
682
+ --ds-advanced-color-flightline-line: #ced0d0;
711
683
  --ds-advanced-color-footer-background: #463c8f;
712
684
  --ds-advanced-color-footer-foreground: #2f2672;
713
685
  --ds-advanced-color-footer-pattern: #0000000d;
@@ -727,7 +699,7 @@
727
699
  --ds-advanced-color-hyperlink-text-inverse-hover: #ffffff;
728
700
  --ds-advanced-color-interactive-background-hover: #00000014;
729
701
  --ds-advanced-color-interactive-background-inverse-hover: #ffffff14;
730
- --ds-advanced-color-interactive-disabled: #dddddd;
702
+ --ds-advanced-color-interactive-disabled: #dbdddd;
731
703
  --ds-advanced-color-interactive-disabled-inverse: #ffffff66;
732
704
  --ds-advanced-color-interactive-error: #e01f26;
733
705
  --ds-advanced-color-interactive-error-hover: #b1161c;
@@ -751,15 +723,15 @@
751
723
  --ds-advanced-color-shared-background-inverse: #ffffff26;
752
724
  --ds-advanced-color-shared-background-inverse-disabled: #ffffff1a;
753
725
  --ds-advanced-color-shared-background-inverse-hover: #ffffff33;
754
- --ds-advanced-color-shared-background-muted: #f7f7f7;
755
- --ds-advanced-color-shared-background-strong: #676767;
756
- --ds-advanced-color-shared-emphasized-background: #edeaf4;
726
+ --ds-advanced-color-shared-background-muted: #f5f7f7;
727
+ --ds-advanced-color-shared-background-strong: #666767;
728
+ --ds-advanced-color-shared-emphasized-background: #eae5f4;
757
729
  --ds-advanced-color-shared-emphasized-background-hover: #ccc5e0;
758
730
  --ds-advanced-color-shared-scrim: #00000080;
759
731
  --ds-advanced-color-shared-text-accent: #463c8f;
760
732
  --ds-advanced-color-skeleton-background: #f7f8fa;
761
733
  --ds-advanced-color-skeleton-wave: #e4e8ec;
762
- --ds-advanced-color-state-background-disabled: #dddddd;
734
+ --ds-advanced-color-state-background-disabled: #dbdddd;
763
735
  --ds-advanced-color-state-background-hover: #00000014;
764
736
  --ds-advanced-color-state-background-inverse-disabled: #ffffff66;
765
737
  --ds-advanced-color-state-error-inverse: #f9a4a8;
@@ -785,16 +757,16 @@
785
757
  --ds-advanced-color-switch-track-off-hover: #00000080;
786
758
  --ds-advanced-color-switch-track-on: #463c8f;
787
759
  --ds-advanced-color-switch-track-on-hover: #31295c;
788
- --ds-basic-color-border-bold: #adadad;
760
+ --ds-basic-color-border-bold: #abadad;
789
761
  --ds-basic-color-border-brand: #463c8f;
790
- --ds-basic-color-border-default: #d0d0d0;
762
+ --ds-basic-color-border-default: #ced0d0;
791
763
  --ds-basic-color-border-divider: #00000026;
792
764
  --ds-basic-color-border-divider-inverse: #ffffff66;
793
765
  --ds-basic-color-border-inverse: #ffffff;
794
- --ds-basic-color-border-subtle: #dddddd;
766
+ --ds-basic-color-border-subtle: #dbdddd;
795
767
  --ds-basic-color-brand-primary: #463c8f;
796
768
  --ds-basic-color-brand-primary-bold: #31295c;
797
- --ds-basic-color-brand-primary-muted: #edeaf4;
769
+ --ds-basic-color-brand-primary-muted: #eae5f4;
798
770
  --ds-basic-color-brand-primary-subtle: #8c7eb8;
799
771
  --ds-basic-color-brand-secondary: #ce0c88;
800
772
  --ds-basic-color-brand-secondary-bold: #831a57;
@@ -804,44 +776,24 @@
804
776
  --ds-basic-color-brand-tertiary-bold: #97322a;
805
777
  --ds-basic-color-brand-tertiary-muted: #ffeeea;
806
778
  --ds-basic-color-brand-tertiary-subtle: #ff9080;
807
- --ds-basic-color-fare-alaska-basic-economy-bold: #096173;
808
- --ds-basic-color-fare-alaska-basic-economy-default: #97eaf8;
809
- --ds-basic-color-fare-alaska-basic-economy-subtle: #ebfafd;
810
- --ds-basic-color-fare-alaska-economy-bold: #005fa7;
811
- --ds-basic-color-fare-alaska-economy-default: #289bee;
812
- --ds-basic-color-fare-alaska-economy-subtle: #ebf7ff;
813
- --ds-basic-color-fare-alaska-economy-extra-legroom-bold: #265688;
814
- --ds-basic-color-fare-alaska-economy-extra-legroom-default: #265688;
815
- --ds-basic-color-fare-alaska-economy-extra-legroom-subtle: #ebf3f9;
816
- --ds-basic-color-fare-alaska-first-business-bold: #005154;
817
- --ds-basic-color-fare-alaska-first-business-default: #005154;
818
- --ds-basic-color-fare-alaska-first-business-gradient-back: #00274a;
819
- --ds-basic-color-fare-alaska-first-business-gradient-front: #005154;
820
- --ds-basic-color-fare-alaska-first-business-subtle: #e9f1f1;
821
- --ds-basic-color-fare-alaska-premium-economy-bold: #00274a;
822
- --ds-basic-color-fare-alaska-premium-economy-default: #00274a;
823
- --ds-basic-color-fare-alaska-premium-economy-subtle: #ecf0f3;
824
- --ds-basic-color-fare-basiceconomy: #d0d0d0;
779
+ --ds-basic-color-fare-basic-economy-bold: #515252;
780
+ --ds-basic-color-fare-basic-economy-default: #ced0d0;
781
+ --ds-basic-color-fare-basic-economy-subtle: #f5f7f7;
782
+ --ds-basic-color-fare-basiceconomy: #ced0d0;
825
783
  --ds-basic-color-fare-business: #463c8f;
826
784
  --ds-basic-color-fare-economy: #00a5ba;
785
+ --ds-basic-color-fare-economy-extra-legroom-bold: #a91770;
786
+ --ds-basic-color-fare-economy-extra-legroom-default: #ce0c88;
787
+ --ds-basic-color-fare-economy-extra-legroom-subtle: #fdf1f8;
827
788
  --ds-basic-color-fare-first: #463c8f;
828
- --ds-basic-color-fare-hawaiian-basic-economy-bold: #515252;
829
- --ds-basic-color-fare-hawaiian-basic-economy-default: #ced0d0;
830
- --ds-basic-color-fare-hawaiian-basic-economy-subtle: #f5f7f7;
831
- --ds-basic-color-fare-hawaiian-economy-bold: #1b6976;
832
- --ds-basic-color-fare-hawaiian-economy-default: #00a5ba;
833
- --ds-basic-color-fare-hawaiian-economy-subtle: #ecf6f8;
834
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-bold: #a91770;
835
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-default: #ce0c88;
836
- --ds-basic-color-fare-hawaiian-economy-extra-legroom-subtle: #fdf1f8;
837
- --ds-basic-color-fare-hawaiian-first-business-bold: #463c8f;
838
- --ds-basic-color-fare-hawaiian-first-business-default: #463c8f;
839
- --ds-basic-color-fare-hawaiian-first-business-gradient-back: #ce0c88;
840
- --ds-basic-color-fare-hawaiian-first-business-gradient-front: #463c8f;
841
- --ds-basic-color-fare-hawaiian-first-business-subtle: #edeaf4;
842
- --ds-basic-color-fare-hawaiian-premium-economy-bold: #831a57;
843
- --ds-basic-color-fare-hawaiian-premium-economy-default: #831a57;
844
- --ds-basic-color-fare-hawaiian-premium-economy-subtle: #fdf1f8;
789
+ --ds-basic-color-fare-first-business-bold: #463c8f;
790
+ --ds-basic-color-fare-first-business-default: #463c8f;
791
+ --ds-basic-color-fare-first-business-gradient-back: #ce0c88;
792
+ --ds-basic-color-fare-first-business-gradient-front: #463c8f;
793
+ --ds-basic-color-fare-first-business-subtle: #eae5f4;
794
+ --ds-basic-color-fare-premium-economy-bold: #831a57;
795
+ --ds-basic-color-fare-premium-economy-default: #831a57;
796
+ --ds-basic-color-fare-premium-economy-subtle: #fdf1f8;
845
797
  --ds-basic-color-fare-premiumeconomy: #ce0c88;
846
798
  --ds-basic-color-fare-suites-back: #ce0c88;
847
799
  --ds-basic-color-fare-suites-front: #463c8f;
@@ -857,19 +809,19 @@
857
809
  --ds-basic-color-status-warning: #fac200;
858
810
  --ds-basic-color-status-warning-subtle: #fff6d2;
859
811
  --ds-basic-color-surface-accent1: #aca1cc;
860
- --ds-basic-color-surface-accent1-muted: #edeaf4;
812
+ --ds-basic-color-surface-accent1-muted: #eae5f4;
861
813
  --ds-basic-color-surface-accent1-subtle: #aca1cc;
862
- --ds-basic-color-surface-accent2: #f7f7f7;
863
- --ds-basic-color-surface-accent2-muted: #f7f7f7;
814
+ --ds-basic-color-surface-accent2: #f5f7f7;
815
+ --ds-basic-color-surface-accent2-muted: #f5f7f7;
864
816
  --ds-basic-color-surface-default: #ffffff;
865
817
  --ds-basic-color-surface-inverse: #463c8f;
866
818
  --ds-basic-color-surface-inverse-subtle: #8c7eb8;
867
- --ds-basic-color-surface-neutral: #f2f2f2;
868
- --ds-basic-color-surface-neutral-medium: #dddddd;
869
- --ds-basic-color-surface-neutral-subtle: #f7f7f7;
819
+ --ds-basic-color-surface-neutral: #f1f3f3;
820
+ --ds-basic-color-surface-neutral-medium: #dbdddd;
821
+ --ds-basic-color-surface-neutral-subtle: #f5f7f7;
870
822
  --ds-basic-color-texticon-accent1: #000000;
871
823
  --ds-basic-color-texticon-default: #000000;
872
- --ds-basic-color-texticon-disabled: #d0d0d0;
824
+ --ds-basic-color-texticon-disabled: #ced0d0;
873
825
  --ds-basic-color-texticon-inverse: #ffffff;
874
826
  --ds-basic-color-texticon-inverse-disabled: #7e8894;
875
827
  --ds-basic-color-texticon-inverse-muted: #ccd2db;
@@ -877,7 +829,7 @@
877
829
  --ds-basic-color-texticon-link-hover: #831a57;
878
830
  --ds-basic-color-texticon-link-inverse-default: #ffffff;
879
831
  --ds-basic-color-texticon-link-inverse-hover: #ffffff;
880
- --ds-basic-color-texticon-muted: #3d3d3d;
832
+ --ds-basic-color-texticon-muted: #3c3d3d;
881
833
  --ds-basic-color-tier-program-loungetier-lounge: #01426a;
882
834
  --ds-basic-color-tier-program-loungetier-loungeplus: #53b390;
883
835
  --ds-basic-color-tier-program-loyaltytier-gold: #fbdc7a;
@@ -891,6 +843,10 @@
891
843
  --ds-basic-color-tier-program-oneworld-emerald: #139142;
892
844
  --ds-basic-color-tier-program-oneworld-ruby: #a41d4a;
893
845
  --ds-basic-color-tier-program-oneworld-sapphire: #015daa;
846
+ }
847
+
848
+ [data-aag-theme="aag-theme-ha"],
849
+ [data-aag-theme="aag-theme-ha-type"] {
894
850
  --ds-basic-type-brand-family-primary: "Slate Pro";
895
851
  --ds-basic-type-brand-family-secondary: "Chronicle Display";
896
852
  --ds-basic-type-brand-letter-spacing-primary: 0;