@bspk/ui 1.4.0 → 1.4.1

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 (24) hide show
  1. package/dist/components/StylesProviderDemo/brandsCss.js +10 -10
  2. package/dist/components/StylesProviderDemo/brandsCss.js.map +1 -1
  3. package/dist/styles/agent-workplace.css +307 -301
  4. package/dist/styles/agent-workplace.css.js +307 -301
  5. package/dist/styles/anywhere.css +305 -299
  6. package/dist/styles/anywhere.css.js +305 -299
  7. package/dist/styles/better-homes-gardens.css +200 -350
  8. package/dist/styles/better-homes-gardens.css.js +200 -350
  9. package/dist/styles/broker-workplace.css +315 -309
  10. package/dist/styles/broker-workplace.css.js +315 -309
  11. package/dist/styles/cartus.css +288 -282
  12. package/dist/styles/cartus.css.js +288 -282
  13. package/dist/styles/century-21.css +312 -306
  14. package/dist/styles/century-21.css.js +312 -306
  15. package/dist/styles/coldwell-banker.css +283 -277
  16. package/dist/styles/coldwell-banker.css.js +283 -277
  17. package/dist/styles/corcoran.css +283 -277
  18. package/dist/styles/corcoran.css.js +283 -277
  19. package/dist/styles/era.css +290 -284
  20. package/dist/styles/era.css.js +290 -284
  21. package/dist/styles/sothebys.css +282 -276
  22. package/dist/styles/sothebys.css.js +282 -276
  23. package/package.json +2 -2
  24. package/src/components/StylesProviderDemo/brandsCss.ts +10 -10
