brandsync-tokens 1.0.24 → 1.0.26

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 (6) hide show
  1. package/dist/css/tokens.css +368 -368
  2. package/dist/dart/BrandsyncTokens.dart +23 -2
  3. package/dist/scss/_brandsync-theme.scss +1341 -0
  4. package/dist/swift/BrandsyncTheme.swift +15 -3
  5. package/dist/swift/BrandsyncToken.swift +17 -1
  6. package/package.json +3 -1
package/dist/css/tokens.css CHANGED
@@ -319,12 +319,12 @@
319
319
  --scale-1600: 128px;
320
320
  --scale-3200: 256px;
321
321
  --scale-6400: 512px;
322
- --scale-600: -48px;
323
- --scale-500: -40px;
324
- --scale-350: -28px;
325
- --scale-200: -16px;
326
- --scale-150: -12px;
327
- --scale-100: -8px;
322
+ --scale--600: -48px;
323
+ --scale--500: -40px;
324
+ --scale--350: -28px;
325
+ --scale--200: -16px;
326
+ --scale--150: -12px;
327
+ --scale--100: -8px;
328
328
  --white: #ffffff;
329
329
  --static-white: #ffffff;
330
330
  --static-black: #000000;
@@ -704,15 +704,15 @@
704
704
  --navigation-header-left-menu: true;
705
705
  --navigation-header-page-label: false;
706
706
  --navigation-header-gap: 40;
707
- --label: Label;
708
- --label: Label;
707
+ --bs-label: Label;
708
+ --bs-label: Label;
709
709
  --icon-primary: {color.icons.secondary};
710
710
  --icon: {color.icons.secondary};
711
711
  --icon-default: {color.icons.secondary};
712
- --radio-bg-default: var(--alpha-5);
713
- --radio-bg-hover: var(--alpha-60);
714
- --radio-bg-focus: var(--alpha-80);
715
- --radio-bg-pressed: var(--alpha-90);
712
+ --bs-radio-bg-default: var(--alpha-5);
713
+ --bs-radio-bg-hover: var(--alpha-60);
714
+ --bs-radio-bg-focus: var(--alpha-80);
715
+ --bs-radio-bg-pressed: var(--alpha-90);
716
716
  --text-style-display-size: var(--font-size-6xl);
717
717
  --text-style-display-line-height: var(--line-height-tight);
718
718
  --text-style-display-letter-spacing: var(--letter-spacing-tight);
@@ -784,360 +784,360 @@
784
784
  --brand-800: var(--brand-colors-blue-800);
785
785
  --brand-900: var(--brand-colors-blue-900);
786
786
  --brand-950: var(--brand-colors-blue-950);
