@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/broker-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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker 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/Broker Workplace/Primary/00-base - Global (primitives) */
550
+ /* Colors/Brands/BRAND/Primary/00-base - Global (primitives) */
549
551
  --primary-00-base: #19172f;
550
- /* Colors/Brands/Broker Workplace/Primary/15-dark - Global (primitives) */
552
+ /* Colors/Brands/BRAND/Primary/15-dark - Global (primitives) */
551
553
  --primary-15-dark: #151428;
552
- /* Colors/Brands/Broker Workplace/Primary/40-light - Global (primitives) */
554
+ /* Colors/Brands/BRAND/Primary/40-light - Global (primitives) */
553
555
  --primary-40-light: #757482;
554
- /* Colors/Brands/Broker Workplace/Primary/55-light - Global (primitives) */
556
+ /* Colors/Brands/BRAND/Primary/55-light - Global (primitives) */
555
557
  --primary-55-light: #9897a1;
556
- /* Colors/Brands/Broker Workplace/Primary/75-dark - Global (primitives) */
558
+ /* Colors/Brands/BRAND/Primary/75-dark - Global (primitives) */
557
559
  --primary-75-dark: #06060c;
558
- /* Colors/Brands/Broker 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/Broker Workplace/Secondary/00-base - Global (primitives) */
574
+ /* Colors/Brands/BRAND/Secondary/00-base - Global (primitives) */
571
575
  --secondary-00-base: #eb672f;
572
- /* Colors/Brands/Broker Workplace/Secondary/15-dark - Global (primitives) */
576
+ /* Colors/Brands/BRAND/Secondary/15-dark - Global (primitives) */
573
577
  --secondary-15-dark: #c85828;
574
- /* Colors/Brands/Broker Workplace/Secondary/40-light - Global (primitives) */
578
+ /* Colors/Brands/BRAND/Secondary/40-light - Global (primitives) */
575
579
  --secondary-40-light: #f3a482;
576
- /* Colors/Brands/Broker Workplace/Secondary/55-light - Global (primitives) */
580
+ /* Colors/Brands/BRAND/Secondary/55-light - Global (primitives) */
577
581
  --secondary-55-light: #f6bba1;
578
- /* Colors/Brands/Broker Workplace/Secondary/75-dark - Global (primitives) */
582
+ /* Colors/Brands/BRAND/Secondary/75-dark - Global (primitives) */
579
583
  --secondary-75-dark: #3b1a0c;
580
- /* Colors/Brands/Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker Workplace */
1010
- --data-visual-category-7-highlight: #4334794d;
1011
- /* Data visual/gradient-end - Theme - Broker 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 - Broker Workplace */
1023
+ /* Data visual/green - Theme - BRAND */
1014
1024
  --data-visual-green: #258750;
1015
- /* Data visual/green-highlight - Theme - Broker 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 - Broker Workplace */
1035
+ /* Data visual/red - Theme - BRAND */
1026
1036
  --data-visual-red: #d83a52;
1027
- /* Data visual/red-highlight - Theme - Broker Workplace */
1037
+ /* Data visual/red-highlight - Theme - BRAND */
1028
1038
  --data-visual-red-highlight: #f9e1e5;
1029
- /* Foreground/AI-powered/blue - Theme - Broker Workplace */
1039
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1030
1040
  --foreground-ai-powered-blue: #215ecd;
1031
- /* Foreground/AI-powered/pink - Theme - Broker Workplace */
1041
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1032
1042
  --foreground-ai-powered-pink: #c60ede;
1033
- /* Foreground/Brand/on-inverse-primary - Theme - Broker Workplace */
1043
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1034
1044
  --foreground-brand-on-inverse-primary: #757482;
1035
- /* Foreground/Brand/on-inverse-secondary - Theme - Broker Workplace */
1036
- --foreground-brand-on-inverse-secondary: #eba691;
1037
- /* Foreground/Brand/on-brand-primary - Brand */
1045
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1046
+ --foreground-brand-on-inverse-secondary: #f3a482;
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 - Broker Workplace */
1052
- --foreground-brand-secondary-depth: #bc5b3c;
1053
- /* Foreground/Link text/default - Brand */
1061
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1062
+ --foreground-brand-secondary-depth: #c85828;
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 - Broker Workplace */
1067
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1058
1068
  --foreground-link-text-default-hovered: #1e55b9;
