@gitlab/ui 134.6.0 → 134.8.0

package/src/tokens/build/json/tokens.json

@@ -824,6 +824,7 @@
           "key": "{color.alpha.light.36}",
           "$value": "rgba(255, 255, 255, 0.36)",
           "$type": "color",
+          "$deprecated": true,
           "$extensions": {
             "com.figma.scopes": []
           },
@@ -832,6 +833,7 @@
           "original": {
             "$value": "rgba(255, 255, 255, 0.36)",
             "$type": "color",
+            "$deprecated": true,
             "$extensions": {
               "com.figma.scopes": []
             },
@@ -845,6 +847,32 @@
             "light",
             "36"
           ]
+        },
+        "40": {
+          "key": "{color.alpha.light.40}",
+          "$value": "rgba(255, 255, 255, 0.4)",
+          "$type": "color",
+          "$extensions": {
+            "com.figma.scopes": []
+          },
+          "filePath": "src/tokens/constant/color.alpha.tokens.json",
+          "isSource": true,
+          "original": {
+            "$value": "rgba(255, 255, 255, 0.4)",
+            "$type": "color",
+            "$extensions": {
+              "com.figma.scopes": []
+            },
+            "key": "{color.alpha.light.40}"
+          },
+          "name": "COLOR_ALPHA_LIGHT_40",
+          "attributes": {},
+          "path": [
+            "color",
+            "alpha",
+            "light",
+            "40"
+          ]
         }
       }
     },