787
- --color-neutral-default: var(--neutral-700);
788
- --color-neutral-hover: var(--neutral-800);
789
- --color-neutral-focused: var(--neutral-800);
790
- --color-neutral-pressed: var(--neutral-900);
791
- --color-neutral-container: var(--neutral-50);
792
- --color-neutral-container-hover: var(--neutral-100);
793
- --color-neutral-container-focused: var(--neutral-200);
794
- --color-neutral-container-pressed: var(--neutral-300);
795
- --color-accent-default: var(--brand-colors-magenta-600);
796
- --color-accent-hover: var(--brand-colors-magenta-700);
797
- --color-accent-active: var(--brand-colors-magenta-800);
798
- --color-accent-container: var(--brand-colors-magenta-100);
799
- --color-success-default: var(--semantic-success-success-600);
800
- --color-success-hover: var(--semantic-success-success-700);
801
- --color-success-focused: var(--semantic-success-success-700);
802
- --color-success-pressed: var(--semantic-success-success-800);
803
- --color-success-container: var(--semantic-success-success-100);
804
- --color-warning-default: var(--semantic-warning-warning-600);
805
- --color-warning-hover: var(--semantic-warning-warning-700);
806
- --color-warning-focused: var(--semantic-warning-warning-700);
807
- --color-warning-pressed: var(--semantic-warning-warning-800);
808
- --color-warning-container: var(--semantic-warning-warning-100);
809
- --color-error-default: var(--semantic-error-error-600);
810
- --color-error-hover: var(--semantic-error-error-700);
811
- --color-error-focused: var(--semantic-error-error-700);
812
- --color-error-pressed: var(--semantic-error-error-800);
813
- --color-error-container: var(--semantic-error-error-100);
814
- --color-info-default: var(--semantic-information-information-600);
815
- --color-info-hover: var(--semantic-information-information-700);
816
- --color-info-focused: var(--semantic-information-information-700);
817
- --color-info-pressed: var(--semantic-information-information-800);
818
- --color-info-container: var(--semantic-information-information-100);
819
- --color-text-static-white: var(--white);
820
- --color-text-static-black: var(--black);
821
- --color-text-default: var(--black);
822
- --color-text-secondary: var(--neutral-600);
823
- --color-text-muted: var(--neutral-500);
824
- --color-text-inverse: var(--static-white);
825
- --color-text-link: var(--semantic-information-information-700);
826
- --color-text-success: var(--semantic-success-success-700);
827
- --color-text-info: var(--semantic-information-information-700);
828
- --color-text-warning: var(--semantic-warning-warning-700);
829
- --color-text-error: var(--semantic-error-error-700);
830
- --color-text-on-action: var(--white);
831
- --color-text-on-disabled: var(--neutral-400);
832
- --color-text-accent: var(--brand-colors-purple-700);
833
- --color-text-inverse-accent: var(--brand-colors-purple-400);
834
- --color-text-neutral-default: var(--neutral-600);
835
- --color-text-neutral-hover: var(--neutral-800);
836
- --color-text-neutral-focused: var(--neutral-800);
837
- --color-text-neutral-pressed: var(--neutral-900);
838
- --color-text-info: var(--semantic-information-information-700);
839
- --color-text-neutral-default: var(--neutral-600);
840
- --color-text-neutral-hover: var(--neutral-800);
841
- --color-text-neutral-focused: var(--neutral-800);
842
- --color-text-neutral-pressed: var(--neutral-900);
843
- --color-surface-base: var(--white);
844
- --color-surface-raised: var(--static-white);
845
- --color-surface-container: var(--neutral-50);
846
- --color-surface-hover: var(--neutral-100);
847
- --color-surface-focus: var(--neutral-100);
848
- --color-surface-pressed: var(--neutral-300);
849
- --color-surface-selected: var(--neutral-50);
850
- --color-surface-selected-hover: var(--neutral-200);
851
- --color-surface-selected-focus: var(--neutral-200);
852
- --color-surface-selected-pressed: var(--neutral-200);
853
- --color-surface-active: var(--neutral-100);
854
- --color-surface-inset: var(--neutral-50);
855
- --color-surface-inverse: var(--neutral-900);
856
- --color-surface-accent: var(--gray-transparent-2);
857
- --color-surface-on-action: var(--gray-25);
858
- --color-surface-on-action-disabled: var(--neutral-300);
859
- --color-surface-action-disabled: var(--neutral-100);
860
- --color-surface-success: var(--semantic-success-success-50);
861
- --color-surface-info: var(--semantic-information-information-50);
862
- --color-surface-warning: var(--semantic-warning-warning-50);
863
- --color-surface-error: var(--semantic-error-error-50);
864
- --color-surface-overlay: var(--neutral-500-transparent);
865
- --color-surface-overlay-level-2: var(--neutral-500-transparent-2);
866
- --color-surface-overlay-level-2: var(--neutral-500-transparent-2);
867
- --color-icons-static-white: var(--white);
868
- --color-icons-static-black: var(--black);
869
- --color-icons-default: var(--neutral-900);
870
- --color-icons-muted: var(--neutral-500);
871
- --color-icons-disabled: var(--neutral-400);
872
- --color-icons-inverse: var(--static-white);
873
- --color-icons-success: var(--semantic-success-success-600);
874
- --color-icons-info: var(--semantic-information-information-700);
875
- --color-icons-warning: var(--semantic-warning-warning-700);
876
- --color-icons-error: var(--semantic-error-error-700);
877
- --color-icons-neutral-default: var(--neutral-700);
878
- --color-icons-neutral-hover: var(--neutral-800);
879
- --color-icons-neutral-focused: var(--neutral-800);
880
- --color-icons-neutral-pressed: var(--neutral-900);
881
- --color-border-default: var(--neutral-100);
882
- --color-border-neutral-hover: var(--neutral-400);
883
- --color-border-neutral-active: var(--neutral-500);
884
- --color-border-neutral-disabled: var(--neutral-200);
885
- --color-border-neutral-container: var(--neutral-200);
886
- --color-border-neutral-container-hover: var(--neutral-300);
887
- --color-border-neutral-container-focused: var(--neutral-300);
888
- --color-border-neutral-container-pressed: var(--neutral-400);
889
- --color-border-success: var(--semantic-success-success-500);
890
- --color-border-success-hover: var(--semantic-success-success-600);
891
- --color-border-success-focus: var(--semantic-success-success-700);
892
- --color-border-warning: var(--semantic-warning-warning-500);
893
- --color-border-warning-hover: var(--semantic-warning-warning-600);
894
- --color-border-warning-focus: var(--semantic-warning-warning-700);
895
- --color-border-error: var(--semantic-error-error-700);
896
- --color-border-error-hover: var(--semantic-error-error-800);
897
- --color-border-error-focus: var(--semantic-error-error-700);
898
- --color-border-info: var(--semantic-information-information-500);
899
- --color-border-info-hover: var(--semantic-information-information-600);
900
- --color-border-info-focus: var(--semantic-information-information-700);
901
- --color-elevation-none: var(--light-mode-0);
902
- --color-elevation-low: var(--light-mode-100);
903
- --color-elevation-medium: var(--light-mode-200);
904
- --color-elevation-high: var(--light-mode-300);
905
- --color-elevation-higher: var(--light-mode-400);
906
- --color-elevation-highest: var(--light-mode-500);
907
- --color-elevation-inner: var(--light-mode-600);
908
- --color-elevation-focus: var(--light-mode-700);
909
- --border-width-0: var(--scale-0);
910
- --border-width-thin: var(--scale-10);
911
- --border-width-medium: var(--scale-25);
912
- --border-width-thick: var(--scale-50);
913
- --border-radius-0: var(--scale-0);
914
- --border-radius-50: var(--scale-50);
915
- --border-radius-75: var(--scale-75);
916
- --border-radius-100: var(--scale-100);
917
- --border-radius-150: var(--scale-150);
918
- --border-radius-200: var(--scale-200);
919
- --border-radius-300: var(--scale-300);
920
- --border-radius-full: var(--scale-1500);
921
- --spacing-0: var(--scale-0);
922
- --spacing-25: var(--scale-25);
923
- --spacing-50: var(--scale-50);
924
- --spacing-75: var(--scale-75);
925
- --spacing-100: var(--scale-100);
926
- --spacing-150: var(--scale-150);
927
- --spacing-200: var(--scale-200);
928
- --spacing-250: var(--scale-250);
929
- --spacing-300: var(--scale-300);
930
- --spacing-350: var(--scale-350);
931
- --spacing-400: var(--scale-400);
932
- --spacing-500: var(--scale-500);
933
- --spacing-550: var(--scale-550);
934
- --spacing-600: var(--scale-600);
935
- --spacing-700: var(--scale-700);
936
- --spacing-800: var(--scale-800);
937
- --spacing-1000: var(--scale-1000);
938
- --spacing-1200: var(--scale-1200);
939
- --spacing-1500: var(--scale-1500);
940
- --spacing-600: var(--scale-600);
941
- --spacing-500: var(--scale-500);
942
- --spacing-350: var(--scale-350);
943
- --spacing-200: var(--scale-200);
944
- --spacing-150: var(--scale-150);
945
- --spacing-100: var(--scale-100);
946
- --sizing-75: var(--scale-75);
947
- --sizing-100: var(--scale-100);
948
- --sizing-200: var(--scale-200);
949
- --sizing-250: var(--scale-250);
950
- --sizing-300: var(--scale-300);
951
- --sizing-400: var(--scale-400);
952
- --sizing-500: var(--scale-500);
953
- --sizing-600: var(--scale-600);
954
- --sizing-700: var(--scale-700);
955
- --sizing-800: var(--scale-800);
956
- --sizing-1000: var(--scale-1000);
957
- --sizing-1200: var(--scale-1200);
958
- --sizing-1600: var(--scale-1600);
959
- --sizing-3200: var(--scale-3200);
960
- --sizing-6400: var(--scale-6400);
961
- --border-width-0: var(--scale-0);
962
- --border-width-thin: var(--scale-10);
963
- --border-width-medium: var(--scale-25);
964
- --border-width-thick: var(--scale-50);
965
- --border-radius-0: var(--scale-0);
966
- --border-radius-50: var(--scale-50);
967
- --border-radius-75: var(--scale-75);
968
- --border-radius-100: var(--scale-100);
969
- --border-radius-150: var(--scale-150);
970
- --border-radius-200: var(--scale-200);
971
- --border-radius-300: var(--scale-300);
972
- --border-radius-full: var(--scale-1500);
973
- --avatar-text-default: var(--color-text-default);
974
- --avatar-text-secondary: var(--color-text-secondary);
975
- --avatar-border-primary: var(--color-border-neutral-container);
976
- --avatar-border-hover: var(--color-border-neutral-container-hover);
977
- --avatar-border-pressed: var(--color-border-neutral-container-pressed);
978
- --avatar-border-focused: var(--color-border-neutral-container);
979
- --avatar-bg-dafault: var(--color-surface-raised);
980
- --avatar-bg-hover: var(--color-surface-raised);
981
- --avatar-bg-pressed: var(--color-surface-raised);
982
- --avatar-bg-focused: var(--color-surface-raised);
983
- --avatar-icon-primary: var(--color-icons-muted);
984
- --switch-track-bg-default: var(--color-surface-active);
985
- --switch-track-bg-hover: var(--color-surface-hover);
986
- --switch-thumb-bg-default: var(--color-surface-base);
987
- --switch-thumb-bg-hover: var(--color-surface-raised);
988
- --switch-thumb-bg-checked: var(--color-surface-base);
989
- --switch-thumb-bg-disabled: var(--color-surface-on-action-disabled);
990
- --switch-track-border-default: var(--color-border-neutral-container);
991
- --switch-track-border-hover: var(--color-border-neutral-container-hover);
992
- --switch-track-bg-disabled: var(--color-surface-action-disabled);
993
- --switch-icon-disabled: var(--color-icons-disabled);
994
- --input-bg-default: var(--color-surface-base);
995
- --input-bg-filled: var(--color-surface-raised);
996
- --input-bg-disabled: var(--color-surface-action-disabled);
997
- --input-border-default: var(--color-border-neutral-container);
998
- --input-border-hover: var(--color-border-neutral-container-hover);
999
- --input-border-disabled: var(--color-border-neutral-disabled);
1000
- --input-border-error: var(--color-border-error);
1001
- --input-text: var(--color-text-default);
1002
- --input-text-success: var(--color-text-success);
1003
- --input-text-disabled: var(--color-text-on-disabled);
1004
- --input-placeholder: var(--color-text-secondary);
1005
- --input-label: var(--color-text-default);
1006
- --input-error: var(--color-text-error);
1007
- --input-description: var(--color-text-secondary);
1008
- --input-icon-error: var(--color-icons-error);
1009
- --input-icon-success: var(--color-icons-success);
1010
- --input-icon-disabled: var(--color-icons-disabled);
1011
- --input-error: var(--color-text-error);
1012
- --chip-text-default: var(--color-text-default);
1013
- --chip-text-static: var(--color-text-static-white);
1014
- --chip-text-primary: var(--color-text-default);
1015
- --chip-text-on-primary: var(--color-text-on-action);
1016
- --chip-text-warning: var(--color-text-warning);
1017
- --chip-text-success: var(--color-text-success);
1018
- --chip-text-neutral: var(--color-text-default);
1019
- --chip-text-inverse: var(--color-text-inverse);
1020
- --chip-text-info: var(--color-text-info);
1021
- --chip-text-error: var(--color-text-error);
1022
- --chip-text-disabled: var(--color-text-on-disabled);
1023
- --chip-icon-static: var(--color-icons-static-white);
1024
- --chip-icon-default: var(--color-icons-default);
1025
- --chip-icon-inverse: var(--color-icons-inverse);
1026
- --chip-icon-success: var(--color-icons-success);
1027
- --chip-icon-warning: var(--color-icons-warning);
1028
- --chip-icon-info: var(--color-icons-info);
1029
- --chip-icon-error: var(--color-icons-error);
1030
- --chip-icon-disabled: var(--color-icons-disabled);
1031
- --chip-border-default: var(--color-border-default);
1032
- --chip-border-inverse: var(--color-border-neutral-container);
1033
- --chip-bg-default: var(--color-surface-action-disabled);
1034
- --chip-bg-neutral: var(--color-neutral-default);
1035
- --chip-bg-neutral-container: var(--color-neutral-container);
1036
- --chip-bg-inverse: var(--color-surface-inset);
1037
- --chip-bg-success: var(--color-success-default);
1038
- --chip-bg-success-container: var(--color-success-container);
1039
- --chip-bg-warning: var(--color-warning-default);
1040
- --chip-bg-warning-container: var(--color-warning-container);
1041
- --chip-bg-info: var(--color-info-default);
1042
- --chip-bg-info-container: var(--color-info-container);
1043
- --chip-bg-error: var(--color-error-default);
1044
- --chip-bg-error-container: var(--color-error-container);
1045
- --chip-bg-primary: var(--color-neutral-default);
1046
- --chip-bg-primary-hover: var(--color-neutral-hover);
1047
- --chip-bg-primary-focused: var(--color-neutral-focused);
1048
- --chip-bg-primary-pressed: var(--color-neutral-pressed);
1049
- --chip-bg-primary-container: var(--color-neutral-container);
1050
- --chip-bg-primary-container-hover: var(--color-neutral-container-hover);
1051
- --chip-bg-primary-container-focused: var(--color-neutral-container-focused);
1052
- --chip-bg-primary-container-pressed: var(--color-neutral-container-pressed);
1053
- --chip-bg-disabled: var(--color-surface-action-disabled);
1054
- --badge-bg-default: var(--color-surface-action-disabled);
1055
- --badge-bg-success: var(--color-success-default);
1056
- --badge-bg-success-container: var(--color-success-container);
1057
- --badge-bg-warning: var(--color-warning-default);
1058
- --badge-bg-warning-container: var(--color-warning-container);
1059
- --badge-bg-info: var(--color-info-default);
1060
- --badge-bg-info-container: var(--color-info-container);
1061
- --badge-bg-error: var(--color-error-default);
1062
- --badge-bg-error-container: var(--color-error-container);
1063
- --badge-bg-neutral: var(--color-neutral-default);
1064
- --badge-bg-neutral-container: var(--color-neutral-container);
1065
- --badge-bg-inverse: var(--color-surface-inset);
1066
- --badge-border-default: var(--color-border-default);
1067
- --badge-text-default: var(--color-text-default);
1068
- --badge-text-neutral: var(--color-text-default);
1069
- --badge-text-inverse: var(--color-text-inverse);
1070
- --badge-text-warning: var(--color-text-warning);
1071
- --badge-text-info: var(--color-text-info);
1072
- --badge-text-error: var(--color-text-error);
1073
- --badge-text-success: var(--color-text-success);
1074
- --radio-bg-disabled: var(--color-surface-action-disabled);
1075
- --radio-enabled-border-default: var(--color-border-default);
1076
- --radio-enabled-border-hover: var(--color-border-neutral-hover);
1077
- --radio-enabled-border-focus: var(--color-border-neutral-hover);
1078
- --radio-enabled-border-pressed: var(--color-border-neutral-active);
1079
- --radio-border-disabled: var(--color-border-neutral-disabled);
1080
- --radio-icon-disabled: var(--color-icons-muted);
1081
- --radio-label-default: var(--color-text-default);
1082
- --radio-label-disabled: var(--color-text-muted);
1083
- --paper-bg-base: var(--color-surface-base);
1084
- --paper-bg-raised: var(--color-surface-raised);
1085
- --paper-bg-container: var(--color-surface-container);
1086
- --paper-bg-hover: var(--color-surface-hover);
1087
- --paper-bg-disabled: var(--color-surface-action-disabled);
1088
- --paper-border-surface: var(--color-border-neutral-container);
1089
- --button-primary-disabled: var(--color-surface-action-disabled);
1090
- --button-neutral-default: var(--color-neutral-default);
1091
- --button-neutral-hover: var(--color-neutral-hover);
1092
- --button-neutral-focus: var(--color-neutral-container-focused);
1093
- --button-neutral-disabled: var(--color-surface-action-disabled);
1094
- --button-neutral-container: var(--color-neutral-container);
1095
- --grid-gutter: var(--spacing-200); /** Gap between columns (16px) */
1096
- --grid-margin-sm: var(--spacing-200); /** Page edge on mobile (16px) */
1097
- --grid-margin-md: var(--spacing-300); /** Page edge on tablet (24px) */
1098
- --grid-margin-lg: var(--spacing-400); /** Page edge on desktop (32px) */
1099
- --grid-sidebar-width: var(--sizing-3200); /** Standard sidebar width (256px) */
1100
- --grid-panel-min-width: var(--sizing-3200); /** Minimum panel width (256px) */
1101
- --color-primary-default: var(--brand-600);
1102
- --color-primary-hover: var(--brand-700);
1103
- --color-primary-focused: var(--brand-700);
1104
- --color-primary-pressed: var(--brand-800);
1105
- --color-primary-container: var(--brand-50);
1106
- --color-primary-container-hover: var(--brand-100);
1107
- --color-text-action: var(--brand-600);
1108
- --color-text-action-hover: var(--brand-700);
1109
- --color-icons-action: var(--brand-600);
1110
- --color-icons-action-hover: var(--brand-700);
1111
- --color-border-neutral-focus: var(--brand-600);
1112
- --color-border-primary: var(--brand-500);
1113
- --color-border-primary-hover: var(--brand-600);
1114
- --color-border-primary-focus: var(--brand-600);
1115
- --color-border-primary-pressed: var(--brand-700);
1116
- --avatar-text-primary: var(--color-text-action);
1117
- --avatar-border-focus: var(--color-border-neutral-focus);
1118
- --switch-track-bg-checked-default: var(--color-primary-default);
1119
- --switch-track-bg-checked-hover: var(--color-primary-hover);
1120
- --switch-track-bg-checked-focused: var(--color-primary-focused);
1121
- --switch-track-border-focus: var(--color-border-neutral-focus);
1122
- --switch-icon-checked: var(--color-icons-action);
1123
- --input-border-focus: var(--color-border-neutral-focus);
1124
- --input-label-focus: var(--color-primary-default);
1125
- --chip-border-focus: var(--color-border-neutral-focus);
1126
- --badge-bg-primary: var(--color-primary-default);
1127
- --badge-bg-primary-container: var(--color-primary-container);
1128
- --badge-text-primary: var(--color-text-action);
1129
- --radio-selected-border-default: var(--color-border-primary);
1130
- --radio-selected-border-hover: var(--color-border-primary-hover);
1131
- --radio-selected-border-focus: var(--color-border-primary-focus);
1132
- --radio-selected-border-pressed: var(--color-border-primary-pressed);
1133
- --radio-icon-checked: var(--color-icons-action);
1134
- --radio-icon-hover: var(--color-icons-action-hover);
1135
- --radio-focus-ring: var(--color-border-neutral-focus);
1136
- --button-primary-default: var(--color-primary-default);
1137
- --button-primary-hover: var(--color-primary-hover);
1138
- --button-primary-focus: var(--color-primary-focused);
1139
- --button-primary-pressed: var(--color-primary-pressed);
1140
- --button-primary-container: var(--color-primary-container);
1141
- --button-neutral-pressed: var(--color-primary-pressed);
1142
- --color-surface-action: var(--color-primary-default);
787
+ --bs-color-neutral-default: var(--neutral-700);
788
+ --bs-color-neutral-hover: var(--neutral-800);
789
+ --bs-color-neutral-focused: var(--neutral-800);
790
+ --bs-color-neutral-pressed: var(--neutral-900);
791
+ --bs-color-neutral-container: var(--neutral-50);
792
+ --bs-color-neutral-container-hover: var(--neutral-100);
793
+ --bs-color-neutral-container-focused: var(--neutral-200);
794
+ --bs-color-neutral-container-pressed: var(--neutral-300);
795
+ --bs-color-accent-default: var(--brand-colors-magenta-600);
796
+ --bs-color-accent-hover: var(--brand-colors-magenta-700);
797
+ --bs-color-accent-active: var(--brand-colors-magenta-800);
798
+ --bs-color-accent-container: var(--brand-colors-magenta-100);
799
+ --bs-color-success-default: var(--semantic-success-success-600);
800
+ --bs-color-success-hover: var(--semantic-success-success-700);
801
+ --bs-color-success-focused: var(--semantic-success-success-700);
802
+ --bs-color-success-pressed: var(--semantic-success-success-800);
803
+ --bs-color-success-container: var(--semantic-success-success-100);
804
+ --bs-color-warning-default: var(--semantic-warning-warning-600);
805
+ --bs-color-warning-hover: var(--semantic-warning-warning-700);
806
+ --bs-color-warning-focused: var(--semantic-warning-warning-700);
807
+ --bs-color-warning-pressed: var(--semantic-warning-warning-800);
808
+ --bs-color-warning-container: var(--semantic-warning-warning-100);
809
+ --bs-color-error-default: var(--semantic-error-error-600);
810
+ --bs-color-error-hover: var(--semantic-error-error-700);
811
+ --bs-color-error-focused: var(--semantic-error-error-700);
812
+ --bs-color-error-pressed: var(--semantic-error-error-800);
813
+ --bs-color-error-container: var(--semantic-error-error-100);
814
+ --bs-color-info-default: var(--semantic-information-information-600);
815
+ --bs-color-info-hover: var(--semantic-information-information-700);
816
+ --bs-color-info-focused: var(--semantic-information-information-700);
817
+ --bs-color-info-pressed: var(--semantic-information-information-800);
818
+ --bs-color-info-container: var(--semantic-information-information-100);
819
+ --bs-color-text-static-white: var(--white);
820
+ --bs-color-text-static-black: var(--black);
821
+ --bs-color-text-default: var(--black);
822
+ --bs-color-text-secondary: var(--neutral-600);
823
+ --bs-color-text-muted: var(--neutral-500);
824
+ --bs-color-text-inverse: var(--static-white);
825
+ --bs-color-text-link: var(--semantic-information-information-700);
826
+ --bs-color-text-success: var(--semantic-success-success-700);
827
+ --bs-color-text-info: var(--semantic-information-information-700);
828
+ --bs-color-text-warning: var(--semantic-warning-warning-700);
829
+ --bs-color-text-error: var(--semantic-error-error-700);
830
+ --bs-color-text-on-action: var(--white);
831
+ --bs-color-text-on-disabled: var(--neutral-400);
832
+ --bs-color-text-accent: var(--brand-colors-purple-700);
833
+ --bs-color-text-inverse-accent: var(--brand-colors-purple-400);
834
+ --bs-color-text-neutral---default: var(--neutral-600);
835
+ --bs-color-text-neutral---hover: var(--neutral-800);
836
+ --bs-color-text-neutral---focused: var(--neutral-800);
837
+ --bs-color-text-neutral---pressed: var(--neutral-900);
838
+ --bs-color-text-info: var(--semantic-information-information-700);
839
+ --bs-color-text-neutral-default: var(--neutral-600);
840
+ --bs-color-text-neutral-hover: var(--neutral-800);
841
+ --bs-color-text-neutral-focused: var(--neutral-800);
842
+ --bs-color-text-neutral-pressed: var(--neutral-900);
843
+ --bs-color-surface-base: var(--white);
844
+ --bs-color-surface-raised: var(--static-white);
845
+ --bs-color-surface-container: var(--neutral-50);
846
+ --bs-color-surface-hover: var(--neutral-100);
847
+ --bs-color-surface-focus: var(--neutral-100);
848
+ --bs-color-surface-pressed: var(--neutral-300);
849
+ --bs-color-surface-selected: var(--neutral-50);
850
+ --bs-color-surface-selected-hover: var(--neutral-200);
851
+ --bs-color-surface-selected-focus: var(--neutral-200);
852
+ --bs-color-surface-selected-pressed: var(--neutral-200);
853
+ --bs-color-surface-active: var(--neutral-100);
854
+ --bs-color-surface-inset: var(--neutral-50);
855
+ --bs-color-surface-inverse: var(--neutral-900);
856
+ --bs-color-surface-accent: var(--gray-transparent-2);
857
+ --bs-color-surface-on-action: var(--gray-25);
858
+ --bs-color-surface-on-action-disabled: var(--neutral-300);
859
+ --bs-color-surface-action-disabled: var(--neutral-100);
860
+ --bs-color-surface-success: var(--semantic-success-success-50);
861
+ --bs-color-surface-info: var(--semantic-information-information-50);
862
+ --bs-color-surface-warning: var(--semantic-warning-warning-50);
863
+ --bs-color-surface-error: var(--semantic-error-error-50);
864
+ --bs-color-surface-overlay: var(--neutral-500-transparent);
865
+ --bs-color-surface-overlay-level-2: var(--neutral-500-transparent-2);
866
+ --bs-color-surface-overlay-level-2: var(--neutral-500-transparent-2);
867
+ --bs-color-icons-static-white: var(--white);
868
+ --bs-color-icons-static-black: var(--black);
869
+ --bs-color-icons-default: var(--neutral-900);
870
+ --bs-color-icons-muted: var(--neutral-500);
871
+ --bs-color-icons-disabled: var(--neutral-400);
872
+ --bs-color-icons-inverse: var(--static-white);
873
+ --bs-color-icons-success: var(--semantic-success-success-600);
874
+ --bs-color-icons-info: var(--semantic-information-information-700);
875
+ --bs-color-icons-warning: var(--semantic-warning-warning-700);
876
+ --bs-color-icons-error: var(--semantic-error-error-700);
877
+ --bs-color-icons-neutral-default: var(--neutral-700);
878
+ --bs-color-icons-neutral-hover: var(--neutral-800);
879
+ --bs-color-icons-neutral-focused: var(--neutral-800);
880
+ --bs-color-icons-neutral-pressed: var(--neutral-900);
881
+ --bs-color-border-default: var(--neutral-100);
882
+ --bs-color-border-neutral-hover: var(--neutral-400);
883
+ --bs-color-border-neutral-active: var(--neutral-500);
884
+ --bs-color-border-neutral-disabled: var(--neutral-200);
885
+ --bs-color-border-neutral-container: var(--neutral-200);
886
+ --bs-color-border-neutral-container-hover: var(--neutral-300);
887
+ --bs-color-border-neutral-container-focused: var(--neutral-300);
888
+ --bs-color-border-neutral-container-pressed: var(--neutral-400);
889
+ --bs-color-border-success: var(--semantic-success-success-500);
890
+ --bs-color-border-success-hover: var(--semantic-success-success-600);
891
+ --bs-color-border-success-focus: var(--semantic-success-success-700);
892
+ --bs-color-border-warning: var(--semantic-warning-warning-500);
893
+ --bs-color-border-warning-hover: var(--semantic-warning-warning-600);
894
+ --bs-color-border-warning-focus: var(--semantic-warning-warning-700);
895
+ --bs-color-border-error: var(--semantic-error-error-700);
896
+ --bs-color-border-error-hover: var(--semantic-error-error-800);
897
+ --bs-color-border-error-focus: var(--semantic-error-error-700);
898
+ --bs-color-border-info: var(--semantic-information-information-500);
899
+ --bs-color-border-info-hover: var(--semantic-information-information-600);
900
+ --bs-color-border-info-focus: var(--semantic-information-information-700);
901
+ --bs-color-elevation-none: var(--light-mode-0);
902
+ --bs-color-elevation-low: var(--light-mode-100);
903
+ --bs-color-elevation-medium: var(--light-mode-200);
904
+ --bs-color-elevation-high: var(--light-mode-300);
905
+ --bs-color-elevation-higher: var(--light-mode-400);
906
+ --bs-color-elevation-highest: var(--light-mode-500);
907
+ --bs-color-elevation-inner: var(--light-mode-600);
908
+ --bs-color-elevation-focus: var(--light-mode-700);
909
+ --bs-border-width-0: var(--scale-0);
910
+ --bs-border-width-thin: var(--scale-10);
911
+ --bs-border-width-medium: var(--scale-25);
912
+ --bs-border-width-thick: var(--scale-50);
913
+ --bs-border-radius-0: var(--scale-0);
914
+ --bs-border-radius-50: var(--scale-50);
915
+ --bs-border-radius-75: var(--scale-75);
916
+ --bs-border-radius-100: var(--scale-100);
917
+ --bs-border-radius-150: var(--scale-150);
918
+ --bs-border-radius-200: var(--scale-200);
919
+ --bs-border-radius-300: var(--scale-300);
920
+ --bs-border-radius-full: var(--scale-1500);
921
+ --bs-spacing-0: var(--scale-0);
922
+ --bs-spacing-25: var(--scale-25);
923
+ --bs-spacing-50: var(--scale-50);
924
+ --bs-spacing-75: var(--scale-75);
925
+ --bs-spacing-100: var(--scale-100);
926
+ --bs-spacing-150: var(--scale-150);
927
+ --bs-spacing-200: var(--scale-200);
928
+ --bs-spacing-250: var(--scale-250);
929
+ --bs-spacing-300: var(--scale-300);
930
+ --bs-spacing-350: var(--scale-350);
931
+ --bs-spacing-400: var(--scale-400);
932
+ --bs-spacing-500: var(--scale-500);
933
+ --bs-spacing-550: var(--scale-550);
934
+ --bs-spacing-600: var(--scale-600);
935
+ --bs-spacing-700: var(--scale-700);
936
+ --bs-spacing-800: var(--scale-800);
937
+ --bs-spacing-1000: var(--scale-1000);
938
+ --bs-spacing-1200: var(--scale-1200);
939
+ --bs-spacing-1500: var(--scale-1500);
940
+ --bs-spacing--600: var(--scale--600);
941
+ --bs-spacing--500: var(--scale--500);
942
+ --bs-spacing--350: var(--scale--350);
943
+ --bs-spacing--200: var(--scale--200);
944
+ --bs-spacing--150: var(--scale--150);
945
+ --bs-spacing--100: var(--scale--100);
946
+ --bs-sizing-75: var(--scale-75);
947
+ --bs-sizing-100: var(--scale-100);
948
+ --bs-sizing-200: var(--scale-200);
949
+ --bs-sizing-250: var(--scale-250);
950
+ --bs-sizing-300: var(--scale-300);
951
+ --bs-sizing-400: var(--scale-400);
952
+ --bs-sizing-500: var(--scale-500);
953
+ --bs-sizing-600: var(--scale-600);
954
+ --bs-sizing-700: var(--scale-700);
955
+ --bs-sizing-800: var(--scale-800);
956
+ --bs-sizing-1000: var(--scale-1000);
957
+ --bs-sizing-1200: var(--scale-1200);
958
+ --bs-sizing-1600: var(--scale-1600);
959
+ --bs-sizing-3200: var(--scale-3200);
960
+ --bs-sizing-6400: var(--scale-6400);
961
+ --bs-border-width-0: var(--scale-0);
962
+ --bs-border-width-thin: var(--scale-10);
963
+ --bs-border-width-medium: var(--scale-25);
964
+ --bs-border-width-thick: var(--scale-50);
965
+ --bs-border-radius-0: var(--scale-0);
966
+ --bs-border-radius-50: var(--scale-50);
967
+ --bs-border-radius-75: var(--scale-75);
968
+ --bs-border-radius-100: var(--scale-100);
969
+ --bs-border-radius-150: var(--scale-150);
970
+ --bs-border-radius-200: var(--scale-200);
971
+ --bs-border-radius-300: var(--scale-300);
972
+ --bs-border-radius-full: var(--scale-1500);
973
+ --bs-avatar-text-default: var(--bs-color-text-default);
974
+ --bs-avatar-text-secondary: var(--bs-color-text-secondary);
975
+ --bs-avatar-border-primary: var(--bs-color-border-neutral-container);
976
+ --bs-avatar-border-hover: var(--bs-color-border-neutral-container-hover);
977
+ --bs-avatar-border-pressed: var(--bs-color-border-neutral-container-pressed);
978
+ --bs-avatar-border-focused: var(--bs-color-border-neutral-container);
979
+ --bs-avatar-bg-dafault: var(--bs-color-surface-raised);
980
+ --bs-avatar-bg-hover: var(--bs-color-surface-raised);
981
+ --bs-avatar-bg-pressed: var(--bs-color-surface-raised);
982
+ --bs-avatar-bg-focused: var(--bs-color-surface-raised);
983
+ --bs-avatar-icon-primary: var(--bs-color-icons-muted);
984
+ --bs-switch-track-bg-default: var(--bs-color-surface-active);
985
+ --bs-switch-track-bg-hover: var(--bs-color-surface-hover);
986
+ --bs-switch-thumb-bg-default: var(--bs-color-surface-base);
987
+ --bs-switch-thumb-bg-hover: var(--bs-color-surface-raised);
988
+ --bs-switch-thumb-bg-checked: var(--bs-color-surface-base);
989
+ --bs-switch-thumb-bg-disabled: var(--bs-color-surface-on-action-disabled);
990
+ --bs-switch-track-border-default: var(--bs-color-border-neutral-container);
991
+ --bs-switch-track-border-hover: var(--bs-color-border-neutral-container-hover);
992
+ --bs-switch-track-bg-disabled: var(--bs-color-surface-action-disabled);
993
+ --bs-switch-icon-disabled: var(--bs-color-icons-disabled);
994
+ --bs-input-bg-default: var(--bs-color-surface-base);
995
+ --bs-input-bg-filled: var(--bs-color-surface-raised);
996
+ --bs-input-bg-disabled: var(--bs-color-surface-action-disabled);
997
+ --bs-input-border-default: var(--bs-color-border-neutral-container);
998
+ --bs-input-border-hover: var(--bs-color-border-neutral-container-hover);
999
+ --bs-input-border-disabled: var(--bs-color-border-neutral-disabled);
1000
+ --bs-input-border-error: var(--bs-color-border-error);
1001
+ --bs-input-text: var(--bs-color-text-default);
1002
+ --bs-input-text-success: var(--bs-color-text-success);
1003
+ --bs-input-text-disabled: var(--bs-color-text-on-disabled);
1004
+ --bs-input-placeholder: var(--bs-color-text-secondary);
1005
+ --bs-input-label: var(--bs-color-text-default);
1006
+ --bs-input-error: var(--bs-color-text-error);
1007
+ --bs-input-description: var(--bs-color-text-secondary);
1008
+ --bs-input-icon-error: var(--bs-color-icons-error);
1009
+ --bs-input-icon-success: var(--bs-color-icons-success);
1010
+ --bs-input-icon-disabled: var(--bs-color-icons-disabled);
1011
+ --bs-input-error: var(--bs-color-text-error);
1012
+ --bs-chip-text-default: var(--bs-color-text-default);
1013
+ --bs-chip-text-static: var(--bs-color-text-static-white);
1014
+ --bs-chip-text-primary: var(--bs-color-text-default);
1015
+ --bs-chip-text-on-primary: var(--bs-color-text-on-action);
1016
+ --bs-chip-text-warning: var(--bs-color-text-warning);
1017
+ --bs-chip-text-success: var(--bs-color-text-success);
1018
+ --bs-chip-text-neutral: var(--bs-color-text-default);
1019
+ --bs-chip-text-inverse: var(--bs-color-text-inverse);
1020
+ --bs-chip-text-info: var(--bs-color-text-info);
1021
+ --bs-chip-text-error: var(--bs-color-text-error);
1022
+ --bs-chip-text-disabled: var(--bs-color-text-on-disabled);
1023
+ --bs-chip-icon-static: var(--bs-color-icons-static-white);
1024
+ --bs-chip-icon-default: var(--bs-color-icons-default);
1025
+ --bs-chip-icon-inverse: var(--bs-color-icons-inverse);
1026
+ --bs-chip-icon-success: var(--bs-color-icons-success);
1027
+ --bs-chip-icon-warning: var(--bs-color-icons-warning);
1028
+ --bs-chip-icon-info: var(--bs-color-icons-info);
1029
+ --bs-chip-icon-error: var(--bs-color-icons-error);
1030
+ --bs-chip-icon-disabled: var(--bs-color-icons-disabled);
1031
+ --bs-chip-border-default: var(--bs-color-border-default);
1032
+ --bs-chip-border-inverse: var(--bs-color-border-neutral-container);
1033
+ --bs-chip-bg-default: var(--bs-color-surface-action-disabled);
1034
+ --bs-chip-bg-neutral: var(--bs-color-neutral-default);
1035
+ --bs-chip-bg-neutral-container: var(--bs-color-neutral-container);
1036
+ --bs-chip-bg-inverse: var(--bs-color-surface-inset);
1037
+ --bs-chip-bg-success: var(--bs-color-success-default);
1038
+ --bs-chip-bg-success-container: var(--bs-color-success-container);
1039
+ --bs-chip-bg-warning: var(--bs-color-warning-default);
1040
+ --bs-chip-bg-warning-container: var(--bs-color-warning-container);
1041
+ --bs-chip-bg-info: var(--bs-color-info-default);
1042
+ --bs-chip-bg-info-container: var(--bs-color-info-container);
1043
+ --bs-chip-bg-error: var(--bs-color-error-default);
1044
+ --bs-chip-bg-error-container: var(--bs-color-error-container);
1045
+ --bs-chip-bg-primary: var(--bs-color-neutral-default);
1046
+ --bs-chip-bg-primary-hover: var(--bs-color-neutral-hover);
1047
+ --bs-chip-bg-primary-focused: var(--bs-color-neutral-focused);
1048
+ --bs-chip-bg-primary-pressed: var(--bs-color-neutral-pressed);
1049
+ --bs-chip-bg-primary-container: var(--bs-color-neutral-container);
1050
+ --bs-chip-bg-primary-container-hover: var(--bs-color-neutral-container-hover);
1051
+ --bs-chip-bg-primary-container-focused: var(--bs-color-neutral-container-focused);
1052
+ --bs-chip-bg-primary-container-pressed: var(--bs-color-neutral-container-pressed);
1053
+ --bs-chip-bg-disabled: var(--bs-color-surface-action-disabled);
1054
+ --bs-badge-bg-default: var(--bs-color-surface-action-disabled);
1055
+ --bs-badge-bg-success: var(--bs-color-success-default);
1056
+ --bs-badge-bg-success-container: var(--bs-color-success-container);
1057
+ --bs-badge-bg-warning: var(--bs-color-warning-default);
1058
+ --bs-badge-bg-warning-container: var(--bs-color-warning-container);
1059
+ --bs-badge-bg-info: var(--bs-color-info-default);
1060
+ --bs-badge-bg-info-container: var(--bs-color-info-container);
1061
+ --bs-badge-bg-error: var(--bs-color-error-default);
1062
+ --bs-badge-bg-error-container: var(--bs-color-error-container);
1063
+ --bs-badge-bg-neutral: var(--bs-color-neutral-default);
1064
+ --bs-badge-bg-neutral-container: var(--bs-color-neutral-container);
1065
+ --bs-badge-bg-inverse: var(--bs-color-surface-inset);
1066
+ --bs-badge-border-default: var(--bs-color-border-default);
1067
+ --bs-badge-text-default: var(--bs-color-text-default);
1068
+ --bs-badge-text-neutral: var(--bs-color-text-default);
1069
+ --bs-badge-text-inverse: var(--bs-color-text-inverse);
1070
+ --bs-badge-text-warning: var(--bs-color-text-warning);
1071
+ --bs-badge-text-info: var(--bs-color-text-info);
1072
+ --bs-badge-text-error: var(--bs-color-text-error);
1073
+ --bs-badge-text-success: var(--bs-color-text-success);
1074
+ --bs-radio-bg-disabled: var(--bs-color-surface-action-disabled);
1075
+ --bs-radio-enabled-border-default: var(--bs-color-border-default);
1076
+ --bs-radio-enabled-border-hover: var(--bs-color-border-neutral-hover);
1077
+ --bs-radio-enabled-border-focus: var(--bs-color-border-neutral-hover);
1078
+ --bs-radio-enabled-border-pressed: var(--bs-color-border-neutral-active);
1079
+ --bs-radio-border-disabled: var(--bs-color-border-neutral-disabled);
1080
+ --bs-radio-icon-disabled: var(--bs-color-icons-muted);
1081
+ --bs-radio-label-default: var(--bs-color-text-default);
1082
+ --bs-radio-label-disabled: var(--bs-color-text-muted);
1083
+ --bs-paper-bg-base: var(--bs-color-surface-base);
1084
+ --bs-paper-bg-raised: var(--bs-color-surface-raised);
1085
+ --bs-paper-bg-container: var(--bs-color-surface-container);
1086
+ --bs-paper-bg-hover: var(--bs-color-surface-hover);
1087
+ --bs-paper-bg-disabled: var(--bs-color-surface-action-disabled);
1088
+ --bs-paper-border-surface: var(--bs-color-border-neutral-container);
1089
+ --bs-button-primary-disabled: var(--bs-color-surface-action-disabled);
1090
+ --bs-button-neutral-default: var(--bs-color-neutral-default);
1091
+ --bs-button-neutral-hover: var(--bs-color-neutral-hover);
1092
+ --bs-button-neutral-focus: var(--bs-color-neutral-container-focused);
1093
+ --bs-button-neutral-disabled: var(--bs-color-surface-action-disabled);
1094
+ --bs-button-neutral-container: var(--bs-color-neutral-container);
1095
+ --grid-gutter: var(--bs-spacing-200); /** Gap between columns (16px) */
1096
+ --grid-margin-sm: var(--bs-spacing-200); /** Page edge on mobile (16px) */
1097
+ --grid-margin-md: var(--bs-spacing-300); /** Page edge on tablet (24px) */
1098
+ --grid-margin-lg: var(--bs-spacing-400); /** Page edge on desktop (32px) */
1099
+ --grid-sidebar-width: var(--bs-sizing-3200); /** Standard sidebar width (256px) */
1100
+ --grid-panel-min-width: var(--bs-sizing-3200); /** Minimum panel width (256px) */
1101
+ --bs-color-primary-default: var(--brand-600);
1102
+ --bs-color-primary-hover: var(--brand-700);
1103
+ --bs-color-primary-focused: var(--brand-700);
1104
+ --bs-color-primary-pressed: var(--brand-800);
1105
+ --bs-color-primary-container: var(--brand-50);
1106
+ --bs-color-primary-container-hover: var(--brand-100);
1107
+ --bs-color-text-action: var(--brand-600);
1108
+ --bs-color-text-action-hover: var(--brand-700);
1109
+ --bs-color-icons-action: var(--brand-600);
1110
+ --bs-color-icons-action-hover: var(--brand-700);
1111
+ --bs-color-border-neutral-focus: var(--brand-600);
1112
+ --bs-color-border-primary: var(--brand-500);
1113
+ --bs-color-border-primary-hover: var(--brand-600);
1114
+ --bs-color-border-primary-focus: var(--brand-600);
1115
+ --bs-color-border-primary-pressed: var(--brand-700);
1116
+ --bs-avatar-text-primary: var(--bs-color-text-action);
1117
+ --bs-avatar-border-focus: var(--bs-color-border-neutral-focus);
1118
+ --bs-switch-track-bg-checked-default: var(--bs-color-primary-default);
1119
+ --bs-switch-track-bg-checked-hover: var(--bs-color-primary-hover);
1120
+ --bs-switch-track-bg-checked-focused: var(--bs-color-primary-focused);
1121
+ --bs-switch-track-border-focus: var(--bs-color-border-neutral-focus);
1122
+ --bs-switch-icon-checked: var(--bs-color-icons-action);
1123
+ --bs-input-border-focus: var(--bs-color-border-neutral-focus);
1124
+ --bs-input-label-focus: var(--bs-color-primary-default);
1125
+ --bs-chip-border-focus: var(--bs-color-border-neutral-focus);
1126
+ --bs-badge-bg-primary: var(--bs-color-primary-default);
1127
+ --bs-badge-bg-primary-container: var(--bs-color-primary-container);
1128
+ --bs-badge-text-primary: var(--bs-color-text-action);
1129
+ --bs-radio-selected-border-default: var(--bs-color-border-primary);
1130
+ --bs-radio-selected-border-hover: var(--bs-color-border-primary-hover);
1131
+ --bs-radio-selected-border-focus: var(--bs-color-border-primary-focus);
1132
+ --bs-radio-selected-border-pressed: var(--bs-color-border-primary-pressed);
1133
+ --bs-radio-icon-checked: var(--bs-color-icons-action);
1134
+ --bs-radio-icon-hover: var(--bs-color-icons-action-hover);
1135
+ --bs-radio-focus-ring: var(--bs-color-border-neutral-focus);
1136
+ --bs-button-primary-default: var(--bs-color-primary-default);
1137
+ --bs-button-primary-hover: var(--bs-color-primary-hover);
1138
+ --bs-button-primary-focus: var(--bs-color-primary-focused);
1139
+ --bs-button-primary-pressed: var(--bs-color-primary-pressed);
1140
+ --bs-button-primary-container: var(--bs-color-primary-container);
1141
+ --bs-button-neutral-pressed: var(--bs-color-primary-pressed);
1142
+ --bs-color-surface-action: var(--bs-color-primary-default);
1143
1143
  }