1059
- /* Foreground/Link text/default-pressed - Theme - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker Workplace */
1111
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1102
1112
  --foreground-spectrum-blue: #143778;
1103
- /* Foreground/Spectrum/green - Theme - Broker Workplace */
1113
+ /* Foreground/Spectrum/green - Theme - BRAND */
1104
1114
  --foreground-spectrum-green: #134428;
1105
- /* Foreground/Spectrum/lime - Theme - Broker Workplace */
1115
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1106
1116
  --foreground-spectrum-lime: #60651a;
1107
- /* Foreground/Spectrum/magenta - Theme - Broker 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 - Broker Workplace */
1121
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1112
1122
  --foreground-spectrum-pink: #6c1240;
1113
- /* Foreground/Spectrum/purple - Theme - Broker 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 - Broker Workplace */
1127
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1118
1128
  --foreground-spectrum-teal: #01413c;
1119
- /* Foreground/Spectrum/yellow - Theme - Broker Workplace */
1129
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1120
1130
  --foreground-spectrum-yellow: #7b5e18;
1121
- /* Interactions/brand-disabled-opacity - Theme - Broker Workplace */
1131
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1122
1132
  --interactions-brand-disabled-opacity: #0000000f;
1123
- /* Interactions/brand-hover-opacity - Theme - Broker Workplace */
1133
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1124
1134
  --interactions-brand-hover-opacity: #0000001a;
1125
- /* Interactions/brand-press-opacity - Theme - Broker Workplace */
1135
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1126
1136
  --interactions-brand-press-opacity: #00000033;
1127
- /* Interactions/disabled-opacity - Theme - Broker Workplace */
1137
+ /* Interactions/disabled-opacity - Theme - BRAND */
1128
1138
  --interactions-disabled-opacity: #0000000f;
1129
- /* Interactions/hover-opacity - Theme - Broker 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 - Broker Workplace */
1149
+ /* Interactions/press-opacity - Theme - BRAND */
1140
1150
  --interactions-press-opacity: #00000029;
1141
- /* Interactions/primary-disabled-opacity - Theme - Broker Workplace */
1151
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1142
1152
  --interactions-primary-disabled-opacity: #19172f1f;
1143
- /* Interactions/primary-hover-opacity - Theme - Broker Workplace */
1153
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1144
1154
  --interactions-primary-hover-opacity: #19172f1a;
1145
- /* Interactions/primary-press-opacity - Theme - Broker Workplace */
1155
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1146
1156
  --interactions-primary-press-opacity: #19172f33;
1147
- /* Shadow/shadow-10 - Theme - Broker Workplace */
1157
+ /* Shadow/shadow-10 - Theme - BRAND */
1148
1158
  --shadow-10: #0000001a;
1149
- /* Shadow/shadow-12 - Theme - Broker Workplace */
1159
+ /* Shadow/shadow-12 - Theme - BRAND */
1150
1160
  --shadow-12: #0000001f;
1151
- /* Shadow/shadow-15 - Theme - Broker Workplace */
1161
+ /* Shadow/shadow-15 - Theme - BRAND */
1152
1162
  --shadow-15: #00000026;
1153
- /* Shadow/shadow-25 - Theme - Broker Workplace */
1163
+ /* Shadow/shadow-25 - Theme - BRAND */
1154
1164
  --shadow-25: #00000040;
1155
- /* Shadow/shadow-32 - Theme - Broker 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 - Broker Workplace */
1209
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1200
1210
  --stroke-ai-powered-blue: #215ecd;
1201
- /* Stroke/AI-powered/pink - Theme - Broker 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 - Broker Workplace */
1212
- --stroke-brand-secondary-depth: #bc5b3c;
1213
- /* Stroke/Neutral/neutral-base - Brand */
1219
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1220
+ --stroke-brand-secondary: #eb672f;
1221
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1222
+ --stroke-brand-secondary-depth: #c85828;
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 - Broker Workplace */
1240
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1231
1241
  --stroke-neutral-high-contrast: #141414;
1232
- /* Stroke/Neutral/Interactions/disabled-dark - Theme - Broker Workplace */
1242
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1233
1243
  --stroke-neutral-interactions-disabled-dark: #757575;
1234
- /* Stroke/Neutral/Interactions/disabled-light - Theme - Broker Workplace */
1244
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1235
1245
  --stroke-neutral-interactions-disabled-light: #bdbdbd;
1236
- /* Stroke/Neutral/Interactions/focus - Theme - Broker Workplace */
1246
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1237
1247
  --stroke-neutral-interactions-focus: #000000;