package/dist/styles/agent-workplace.css.js CHANGED
@@ -455,6 +455,8 @@ body {
455
455
  --corner-radius-80: 8px;
456
456
  /* Corner radius/circular - Global (primitives) */
457
457
  --corner-radius-circular: 999px;
458
+ /* Corner radius/None - Global (primitives) */
459
+ --corner-radius-none: 0;
458
460
  /* East - navigation rails, drawers, sheets */
459
461
  --drop-shadow-east: 2px 0px 8px -2px #0000001a, 2px 0px 4px -2px #0000001f;
460
462
  /* Float */
@@ -493,25 +495,25 @@ body {
493
495
  --interactions-opacity-white-6: #ffffff0f;
494
496
  /* Interactions/opacity-white-8 - Global (primitives) */
495
497
  --interactions-opacity-white-8: #ffffff14;
496
- /* Colors/Brands/Agent Workplace/Interactions/primary-dark-opacity-10 - Global (primitives) */
498
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-10 - Global (primitives) */
497
499
  --interactions-primary-dark-opacity-10: #7574821a;
498
- /* Colors/Brands/Agent Workplace/Interactions/primary-dark-opacity-12 - Global (primitives) */
500
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-12 - Global (primitives) */
499
501
  --interactions-primary-dark-opacity-12: #7574821f;
500
- /* Colors/Brands/Agent Workplace/Interactions/primary-dark-opacity-16 - Global (primitives) */
502
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-16 - Global (primitives) */
501
503
  --interactions-primary-dark-opacity-16: #75748229;
502
- /* Colors/Brands/Agent Workplace/Interactions/primary-dark-opacity-20 - Global (primitives) */
504
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-20 - Global (primitives) */
503
505
  --interactions-primary-dark-opacity-20: #75748233;
504
- /* Colors/Brands/Agent Workplace/Interactions/primary-dark-opacity-8 - Global (primitives) */
506
+ /* Colors/Brands/BRAND/Interactions/primary-dark-opacity-8 - Global (primitives) */
505
507
  --interactions-primary-dark-opacity-8: #75748214;
506
- /* Colors/Brands/Agent Workplace/Interactions/primary-light-opacity-10 - Global (primitives) */
508
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-10 - Global (primitives) */
507
509
  --interactions-primary-light-opacity-10: #19172f1a;
508
- /* Colors/Brands/Agent Workplace/Interactions/primary-light-opacity-12 - Global (primitives) */
510
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-12 - Global (primitives) */
509
511
  --interactions-primary-light-opacity-12: #19172f1f;
510
- /* Colors/Brands/Agent Workplace/Interactions/primary-light-opacity-16 - Global (primitives) */
512
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-16 - Global (primitives) */
511
513
  --interactions-primary-light-opacity-16: #19172f29;
512
- /* Colors/Brands/Agent Workplace/Interactions/primary-light-opacity-20 - Global (primitives) */
514
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-20 - Global (primitives) */
513
515
  --interactions-primary-light-opacity-20: #19172f33;
514
- /* Colors/Brands/Agent Workplace/Interactions/primary-light-opacity-8 - Global (primitives) */
516
+ /* Colors/Brands/BRAND/Interactions/primary-light-opacity-8 - Global (primitives) */
515
517
  --interactions-primary-light-opacity-8: #19172f14;
516
518
  /* Labels/Base */
517
519
  --labels-base: 500 16px/24px var(--typeface);
@@ -545,17 +547,17 @@ body {
545
547
  --labels-x-small-size: 12px;
546
548
  /* Labels/X-Small - style */
547
549
  --labels-x-small-style: medium;
548
- /* Colors/Brands/Agent Workplace/Primary/00-base - Global (primitives) */
550
+ /* Colors/Brands/BRAND/Primary/00-base - Global (primitives) */
549
551
  --primary-00-base: #19172f;
550
- /* Colors/Brands/Agent Workplace/Primary/15-dark - Global (primitives) */
552
+ /* Colors/Brands/BRAND/Primary/15-dark - Global (primitives) */
551
553
  --primary-15-dark: #151428;
552
- /* Colors/Brands/Agent Workplace/Primary/40-light - Global (primitives) */
554
+ /* Colors/Brands/BRAND/Primary/40-light - Global (primitives) */
553
555
  --primary-40-light: #757482;
554
- /* Colors/Brands/Agent Workplace/Primary/55-light - Global (primitives) */
556
+ /* Colors/Brands/BRAND/Primary/55-light - Global (primitives) */
555
557
  --primary-55-light: #9897a1;
556
- /* Colors/Brands/Agent Workplace/Primary/75-dark - Global (primitives) */
558
+ /* Colors/Brands/BRAND/Primary/75-dark - Global (primitives) */
557
559
  --primary-75-dark: #06060c;
558
- /* Colors/Brands/Agent Workplace/Primary/85-light - Global (primitives) */
560
+ /* Colors/Brands/BRAND/Primary/85-light - Global (primitives) */
559
561
  --primary-85-light: #dddce0;
560
562
  /* Radius/full - Borders */
561
563
  --radius-full: 999px;
@@ -563,21 +565,23 @@ body {
563
565
  --radius-lg: 12px;
564
566
  /* Radius/md - Borders */
565
567
  --radius-md: 8px;
568
+ /* Radius/none - Borders */
569
+ --radius-none: 0;
566
570
  /* Radius/sm - Borders */
567
571
  --radius-sm: 4px;
568
572
  /* Radius/xlg - Borders */
569
573
  --radius-xlg: 16px;
570
- /* Colors/Brands/Agent Workplace/Secondary/00-base - Global (primitives) */
574
+ /* Colors/Brands/BRAND/Secondary/00-base - Global (primitives) */
571
575
  --secondary-00-base: #eb672f;
572
- /* Colors/Brands/Agent Workplace/Secondary/15-dark - Global (primitives) */
576
+ /* Colors/Brands/BRAND/Secondary/15-dark - Global (primitives) */
573
577
  --secondary-15-dark: #c85828;
574
- /* Colors/Brands/Agent Workplace/Secondary/40-light - Global (primitives) */
578
+ /* Colors/Brands/BRAND/Secondary/40-light - Global (primitives) */
575
579
  --secondary-40-light: #f3a482;
576
- /* Colors/Brands/Agent Workplace/Secondary/55-light - Global (primitives) */
580
+ /* Colors/Brands/BRAND/Secondary/55-light - Global (primitives) */
577
581
  --secondary-55-light: #f6bba1;
578
- /* Colors/Brands/Agent Workplace/Secondary/75-dark - Global (primitives) */
582
+ /* Colors/Brands/BRAND/Secondary/75-dark - Global (primitives) */
579
583
  --secondary-75-dark: #3b1a0c;
580
- /* Colors/Brands/Agent Workplace/Secondary/85-light - Global (primitives) */
584
+ /* Colors/Brands/BRAND/Secondary/85-light - Global (primitives) */
581
585
  --secondary-85-light: #fce8e0;
582
586
  /* Shadows/Inner-Shadow-black-100 - Global (primitives) */
583
587
  --shadows-inner-shadow-black-100: #000000;
@@ -657,6 +661,8 @@ body {
657
661
  --spacing-sizing-24: 148px;
658
662
  /* Spacing/sizing-25 - Spacing & Sizing */
659
663
  --spacing-sizing-25: 152px;
664
+ /* Spacing/sizing-none - Spacing & Sizing */
665
+ --spacing-sizing-none: 0;
660
666
  /* Spacings/1040 - Global (primitives) */
661
667
  --spacings-1040: 104px;
662
668
  /* Spacings/120 - Global (primitives) */
@@ -707,6 +713,10 @@ body {
707
713
  --spacings-800: 80px;
708
714
  /* Spacings/960 - Global (primitives) */
709
715
  --spacings-960: 96px;
716
+ /* Spacings/None - Global (primitives) */
717
+ --spacings-none: 0;
718
+ /* Stroke/none - Borders */
719
+ --stroke-none: 0;
710
720
  /* Stroke/thick - Borders */
711
721
  --stroke-thick: 2px;
712
722
  /* Stroke/thicker - Borders */
@@ -714,7 +724,7 @@ body {
714
724
  /* Stroke/thin - Borders */
715
725
  --stroke-thin: 1px;
716
726
  /* Typeface - Brand */
717
- --typeface: 'Inter';
727
+ --typeface: 'Inter', sans-serif;
718
728
  /* Typography/Line-height/lh-1 - Global (primitives) */
719
729
  --typography-line-height-lh-1: 16px;
720
730
  /* Typography/Line-height/lh-10 - Global (primitives) */
@@ -946,11 +956,11 @@ body {
946
956
  /* Mobile/Subheader/XXX-Large - Large Headline style */
947
957
  --subheader-xxx-large-style: regular;
948
958
  /* light theme (default) */
949
- /* Background/base - Brand */
959
+ /* Background/base - Theme - BRAND */
950
960
  --background-base: #ffffff;
951
- /* Background/scrim - Theme - Agent Workplace */
961
+ /* Background/scrim - Theme - BRAND */
952
962
  --background-scrim: #00000040;
953
- /* Background/shade - Brand */
963
+ /* Background/shade - Theme - BRAND */
954
964
  --background-shade: #f5f5f5;
955
965
  /* Data visual/category-01 - Brand */
956
966
  --data-visual-category-01: #d67e51;
@@ -980,39 +990,39 @@ body {
980
990
  --data-visual-category-07: #530909;
981
991
  /* Data visual/category-07-highlight - Brand */
982
992
  --data-visual-category-07-highlight: #5309094d;
983
- /* Data visual/category-1 - Theme - Better Home & Garden */
984
- --data-visual-category-1: #0a466c;
985
- /* Data visual/category-1-highlight - Theme - Agent Workplace */
986
- --data-visual-category-1-highlight: #0a466c4d;
987
- /* Data visual/category-2 - Theme - Better Home & Garden */
988
- --data-visual-category-2: #299de0;
989
- /* Data visual/category-2-highlight - Theme - Agent Workplace */
990
- --data-visual-category-2-highlight: #299de04d;
991
- /* Data visual/category-3 - Theme - Better Home & Garden */
992
- --data-visual-category-3: #130033;
993
- /* Data visual/category-3-highlight - Theme - Agent Workplace */
994
- --data-visual-category-3-highlight: #1300334d;
995
- /* Data visual/category-4 - Theme - Better Home & Garden */
996
- --data-visual-category-4: #389e7a;
997
- /* Data visual/category-4-highlight - Theme - Agent Workplace */
998
- --data-visual-category-4-highlight: #389e7a4d;
999
- /* Data visual/category-5 - Theme - Better Home & Garden */
1000
- --data-visual-category-5: #094a53;
1001
- /* Data visual/category-5-highlight - Theme - Agent Workplace */
1002
- --data-visual-category-5-highlight: #094a534d;
1003
- /* Data visual/category-6 - Theme - Better Home & Garden */
993
+ /* Data visual/category-1 - Theme - BRAND */
994
+ --data-visual-category-1: #7a2a0b;
995
+ /* Data visual/category-1-highlight - Theme - BRAND */
996
+ --data-visual-category-1-highlight: #7a2a0b4d;
997
+ /* Data visual/category-2 - Theme - BRAND */
998
+ --data-visual-category-2: #d67e51;
999
+ /* Data visual/category-2-highlight - Theme - BRAND */
1000
+ --data-visual-category-2-highlight: #d67e514d;
1001
+ /* Data visual/category-3 - Theme - BRAND */
1002
+ --data-visual-category-3: #2d3300;
1003
+ /* Data visual/category-3-highlight - Theme - BRAND */
1004
+ --data-visual-category-3-highlight: #2d33004d;
1005
+ /* Data visual/category-4 - Theme - BRAND */
1006
+ --data-visual-category-4: #ab922b;
1007
+ /* Data visual/category-4-highlight - Theme - BRAND */
1008
+ --data-visual-category-4-highlight: #ab922b4d;
1009
+ /* Data visual/category-5 - Theme - BRAND */
1010
+ --data-visual-category-5: #530909;
1011
+ /* Data visual/category-5-highlight - Theme - BRAND */
1012
+ --data-visual-category-5-highlight: #5309094d;
1013
+ /* Data visual/category-6 - Theme - BRAND */
1004
1014
  --data-visual-category-6: #7f7f7f;
1005
- /* Data visual/category-6-highlight - Theme - Agent Workplace */
1015
+ /* Data visual/category-6-highlight - Theme - BRAND */
1006
1016
  --data-visual-category-6-highlight: #7f7f7f4d;
1007
- /* Data visual/category-7 - Theme - Better Home & Garden */
1008
- --data-visual-category-7: #433479;
1009
- /* Data visual/category-7-highlight - Theme - Agent Workplace */
1010
- --data-visual-category-7-highlight: #4334794d;
1011
- /* Data visual/gradient-end - Theme - Agent Workplace */
1017
+ /* Data visual/category-7 - Theme - BRAND */
1018
+ --data-visual-category-7: #794b34;
1019
+ /* Data visual/category-7-highlight - Theme - BRAND */
1020
+ --data-visual-category-7-highlight: #794b344d;
1021
+ /* Data visual/gradient-end - Theme - BRAND */
1012
1022
  --data-visual-gradient-end: #ffffff4d;
1013
- /* Data visual/green - Theme - Agent Workplace */
1023
+ /* Data visual/green - Theme - BRAND */
1014
1024
  --data-visual-green: #258750;
1015
- /* Data visual/green-highlight - Theme - Agent Workplace */
1025
+ /* Data visual/green-highlight - Theme - BRAND */
1016
1026
  --data-visual-green-highlight: #deede5;
1017
1027
  /* Data visual/negative - Brand */
1018
1028
  --data-visual-negative: #d83a52;
@@ -1022,113 +1032,113 @@ body {
1022
1032
  --data-visual-positive: #258750;
1023
1033
  /* Data visual/positive-highlight - Brand */
1024
1034
  --data-visual-positive-highlight: #deede5;
1025
- /* Data visual/red - Theme - Agent Workplace */
1035
+ /* Data visual/red - Theme - BRAND */
1026
1036
  --data-visual-red: #d83a52;
1027
- /* Data visual/red-highlight - Theme - Agent Workplace */
1037
+ /* Data visual/red-highlight - Theme - BRAND */
1028
1038
  --data-visual-red-highlight: #f9e1e5;
1029
- /* Foreground/AI-powered/blue - Theme - Agent Workplace */
1039
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1030
1040
  --foreground-ai-powered-blue: #215ecd;
1031
- /* Foreground/AI-powered/pink - Theme - Agent Workplace */
1041
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1032
1042
  --foreground-ai-powered-pink: #c60ede;
1033
- /* Foreground/Brand/on-inverse-primary - Theme - Agent Workplace */
1043
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1034
1044
  --foreground-brand-on-inverse-primary: #757482;
1035
- /* Foreground/Brand/on-inverse-secondary - Theme - Agent Workplace */
1045
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1036
1046
  --foreground-brand-on-inverse-secondary: #f3a482;
1037
- /* Foreground/Brand/on-brand-primary - Brand */
1047
+ /* Foreground/Brand/on-brand-primary - Theme - BRAND */
1038
1048
  /* Foreground color used on Brand's primary color (non neutral color) */
1039
1049
  --foreground-brand-on-primary: #ffffff;
1040
- /* Foreground/Brand/on-brand-secondary - Brand */
1050
+ /* Foreground/Brand/on-brand-secondary - Theme - BRAND */
1041
1051
  /* Foreground color used on Brand's primary color (non neutral color) */
1042
1052
  --foreground-brand-on-secondary: #ffffff;
1043
- /* Foreground/Brand/brand-primary - Brand */
1053
+ /* Foreground/Brand/brand-primary - Theme - BRAND */
1044
1054
  /* Foreground text and icons that match the brand's primary color */
1045
1055
  --foreground-brand-primary: #19172f;
1046
- /* Foreground/Brand/brand-primary-depth - Theme - Better Home & Garden */
1047
- --foreground-brand-primary-depth: #217221;
1048
- /* Foreground/Brand/brand-secondary - Brand */
1056
+ /* Foreground/Brand/brand-primary-depth - Theme - BRAND */
1057
+ --foreground-brand-primary-depth: #151428;
1058
+ /* Foreground/Brand/brand-secondary - Theme - BRAND */
1049
1059
  /* Foreground text and icons that match the brand's secondary color */
1050
1060
  --foreground-brand-secondary: #eb672f;
1051
- /* Foreground/Brand/brand-secondary-depth - Theme - Agent Workplace */
1061
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1052
1062
  --foreground-brand-secondary-depth: #c85828;
1053
- /* Foreground/Link text/default - Brand */
1063
+ /* Foreground/Link text/default - Theme - BRAND */
1054
1064
  --foreground-link-text-default: #215ecd;
1055
- /* Foreground/Link text/default-disabled - Brand */
1065
+ /* Foreground/Link text/default-disabled - Theme - BRAND */
1056
1066
  --foreground-link-text-default-disabled: #7a9ee1;
1057
- /* Foreground/Link text/default-hovered - Theme - Agent Workplace */
1067
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1058
1068
  --foreground-link-text-default-hovered: #1e55b9;
1059
- /* Foreground/Link text/default-pressed - Theme - Agent Workplace */
1069
+ /* Foreground/Link text/default-pressed - Theme - BRAND */
1060
1070
  --foreground-link-text-default-pressed: #1a4ba4;
1061
- /* Foreground/Link text/default-visited - Brand */
1071
+ /* Foreground/Link text/default-visited - Theme - BRAND */
1062
1072
  --foreground-link-text-default-visited: #7a3e7a;
1063
1073
  /* Foreground/Link text/subtle-disabled - Brand */
1064
1074
  --foreground-link-text-subtle-disabled: #bdbdbd;
1065
- /* Foreground/Link text/subtle-hovered - Theme - Agent Workplace */
1075
+ /* Foreground/Link text/subtle-hovered - Theme - BRAND */
1066
1076
  --foreground-link-text-subtle-hovered: #292929;
1067
- /* Foreground/Link text/subtle-inverse-hovered - Theme - Agent Workplace */
1077
+ /* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
1068
1078
  --foreground-link-text-subtle-inverse-hovered: #e6e6e6;
1069
- /* Foreground/Link text/subtle-inverse-pressed - Theme - Agent Workplace */
1079
+ /* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
1070
1080
  --foreground-link-text-subtle-inverse-pressed: #d1d1d1;
1071
1081
  /* Foreground/Link text/subtle-inversed-disabled - Brand */
1072
1082
  --foreground-link-text-subtle-inversed-disabled: #757575;
1073
- /* Foreground/Link text/subtle-pressed - Theme - Agent Workplace */
1083
+ /* Foreground/Link text/subtle-pressed - Theme - BRAND */
1074
1084
  --foreground-link-text-subtle-pressed: #3d3d3d;
1075
- /* Foreground/Neutral/disabled-on-color-surface - Brand */
1085
+ /* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
1076
1086
  --foreground-neutral-disabled-on-color-surface: #757575;
1077
- /* Foreground/Neutral/disabled-on-surface - Brand */
1087
+ /* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
1078
1088
  --foreground-neutral-disabled-on-surface: #bdbdbd;
1079
- /* Foreground/Neutral/inverse-on-surface - Theme - Agent Workplace */
1089
+ /* Foreground/Neutral/inverse-on-surface - Theme - BRAND */
1080
1090
  --foreground-neutral-inverse-on-surface: #fafafa;
1081
- /* Foreground/Neutral/on-color - Brand */
1091
+ /* Foreground/Neutral/on-color - Theme - BRAND */
1082
1092
  /* Interactive controls */
1083
1093
  --foreground-neutral-on-color: #ffffff;
1084
1094
  /* Foreground/Neutral/on-inverse-surface - Brand */
1085
1095
  /* Text and icons against inverse surface */
1086
1096
  --foreground-neutral-on-inverse-surface: #fafafa;
1087
- /* Foreground/Neutral/on-surface - Brand */
1097
+ /* Foreground/Neutral/on-surface - Theme - BRAND */
1088
1098
  /* Default foreground text and icons against any surface color */
1089
1099
  --foreground-neutral-on-surface: #141414;
1090
- /* Foreground/Neutral/on-surface-variant-01 - Brand */
1100
+ /* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
1091
1101
  /* Secondary foreground color for icons and text */
1092
1102
  --foreground-neutral-on-surface-variant-01: #707070;
1093
- /* Foreground/Neutral/on-surface-variant-02 - Brand */
1103
+ /* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
1094
1104
  /* Tertiary foreground color for icons and text */
1095
1105
  --foreground-neutral-on-surface-variant-02: #757575;
1096
- /* Foreground/Neutral/on-surface-variant-03 - Brand */
1106
+ /* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
1097
1107
  /* Quaternary foreground color for icons and text. Only for placeholder text */
1098
1108
  --foreground-neutral-on-surface-variant-03: #8a8a8a;
1099
- /* Foreground/Neutral/skeleton-element - Brand */
1109
+ /* Foreground/Neutral/skeleton-element - Theme - BRAND */
1100
1110
  --foreground-neutral-skeleton-element: #e0e0e0;
1101
- /* Foreground/Spectrum/blue - Theme - Agent Workplace */
1111
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1102
1112
  --foreground-spectrum-blue: #143778;
1103
- /* Foreground/Spectrum/green - Theme - Agent Workplace */
1113
+ /* Foreground/Spectrum/green - Theme - BRAND */
1104
1114
  --foreground-spectrum-green: #134428;
1105
- /* Foreground/Spectrum/lime - Theme - Agent Workplace */
1115
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1106
1116
  --foreground-spectrum-lime: #60651a;
1107
- /* Foreground/Spectrum/magenta - Theme - Agent Workplace */
1117
+ /* Foreground/Spectrum/magenta - Theme - BRAND */
1108
1118
  --foreground-spectrum-magenta: #63076f;
1109
- /* Foreground/Spectrum/orange - Brand */
1119
+ /* Foreground/Spectrum/orange - Theme - BRAND */
1110
1120
  --foreground-spectrum-orange: #773001;
1111
- /* Foreground/Spectrum/pink - Theme - Agent Workplace */
1121
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1112
1122
  --foreground-spectrum-pink: #6c1240;
1113
- /* Foreground/Spectrum/purple - Theme - Agent Workplace */
1123
+ /* Foreground/Spectrum/purple - Theme - BRAND */
1114
1124
  --foreground-spectrum-purple: #310077;
1115
- /* Foreground/Spectrum/red - Brand */
1125
+ /* Foreground/Spectrum/red - Theme - BRAND */
1116
1126
  --foreground-spectrum-red: #6c1d29;
1117
- /* Foreground/Spectrum/teal - Theme - Agent Workplace */
1127
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1118
1128
  --foreground-spectrum-teal: #01413c;
1119
- /* Foreground/Spectrum/yellow - Theme - Agent Workplace */
1129
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1120
1130
  --foreground-spectrum-yellow: #7b5e18;
1121
- /* Interactions/brand-disabled-opacity - Theme - Agent Workplace */
1131
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1122
1132
  --interactions-brand-disabled-opacity: #0000000f;
1123
- /* Interactions/brand-hover-opacity - Theme - Agent Workplace */
1133
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1124
1134
  --interactions-brand-hover-opacity: #0000001a;
1125
- /* Interactions/brand-press-opacity - Theme - Agent Workplace */
1135
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1126
1136
  --interactions-brand-press-opacity: #00000033;
1127
- /* Interactions/disabled-opacity - Theme - Agent Workplace */
1137
+ /* Interactions/disabled-opacity - Theme - BRAND */
1128
1138
  --interactions-disabled-opacity: #0000000f;
1129
- /* Interactions/hover-opacity - Theme - Agent Workplace */
1139
+ /* Interactions/hover-opacity - Theme - BRAND */
1130
1140
  --interactions-hover-opacity: #00000014;
1131
- /* Interactions/link-active-opacity - Brand */
1141
+ /* Interactions/link-active-opacity - Theme - BRAND */
1132
1142
  --interactions-link-active-opacity: #0000004d;
1133
1143
  /* Interactions/neutral-hover-opacity - Brand */
1134
1144
  /* surfaces using neutral tones */
@@ -1136,27 +1146,27 @@ body {
1136
1146
  /* Interactions/neutral-press-opacity - Brand */
1137
1147
  /* surfaces using neutral tones */
1138
1148
  --interactions-neutral-press-opacity: #00000029;
1139
- /* Interactions/press-opacity - Theme - Agent Workplace */
1149
+ /* Interactions/press-opacity - Theme - BRAND */
1140
1150
  --interactions-press-opacity: #00000029;
1141
- /* Interactions/primary-disabled-opacity - Theme - Agent Workplace */
1151
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1142
1152
  --interactions-primary-disabled-opacity: #19172f1f;
1143
- /* Interactions/primary-hover-opacity - Theme - Agent Workplace */
1153
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1144
1154
  --interactions-primary-hover-opacity: #19172f1a;
1145
- /* Interactions/primary-press-opacity - Theme - Agent Workplace */
1155
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1146
1156
  --interactions-primary-press-opacity: #19172f33;
1147
- /* Shadow/shadow-10 - Theme - Agent Workplace */
1157
+ /* Shadow/shadow-10 - Theme - BRAND */
1148
1158
  --shadow-10: #0000001a;
1149
- /* Shadow/shadow-12 - Theme - Agent Workplace */
1159
+ /* Shadow/shadow-12 - Theme - BRAND */
1150
1160
  --shadow-12: #0000001f;
1151
- /* Shadow/shadow-15 - Theme - Agent Workplace */
1161
+ /* Shadow/shadow-15 - Theme - BRAND */
1152
1162
  --shadow-15: #00000026;
1153
- /* Shadow/shadow-25 - Theme - Agent Workplace */
1163
+ /* Shadow/shadow-25 - Theme - BRAND */
1154
1164
  --shadow-25: #00000040;
1155
- /* Shadow/shadow-32 - Theme - Agent Workplace */
1165
+ /* Shadow/shadow-32 - Theme - BRAND */
1156
1166
  --shadow-32: #00000052;
1157
1167
  /* Shadow/inner-shadow - Brand */
1158
1168
  --shadow-inner: #ffffff;
1159
- /* Shadow/inner-shadow-100 - Theme - Better Home & Garden */
1169
+ /* Shadow/inner-shadow-100 - Theme - BRAND */
1160
1170
  --shadow-inner-100: #ffffff;
1161
1171
  /* Shadow/variant-01 - Brand */
1162
1172
  --shadow-variant-01: #0000001a;
@@ -1168,49 +1178,49 @@ body {
1168
1178
  --shadow-variant-04: #00000040;
1169
1179
  /* Shadow/variant-05 - Brand */
1170
1180
  --shadow-variant-05: #00000052;
1171
- /* Status/error - Brand */
1181
+ /* Status/error - Theme - BRAND */
1172
1182
  /* Foreground error text and icons */
1173
1183
  --status-error: #d83a52;
1174
- /* Status/information - Theme - Better Home & Garden */
1184
+ /* Status/information - Theme - BRAND */
1175
1185
  --status-information: #276ef1;
1176
1186
  /* Status/informational - Brand */
1177
1187
  /* Foreground informational text and icons */
1178
1188
  --status-informational: #276ef1;
1179
- /* Status/on-error - Brand */
1189
+ /* Status/on-error - Theme - BRAND */
1180
1190
  /* Foreground error text and icons */
1181
1191
  --status-on-error: #ffffff;
1182
- /* Status/on-information - Theme - Better Home & Garden */
1192
+ /* Status/on-information - Theme - BRAND */
1183
1193
  --status-on-information: #ffffff;
1184
1194
  /* Status/on-informational - Brand */
1185
1195
  /* Foreground informational text and icons */
1186
1196
  --status-on-informational: #ffffff;
1187
- /* Status/on-success - Brand */
1197
+ /* Status/on-success - Theme - BRAND */
1188
1198
  /* Foreground success icons and text */
1189
1199
  --status-on-success: #ffffff;
1190
- /* Status/on-warning - Brand */
1200
+ /* Status/on-warning - Theme - BRAND */
1191
1201
  /* Foreground warning icons */
1192
1202
  --status-on-warning: #141414;
1193
- /* Status/success - Brand */
1203
+ /* Status/success - Theme - BRAND */
1194
1204
  /* Foreground success icons and text */
1195
1205
  --status-success: #258750;
1196
- /* Status/warning - Brand */
1206
+ /* Status/warning - Theme - BRAND */
1197
1207
  /* Foreground warning icons */
1198
1208
  --status-warning: #f6bc2f;
1199
- /* Stroke/AI-powered/blue - Theme - Agent Workplace */
1209
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1200
1210
  --stroke-ai-powered-blue: #215ecd;
1201
- /* Stroke/AI-powered/pink - Theme - Agent Workplace */
1211
+ /* Stroke/AI-powered/pink - Theme - BRAND */
1202
1212
  --stroke-ai-powered-pink: #c60ede;
1203
- /* Stroke/Brand/brand-primary - Brand */
1213
+ /* Stroke/Brand/brand-primary - Theme - BRAND */
1204
1214
  /* Outline variant - decorative elements such as dividers */
1205
1215
  --stroke-brand-primary: #19172f;
1206
- /* Stroke/Brand/brand-primary-depth - Brand */
1216
+ /* Stroke/Brand/brand-primary-depth - Theme - BRAND */
1207
1217
  /* Outline variant - decorative elements such as dividers */
1208
1218
  --stroke-brand-primary-depth: #151428;
1209
- /* Stroke/Brand/brand-secondary - Theme - Better Home & Garden */
1210
- --stroke-brand-secondary: #dd6b47;
1211
- /* Stroke/Brand/brand-secondary-depth - Theme - Agent Workplace */
1219
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1220
+ --stroke-brand-secondary: #eb672f;
1221
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1212
1222
  --stroke-brand-secondary-depth: #c85828;
1213
- /* Stroke/Neutral/neutral-base - Brand */
1223
+ /* Stroke/Neutral/neutral-base - Theme - BRAND */
1214
1224
  /* For control components */
1215
1225
  --stroke-neutral-base: #949494;
1216
1226
  /* Stroke/Neutral/disabled-dark - Brand */
@@ -1227,77 +1237,75 @@ body {
1227
1237
  --stroke-neutral-focus-on-inverse: #ffffff;
1228
1238
  /* Stroke/Neutral/neutral-high - Brand */
1229
1239
  --stroke-neutral-high: #141414;
1230
- /* Stroke/Neutral/neutral-high-contrast - Theme - Agent Workplace */
1240
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1231
1241
  --stroke-neutral-high-contrast: #141414;
1232
- /* Stroke/Neutral/Interactions/disabled-dark - Theme - Agent Workplace */
1242
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1233
1243
  --stroke-neutral-interactions-disabled-dark: #757575;
1234
- /* Stroke/Neutral/Interactions/disabled-light - Theme - Agent Workplace */
1244
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1235
1245
  --stroke-neutral-interactions-disabled-light: #bdbdbd;
1236
- /* Stroke/Neutral/Interactions/focus - Theme - Agent Workplace */
1246
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1237
1247
  --stroke-neutral-interactions-focus: #000000;
1238
- /* Stroke/Neutral/Interactions/inverse-focus - Theme - Agent Workplace */
1248
+ /* Stroke/Neutral/Interactions/inverse-focus - Theme - BRAND */
1239
1249
  --stroke-neutral-interactions-inverse-focus: #ffffff;
1240
1250
  /* Stroke/Neutral/neutral-low - Brand */
1241
1251
  /* Outline variant - decorative elements such as dividers */
1242
1252
  --stroke-neutral-low: #e0e0e0;
1243
- /* Stroke/Neutral/neutral-low-contrast - Theme - Agent Workplace */
1253
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1244
1254
  --stroke-neutral-low-contrast: #e0e0e0;
1245
- /* Surface/AI-powered/blue - Theme - Agent Workplace */
1255
+ /* Surface/AI-powered/blue - Theme - BRAND */
1246
1256
  --surface-ai-powered-blue: #215ecd;
1247
- /* Surface/AI-powered/pink - Theme - Agent Workplace */
1257
+ /* Surface/AI-powered/pink - Theme - BRAND */
1248
1258
  --surface-ai-powered-pink: #c60ede;
1249
- /* Surface/Brand/primary - Brand */
1259
+ /* Surface/Brand/primary - Theme - BRAND */
1250
1260
  --surface-brand-primary: #19172f;
1251
- /* Surface/Brand/primary-highlight - Theme - Agent Workplace */
1252
- --surface-brand-primary-highlight: #dfeddf;
1253
- /* Surface/Brand/secondary - Brand */
1261
+ /* Surface/Brand/primary-highlight - Theme - BRAND */
1262
+ --surface-brand-primary-highlight: #dddce0;
1263
+ /* Surface/Brand/secondary - Theme - BRAND */
1254
1264
  --surface-brand-secondary: #eb672f;
1255
- /* Surface/Brand/secondary-highlight - Theme - Agent Workplace */
1265
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1256
1266
  --surface-brand-secondary-highlight: #fce8e0;
1257
- /* Surface/Neutral/Interactions/dark-disabled - Theme - Better Home & Garden */
1267
+ /* Surface/Neutral/Interactions/dark-disabled - Theme - BRAND */
1258
1268
  --surface-neutral-interactions-dark-disabled: #d6d6d6;
1259
- /* Surface/Neutral/Interactions/light-disabled - Theme - Better Home & Garden */
1269
+ /* Surface/Neutral/Interactions/light-disabled - Theme - BRAND */
1260
1270
  --surface-neutral-interactions-light-disabled: #f5f5f5;
1261
1271
  /* Surface/Neutral/inverse - Brand */
1262
1272
  /* Inverted. Use for toasts notification & snackbars */
1263
1273
  --surface-neutral-inverse: #1f1f1f;
1264
- /* Surface/Neutral/inverse-dark - Theme - Better Home & Garden */
1274
+ /* Surface/Neutral/inverse-dark - Theme - BRAND */
1265
1275
  --surface-neutral-inverse-dark: #1f1f1f;
1266
- /* Surface/Neutral/inverse-light - Theme - Agent Workplace */
1276
+ /* Surface/Neutral/inverse-light - Theme - BRAND */
1267
1277
  --surface-neutral-inverse-light: #ffffff;
1268
- /* Surface/Neutral/T1-base - Brand */
1278
+ /* Surface/Neutral/T1-base - Theme - BRAND */
1269
1279
  --surface-neutral-t1-base: #ffffff;
1270
- /* Surface/Neutral/T2-lowest - Brand */
1280
+ /* Surface/Neutral/T2-lowest - Theme - BRAND */
1271
1281
  --surface-neutral-t2-lowest: #f5f5f5;
1272
- /* Surface/Neutral/T3-low - Brand */
1282
+ /* Surface/Neutral/T3-low - Theme - BRAND */
1273
1283
  /* Navigations, app bar etc */
1274
1284
  --surface-neutral-t3-low: #dbdbdb;
1275
- /* Surface/Neutral/T4-high - Brand */
1285
+ /* Surface/Neutral/T4-high - Theme - BRAND */
1276
1286
  /* Navigations, app bar etc */
1277
1287
  --surface-neutral-t4-high: #8a8a8a;
1278
- /* Surface/Neutral/T4-high 2 - Theme - Better Home & Garden */
1279
- --surface-neutral-t4-high-2: #8a8a8a;
1280
- /* Surface/Neutral/transparent - Brand */
1288
+ /* Surface/Neutral/transparent - Theme - BRAND */
1281
1289
  --surface-neutral-transparent: #ffffff00;
1282
- /* Surface/Spectrum/blue - Theme - Agent Workplace */
1290
+ /* Surface/Spectrum/blue - Theme - BRAND */
1283
1291
  --surface-spectrum-blue: #dfe9fd;
1284
- /* Surface/Spectrum/green - Theme - Agent Workplace */
1292
+ /* Surface/Spectrum/green - Theme - BRAND */
1285
1293
  --surface-spectrum-green: #deede5;
1286
- /* Surface/Spectrum/lime - Theme - Agent Workplace */
1294
+ /* Surface/Spectrum/lime - Theme - BRAND */
1287
1295
  --surface-spectrum-lime: #f6f7e0;
1288
- /* Surface/Spectrum/magenta - Theme - Agent Workplace */
1296
+ /* Surface/Spectrum/magenta - Theme - BRAND */
1289
1297
  --surface-spectrum-magenta: #f6dbfa;
1290
- /* Surface/Spectrum/orange - Theme - Better Home & Garden */
1298
+ /* Surface/Spectrum/orange - Theme - BRAND */
1291
1299
  --surface-spectrum-orange: #fce7d9;
1292
- /* Surface/Spectrum/pink - Theme - Agent Workplace */
1300
+ /* Surface/Spectrum/pink - Theme - BRAND */
1293
1301
  --surface-spectrum-pink: #f9deec;
1294
- /* Surface/Spectrum/purple - Theme - Agent Workplace */
1302
+ /* Surface/Spectrum/purple - Theme - BRAND */
1295
1303
  --surface-spectrum-purple: #e7d9fc;
1296
- /* Surface/Spectrum/red - Theme - Agent Workplace */
1304
+ /* Surface/Spectrum/red - Theme - BRAND */
1297
1305
  --surface-spectrum-red: #f9e1e5;
1298
- /* Surface/Spectrum/teal - Theme - Agent Workplace */
1306
+ /* Surface/Spectrum/teal - Theme - BRAND */
1299
1307
  --surface-spectrum-teal: #d9eceb;
1300
- /* Surface/Spectrum/yellow - Theme - Agent Workplace */
1308
+ /* Surface/Spectrum/yellow - Theme - BRAND */
1301
1309
  --surface-spectrum-yellow: #fef5e0;
1302
1310
 
1303
1311
  @media (width >= 640px) {
@@ -1441,11 +1449,11 @@ body {
1441
1449
  }
1442
1450
  /* dark theme */
1443
1451
  [data-theme='dark'] {
1444
- /* Background/base - Brand */
1452
+ /* Background/base - Theme - BRAND */
1445
1453
  --background-base: #1f1f1f;
1446
- /* Background/scrim - Theme - Agent Workplace */
1454
+ /* Background/scrim - Theme - BRAND */
1447
1455
  --background-scrim: #61616180;
1448
- /* Background/shade - Brand */
1456
+ /* Background/shade - Theme - BRAND */
1449
1457
  --background-shade: #292929;
1450
1458
  /* Data visual/category-01 - Brand */
1451
1459
  --data-visual-category-01: #e6b297;
@@ -1475,39 +1483,39 @@ body {
1475
1483
  --data-visual-category-07: #a98484;
1476
1484
  /* Data visual/category-07-highlight - Brand */
1477
1485
  --data-visual-category-07-highlight: #a984844d;
1478
- /* Data visual/category-1 - Theme - Better Home & Garden */
1479
- --data-visual-category-1: #0a466c;
1480
- /* Data visual/category-1-highlight - Theme - Agent Workplace */
1481
- --data-visual-category-1-highlight: #7899ae4d;
1482
- /* Data visual/category-2 - Theme - Better Home & Garden */
1483
- --data-visual-category-2: #7fc4ec;
1484
- /* Data visual/category-2-highlight - Theme - Agent Workplace */
1485
- --data-visual-category-2-highlight: #7fc4ec4d;
1486
- /* Data visual/category-3 - Theme - Better Home & Garden */
1487
- --data-visual-category-3: #958ca3;
1488
- /* Data visual/category-3-highlight - Theme - Agent Workplace */
1489
- --data-visual-category-3-highlight: #958ca34d;
1490
- /* Data visual/category-4 - Theme - Better Home & Garden */
1491
- --data-visual-category-4: #88c5af;
1492
- /* Data visual/category-4-highlight - Theme - Agent Workplace */
1493
- --data-visual-category-4-highlight: #88c5af4d;
1494
- /* Data visual/category-5 - Theme - Better Home & Garden */
1495
- --data-visual-category-5: #789ba0;
1496
- /* Data visual/category-5-highlight - Theme - Agent Workplace */
1497
- --data-visual-category-5-highlight: #789ba04d;
1498
- /* Data visual/category-6 - Theme - Better Home & Garden */
1486
+ /* Data visual/category-1 - Theme - BRAND */
1487
+ --data-visual-category-1: #b68a79;
1488
+ /* Data visual/category-1-highlight - Theme - BRAND */
1489
+ --data-visual-category-1-highlight: #b68a794d;
1490
+ /* Data visual/category-2 - Theme - BRAND */
1491
+ --data-visual-category-2: #e6b297;
1492
+ /* Data visual/category-2-highlight - Theme - BRAND */
1493
+ --data-visual-category-2-highlight: #e6b2974d;
1494
+ /* Data visual/category-3 - Theme - BRAND */
1495
+ --data-visual-category-3: #969980;
1496
+ /* Data visual/category-3-highlight - Theme - BRAND */
1497
+ --data-visual-category-3-highlight: #9699804d;
1498
+ /* Data visual/category-4 - Theme - BRAND */
1499
+ --data-visual-category-4: #cdbe80;
1500
+ /* Data visual/category-4-highlight - Theme - BRAND */
1501
+ --data-visual-category-4-highlight: #cdbe804d;
1502
+ /* Data visual/category-5 - Theme - BRAND */
1503
+ --data-visual-category-5: #a98484;
1504
+ /* Data visual/category-5-highlight - Theme - BRAND */
1505
+ --data-visual-category-5-highlight: #a984844d;
1506
+ /* Data visual/category-6 - Theme - BRAND */
1499
1507
  --data-visual-category-6: #b2b2b2;
1500
- /* Data visual/category-6-highlight - Theme - Agent Workplace */
1508
+ /* Data visual/category-6-highlight - Theme - BRAND */
1501
1509
  --data-visual-category-6-highlight: #b2b2b24d;
1502
- /* Data visual/category-7 - Theme - Better Home & Garden */
1503
- --data-visual-category-7: #a19abc;
1504
- /* Data visual/category-7-highlight - Theme - Agent Workplace */
1505
- --data-visual-category-7-highlight: #a19abc4d;
1506
- /* Data visual/gradient-end - Theme - Agent Workplace */
1510
+ /* Data visual/category-7 - Theme - BRAND */
1511
+ --data-visual-category-7: #af9385;
1512
+ /* Data visual/category-7-highlight - Theme - BRAND */
1513
+ --data-visual-category-7-highlight: #af93854d;
1514
+ /* Data visual/gradient-end - Theme - BRAND */
1507
1515
  --data-visual-gradient-end: #1f1f1f4d;
1508
- /* Data visual/green - Theme - Agent Workplace */
1516
+ /* Data visual/green - Theme - BRAND */
1509
1517
  --data-visual-green: #7cb796;
1510
- /* Data visual/green-highlight - Theme - Agent Workplace */
1518
+ /* Data visual/green-highlight - Theme - BRAND */
1511
1519
  --data-visual-green-highlight: #0d2f1c;
1512
1520
  /* Data visual/negative - Brand */
1513
1521
  --data-visual-negative: #e88997;
@@ -1517,113 +1525,113 @@ body {
1517
1525
  --data-visual-positive: #7cb796;
1518
1526
  /* Data visual/positive-highlight - Brand */
1519
1527
  --data-visual-positive-highlight: #0d2f1c;
1520
- /* Data visual/red - Theme - Agent Workplace */
1528
+ /* Data visual/red - Theme - BRAND */
1521
1529
  --data-visual-red: #e88997;
1522
- /* Data visual/red-highlight - Theme - Agent Workplace */
1530
+ /* Data visual/red-highlight - Theme - BRAND */
1523
1531
  --data-visual-red-highlight: #4c141d;
1524
- /* Foreground/AI-powered/blue - Theme - Agent Workplace */
1532
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1525
1533
  --foreground-ai-powered-blue: #000000;
1526
- /* Foreground/AI-powered/pink - Theme - Agent Workplace */
1534
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1527
1535
  --foreground-ai-powered-pink: #000000;
1528
- /* Foreground/Brand/on-inverse-primary - Theme - Agent Workplace */
1536
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1529
1537
  --foreground-brand-on-inverse-primary: #757482;
1530
- /* Foreground/Brand/on-inverse-secondary - Theme - Agent Workplace */
1538
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1531
1539
  --foreground-brand-on-inverse-secondary: #f3a482;
1532
- /* Foreground/Brand/on-brand-primary - Brand */
1540
+ /* Foreground/Brand/on-brand-primary - Theme - BRAND */
1533
1541
  /* Foreground color used on Brand's primary color (non neutral color) */
1534
1542
  --foreground-brand-on-primary: #141414;
1535
- /* Foreground/Brand/on-brand-secondary - Brand */
1543
+ /* Foreground/Brand/on-brand-secondary - Theme - BRAND */
1536
1544
  /* Foreground color used on Brand's primary color (non neutral color) */
1537
1545
  --foreground-brand-on-secondary: #141414;
1538
- /* Foreground/Brand/brand-primary - Brand */
1546
+ /* Foreground/Brand/brand-primary - Theme - BRAND */
1539
1547
  /* Foreground text and icons that match the brand's primary color */
1540
1548
  --foreground-brand-primary: #757482;
1541
- /* Foreground/Brand/brand-primary-depth - Theme - Better Home & Garden */
1542
- --foreground-brand-primary-depth: #88bc88;
1543
- /* Foreground/Brand/brand-secondary - Brand */
1549
+ /* Foreground/Brand/brand-primary-depth - Theme - BRAND */
1550
+ --foreground-brand-primary-depth: #9897a1;
1551
+ /* Foreground/Brand/brand-secondary - Theme - BRAND */
1544
1552
  /* Foreground text and icons that match the brand's secondary color */
1545
1553
  --foreground-brand-secondary: #f3a482;
1546
- /* Foreground/Brand/brand-secondary-depth - Theme - Agent Workplace */
1554
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1547
1555
  --foreground-brand-secondary-depth: #f6bba1;
1548
- /* Foreground/Link text/default - Brand */
1556
+ /* Foreground/Link text/default - Theme - BRAND */
1549
1557
  --foreground-link-text-default: #7a9ee1;
1550
- /* Foreground/Link text/default-disabled - Brand */
1558
+ /* Foreground/Link text/default-disabled - Theme - BRAND */
1551
1559
  --foreground-link-text-default-disabled: #14387b;
1552
- /* Foreground/Link text/default-hovered - Theme - Agent Workplace */
1560
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1553
1561
  --foreground-link-text-default-hovered: #90afe6;
1554
- /* Foreground/Link text/default-pressed - Theme - Agent Workplace */
1562
+ /* Foreground/Link text/default-pressed - Theme - BRAND */
1555
1563
  --foreground-link-text-default-pressed: #a6bfeb;
1556
- /* Foreground/Link text/default-visited - Brand */
1564
+ /* Foreground/Link text/default-visited - Theme - BRAND */
1557
1565
  --foreground-link-text-default-visited: #af8baf;
1558
1566
  /* Foreground/Link text/subtle-disabled - Brand */
1559
1567
  --foreground-link-text-subtle-disabled: #4d4d4d;
1560
- /* Foreground/Link text/subtle-hovered - Theme - Agent Workplace */
1568
+ /* Foreground/Link text/subtle-hovered - Theme - BRAND */
1561
1569
  --foreground-link-text-subtle-hovered: #e6e6e6;
1562
- /* Foreground/Link text/subtle-inverse-hovered - Theme - Agent Workplace */
1570
+ /* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
1563
1571
  --foreground-link-text-subtle-inverse-hovered: #e6e6e6;
1564
- /* Foreground/Link text/subtle-inverse-pressed - Theme - Agent Workplace */
1572
+ /* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
1565
1573
  --foreground-link-text-subtle-inverse-pressed: #d1d1d1;
1566
1574
  /* Foreground/Link text/subtle-inversed-disabled - Brand */
1567
1575
  --foreground-link-text-subtle-inversed-disabled: #3d3d3d;
1568
- /* Foreground/Link text/subtle-pressed - Theme - Agent Workplace */
1576
+ /* Foreground/Link text/subtle-pressed - Theme - BRAND */
1569
1577
  --foreground-link-text-subtle-pressed: #d1d1d1;
1570
- /* Foreground/Neutral/disabled-on-color-surface - Brand */
1578
+ /* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
1571
1579
  --foreground-neutral-disabled-on-color-surface: #3d3d3d;
1572
- /* Foreground/Neutral/disabled-on-surface - Brand */
1580
+ /* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
1573
1581
  --foreground-neutral-disabled-on-surface: #4d4d4d;
1574
- /* Foreground/Neutral/inverse-on-surface - Theme - Agent Workplace */
1582
+ /* Foreground/Neutral/inverse-on-surface - Theme - BRAND */
1575
1583
  --foreground-neutral-inverse-on-surface: #fafafa;
1576
- /* Foreground/Neutral/on-color - Brand */
1584
+ /* Foreground/Neutral/on-color - Theme - BRAND */
1577
1585
  /* Interactive controls */
1578
1586
  --foreground-neutral-on-color: #ffffff;
1579
1587
  /* Foreground/Neutral/on-inverse-surface - Brand */
1580
1588
  /* Text and icons against inverse surface */
1581
1589
  --foreground-neutral-on-inverse-surface: #fafafa;
1582
- /* Foreground/Neutral/on-surface - Brand */
1590
+ /* Foreground/Neutral/on-surface - Theme - BRAND */
1583
1591
  /* Default foreground text and icons against any surface color */
1584
1592
  --foreground-neutral-on-surface: #fafafa;
1585
- /* Foreground/Neutral/on-surface-variant-01 - Brand */
1593
+ /* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
1586
1594
  /* Secondary foreground color for icons and text */
1587
1595
  --foreground-neutral-on-surface-variant-01: #c2c2c2;
1588
- /* Foreground/Neutral/on-surface-variant-02 - Brand */
1596
+ /* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
1589
1597
  /* Tertiary foreground color for icons and text */
1590
1598
  --foreground-neutral-on-surface-variant-02: #9e9e9e;
1591
- /* Foreground/Neutral/on-surface-variant-03 - Brand */
1599
+ /* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
1592
1600
  /* Quaternary foreground color for icons and text. Only for placeholder text */
1593
1601
  --foreground-neutral-on-surface-variant-03: #757575;
1594
- /* Foreground/Neutral/skeleton-element - Brand */
1602
+ /* Foreground/Neutral/skeleton-element - Theme - BRAND */
1595
1603
  --foreground-neutral-skeleton-element: #333333;
1596
- /* Foreground/Spectrum/blue - Theme - Agent Workplace */
1604
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1597
1605
  --foreground-spectrum-blue: #88aff7;
1598
- /* Foreground/Spectrum/green - Theme - Agent Workplace */
1606
+ /* Foreground/Spectrum/green - Theme - BRAND */
1599
1607
  --foreground-spectrum-green: #87bd9f;
1600
- /* Foreground/Spectrum/lime - Theme - Agent Workplace */
1608
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1601
1609
  --foreground-spectrum-lime: #dce28f;
1602
- /* Foreground/Spectrum/magenta - Theme - Agent Workplace */
1610
+ /* Foreground/Spectrum/magenta - Theme - BRAND */
1603
1611
  --foreground-spectrum-magenta: #e07aed;
1604
- /* Foreground/Spectrum/orange - Brand */
1612
+ /* Foreground/Spectrum/orange - Theme - BRAND */
1605
1613
  --foreground-spectrum-orange: #f6a874;
1606
- /* Foreground/Spectrum/pink - Theme - Agent Workplace */
1614
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1607
1615
  --foreground-spectrum-pink: #ea86b9;
1608
- /* Foreground/Spectrum/purple - Theme - Agent Workplace */
1616
+ /* Foreground/Spectrum/purple - Theme - BRAND */
1609
1617
  --foreground-spectrum-purple: #c8a6f9;
1610
- /* Foreground/Spectrum/red - Brand */
1618
+ /* Foreground/Spectrum/red - Theme - BRAND */
1611
1619
  --foreground-spectrum-red: #ea93a0;
1612
- /* Foreground/Spectrum/teal - Theme - Agent Workplace */
1620
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1613
1621
  --foreground-spectrum-teal: #74bbb4;
1614
- /* Foreground/Spectrum/yellow - Theme - Agent Workplace */
1622
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1615
1623
  --foreground-spectrum-yellow: #fada8d;
1616
- /* Interactions/brand-disabled-opacity - Theme - Agent Workplace */
1624
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1617
1625
  --interactions-brand-disabled-opacity: #ffffff0f;
1618
- /* Interactions/brand-hover-opacity - Theme - Agent Workplace */
1626
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1619
1627
  --interactions-brand-hover-opacity: #ffffff1a;
1620
- /* Interactions/brand-press-opacity - Theme - Agent Workplace */
1628
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1621
1629
  --interactions-brand-press-opacity: #ffffff33;
1622
- /* Interactions/disabled-opacity - Theme - Agent Workplace */
1630
+ /* Interactions/disabled-opacity - Theme - BRAND */
1623
1631
  --interactions-disabled-opacity: #ffffff0f;
1624
- /* Interactions/hover-opacity - Theme - Agent Workplace */
1632
+ /* Interactions/hover-opacity - Theme - BRAND */
1625
1633
  --interactions-hover-opacity: #ffffff14;
1626
- /* Interactions/link-active-opacity - Brand */
1634
+ /* Interactions/link-active-opacity - Theme - BRAND */
1627
1635
  --interactions-link-active-opacity: #ffffff4d;
1628
1636
  /* Interactions/neutral-hover-opacity - Brand */
1629
1637
  /* surfaces using neutral tones */
@@ -1631,27 +1639,27 @@ body {
1631
1639
  /* Interactions/neutral-press-opacity - Brand */
1632
1640
  /* surfaces using neutral tones */
1633
1641
  --interactions-neutral-press-opacity: #ffffff29;
1634
- /* Interactions/press-opacity - Theme - Agent Workplace */
1642
+ /* Interactions/press-opacity - Theme - BRAND */
1635
1643
  --interactions-press-opacity: #ffffff29;
1636
- /* Interactions/primary-disabled-opacity - Theme - Agent Workplace */
1644
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1637
1645
  --interactions-primary-disabled-opacity: #7574821f;
1638
- /* Interactions/primary-hover-opacity - Theme - Agent Workplace */
1646
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1639
1647
  --interactions-primary-hover-opacity: #7574821a;
1640
- /* Interactions/primary-press-opacity - Theme - Agent Workplace */
1648
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1641
1649
  --interactions-primary-press-opacity: #75748233;
1642
- /* Shadow/shadow-10 - Theme - Agent Workplace */
1650
+ /* Shadow/shadow-10 - Theme - BRAND */
1643
1651
  --shadow-10: #6161611a;
1644
- /* Shadow/shadow-12 - Theme - Agent Workplace */
1652
+ /* Shadow/shadow-12 - Theme - BRAND */
1645
1653
  --shadow-12: #6161611f;
1646
- /* Shadow/shadow-15 - Theme - Agent Workplace */
1654
+ /* Shadow/shadow-15 - Theme - BRAND */
1647
1655
  --shadow-15: #61616126;
1648
- /* Shadow/shadow-25 - Theme - Agent Workplace */
1656
+ /* Shadow/shadow-25 - Theme - BRAND */
1649
1657
  --shadow-25: #61616140;
1650
- /* Shadow/shadow-32 - Theme - Agent Workplace */
1658
+ /* Shadow/shadow-32 - Theme - BRAND */
1651
1659
  --shadow-32: #61616152;
1652
1660
  /* Shadow/inner-shadow - Brand */
1653
1661
  --shadow-inner: #000000;
1654
- /* Shadow/inner-shadow-100 - Theme - Better Home & Garden */
1662
+ /* Shadow/inner-shadow-100 - Theme - BRAND */
1655
1663
  --shadow-inner-100: #000000;
1656
1664
  /* Shadow/variant-01 - Brand */
1657
1665
  --shadow-variant-01: #6161611a;
@@ -1663,49 +1671,49 @@ body {
1663
1671
  --shadow-variant-04: #61616140;
1664
1672
  /* Shadow/variant-05 - Brand */
1665
1673
  --shadow-variant-05: #61616152;
1666
- /* Status/error - Brand */
1674
+ /* Status/error - Theme - BRAND */
1667
1675
  /* Foreground error text and icons */
1668
1676
  --status-error: #e26b7d;
1669
- /* Status/information - Theme - Better Home & Garden */
1677
+ /* Status/information - Theme - BRAND */
1670
1678
  --status-information: #5d92f5;
1671
1679
  /* Status/informational - Brand */
1672
1680
  /* Foreground informational text and icons */
1673
1681
  --status-informational: #5d92f5;
1674
- /* Status/on-error - Brand */
1682
+ /* Status/on-error - Theme - BRAND */
1675
1683
  /* Foreground error text and icons */
1676
1684
  --status-on-error: #ffffff;
1677
- /* Status/on-information - Theme - Better Home & Garden */
1685
+ /* Status/on-information - Theme - BRAND */
1678
1686
  --status-on-information: #ffffff;
1679
1687
  /* Status/on-informational - Brand */
1680
1688
  /* Foreground informational text and icons */
1681
1689
  --status-on-informational: #ffffff;
1682
- /* Status/on-success - Brand */
1690
+ /* Status/on-success - Theme - BRAND */
1683
1691
  /* Foreground success icons and text */
1684
1692
  --status-on-success: #ffffff;
1685
- /* Status/on-warning - Brand */
1693
+ /* Status/on-warning - Theme - BRAND */
1686
1694
  /* Foreground warning icons */
1687
1695
  --status-on-warning: #141414;
1688
- /* Status/success - Brand */
1696
+ /* Status/success - Theme - BRAND */
1689
1697
  /* Foreground success icons and text */
1690
1698
  --status-success: #519f73;
1691
- /* Status/warning - Brand */
1699
+ /* Status/warning - Theme - BRAND */
1692
1700
  /* Foreground warning icons */
1693
1701
  --status-warning: #f8cd63;
1694
- /* Stroke/AI-powered/blue - Theme - Agent Workplace */
1702
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1695
1703
  --stroke-ai-powered-blue: #000000;
1696
- /* Stroke/AI-powered/pink - Theme - Agent Workplace */
1704
+ /* Stroke/AI-powered/pink - Theme - BRAND */
1697
1705
  --stroke-ai-powered-pink: #000000;
1698
- /* Stroke/Brand/brand-primary - Brand */
1706
+ /* Stroke/Brand/brand-primary - Theme - BRAND */
1699
1707
  /* Outline variant - decorative elements such as dividers */
1700
1708
  --stroke-brand-primary: #757482;
1701
- /* Stroke/Brand/brand-primary-depth - Brand */
1709
+ /* Stroke/Brand/brand-primary-depth - Theme - BRAND */
1702
1710
  /* Outline variant - decorative elements such as dividers */
1703
1711
  --stroke-brand-primary-depth: #9897a1;
1704
- /* Stroke/Brand/brand-secondary - Theme - Better Home & Garden */
1705
- --stroke-brand-secondary: #f0bcac;
1706
- /* Stroke/Brand/brand-secondary-depth - Theme - Agent Workplace */
1712
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1713
+ --stroke-brand-secondary: #f3a482;
1714
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1707
1715
  --stroke-brand-secondary-depth: #f6bba1;
1708
- /* Stroke/Neutral/neutral-base - Brand */
1716
+ /* Stroke/Neutral/neutral-base - Theme - BRAND */
1709
1717
  /* For control components */
1710
1718
  --stroke-neutral-base: #6b6b6b;
1711
1719
  /* Stroke/Neutral/disabled-dark - Brand */
@@ -1722,77 +1730,75 @@ body {
1722
1730
  --stroke-neutral-focus-on-inverse: #ffffff;
1723
1731
  /* Stroke/Neutral/neutral-high - Brand */
1724
1732
  --stroke-neutral-high: #fafafa;
1725
- /* Stroke/Neutral/neutral-high-contrast - Theme - Agent Workplace */
1733
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1726
1734
  --stroke-neutral-high-contrast: #fafafa;
1727
- /* Stroke/Neutral/Interactions/disabled-dark - Theme - Agent Workplace */
1735
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1728
1736
  --stroke-neutral-interactions-disabled-dark: #3d3d3d;
1729
- /* Stroke/Neutral/Interactions/disabled-light - Theme - Agent Workplace */
1737
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1730
1738
  --stroke-neutral-interactions-disabled-light: #4d4d4d;
1731
- /* Stroke/Neutral/Interactions/focus - Theme - Agent Workplace */
1739
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1732
1740
  --stroke-neutral-interactions-focus: #ffffff;
1733
- /* Stroke/Neutral/Interactions/inverse-focus - Theme - Agent Workplace */
1741
+ /* Stroke/Neutral/Interactions/inverse-focus - Theme - BRAND */
1734
1742
  --stroke-neutral-interactions-inverse-focus: #ffffff;
1735
1743
  /* Stroke/Neutral/neutral-low - Brand */
1736
1744
  /* Outline variant - decorative elements such as dividers */
1737
1745
  --stroke-neutral-low: #4d4d4d;
1738
- /* Stroke/Neutral/neutral-low-contrast - Theme - Agent Workplace */
1746
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1739
1747
  --stroke-neutral-low-contrast: #4d4d4d;
1740
- /* Surface/AI-powered/blue - Theme - Agent Workplace */
1748
+ /* Surface/AI-powered/blue - Theme - BRAND */
1741
1749
  --surface-ai-powered-blue: #000000;
1742
- /* Surface/AI-powered/pink - Theme - Agent Workplace */
1750
+ /* Surface/AI-powered/pink - Theme - BRAND */
1743
1751
  --surface-ai-powered-pink: #000000;
1744
- /* Surface/Brand/primary - Brand */
1752
+ /* Surface/Brand/primary - Theme - BRAND */
1745
1753
  --surface-brand-primary: #757482;
1746
- /* Surface/Brand/primary-highlight - Theme - Agent Workplace */
1747
- --surface-brand-primary-highlight: #0a220a;
1748
- /* Surface/Brand/secondary - Brand */
1754
+ /* Surface/Brand/primary-highlight - Theme - BRAND */
1755
+ --surface-brand-primary-highlight: #06060c;
1756
+ /* Surface/Brand/secondary - Theme - BRAND */
1749
1757
  --surface-brand-secondary: #f3a482;
1750
- /* Surface/Brand/secondary-highlight - Theme - Agent Workplace */
1758
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1751
1759
  --surface-brand-secondary-highlight: #3b1a0c;
1752
- /* Surface/Neutral/Interactions/dark-disabled - Theme - Better Home & Garden */
1760
+ /* Surface/Neutral/Interactions/dark-disabled - Theme - BRAND */
1753
1761
  --surface-neutral-interactions-dark-disabled: #474747;
1754
- /* Surface/Neutral/Interactions/light-disabled - Theme - Better Home & Garden */
1762
+ /* Surface/Neutral/Interactions/light-disabled - Theme - BRAND */
1755
1763
  --surface-neutral-interactions-light-disabled: #292929;
1756
1764
  /* Surface/Neutral/inverse - Brand */
1757
1765
  /* Inverted. Use for toasts notification & snackbars */
1758
1766
  --surface-neutral-inverse: #383838;
1759
- /* Surface/Neutral/inverse-dark - Theme - Better Home & Garden */
1767
+ /* Surface/Neutral/inverse-dark - Theme - BRAND */
1760
1768
  --surface-neutral-inverse-dark: #383838;
1761
- /* Surface/Neutral/inverse-light - Theme - Agent Workplace */
1769
+ /* Surface/Neutral/inverse-light - Theme - BRAND */
1762
1770
  --surface-neutral-inverse-light: #575757;
1763
- /* Surface/Neutral/T1-base - Brand */
1771
+ /* Surface/Neutral/T1-base - Theme - BRAND */
1764
1772
  --surface-neutral-t1-base: #1f1f1f;
1765
- /* Surface/Neutral/T2-lowest - Brand */
1773
+ /* Surface/Neutral/T2-lowest - Theme - BRAND */
1766
1774
  --surface-neutral-t2-lowest: #2e2e2e;
1767
- /* Surface/Neutral/T3-low - Brand */
1775
+ /* Surface/Neutral/T3-low - Theme - BRAND */
1768
1776
  /* Navigations, app bar etc */
1769
1777
  --surface-neutral-t3-low: #383838;
1770
- /* Surface/Neutral/T4-high - Brand */
1778
+ /* Surface/Neutral/T4-high - Theme - BRAND */
1771
1779
  /* Navigations, app bar etc */
1772
1780
  --surface-neutral-t4-high: #7a7a7a;
1773
- /* Surface/Neutral/T4-high 2 - Theme - Better Home & Garden */
1774
- --surface-neutral-t4-high-2: #7a7a7a;
1775
- /* Surface/Neutral/transparent - Brand */
1781
+ /* Surface/Neutral/transparent - Theme - BRAND */
1776
1782
  --surface-neutral-transparent: #ffffff00;
1777
- /* Surface/Spectrum/blue - Theme - Agent Workplace */
1783
+ /* Surface/Spectrum/blue - Theme - BRAND */
1778
1784
  --surface-spectrum-blue: #0e2754;
1779
- /* Surface/Spectrum/green - Theme - Agent Workplace */
1785
+ /* Surface/Spectrum/green - Theme - BRAND */
1780
1786
  --surface-spectrum-green: #0d2f1c;
1781
- /* Surface/Spectrum/lime - Theme - Agent Workplace */
1787
+ /* Surface/Spectrum/lime - Theme - BRAND */
1782
1788
  --surface-spectrum-lime: #434712;
1783
- /* Surface/Spectrum/magenta - Theme - Agent Workplace */
1789
+ /* Surface/Spectrum/magenta - Theme - BRAND */
1784
1790
  --surface-spectrum-magenta: #45054e;
1785
- /* Surface/Spectrum/orange - Theme - Better Home & Garden */
1791
+ /* Surface/Spectrum/orange - Theme - BRAND */
1786
1792
  --surface-spectrum-orange: #532201;
1787
- /* Surface/Spectrum/pink - Theme - Agent Workplace */
1793
+ /* Surface/Spectrum/pink - Theme - BRAND */
1788
1794
  --surface-spectrum-pink: #4c0c2d;
1789
- /* Surface/Spectrum/purple - Theme - Agent Workplace */
1795
+ /* Surface/Spectrum/purple - Theme - BRAND */
1790
1796
  --surface-spectrum-purple: #220053;
1791
- /* Surface/Spectrum/red - Theme - Agent Workplace */
1797
+ /* Surface/Spectrum/red - Theme - BRAND */
1792
1798
  --surface-spectrum-red: #4c141d;
1793
- /* Surface/Spectrum/teal - Theme - Agent Workplace */
1799
+ /* Surface/Spectrum/teal - Theme - BRAND */
1794
1800
  --surface-spectrum-teal: #012e2a;
1795
- /* Surface/Spectrum/yellow - Theme - Agent Workplace */
1801
+ /* Surface/Spectrum/yellow - Theme - BRAND */
1796
1802
  --surface-spectrum-yellow: #564210;
1797
1803
  }
1798
1804
  `));