@@ -15545,7 +15573,7 @@
           "color": {
             "default": {
               "key": "{button.default.tertiary.background.color.default}",
-              "$value": "rgba(164, 163, 168, 0)",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the background of a default borderless, tertiary button in the default state.",
               "$extensions": {
@@ -15581,7 +15609,7 @@
             },
             "hover": {
               "key": "{button.default.tertiary.background.color.hover}",
-              "$value": "rgba(164, 163, 168, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of a default borderless, tertiary button in the hover state.",
               "$extensions": {
@@ -15617,7 +15645,7 @@
             },
             "focus": {
               "key": "{button.default.tertiary.background.color.focus}",
-              "$value": "rgba(164, 163, 168, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of a default borderless, tertiary button in the focus state.",
               "$extensions": {
@@ -15653,7 +15681,7 @@
             },
             "active": {
               "key": "{button.default.tertiary.background.color.active}",
-              "$value": "rgba(83, 81, 88, 0.24)",
+              "$value": "rgba(5, 5, 6, 0.16)",
               "$type": "color",
               "$description": "Used for the background of a default borderless, tertiary button in the active state.",
               "$extensions": {
@@ -15885,7 +15913,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.foreground.color.hover}",
+                "$value": "{button.confirm.primary.foreground.color.default}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) primary button in the hover state.",
                 "$extensions": {
@@ -15921,7 +15949,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.foreground.color.focus}",
+                "$value": "{button.confirm.primary.foreground.color.hover}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) primary button in the focus state.",
                 "$extensions": {
@@ -15957,7 +15985,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.foreground.color.active}",
+                "$value": "{button.confirm.primary.foreground.color.focus}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) primary button in the active state.",
                 "$extensions": {
@@ -15985,7 +16013,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.primary.background.color.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) primary button in the default state.",
               "$extensions": {
@@ -15997,7 +16025,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.default}",
+                "$value": "{color.neutral.800}",
                 "$type": "color",
                 "$description": "Used for the background of a confirm (positive) primary button in the default state.",
                 "$extensions": {
@@ -16021,7 +16049,7 @@
             },
             "hover": {
               "key": "{button.confirm.primary.background.color.hover}",
-              "$value": "#2f68b4",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) primary button in the hover state.",
               "$extensions": {
@@ -16033,7 +16061,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.hover}",
+                "$value": "{color.neutral.950}",
                 "$type": "color",
                 "$description": "Used for the background of a confirm (positive) primary button in the hover state.",
                 "$extensions": {
@@ -16057,7 +16085,7 @@
             },
             "focus": {
               "key": "{button.confirm.primary.background.color.focus}",
-              "$value": "#2f68b4",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) primary button in the focus state.",
               "$extensions": {
@@ -16069,7 +16097,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.focus}",
+                "$value": "{button.confirm.primary.background.color.hover}",
                 "$type": "color",
                 "$description": "Used for the background of a confirm (positive) primary button in the focus state.",
                 "$extensions": {
@@ -16093,7 +16121,7 @@
             },
             "active": {
               "key": "{button.confirm.primary.background.color.active}",
-              "$value": "#2f5ca0",
+              "$value": "#050506",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) primary button in the active state.",
               "$extensions": {
@@ -16105,7 +16133,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.active}",
+                "$value": "{color.neutral.1000}",
                 "$type": "color",
                 "$description": "Used for the background of a confirm (positive) primary button in the active state.",
                 "$extensions": {
@@ -16133,7 +16161,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.primary.border.color.default}",
-              "$value": "#2f68b4",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the border of a confirm (positive) primary button in the default state.",
               "$extensions": {
@@ -16144,7 +16172,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.600}",
+                "$value": "{color.alpha.0}",
                 "$type": "color",
                 "$description": "Used for the border of a confirm (positive) primary button in the default state.",
                 "$extensions": {
@@ -16167,7 +16195,7 @@
             },
             "hover": {
               "key": "{button.confirm.primary.border.color.hover}",
-              "$value": "#284779",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the border of a confirm (positive) primary button in the hover state.",
               "$extensions": {
@@ -16178,7 +16206,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.800}",
+                "$value": "{button.confirm.primary.border.color.default}",
                 "$type": "color",
                 "$description": "Used for the border of a confirm (positive) primary button in the hover state.",
                 "$extensions": {
@@ -16201,7 +16229,7 @@
             },
             "focus": {
               "key": "{button.confirm.primary.border.color.focus}",
-              "$value": "#284779",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the border of a confirm (positive) primary button in the focus state.",
               "$extensions": {
@@ -16212,7 +16240,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{button.confirm.primary.border.color.hover}",
+                "$value": "{button.confirm.primary.border.color.default}",
                 "$type": "color",
                 "$description": "Used for the border of a confirm (positive) primary button in the focus state.",
                 "$extensions": {
@@ -16235,7 +16263,7 @@
             },
             "active": {
               "key": "{button.confirm.primary.border.color.active}",
-              "$value": "#213454",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the border of a confirm (positive) primary button in the active state.",
               "$extensions": {
@@ -16246,7 +16274,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.900}",
+                "$value": "{button.confirm.primary.border.color.default}",
                 "$type": "color",
                 "$description": "Used for the border of a confirm (positive) primary button in the active state.",
                 "$extensions": {
@@ -16275,7 +16303,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.secondary.foreground.color.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) button in the default state.",
               "$extensions": {
@@ -16287,7 +16315,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.500}",
+                "$value": "{color.neutral.800}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) button in the default state.",
                 "$extensions": {
@@ -16311,7 +16339,7 @@
             },
             "hover": {
               "key": "{button.confirm.secondary.foreground.color.hover}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) button in the hover state.",
               "$extensions": {
@@ -16323,7 +16351,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.700}",
+                "$value": "{color.neutral.950}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) button in the hover state.",
                 "$extensions": {
@@ -16347,7 +16375,7 @@
             },
             "focus": {
               "key": "{button.confirm.secondary.foreground.color.focus}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) button in the focus state.",
               "$extensions": {
@@ -16383,7 +16411,7 @@
             },
             "active": {
               "key": "{button.confirm.secondary.foreground.color.active}",
-              "$value": "#213454",
+              "$value": "#050506",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) button in the active state.",
               "$extensions": {
@@ -16395,7 +16423,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.900}",
+                "$value": "{color.neutral.1000}",
                 "$type": "color",
                 "$description": "Used for the foreground of a confirm (positive) button in the active state.",
                 "$extensions": {
@@ -16459,7 +16487,7 @@
             },
             "hover": {
               "key": "{button.confirm.secondary.background.color.hover}",
-              "$value": "#e9f3fc",
+              "$value": "#ececef",
               "$type": "color",
               "$description": "Used for the background of an outlined confirm (positive) button in the hover state.",
               "$extensions": {
@@ -16471,7 +16499,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.50}",
+                "$value": "{color.neutral.50}",
                 "$type": "color",
                 "$description": "Used for the background of an outlined confirm (positive) button in the hover state.",
                 "$extensions": {
@@ -16495,7 +16523,7 @@
             },
             "focus": {
               "key": "{button.confirm.secondary.background.color.focus}",
-              "$value": "#e9f3fc",
+              "$value": "#ececef",
               "$type": "color",
               "$description": "Used for the background of an outlined confirm (positive) button in the focus state.",
               "$extensions": {
@@ -16531,7 +16559,7 @@
             },
             "active": {
               "key": "{button.confirm.secondary.background.color.active}",
-              "$value": "#cbe2f9",
+              "$value": "#dcdcde",
               "$type": "color",
               "$description": "Used for the background of an outlined confirm (positive) button in the active state.",
               "$extensions": {
@@ -16543,7 +16571,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.100}",
+                "$value": "{color.neutral.100}",
                 "$type": "color",
                 "$description": "Used for the background of an outlined confirm (positive) button in the active state.",
                 "$extensions": {
@@ -16571,7 +16599,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.secondary.border.color.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the border of an outlined confirm (positive) button in the default state.",
               "$extensions": {
@@ -16582,7 +16610,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.500}",
+                "$value": "{color.neutral.800}",
                 "$type": "color",
                 "$description": "Used for the border of an outlined confirm (positive) button in the default state.",
                 "$extensions": {
@@ -16605,7 +16633,7 @@
             },
             "hover": {
               "key": "{button.confirm.secondary.border.color.hover}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the border of an outlined confirm (positive) button in the hover state.",
               "$extensions": {
@@ -16616,7 +16644,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.700}",
+                "$value": "{color.neutral.950}",
                 "$type": "color",
                 "$description": "Used for the border of an outlined confirm (positive) button in the hover state.",
                 "$extensions": {
@@ -16639,7 +16667,7 @@
             },
             "focus": {
               "key": "{button.confirm.secondary.border.color.focus}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the border of an outlined confirm (positive) button in the focus state.",
               "$extensions": {
@@ -16673,7 +16701,7 @@
             },
             "active": {
               "key": "{button.confirm.secondary.border.color.active}",
-              "$value": "#213454",
+              "$value": "#050506",
               "$type": "color",
               "$description": "Used for the border of an outlined confirm (positive) button in the active state.",
               "$extensions": {
@@ -16684,7 +16712,7 @@
               "filePath": "src/tokens/contextual/button.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.blue.900}",
+                "$value": "{color.neutral.1000}",
                 "$type": "color",
                 "$description": "Used for the border of an outlined confirm (positive) button in the active state.",
                 "$extensions": {
@@ -16713,7 +16741,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.tertiary.foreground.color.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the foreground of a borderless, tertiary confirm (positive) button in the default state.",
               "$extensions": {
@@ -16749,7 +16777,7 @@
             },
             "hover": {
               "key": "{button.confirm.tertiary.foreground.color.hover}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the foreground of a borderless, tertiary confirm (positive) button in the hover state.",
               "$extensions": {
@@ -16785,7 +16813,7 @@
             },
             "focus": {
               "key": "{button.confirm.tertiary.foreground.color.focus}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the foreground of a borderless, tertiary confirm (positive) button in the focus state.",
               "$extensions": {
@@ -16821,7 +16849,7 @@
             },
             "active": {
               "key": "{button.confirm.tertiary.foreground.color.active}",
-              "$value": "#213454",
+              "$value": "#050506",
               "$type": "color",
               "$description": "Used for the foreground of a borderless, tertiary confirm (positive) button in the active state.",
               "$extensions": {
@@ -16861,7 +16889,7 @@
           "color": {
             "default": {
               "key": "{button.confirm.tertiary.background.color.default}",
-              "$value": "rgba(99, 166, 233, 0)",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the background of a borderless, tertiary confirm (positive) button in the default state.",
               "$extensions": {
@@ -16897,7 +16925,7 @@
             },
             "hover": {
               "key": "{button.confirm.tertiary.background.color.hover}",
-              "$value": "rgba(99, 166, 233, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of a borderless, tertiary confirm (positive) button in the hover state.",
               "$extensions": {
@@ -16933,7 +16961,7 @@
             },
             "focus": {
               "key": "{button.confirm.tertiary.background.color.focus}",
-              "$value": "rgba(99, 166, 233, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of a borderless, tertiary confirm (positive) button in the focus state.",
               "$extensions": {
@@ -16969,7 +16997,7 @@
             },
             "active": {
               "key": "{button.confirm.tertiary.background.color.active}",
-              "$value": "rgba(11, 92, 173, 0.24)",
+              "$value": "rgba(5, 5, 6, 0.16)",
               "$type": "color",
               "$description": "Used for the background of a borderless, tertiary confirm (positive) button in the active state.",
               "$extensions": {
@@ -20068,7 +20096,7 @@
           "selected": {
             "default": {
               "key": "{dropdown.option.indicator.color.selected.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the dropdown selected option indicator in the default state.",
               "$extensions": {
@@ -20104,7 +20132,7 @@
             },
             "hover": {
               "key": "{dropdown.option.indicator.color.selected.hover}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the dropdown selected option indicator in the hover state.",
               "$extensions": {
@@ -20140,7 +20168,7 @@
             },
             "focus": {
               "key": "{dropdown.option.indicator.color.selected.focus}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the dropdown selected option indicator in the focus state.",
               "$extensions": {
@@ -20176,7 +20204,7 @@
             },
             "active": {
               "key": "{dropdown.option.indicator.color.selected.active}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the dropdown selected option indicator in the active state.",
               "$extensions": {
@@ -20218,7 +20246,7 @@
           "unselected": {
             "default": {
               "key": "{dropdown.option.background.color.unselected.default}",
-              "$value": "rgba(164, 163, 168, 0)",
+              "$value": "rgba(0, 0, 0, 0)",
               "$type": "color",
               "$description": "Used for the background of an unselected dropdown option in the default state.",
               "$extensions": {
@@ -20254,7 +20282,7 @@
             },
             "hover": {
               "key": "{dropdown.option.background.color.unselected.hover}",
-              "$value": "rgba(164, 163, 168, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of an unselected dropdown option in the hover state.",
               "$extensions": {
@@ -20290,7 +20318,7 @@
             },
             "focus": {
               "key": "{dropdown.option.background.color.unselected.focus}",
-              "$value": "rgba(164, 163, 168, 0.16)",
+              "$value": "rgba(5, 5, 6, 0.06)",
               "$type": "color",
               "$description": "Used for the background of an unselected dropdown option in the focus state.",
               "$extensions": {
@@ -20326,7 +20354,7 @@
             },
             "active": {
               "key": "{dropdown.option.background.color.unselected.active}",
-              "$value": "rgba(83, 81, 88, 0.24)",
+              "$value": "rgba(5, 5, 6, 0.16)",
               "$type": "color",
               "$description": "Used for the background of an unselected dropdown option in the active state.",
               "$extensions": {
@@ -22855,7 +22883,7 @@
         "color": {
           "default": {
             "key": "{nav.item.background.color.default}",
-            "$value": "rgba(164, 163, 168, 0)",
+            "$value": "rgba(0, 0, 0, 0)",
             "$type": "color",
             "$description": "Used for the background of a default navigation item in the default state.",
             "$extensions": {
@@ -22888,7 +22916,7 @@
           },
           "hover": {
             "key": "{nav.item.background.color.hover}",
-            "$value": "rgba(164, 163, 168, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a default navigation item in the hover state.",
             "$extensions": {
@@ -22921,7 +22949,7 @@
           },
           "focus": {
             "key": "{nav.item.background.color.focus}",
-            "$value": "rgba(164, 163, 168, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a default navigation item in the focus state.",
             "$extensions": {
@@ -22954,7 +22982,7 @@
           },
           "active": {
             "key": "{nav.item.background.color.active}",
-            "$value": "rgba(83, 81, 88, 0.24)",
+            "$value": "rgba(5, 5, 6, 0.16)",
             "$type": "color",
             "$description": "Used for the background of a default navigation item in the active state.",
             "$extensions": {
@@ -23132,7 +23160,7 @@
           "color": {
             "default": {
               "key": "{nav.item.selected.background.color.default}",
-              "$value": "#1f75cb",
+              "$value": "#3a383f",
               "$type": "color",
               "$description": "Used for the background of a selected navigation item in the default state.",
               "$extensions": {
@@ -23166,7 +23194,7 @@
             },
             "hover": {
               "key": "{nav.item.selected.background.color.hover}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the background of a selected navigation item in the hover state.",
               "$extensions": {
@@ -23200,7 +23228,7 @@
             },
             "focus": {
               "key": "{nav.item.selected.background.color.focus}",
-              "$value": "#2f5ca0",
+              "$value": "#18171d",
               "$type": "color",
               "$description": "Used for the background of a selected navigation item in the focus state.",
               "$extensions": {
@@ -23234,7 +23262,7 @@
             },
             "active": {
               "key": "{nav.item.selected.background.color.active}",
-              "$value": "#284779",
+              "$value": "#050506",
               "$type": "color",
               "$description": "Used for the background of a selected navigation item in the active state.",
               "$extensions": {
@@ -23741,7 +23769,7 @@
         "color": {
           "default": {
             "key": "{tab.selected.indicator.color.default}",
-            "$value": "#1f75cb",
+            "$value": "#050506",
             "$type": "color",
             "$description": "Used for the selected indicator of a tab.",
             "$extensions": {
@@ -23753,7 +23781,7 @@
             "filePath": "src/tokens/contextual/tabs.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.500}",
+              "$value": "{action.selected.border.color.active}",
               "$type": "color",
               "$description": "Used for the selected indicator of a tab.",
               "$extensions": {
@@ -23780,14 +23808,14 @@
   },
   "toggle": {
     "switch": {
-      "icon": {
+      "track": {
         "color": {
           "unchecked": {
             "default": {
-              "key": "{toggle.switch.icon.color.unchecked.default}",
-              "$value": "#626168",
+              "key": "{toggle.switch.track.color.unchecked.default}",
+              "$value": "#89888d",
               "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the default state.",
+              "$description": "Used for the track color of an unchecked toggle switch in the default state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23796,32 +23824,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.neutral.background.color.default}",
+                "$value": "{control.border.color.default}",
                 "$type": "color",
-                "$description": "Used for the icon color of an unchecked toggle switch in the default state.",
+                "$description": "Used for the track color of an unchecked toggle switch in the default state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.unchecked.default}"
+                "key": "{toggle.switch.track.color.unchecked.default}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_DEFAULT",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_UNCHECKED_DEFAULT",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "unchecked",
                 "default"
               ]
             },
             "hover": {
-              "key": "{toggle.switch.icon.color.unchecked.hover}",
-              "$value": "#4c4b51",
+              "key": "{toggle.switch.track.color.unchecked.hover}",
+              "$value": "#626168",
               "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the hover state.",
+              "$description": "Used for the track color of an unchecked toggle switch in the hover state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23830,32 +23858,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.neutral.background.color.hover}",
+                "$value": "{control.border.color.hover}",
                 "$type": "color",
-                "$description": "Used for the icon color of an unchecked toggle switch in the hover state.",
+                "$description": "Used for the track color of an unchecked toggle switch in the hover state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.unchecked.hover}"
+                "key": "{toggle.switch.track.color.unchecked.hover}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_HOVER",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_UNCHECKED_HOVER",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "unchecked",
                 "hover"
               ]
             },
             "focus": {
-              "key": "{toggle.switch.icon.color.unchecked.focus}",
-              "$value": "#4c4b51",
+              "key": "{toggle.switch.track.color.unchecked.focus}",
+              "$value": "#28272d",
               "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the focus state.",
+              "$description": "Used for the track color of an unchecked toggle switch in the focus state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23864,32 +23892,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.neutral.background.color.focus}",
+                "$value": "{control.border.color.focus}",
                 "$type": "color",
-                "$description": "Used for the icon color of an unchecked toggle switch in the focus state.",
+                "$description": "Used for the track color of an unchecked toggle switch in the focus state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.unchecked.focus}"
+                "key": "{toggle.switch.track.color.unchecked.focus}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_FOCUS",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_UNCHECKED_FOCUS",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "unchecked",
                 "focus"
               ]
             },
             "active": {
-              "key": "{toggle.switch.icon.color.unchecked.active}",
-              "$value": "#3a383f",
+              "key": "{toggle.switch.track.color.unchecked.active}",
+              "$value": "#28272d",
               "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the active state.",
+              "$description": "Used for the track color of an unchecked toggle switch in the active state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23898,22 +23926,22 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.neutral.background.color.active}",
+                "$value": "{control.border.color.focus}",
                 "$type": "color",
-                "$description": "Used for the icon color of an unchecked toggle switch in the active state.",
+                "$description": "Used for the track color of an unchecked toggle switch in the active state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.unchecked.active}"
+                "key": "{toggle.switch.track.color.unchecked.active}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_ACTIVE",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_UNCHECKED_ACTIVE",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "unchecked",
                 "active"
@@ -23922,10 +23950,10 @@
           },
           "checked": {
             "default": {
-              "key": "{toggle.switch.icon.color.checked.default}",
-              "$value": "#1f75cb",
+              "key": "{toggle.switch.track.color.checked.default}",
+              "$value": "#3a383f",
               "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the default state.",
+              "$description": "Used for the track color of a checked toggle switch in the default state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23934,32 +23962,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.default}",
+                "$value": "{color.neutral.800}",
                 "$type": "color",
-                "$description": "Used for the icon color of a checked toggle switch in the default state.",
+                "$description": "Used for the track color of a checked toggle switch in the default state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.checked.default}"
+                "key": "{toggle.switch.track.color.checked.default}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_DEFAULT",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_CHECKED_DEFAULT",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "checked",
                 "default"
               ]
             },
             "hover": {
-              "key": "{toggle.switch.icon.color.checked.hover}",
-              "$value": "#2f68b4",
+              "key": "{toggle.switch.track.color.checked.hover}",
+              "$value": "#18171d",
               "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the hover state.",
+              "$description": "Used for the track color of a checked toggle switch in the hover state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -23968,32 +23996,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.hover}",
+                "$value": "{color.neutral.950}",
                 "$type": "color",
-                "$description": "Used for the icon color of a checked toggle switch in the hover state.",
+                "$description": "Used for the track color of a checked toggle switch in the hover state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.checked.hover}"
+                "key": "{toggle.switch.track.color.checked.hover}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_HOVER",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_CHECKED_HOVER",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "checked",
                 "hover"
               ]
             },
             "focus": {
-              "key": "{toggle.switch.icon.color.checked.focus}",
-              "$value": "#2f68b4",
+              "key": "{toggle.switch.track.color.checked.focus}",
+              "$value": "#18171d",
               "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the focus state.",
+              "$description": "Used for the track color of a checked toggle switch in the focus state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -24002,32 +24030,32 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.focus}",
+                "$value": "{toggle.switch.track.color.checked.hover}",
                 "$type": "color",
-                "$description": "Used for the icon color of a checked toggle switch in the focus state.",
+                "$description": "Used for the track color of a checked toggle switch in the focus state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.checked.focus}"
+                "key": "{toggle.switch.track.color.checked.focus}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_FOCUS",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_CHECKED_FOCUS",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "checked",
                 "focus"
               ]
             },
             "active": {
-              "key": "{toggle.switch.icon.color.checked.active}",
-              "$value": "#2f5ca0",
+              "key": "{toggle.switch.track.color.checked.active}",
+              "$value": "#050506",
               "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the active state.",
+              "$description": "Used for the track color of a checked toggle switch in the active state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
@@ -24036,101 +24064,694 @@
               "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{action.strong.confirm.background.color.active}",
+                "$value": "{color.neutral.1000}",
                 "$type": "color",
-                "$description": "Used for the icon color of a checked toggle switch in the active state.",
+                "$description": "Used for the track color of a checked toggle switch in the active state.",
                 "$extensions": {
                   "com.figma.scopes": [
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{toggle.switch.icon.color.checked.active}"
+                "key": "{toggle.switch.track.color.checked.active}"
               },
-              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_ACTIVE",
+              "name": "TOGGLE_SWITCH_TRACK_COLOR_CHECKED_ACTIVE",
               "attributes": {},
               "path": [
                 "toggle",
                 "switch",
-                "icon",
+                "track",
                 "color",
                 "checked",
                 "active"
               ]
             }
-          },
-          "disabled": {
-            "key": "{toggle.switch.icon.color.disabled}",
-            "$value": "#ececef",
-            "$type": "color",
-            "$description": "Used for the icon color of a disabled toggle switch.",
-            "$extensions": {
-              "com.figma.scopes": [
-                "SHAPE_FILL"
-              ]
-            },
-            "filePath": "src/tokens/contextual/toggle.tokens.json",
-            "isSource": true,
-            "original": {
-              "$value": "{action.disabled.background.color}",
+          }
+        }
+      },
+      "background": {
+        "color": {
+          "unchecked": {
+            "default": {
+              "key": "{toggle.switch.background.color.unchecked.default}",
+              "$value": "#fff",
               "$type": "color",
-              "$description": "Used for the icon color of a disabled toggle switch.",
+              "$description": "Used for the background color of the unchecked toggle switch thumb in the default state.",
               "$extensions": {
                 "com.figma.scopes": [
                   "SHAPE_FILL"
                 ]
               },
-              "key": "{toggle.switch.icon.color.disabled}"
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{control.indicator.color.selected}",
+                "$type": "color",
+                "$description": "Used for the background color of the unchecked toggle switch thumb in the default state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.unchecked.default}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_UNCHECKED_DEFAULT",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "unchecked",
+                "default"
+              ]
             },
-            "name": "TOGGLE_SWITCH_ICON_COLOR_DISABLED",
-            "attributes": {},
-            "path": [
-              "toggle",
-              "switch",
-              "icon",
-              "color",
-              "disabled"
-            ]
-          }
-        }
-      }
-    }
-  },
-  "token-selector": {
-    "token-container": {
-      "token": {
-        "background": {
-          "color": {
-            "focus": {
-              "key": "{token-selector.token-container.token.background.color.focus}",
-              "$value": "#a4a3a8",
+            "hover": {
+              "key": "{toggle.switch.background.color.unchecked.hover}",
+              "$value": "#fff",
               "$type": "color",
-              "$description": "Used for the background color of a token in a token-selector when it's token-container is in the focus state.",
+              "$description": "Used for the background color of the unchecked toggle switch thumb in the hover state.",
               "$extensions": {
                 "com.figma.scopes": [
-                  "FRAME_FILL",
                   "SHAPE_FILL"
                 ]
               },
-              "filePath": "src/tokens/contextual/token-selector.tokens.json",
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
               "isSource": true,
               "original": {
-                "$value": "{color.neutral.300}",
+                "$value": "{toggle.switch.background.color.unchecked.default}",
                 "$type": "color",
-                "$description": "Used for the background color of a token in a token-selector when it's token-container is in the focus state.",
+                "$description": "Used for the background color of the unchecked toggle switch thumb in the hover state.",
                 "$extensions": {
                   "com.figma.scopes": [
-                    "FRAME_FILL",
                     "SHAPE_FILL"
                   ]
                 },
-                "key": "{token-selector.token-container.token.background.color.focus}"
+                "key": "{toggle.switch.background.color.unchecked.hover}"
               },
-              "name": "TOKEN_SELECTOR_TOKEN_CONTAINER_TOKEN_BACKGROUND_COLOR_FOCUS",
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_UNCHECKED_HOVER",
               "attributes": {},
               "path": [
-                "token-selector",
-                "token-container",
-                "token",
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "unchecked",
+                "hover"
+              ]
+            },
+            "focus": {
+              "key": "{toggle.switch.background.color.unchecked.focus}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the unchecked toggle switch thumb in the focus state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{toggle.switch.background.color.unchecked.default}",
+                "$type": "color",
+                "$description": "Used for the background color of the unchecked toggle switch thumb in the focus state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.unchecked.focus}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_UNCHECKED_FOCUS",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "unchecked",
+                "focus"
+              ]
+            },
+            "active": {
+              "key": "{toggle.switch.background.color.unchecked.active}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the unchecked toggle switch thumb in the active state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{toggle.switch.background.color.unchecked.default}",
+                "$type": "color",
+                "$description": "Used for the background color of the unchecked toggle switch thumb in the active state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.unchecked.active}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_UNCHECKED_ACTIVE",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "unchecked",
+                "active"
+              ]
+            }
+          },
+          "checked": {
+            "default": {
+              "key": "{toggle.switch.background.color.checked.default}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the checked toggle switch thumb in the default state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.foreground.color.default}",
+                "$type": "color",
+                "$description": "Used for the background color of the checked toggle switch thumb in the default state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.checked.default}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_CHECKED_DEFAULT",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "checked",
+                "default"
+              ]
+            },
+            "hover": {
+              "key": "{toggle.switch.background.color.checked.hover}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the checked toggle switch thumb in the hover state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.foreground.color.hover}",
+                "$type": "color",
+                "$description": "Used for the background color of the checked toggle switch thumb in the hover state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.checked.hover}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_CHECKED_HOVER",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "checked",
+                "hover"
+              ]
+            },
+            "focus": {
+              "key": "{toggle.switch.background.color.checked.focus}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the checked toggle switch thumb in the focus state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.foreground.color.focus}",
+                "$type": "color",
+                "$description": "Used for the background color of the checked toggle switch thumb in the focus state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.checked.focus}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_CHECKED_FOCUS",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "checked",
+                "focus"
+              ]
+            },
+            "active": {
+              "key": "{toggle.switch.background.color.checked.active}",
+              "$value": "#fff",
+              "$type": "color",
+              "$description": "Used for the background color of the checked toggle switch thumb in the active state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.foreground.color.active}",
+                "$type": "color",
+                "$description": "Used for the background color of the checked toggle switch thumb in the active state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.background.color.checked.active}"
+              },
+              "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_CHECKED_ACTIVE",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "background",
+                "color",
+                "checked",
+                "active"
+              ]
+            }
+          },
+          "disabled": {
+            "key": "{toggle.switch.background.color.disabled}",
+            "$value": "#89888d",
+            "$type": "color",
+            "$description": "Used for the background color of the toggle switch thumb in the disabled state.",
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "filePath": "src/tokens/contextual/toggle.tokens.json",
+            "isSource": true,
+            "original": {
+              "$value": "{action.disabled.foreground.color}",
+              "$type": "color",
+              "$description": "Used for the background color of the toggle switch thumb in the disabled state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "key": "{toggle.switch.background.color.disabled}"
+            },
+            "name": "TOGGLE_SWITCH_BACKGROUND_COLOR_DISABLED",
+            "attributes": {},
+            "path": [
+              "toggle",
+              "switch",
+              "background",
+              "color",
+              "disabled"
+            ]
+          }
+        }
+      },
+      "icon": {
+        "color": {
+          "unchecked": {
+            "default": {
+              "key": "{toggle.switch.icon.color.unchecked.default}",
+              "$value": "#626168",
+              "$type": "color",
+              "$description": "Used for the icon color of an unchecked toggle switch in the default state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.neutral.background.color.default}",
+                "$type": "color",
+                "$description": "Used for the icon color of an unchecked toggle switch in the default state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.unchecked.default}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_DEFAULT",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "unchecked",
+                "default"
+              ]
+            },
+            "hover": {
+              "key": "{toggle.switch.icon.color.unchecked.hover}",
+              "$value": "#4c4b51",
+              "$type": "color",
+              "$description": "Used for the icon color of an unchecked toggle switch in the hover state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.neutral.background.color.hover}",
+                "$type": "color",
+                "$description": "Used for the icon color of an unchecked toggle switch in the hover state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.unchecked.hover}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_HOVER",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "unchecked",
+                "hover"
+              ]
+            },
+            "focus": {
+              "key": "{toggle.switch.icon.color.unchecked.focus}",
+              "$value": "#4c4b51",
+              "$type": "color",
+              "$description": "Used for the icon color of an unchecked toggle switch in the focus state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.neutral.background.color.focus}",
+                "$type": "color",
+                "$description": "Used for the icon color of an unchecked toggle switch in the focus state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.unchecked.focus}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_FOCUS",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "unchecked",
+                "focus"
+              ]
+            },
+            "active": {
+              "key": "{toggle.switch.icon.color.unchecked.active}",
+              "$value": "#3a383f",
+              "$type": "color",
+              "$description": "Used for the icon color of an unchecked toggle switch in the active state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.neutral.background.color.active}",
+                "$type": "color",
+                "$description": "Used for the icon color of an unchecked toggle switch in the active state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.unchecked.active}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_UNCHECKED_ACTIVE",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "unchecked",
+                "active"
+              ]
+            }
+          },
+          "checked": {
+            "default": {
+              "key": "{toggle.switch.icon.color.checked.default}",
+              "$value": "#1f75cb",
+              "$type": "color",
+              "$description": "Used for the icon color of a checked toggle switch in the default state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.background.color.default}",
+                "$type": "color",
+                "$description": "Used for the icon color of a checked toggle switch in the default state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.checked.default}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_DEFAULT",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "checked",
+                "default"
+              ]
+            },
+            "hover": {
+              "key": "{toggle.switch.icon.color.checked.hover}",
+              "$value": "#2f68b4",
+              "$type": "color",
+              "$description": "Used for the icon color of a checked toggle switch in the hover state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.background.color.hover}",
+                "$type": "color",
+                "$description": "Used for the icon color of a checked toggle switch in the hover state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.checked.hover}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_HOVER",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "checked",
+                "hover"
+              ]
+            },
+            "focus": {
+              "key": "{toggle.switch.icon.color.checked.focus}",
+              "$value": "#2f68b4",
+              "$type": "color",
+              "$description": "Used for the icon color of a checked toggle switch in the focus state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.background.color.focus}",
+                "$type": "color",
+                "$description": "Used for the icon color of a checked toggle switch in the focus state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.checked.focus}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_FOCUS",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "checked",
+                "focus"
+              ]
+            },
+            "active": {
+              "key": "{toggle.switch.icon.color.checked.active}",
+              "$value": "#2f5ca0",
+              "$type": "color",
+              "$description": "Used for the icon color of a checked toggle switch in the active state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/toggle.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{action.strong.confirm.background.color.active}",
+                "$type": "color",
+                "$description": "Used for the icon color of a checked toggle switch in the active state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{toggle.switch.icon.color.checked.active}"
+              },
+              "name": "TOGGLE_SWITCH_ICON_COLOR_CHECKED_ACTIVE",
+              "attributes": {},
+              "path": [
+                "toggle",
+                "switch",
+                "icon",
+                "color",
+                "checked",
+                "active"
+              ]
+            }
+          },
+          "disabled": {
+            "key": "{toggle.switch.icon.color.disabled}",
+            "$value": "#ececef",
+            "$type": "color",
+            "$description": "Used for the icon color of a disabled toggle switch.",
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "filePath": "src/tokens/contextual/toggle.tokens.json",
+            "isSource": true,
+            "original": {
+              "$value": "{action.disabled.background.color}",
+              "$type": "color",
+              "$description": "Used for the icon color of a disabled toggle switch.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "SHAPE_FILL"
+                ]
+              },
+              "key": "{toggle.switch.icon.color.disabled}"
+            },
+            "name": "TOGGLE_SWITCH_ICON_COLOR_DISABLED",
+            "attributes": {},
+            "path": [
+              "toggle",
+              "switch",
+              "icon",
+              "color",
+              "disabled"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "token-selector": {
+    "token-container": {
+      "token": {
+        "background": {
+          "color": {
+            "focus": {
+              "key": "{token-selector.token-container.token.background.color.focus}",
+              "$value": "#a4a3a8",
+              "$type": "color",
+              "$description": "Used for the background color of a token in a token-selector when it's token-container is in the focus state.",
+              "$extensions": {
+                "com.figma.scopes": [
+                  "FRAME_FILL",
+                  "SHAPE_FILL"
+                ]
+              },
+              "filePath": "src/tokens/contextual/token-selector.tokens.json",
+              "isSource": true,
+              "original": {
+                "$value": "{color.neutral.300}",
+                "$type": "color",
+                "$description": "Used for the background color of a token in a token-selector when it's token-container is in the focus state.",
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "FRAME_FILL",
+                    "SHAPE_FILL"
+                  ]
+                },
+                "key": "{token-selector.token-container.token.background.color.focus}"
+              },
+              "name": "TOKEN_SELECTOR_TOKEN_CONTAINER_TOKEN_BACKGROUND_COLOR_FOCUS",
+              "attributes": {},
+              "path": [
+                "token-selector",
+                "token-container",
+                "token",
                 "background",
                 "color",
                 "focus"
@@ -29124,7 +29745,7 @@
         "color": {
           "default": {
             "key": "{action.selected.background.color.default}",
-            "$value": "#1f75cb",
+            "$value": "#3a383f",
             "$type": "color",
             "$description": "Used for the background of a selected action in the default state.",
             "$extensions": {
@@ -29136,7 +29757,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.500}",
+              "$value": "{color.neutral.800}",
               "$type": "color",
               "$description": "Used for the background of a selected action in the default state.",
               "$extensions": {
@@ -29159,7 +29780,7 @@
           },
           "hover": {
             "key": "{action.selected.background.color.hover}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the background of a selected action in the hover state.",
             "$extensions": {
@@ -29171,7 +29792,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{color.neutral.950}",
               "$type": "color",
               "$description": "Used for the background of a selected action in the hover state.",
               "$extensions": {
@@ -29194,7 +29815,7 @@
           },
           "focus": {
             "key": "{action.selected.background.color.focus}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the background of a selected action in the focus state.",
             "$extensions": {
@@ -29229,7 +29850,7 @@
           },
           "active": {
             "key": "{action.selected.background.color.active}",
-            "$value": "#284779",
+            "$value": "#050506",
             "$type": "color",
             "$description": "Used for the background of a selected action in the active state.",
             "$extensions": {
@@ -29241,7 +29862,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.800}",
+              "$value": "{color.neutral.1000}",
               "$type": "color",
               "$description": "Used for the background of a selected action in the active state.",
               "$extensions": {
@@ -29268,7 +29889,7 @@
         "color": {
           "default": {
             "key": "{action.selected.border.color.default}",
-            "$value": "#1f75cb",
+            "$value": "#3a383f",
             "$type": "color",
             "$description": "Used for the border of a selected action in the default state.",
             "$extensions": {
@@ -29301,7 +29922,7 @@
           },
           "hover": {
             "key": "{action.selected.border.color.hover}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the border of a selected action in the hover state.",
             "$extensions": {
@@ -29334,7 +29955,7 @@
           },
           "focus": {
             "key": "{action.selected.border.color.focus}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the border of a selected action in the focus state.",
             "$extensions": {
@@ -29367,7 +29988,7 @@
           },
           "active": {
             "key": "{action.selected.border.color.active}",
-            "$value": "#284779",
+            "$value": "#050506",
             "$type": "color",
             "$description": "Used for the border of a selected action in the active state.",
             "$extensions": {
@@ -29550,7 +30171,7 @@
         "color": {
           "default": {
             "key": "{action.neutral.background.color.default}",
-            "$value": "rgba(164, 163, 168, 0)",
+            "$value": "rgba(0, 0, 0, 0)",
             "$type": "color",
             "$description": "Used for the background of a neutral action in the default state.",
             "$extensions": {
@@ -29562,7 +30183,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(164, 163, 168, 0)",
+              "$value": "{color.alpha.0}",
               "$type": "color",
               "$description": "Used for the background of a neutral action in the default state.",
               "$extensions": {
@@ -29585,7 +30206,7 @@
           },
           "hover": {
             "key": "{action.neutral.background.color.hover}",
-            "$value": "rgba(164, 163, 168, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a neutral action in the hover state.",
             "$extensions": {
@@ -29597,7 +30218,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(164, 163, 168, 0.16)",
+              "$value": "{color.alpha.dark.6}",
               "$type": "color",
               "$description": "Used for the background of a neutral action in the hover state.",
               "$extensions": {
@@ -29620,7 +30241,7 @@
           },
           "focus": {
             "key": "{action.neutral.background.color.focus}",
-            "$value": "rgba(164, 163, 168, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a neutral action in the focus state.",
             "$extensions": {
@@ -29655,7 +30276,7 @@
           },
           "active": {
             "key": "{action.neutral.background.color.active}",
-            "$value": "rgba(83, 81, 88, 0.24)",
+            "$value": "rgba(5, 5, 6, 0.16)",
             "$type": "color",
             "$description": "Used for the background of a neutral action in the active state.",
             "$extensions": {
@@ -29667,7 +30288,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(83, 81, 88, 0.24)",
+              "$value": "{color.alpha.dark.16}",
               "$type": "color",
               "$description": "Used for the background of a neutral action in the active state.",
               "$extensions": {
@@ -29832,7 +30453,7 @@
         "color": {
           "default": {
             "key": "{action.confirm.foreground.color.default}",
-            "$value": "#1f75cb",
+            "$value": "#3a383f",
             "$type": "color",
             "$description": "Used for the foreground of a confirm (positive) action in the default state.",
             "$extensions": {
@@ -29844,7 +30465,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.500}",
+              "$value": "{color.neutral.800}",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) action in the default state.",
               "$extensions": {
@@ -29867,7 +30488,7 @@
           },
           "hover": {
             "key": "{action.confirm.foreground.color.hover}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the foreground of a confirm (positive) action in the hover state.",
             "$extensions": {
@@ -29879,7 +30500,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{color.neutral.950}",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) action in the hover state.",
               "$extensions": {
@@ -29902,7 +30523,7 @@
           },
           "focus": {
             "key": "{action.confirm.foreground.color.focus}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for the foreground of a confirm (positive) action in the focus state.",
             "$extensions": {
@@ -29937,7 +30558,7 @@
           },
           "active": {
             "key": "{action.confirm.foreground.color.active}",
-            "$value": "#213454",
+            "$value": "#050506",
             "$type": "color",
             "$description": "Used for the foreground of a confirm (positive) action in the active state.",
             "$extensions": {
@@ -29949,7 +30570,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.900}",
+              "$value": "{color.neutral.1000}",
               "$type": "color",
               "$description": "Used for the foreground of a confirm (positive) action in the active state.",
               "$extensions": {
@@ -29976,7 +30597,7 @@
         "color": {
           "default": {
             "key": "{action.confirm.background.color.default}",
-            "$value": "rgba(99, 166, 233, 0)",
+            "$value": "rgba(0, 0, 0, 0)",
             "$type": "color",
             "$description": "Used for the background of a confirm (positive) action in the default state.",
             "$extensions": {
@@ -29988,7 +30609,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(99, 166, 233, 0)",
+              "$value": "{color.alpha.0}",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) action in the default state.",
               "$extensions": {
@@ -30011,7 +30632,7 @@
           },
           "hover": {
             "key": "{action.confirm.background.color.hover}",
-            "$value": "rgba(99, 166, 233, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a confirm (positive) action in the hover state.",
             "$extensions": {
@@ -30023,7 +30644,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(99, 166, 233, 0.16)",
+              "$value": "{color.alpha.dark.6}",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) action in the hover state.",
               "$extensions": {
@@ -30046,7 +30667,7 @@
           },
           "focus": {
             "key": "{action.confirm.background.color.focus}",
-            "$value": "rgba(99, 166, 233, 0.16)",
+            "$value": "rgba(5, 5, 6, 0.06)",
             "$type": "color",
             "$description": "Used for the background of a confirm (positive) action in the focus state.",
             "$extensions": {
@@ -30081,7 +30702,7 @@
           },
           "active": {
             "key": "{action.confirm.background.color.active}",
-            "$value": "rgba(11, 92, 173, 0.24)",
+            "$value": "rgba(5, 5, 6, 0.16)",
             "$type": "color",
             "$description": "Used for the background of a confirm (positive) action in the active state.",
             "$extensions": {
@@ -30093,7 +30714,7 @@
             "filePath": "src/tokens/semantic/action.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "rgba(11, 92, 173, 0.24)",
+              "$value": "{color.alpha.dark.16}",
               "$type": "color",
               "$description": "Used for the background of a confirm (positive) action in the active state.",
               "$extensions": {
@@ -31935,7 +32556,7 @@
         "selected": {
           "default": {
             "key": "{control.background.color.selected.default}",
-            "$value": "#1f75cb",
+            "$value": "#3a383f",
             "$type": "color",
             "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background.",
             "$extensions": {
@@ -31947,7 +32568,7 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.500}",
+              "$value": "{color.neutral.800}",
               "$type": "color",
               "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background.",
               "$extensions": {
@@ -31970,7 +32591,7 @@
           },
           "hover": {
             "key": "{control.background.color.selected.hover}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
             "$extensions": {
@@ -31982,7 +32603,7 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{color.neutral.950}",
               "$type": "color",
               "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
               "$extensions": {
@@ -32005,9 +32626,9 @@
           },
           "focus": {
             "key": "{control.background.color.selected.focus}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
-            "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
+            "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on focus.",
             "$extensions": {
               "com.figma.scopes": [
                 "FRAME_FILL",
@@ -32017,9 +32638,9 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{control.background.color.selected.hover}",
               "$type": "color",
-              "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
+              "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on focus.",
               "$extensions": {
                 "com.figma.scopes": [
                   "FRAME_FILL",
@@ -32206,7 +32827,7 @@
         "selected": {
           "default": {
             "key": "{control.border.color.selected.default}",
-            "$value": "#1f75cb",
+            "$value": "#3a383f",
             "$type": "color",
             "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border.",
             "$extensions": {
@@ -32217,7 +32838,7 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.500}",
+              "$value": "{control.background.color.selected.default}",
               "$type": "color",
               "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border.",
               "$extensions": {
@@ -32239,7 +32860,7 @@
           },
           "hover": {
             "key": "{control.border.color.selected.hover}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border on hover.",
             "$extensions": {
@@ -32250,7 +32871,7 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{control.background.color.selected.hover}",
               "$type": "color",
               "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border on hover.",
               "$extensions": {
@@ -32272,7 +32893,7 @@
           },
           "focus": {
             "key": "{control.border.color.selected.focus}",
-            "$value": "#2f5ca0",
+            "$value": "#18171d",
             "$type": "color",
             "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border on focus.",
             "$extensions": {
@@ -32283,7 +32904,7 @@
             "filePath": "src/tokens/semantic/control.tokens.json",
             "isSource": true,
             "original": {
-              "$value": "{color.blue.700}",
+              "$value": "{control.background.color.selected.focus}",
               "$type": "color",
               "$description": "Used for checked and indeterminate (selected) form control (checkbox, radio button) border on focus.",
               "$extensions": {