1238
- /* Stroke/Neutral/Interactions/inverse-focus - Theme - Broker 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 - Broker Workplace */
1253
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1244
1254
  --stroke-neutral-low-contrast: #e0e0e0;
1245
- /* Surface/AI-powered/blue - Theme - Broker Workplace */
1255
+ /* Surface/AI-powered/blue - Theme - BRAND */
1246
1256
  --surface-ai-powered-blue: #215ecd;
1247
- /* Surface/AI-powered/pink - Theme - Broker 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 - Broker 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 - Broker Workplace */
1256
- --surface-brand-secondary-highlight: #fae9e3;
1257
- /* Surface/Neutral/Interactions/dark-disabled - Theme - Better Home & Garden */
1265
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1266
+ --surface-brand-secondary-highlight: #fce8e0;
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 - Broker 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 - Broker Workplace */
1290
+ /* Surface/Spectrum/blue - Theme - BRAND */
1283
1291
  --surface-spectrum-blue: #dfe9fd;
1284
- /* Surface/Spectrum/green - Theme - Broker Workplace */
1292
+ /* Surface/Spectrum/green - Theme - BRAND */
1285
1293
  --surface-spectrum-green: #deede5;
1286
- /* Surface/Spectrum/lime - Theme - Broker Workplace */
1294
+ /* Surface/Spectrum/lime - Theme - BRAND */
1287
1295
  --surface-spectrum-lime: #f6f7e0;
1288
- /* Surface/Spectrum/magenta - Theme - Broker 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 - Broker Workplace */
1300
+ /* Surface/Spectrum/pink - Theme - BRAND */
1293
1301
  --surface-spectrum-pink: #f9deec;
1294
- /* Surface/Spectrum/purple - Theme - Broker Workplace */
1302
+ /* Surface/Spectrum/purple - Theme - BRAND */
1295
1303
  --surface-spectrum-purple: #e7d9fc;
1296
- /* Surface/Spectrum/red - Theme - Broker Workplace */
1304
+ /* Surface/Spectrum/red - Theme - BRAND */
1297
1305
  --surface-spectrum-red: #f9e1e5;
1298
- /* Surface/Spectrum/teal - Theme - Broker Workplace */
1306
+ /* Surface/Spectrum/teal - Theme - BRAND */
1299
1307
  --surface-spectrum-teal: #d9eceb;
1300
- /* Surface/Spectrum/yellow - Theme - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker Workplace */
1505
- --data-visual-category-7-highlight: #a19abc4d;
1506
- /* Data visual/gradient-end - Theme - Broker 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 - Broker Workplace */
1516
+ /* Data visual/green - Theme - BRAND */
1509
1517
  --data-visual-green: #7cb796;
1510
- /* Data visual/green-highlight - Theme - Broker 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 - Broker Workplace */
1528
+ /* Data visual/red - Theme - BRAND */
1521
1529
  --data-visual-red: #e88997;
1522
- /* Data visual/red-highlight - Theme - Broker Workplace */
1530
+ /* Data visual/red-highlight - Theme - BRAND */
1523
1531
  --data-visual-red-highlight: #4c141d;
1524
- /* Foreground/AI-powered/blue - Theme - Broker Workplace */
1532
+ /* Foreground/AI-powered/blue - Theme - BRAND */
1525
1533
  --foreground-ai-powered-blue: #000000;
1526
- /* Foreground/AI-powered/pink - Theme - Broker Workplace */
1534
+ /* Foreground/AI-powered/pink - Theme - BRAND */
1527
1535
  --foreground-ai-powered-pink: #000000;
1528
- /* Foreground/Brand/on-inverse-primary - Theme - Broker Workplace */
1536
+ /* Foreground/Brand/on-inverse-primary - Theme - BRAND */
1529
1537
  --foreground-brand-on-inverse-primary: #757482;
1530
- /* Foreground/Brand/on-inverse-secondary - Theme - Broker Workplace */
1531
- --foreground-brand-on-inverse-secondary: #eba691;
1532
- /* Foreground/Brand/on-brand-primary - Brand */
1538
+ /* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
1539
+ --foreground-brand-on-inverse-secondary: #f3a482;
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 - Broker Workplace */
1547
- --foreground-brand-secondary-depth: #eba691;
1548
- /* Foreground/Link text/default - Brand */
1554
+ /* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
1555
+ --foreground-brand-secondary-depth: #f6bba1;
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 - Broker Workplace */
1560
+ /* Foreground/Link text/default-hovered - Theme - BRAND */
1553
1561
  --foreground-link-text-default-hovered: #90afe6;
1554
- /* Foreground/Link text/default-pressed - Theme - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker 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 - Broker Workplace */
1604
+ /* Foreground/Spectrum/blue - Theme - BRAND */
1597
1605
  --foreground-spectrum-blue: #88aff7;
1598
- /* Foreground/Spectrum/green - Theme - Broker Workplace */
1606
+ /* Foreground/Spectrum/green - Theme - BRAND */
1599
1607
  --foreground-spectrum-green: #87bd9f;
1600
- /* Foreground/Spectrum/lime - Theme - Broker Workplace */
1608
+ /* Foreground/Spectrum/lime - Theme - BRAND */
1601
1609
  --foreground-spectrum-lime: #dce28f;
1602
- /* Foreground/Spectrum/magenta - Theme - Broker 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 - Broker Workplace */
1614
+ /* Foreground/Spectrum/pink - Theme - BRAND */
1607
1615
  --foreground-spectrum-pink: #ea86b9;
1608
- /* Foreground/Spectrum/purple - Theme - Broker 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 - Broker Workplace */
1620
+ /* Foreground/Spectrum/teal - Theme - BRAND */
1613
1621
  --foreground-spectrum-teal: #74bbb4;
1614
- /* Foreground/Spectrum/yellow - Theme - Broker Workplace */
1622
+ /* Foreground/Spectrum/yellow - Theme - BRAND */
1615
1623
  --foreground-spectrum-yellow: #fada8d;
1616
- /* Interactions/brand-disabled-opacity - Theme - Broker Workplace */
1624
+ /* Interactions/brand-disabled-opacity - Theme - BRAND */
1617
1625
  --interactions-brand-disabled-opacity: #ffffff0f;
1618
- /* Interactions/brand-hover-opacity - Theme - Broker Workplace */
1626
+ /* Interactions/brand-hover-opacity - Theme - BRAND */
1619
1627
  --interactions-brand-hover-opacity: #ffffff1a;
1620
- /* Interactions/brand-press-opacity - Theme - Broker Workplace */
1628
+ /* Interactions/brand-press-opacity - Theme - BRAND */
1621
1629
  --interactions-brand-press-opacity: #ffffff33;
1622
- /* Interactions/disabled-opacity - Theme - Broker Workplace */
1630
+ /* Interactions/disabled-opacity - Theme - BRAND */
1623
1631
  --interactions-disabled-opacity: #ffffff0f;
1624
- /* Interactions/hover-opacity - Theme - Broker 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 - Broker Workplace */
1642
+ /* Interactions/press-opacity - Theme - BRAND */
1635
1643
  --interactions-press-opacity: #ffffff29;
1636
- /* Interactions/primary-disabled-opacity - Theme - Broker Workplace */
1644
+ /* Interactions/primary-disabled-opacity - Theme - BRAND */
1637
1645
  --interactions-primary-disabled-opacity: #7574821f;
1638
- /* Interactions/primary-hover-opacity - Theme - Broker Workplace */
1646
+ /* Interactions/primary-hover-opacity - Theme - BRAND */
1639
1647
  --interactions-primary-hover-opacity: #7574821a;
1640
- /* Interactions/primary-press-opacity - Theme - Broker Workplace */
1648
+ /* Interactions/primary-press-opacity - Theme - BRAND */
1641
1649
  --interactions-primary-press-opacity: #75748233;
1642
- /* Shadow/shadow-10 - Theme - Broker Workplace */
1650
+ /* Shadow/shadow-10 - Theme - BRAND */
1643
1651
  --shadow-10: #6161611a;
1644
- /* Shadow/shadow-12 - Theme - Broker Workplace */
1652
+ /* Shadow/shadow-12 - Theme - BRAND */
1645
1653
  --shadow-12: #6161611f;
1646
- /* Shadow/shadow-15 - Theme - Broker Workplace */
1654
+ /* Shadow/shadow-15 - Theme - BRAND */
1647
1655
  --shadow-15: #61616126;
1648
- /* Shadow/shadow-25 - Theme - Broker Workplace */
1656
+ /* Shadow/shadow-25 - Theme - BRAND */
1649
1657
  --shadow-25: #61616140;
1650
- /* Shadow/shadow-32 - Theme - Broker 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 - Broker Workplace */
1702
+ /* Stroke/AI-powered/blue - Theme - BRAND */
1695
1703
  --stroke-ai-powered-blue: #000000;
1696
- /* Stroke/AI-powered/pink - Theme - Broker 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 - Broker Workplace */
1707
- --stroke-brand-secondary-depth: #eba691;
1708
- /* Stroke/Neutral/neutral-base - Brand */
1712
+ /* Stroke/Brand/brand-secondary - Theme - BRAND */
1713
+ --stroke-brand-secondary: #f3a482;
1714
+ /* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
1715
+ --stroke-brand-secondary-depth: #f6bba1;
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 - Broker Workplace */
1733
+ /* Stroke/Neutral/neutral-high-contrast - Theme - BRAND */
1726
1734
  --stroke-neutral-high-contrast: #fafafa;
1727
- /* Stroke/Neutral/Interactions/disabled-dark - Theme - Broker Workplace */
1735
+ /* Stroke/Neutral/Interactions/disabled-dark - Theme - BRAND */
1728
1736
  --stroke-neutral-interactions-disabled-dark: #3d3d3d;
1729
- /* Stroke/Neutral/Interactions/disabled-light - Theme - Broker Workplace */
1737
+ /* Stroke/Neutral/Interactions/disabled-light - Theme - BRAND */
1730
1738
  --stroke-neutral-interactions-disabled-light: #4d4d4d;
1731
- /* Stroke/Neutral/Interactions/focus - Theme - Broker Workplace */
1739
+ /* Stroke/Neutral/Interactions/focus - Theme - BRAND */
1732
1740
  --stroke-neutral-interactions-focus: #ffffff;
1733
- /* Stroke/Neutral/Interactions/inverse-focus - Theme - Broker 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 - Broker Workplace */
1746
+ /* Stroke/Neutral/neutral-low-contrast - Theme - BRAND */
1739
1747
  --stroke-neutral-low-contrast: #4d4d4d;
1740
- /* Surface/AI-powered/blue - Theme - Broker Workplace */
1748
+ /* Surface/AI-powered/blue - Theme - BRAND */
1741
1749
  --surface-ai-powered-blue: #000000;
1742
- /* Surface/AI-powered/pink - Theme - Broker 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 - Broker 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 - Broker Workplace */
1751
- --surface-brand-secondary-highlight: #371b12;
1752
- /* Surface/Neutral/Interactions/dark-disabled - Theme - Better Home & Garden */
1758
+ /* Surface/Brand/secondary-highlight - Theme - BRAND */
1759
+ --surface-brand-secondary-highlight: #3b1a0c;
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 - Broker 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 - Broker Workplace */
1783
+ /* Surface/Spectrum/blue - Theme - BRAND */
1778
1784
  --surface-spectrum-blue: #0e2754;
1779
- /* Surface/Spectrum/green - Theme - Broker Workplace */
1785
+ /* Surface/Spectrum/green - Theme - BRAND */
1780
1786
  --surface-spectrum-green: #0d2f1c;
1781
- /* Surface/Spectrum/lime - Theme - Broker Workplace */
1787
+ /* Surface/Spectrum/lime - Theme - BRAND */
1782
1788
  --surface-spectrum-lime: #434712;
1783
- /* Surface/Spectrum/magenta - Theme - Broker 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 - Broker Workplace */
1793
+ /* Surface/Spectrum/pink - Theme - BRAND */
1788
1794
  --surface-spectrum-pink: #4c0c2d;
1789
- /* Surface/Spectrum/purple - Theme - Broker Workplace */
1795
+ /* Surface/Spectrum/purple - Theme - BRAND */
1790
1796
  --surface-spectrum-purple: #220053;
1791
- /* Surface/Spectrum/red - Theme - Broker Workplace */
1797
+ /* Surface/Spectrum/red - Theme - BRAND */
1792
1798
  --surface-spectrum-red: #4c141d;
1793
- /* Surface/Spectrum/teal - Theme - Broker Workplace */
1799
+ /* Surface/Spectrum/teal - Theme - BRAND */
1794
1800
  --surface-spectrum-teal: #012e2a;
1795
- /* Surface/Spectrum/yellow - Theme - Broker Workplace */
1801
+ /* Surface/Spectrum/yellow - Theme - BRAND */
1796
1802
  --surface-spectrum-yellow: #564210;
1797
1803
  }
1798
1804
  `));