@carbon/themes 11.32.0 → 11.33.0-rc.0

package/umd/index.js

@@ -708,41 +708,22 @@
   var aiAuraHoverStart$3 = colors$1.rgba(colors$1.blue50, 0.4);
   var aiAuraHoverEnd$3 = colors$1.rgba(colors$1.white, 0);
 
-  // Callout
-  var slugCalloutShadowOuter01$3 = colors$1.rgba(colors$1.blue70, 0.25);
-  var slugCalloutShadowOuter02$3 = colors$1.rgba(colors$1.black, 0.1);
+  // AI Popover
+  var aiPopoverShadowOuter01$3 = colors$1.rgba(colors$1.blue70, 0.25);
+  var aiPopoverShadowOuter02$3 = colors$1.rgba(colors$1.black, 0.1);
 
   // AI skeleton
-  var aiSkeletonBackground$3 = colors$1.blue20Hover;
-  var aiSkeletonElementBackground$3 = colors$1.blue100;
+  var aiSkeletonBackground$3 = colors$1.blue20;
+  var aiSkeletonElementBackground$3 = colors$1.blue50;
 
   // AI Modal tokens
   var aiOverlay$3 = colors$1.rgba(colors$1.blue100, 0.5);
 
-  //// Not used in phase 2 / possibly remove?
-  var slugCalloutGradientTop$3 = colors$1.rgba(colors$1.gray10, 0.85);
-  var slugCalloutGradientBottom$3 = colors$1.rgba(colors$1.gray20, 0.85);
-  var aiGradientStart01$3 = colors$1.rgba(colors$1.coolGray10, 0.5);
-  var aiGradientStart02$3 = colors$1.rgba(colors$1.blue10, 0.5);
-  var aiGradientEnd$3 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutAuraStart$3 = aiAuraStart$3;
-  var slugCalloutAuraEnd$3 = aiAuraEnd$3;
-  var slugCalloutGradientTopHover$3 = colors$1.rgba(colors$1.gray20, 0.55);
-  var slugCalloutGradientBottomHover$3 = colors$1.rgba(colors$1.gray20Hover, 0.55);
-  var slugCalloutAuraStartHover01$3 = colors$1.rgba(colors$1.white, 0.5);
-  var slugCalloutAuraEndHover01$3 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutAuraStartHover02$3 = colors$1.rgba(colors$1.blue20, 0.5);
-  var slugCalloutAuraEndHover02$3 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutGradientTopSelected$3 = colors$1.rgba(colors$1.gray20, 0.85);
-  var slugCalloutGradientBottomSelected$3 = colors$1.rgba(colors$1.gray20Hover, 0.85);
-  var slugCalloutAuraStartSelected$3 = colors$1.rgba(colors$1.blue10, 0.6);
-  var slugCalloutAuraEndSelected$3 = colors$1.rgba(colors$1.white, 0);
-
   // One off tokens for caret
-  var slugCalloutCaretCenter$3 = '#A7C7FF';
-  var slugCalloutCaretBottom$3 = colors$1.blue20;
-  var slugCalloutCaretBottomBackgroundActions$3 = '#DAE5F8';
-  var slugCalloutCaretBottomBackground$3 = '#D5E5FF';
+  var aiPopoverCaretCenter$3 = '#A7C7FF';
+  var aiPopoverCaretBottom$3 = colors$1.blue20;
+  var aiPopoverCaretBottomBackgroundActions$3 = '#DAE5F8';
+  var aiPopoverCaretBottomBackground$3 = '#D5E5FF';
 
   // Chat tokens
   var chatPromptBackground$3 = colors$1.white;
@@ -754,6 +735,8 @@
   var chatAvatarBot$3 = colors$1.gray60;
   var chatAvatarAgent$3 = colors$1.gray80;
   var chatAvatarUser$3 = colors$1.blue60;
+  var chatShellBackground$3 = colors$1.white;
+  var chatHeaderBackground$3 = colors$1.white;
 
   var white$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -873,32 +856,15 @@
     aiAuraHoverBackground: aiAuraHoverBackground$3,
     aiAuraHoverStart: aiAuraHoverStart$3,
     aiAuraHoverEnd: aiAuraHoverEnd$3,
-    slugCalloutShadowOuter01: slugCalloutShadowOuter01$3,
-    slugCalloutShadowOuter02: slugCalloutShadowOuter02$3,
+    aiPopoverShadowOuter01: aiPopoverShadowOuter01$3,
+    aiPopoverShadowOuter02: aiPopoverShadowOuter02$3,
     aiSkeletonBackground: aiSkeletonBackground$3,
     aiSkeletonElementBackground: aiSkeletonElementBackground$3,
     aiOverlay: aiOverlay$3,
-    slugCalloutGradientTop: slugCalloutGradientTop$3,
-    slugCalloutGradientBottom: slugCalloutGradientBottom$3,
-    aiGradientStart01: aiGradientStart01$3,
-    aiGradientStart02: aiGradientStart02$3,
-    aiGradientEnd: aiGradientEnd$3,
-    slugCalloutAuraStart: slugCalloutAuraStart$3,
-    slugCalloutAuraEnd: slugCalloutAuraEnd$3,
-    slugCalloutGradientTopHover: slugCalloutGradientTopHover$3,
-    slugCalloutGradientBottomHover: slugCalloutGradientBottomHover$3,
-    slugCalloutAuraStartHover01: slugCalloutAuraStartHover01$3,
-    slugCalloutAuraEndHover01: slugCalloutAuraEndHover01$3,
-    slugCalloutAuraStartHover02: slugCalloutAuraStartHover02$3,
-    slugCalloutAuraEndHover02: slugCalloutAuraEndHover02$3,
-    slugCalloutGradientTopSelected: slugCalloutGradientTopSelected$3,
-    slugCalloutGradientBottomSelected: slugCalloutGradientBottomSelected$3,
-    slugCalloutAuraStartSelected: slugCalloutAuraStartSelected$3,
-    slugCalloutAuraEndSelected: slugCalloutAuraEndSelected$3,
-    slugCalloutCaretCenter: slugCalloutCaretCenter$3,
-    slugCalloutCaretBottom: slugCalloutCaretBottom$3,
-    slugCalloutCaretBottomBackgroundActions: slugCalloutCaretBottomBackgroundActions$3,
-    slugCalloutCaretBottomBackground: slugCalloutCaretBottomBackground$3,
+    aiPopoverCaretCenter: aiPopoverCaretCenter$3,
+    aiPopoverCaretBottom: aiPopoverCaretBottom$3,
+    aiPopoverCaretBottomBackgroundActions: aiPopoverCaretBottomBackgroundActions$3,
+    aiPopoverCaretBottomBackground: aiPopoverCaretBottomBackground$3,
     chatPromptBackground: chatPromptBackground$3,
     chatPromptBorderStart: chatPromptBorderStart$3,
     chatPromptBorderEnd: chatPromptBorderEnd$3,
@@ -908,6 +874,8 @@
     chatAvatarBot: chatAvatarBot$3,
     chatAvatarAgent: chatAvatarAgent$3,
     chatAvatarUser: chatAvatarUser$3,
+    chatShellBackground: chatShellBackground$3,
+    chatHeaderBackground: chatHeaderBackground$3,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -1167,41 +1135,22 @@
   var aiAuraHoverStart$2 = colors$1.rgba(colors$1.blue50, 0.4);
   var aiAuraHoverEnd$2 = colors$1.rgba(colors$1.white, 0);
 
-  // Callout
-  var slugCalloutShadowOuter01$2 = colors$1.rgba(colors$1.blue70, 0.25);
-  var slugCalloutShadowOuter02$2 = colors$1.rgba(colors$1.black, 0.1);
+  // AI Popover
+  var aiPopoverShadowOuter01$2 = colors$1.rgba(colors$1.blue70, 0.25);
+  var aiPopoverShadowOuter02$2 = colors$1.rgba(colors$1.black, 0.1);
 
   // AI skeleton
-  var aiSkeletonBackground$2 = colors$1.blue20Hover;
-  var aiSkeletonElementBackground$2 = colors$1.blue100;
+  var aiSkeletonBackground$2 = colors$1.blue20;
+  var aiSkeletonElementBackground$2 = colors$1.blue50;
 
   // AI Modal tokens
   var aiOverlay$2 = colors$1.rgba(colors$1.blue100, 0.5);
 
-  //// Not used in phase 2 / possibly remove?
-  var slugCalloutGradientTop$2 = colors$1.rgba(colors$1.gray10, 0.85);
-  var slugCalloutGradientBottom$2 = colors$1.rgba(colors$1.gray20, 0.85);
-  var aiGradientStart01$2 = colors$1.rgba(colors$1.coolGray10, 0.5);
-  var aiGradientStart02$2 = colors$1.rgba(colors$1.blue10, 0.5);
-  var aiGradientEnd$2 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutAuraStart$2 = aiAuraStart$2;
-  var slugCalloutAuraEnd$2 = aiAuraEnd$2;
-  var slugCalloutGradientTopHover$2 = colors$1.rgba(colors$1.gray20, 0.55);
-  var slugCalloutGradientBottomHover$2 = colors$1.rgba(colors$1.gray20Hover, 0.55);
-  var slugCalloutAuraStartHover01$2 = colors$1.rgba(colors$1.white, 0.5);
-  var slugCalloutAuraEndHover01$2 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutAuraStartHover02$2 = colors$1.rgba(colors$1.blue20, 0.5);
-  var slugCalloutAuraEndHover02$2 = colors$1.rgba(colors$1.white, 0);
-  var slugCalloutGradientTopSelected$2 = colors$1.rgba(colors$1.gray20, 0.85);
-  var slugCalloutGradientBottomSelected$2 = colors$1.rgba(colors$1.gray20Hover, 0.85);
-  var slugCalloutAuraStartSelected$2 = colors$1.rgba(colors$1.blue10, 0.6);
-  var slugCalloutAuraEndSelected$2 = colors$1.rgba(colors$1.white, 0);
-
   // One off tokens for caret
-  var slugCalloutCaretCenter$2 = '#A7C7FF';
-  var slugCalloutCaretBottom$2 = colors$1.blue20;
-  var slugCalloutCaretBottomBackgroundActions$2 = '#D2DCEE';
-  var slugCalloutCaretBottomBackground$2 = '#CCDBF8';
+  var aiPopoverCaretCenter$2 = '#A7C7FF';
+  var aiPopoverCaretBottom$2 = colors$1.blue20;
+  var aiPopoverCaretBottomBackgroundActions$2 = '#D2DCEE';
+  var aiPopoverCaretBottomBackground$2 = '#CCDBF8';
 
   // Chat tokens
   var chatPromptBackground$2 = colors$1.white;
@@ -1213,6 +1162,8 @@
   var chatAvatarBot$2 = colors$1.gray60;
   var chatAvatarAgent$2 = colors$1.gray80;
   var chatAvatarUser$2 = colors$1.blue60;
+  var chatShellBackground$2 = colors$1.white;
+  var chatHeaderBackground$2 = colors$1.white;
 
   var g10$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1332,32 +1283,15 @@
     aiAuraHoverBackground: aiAuraHoverBackground$2,
     aiAuraHoverStart: aiAuraHoverStart$2,
     aiAuraHoverEnd: aiAuraHoverEnd$2,
-    slugCalloutShadowOuter01: slugCalloutShadowOuter01$2,
-    slugCalloutShadowOuter02: slugCalloutShadowOuter02$2,
+    aiPopoverShadowOuter01: aiPopoverShadowOuter01$2,
+    aiPopoverShadowOuter02: aiPopoverShadowOuter02$2,
     aiSkeletonBackground: aiSkeletonBackground$2,
     aiSkeletonElementBackground: aiSkeletonElementBackground$2,
     aiOverlay: aiOverlay$2,
-    slugCalloutGradientTop: slugCalloutGradientTop$2,
-    slugCalloutGradientBottom: slugCalloutGradientBottom$2,
-    aiGradientStart01: aiGradientStart01$2,
-    aiGradientStart02: aiGradientStart02$2,
-    aiGradientEnd: aiGradientEnd$2,
-    slugCalloutAuraStart: slugCalloutAuraStart$2,
-    slugCalloutAuraEnd: slugCalloutAuraEnd$2,
-    slugCalloutGradientTopHover: slugCalloutGradientTopHover$2,
-    slugCalloutGradientBottomHover: slugCalloutGradientBottomHover$2,
-    slugCalloutAuraStartHover01: slugCalloutAuraStartHover01$2,
-    slugCalloutAuraEndHover01: slugCalloutAuraEndHover01$2,
-    slugCalloutAuraStartHover02: slugCalloutAuraStartHover02$2,
-    slugCalloutAuraEndHover02: slugCalloutAuraEndHover02$2,
-    slugCalloutGradientTopSelected: slugCalloutGradientTopSelected$2,
-    slugCalloutGradientBottomSelected: slugCalloutGradientBottomSelected$2,
-    slugCalloutAuraStartSelected: slugCalloutAuraStartSelected$2,
-    slugCalloutAuraEndSelected: slugCalloutAuraEndSelected$2,
-    slugCalloutCaretCenter: slugCalloutCaretCenter$2,
-    slugCalloutCaretBottom: slugCalloutCaretBottom$2,
-    slugCalloutCaretBottomBackgroundActions: slugCalloutCaretBottomBackgroundActions$2,
-    slugCalloutCaretBottomBackground: slugCalloutCaretBottomBackground$2,
+    aiPopoverCaretCenter: aiPopoverCaretCenter$2,
+    aiPopoverCaretBottom: aiPopoverCaretBottom$2,
+    aiPopoverCaretBottomBackgroundActions: aiPopoverCaretBottomBackgroundActions$2,
+    aiPopoverCaretBottomBackground: aiPopoverCaretBottomBackground$2,
     chatPromptBackground: chatPromptBackground$2,
     chatPromptBorderStart: chatPromptBorderStart$2,
     chatPromptBorderEnd: chatPromptBorderEnd$2,
@@ -1367,6 +1301,8 @@
     chatAvatarBot: chatAvatarBot$2,
     chatAvatarAgent: chatAvatarAgent$2,
     chatAvatarUser: chatAvatarUser$2,
+    chatShellBackground: chatShellBackground$2,
+    chatHeaderBackground: chatHeaderBackground$2,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -1626,41 +1562,22 @@
   var aiAuraHoverStart$1 = colors$1.rgba(colors$1.blue50, 0.4);
   var aiAuraHoverEnd$1 = colors$1.rgba(colors$1.black, 0);
 
-  // Callout
-  var slugCalloutShadowOuter01$1 = colors$1.rgba(colors$1.blue80, 0.25);
-  var slugCalloutShadowOuter02$1 = colors$1.rgba(colors$1.black, 0.65);
+  // AI Popover
+  var aiPopoverShadowOuter01$1 = colors$1.rgba(colors$1.blue80, 0.25);
+  var aiPopoverShadowOuter02$1 = colors$1.rgba(colors$1.black, 0.65);
 
   // AI skeleton
-  var aiSkeletonBackground$1 = colors$1.blue70Hover;
-  var aiSkeletonElementBackground$1 = colors$1.blue100;
+  var aiSkeletonBackground$1 = colors$1.blue30;
+  var aiSkeletonElementBackground$1 = colors$1.blue80;
 
   // AI Modal tokens
   var aiOverlay$1 = colors$1.rgba(colors$1.blue100, 0.5);
 
-  //// Not used in phase 2 / possibly remove?
-  var slugCalloutGradientTop$1 = colors$1.rgba(colors$1.gray100, 0.85);
-  var slugCalloutGradientBottom$1 = colors$1.rgba(colors$1.gray90, 0.85);
-  var aiGradientStart01$1 = colors$1.rgba(colors$1.blue20, 0.2);
-  var aiGradientStart02$1 = 'transparent';
-  var aiGradientEnd$1 = 'rgba(38, 38, 38, 0)';
-  var slugCalloutAuraStart$1 = aiAuraStart$1;
-  var slugCalloutAuraEnd$1 = aiAuraEnd$1;
-  var slugCalloutGradientTopHover$1 = colors$1.rgba(colors$1.gray80, 0.55);
-  var slugCalloutGradientBottomHover$1 = colors$1.rgba(colors$1.gray80Hover, 0.55);
-  var slugCalloutAuraStartHover01$1 = colors$1.rgba(colors$1.blue20Hover, 0.3);
-  var slugCalloutAuraEndHover01$1 = colors$1.rgba(colors$1.gray100, 0);
-  var slugCalloutAuraStartHover02$1 = 'transparent';
-  var slugCalloutAuraEndHover02$1 = 'transparent';
-  var slugCalloutGradientTopSelected$1 = colors$1.rgba(colors$1.gray80, 0.85);
-  var slugCalloutGradientBottomSelected$1 = colors$1.rgba(colors$1.gray80Hover, 0.85);
-  var slugCalloutAuraStartSelected$1 = colors$1.rgba(colors$1.blue20, 0.2);
-  var slugCalloutAuraEndSelected$1 = colors$1.rgba(colors$1.gray100, 0);
-
   // One off tokens for caret
-  var slugCalloutCaretCenter$1 = '#456FB5';
-  var slugCalloutCaretBottom$1 = '#465060';
-  var slugCalloutCaretBottomBackgroundActions$1 = '#253042';
-  var slugCalloutCaretBottomBackground$1 = '#2D3F5C';
+  var aiPopoverCaretCenter$1 = '#456FB5';
+  var aiPopoverCaretBottom$1 = '#465060';
+  var aiPopoverCaretBottomBackgroundActions$1 = '#253042';
+  var aiPopoverCaretBottomBackground$1 = '#2D3F5C';
 
   // Chat tokens
   var chatPromptBackground$1 = colors$1.gray100;
@@ -1672,6 +1589,8 @@
   var chatAvatarBot$1 = colors$1.gray50;
   var chatAvatarAgent$1 = colors$1.gray30;
   var chatAvatarUser$1 = colors$1.blue50;
+  var chatShellBackground$1 = colors$1.gray90;
+  var chatHeaderBackground$1 = colors$1.gray90;
 
   var g90$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1791,32 +1710,15 @@
     aiAuraHoverBackground: aiAuraHoverBackground$1,
     aiAuraHoverStart: aiAuraHoverStart$1,
     aiAuraHoverEnd: aiAuraHoverEnd$1,
-    slugCalloutShadowOuter01: slugCalloutShadowOuter01$1,
-    slugCalloutShadowOuter02: slugCalloutShadowOuter02$1,
+    aiPopoverShadowOuter01: aiPopoverShadowOuter01$1,
+    aiPopoverShadowOuter02: aiPopoverShadowOuter02$1,
     aiSkeletonBackground: aiSkeletonBackground$1,
     aiSkeletonElementBackground: aiSkeletonElementBackground$1,
     aiOverlay: aiOverlay$1,
-    slugCalloutGradientTop: slugCalloutGradientTop$1,
-    slugCalloutGradientBottom: slugCalloutGradientBottom$1,
-    aiGradientStart01: aiGradientStart01$1,
-    aiGradientStart02: aiGradientStart02$1,
-    aiGradientEnd: aiGradientEnd$1,
-    slugCalloutAuraStart: slugCalloutAuraStart$1,
-    slugCalloutAuraEnd: slugCalloutAuraEnd$1,
-    slugCalloutGradientTopHover: slugCalloutGradientTopHover$1,
-    slugCalloutGradientBottomHover: slugCalloutGradientBottomHover$1,
-    slugCalloutAuraStartHover01: slugCalloutAuraStartHover01$1,
-    slugCalloutAuraEndHover01: slugCalloutAuraEndHover01$1,
-    slugCalloutAuraStartHover02: slugCalloutAuraStartHover02$1,
-    slugCalloutAuraEndHover02: slugCalloutAuraEndHover02$1,
-    slugCalloutGradientTopSelected: slugCalloutGradientTopSelected$1,
-    slugCalloutGradientBottomSelected: slugCalloutGradientBottomSelected$1,
-    slugCalloutAuraStartSelected: slugCalloutAuraStartSelected$1,
-    slugCalloutAuraEndSelected: slugCalloutAuraEndSelected$1,
-    slugCalloutCaretCenter: slugCalloutCaretCenter$1,
-    slugCalloutCaretBottom: slugCalloutCaretBottom$1,
-    slugCalloutCaretBottomBackgroundActions: slugCalloutCaretBottomBackgroundActions$1,
-    slugCalloutCaretBottomBackground: slugCalloutCaretBottomBackground$1,
+    aiPopoverCaretCenter: aiPopoverCaretCenter$1,
+    aiPopoverCaretBottom: aiPopoverCaretBottom$1,
+    aiPopoverCaretBottomBackgroundActions: aiPopoverCaretBottomBackgroundActions$1,
+    aiPopoverCaretBottomBackground: aiPopoverCaretBottomBackground$1,
     chatPromptBackground: chatPromptBackground$1,
     chatPromptBorderStart: chatPromptBorderStart$1,
     chatPromptBorderEnd: chatPromptBorderEnd$1,
@@ -1826,6 +1728,8 @@
     chatAvatarBot: chatAvatarBot$1,
     chatAvatarAgent: chatAvatarAgent$1,
     chatAvatarUser: chatAvatarUser$1,
+    chatShellBackground: chatShellBackground$1,
+    chatHeaderBackground: chatHeaderBackground$1,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -2085,41 +1989,22 @@
   var aiAuraHoverStart = colors$1.rgba(colors$1.blue50, 0.4);
   var aiAuraHoverEnd = colors$1.rgba(colors$1.black, 0);
 
-  // Callout
-  var slugCalloutShadowOuter01 = colors$1.rgba(colors$1.blue80, 0.25);
-  var slugCalloutShadowOuter02 = colors$1.rgba(colors$1.black, 0.65);
+  // AI Popover
+  var aiPopoverShadowOuter01 = colors$1.rgba(colors$1.blue80, 0.25);
+  var aiPopoverShadowOuter02 = colors$1.rgba(colors$1.black, 0.65);
 
   // AI skeleton
-  var aiSkeletonBackground = colors$1.blue70Hover;
-  var aiSkeletonElementBackground = colors$1.blue100;
+  var aiSkeletonBackground = colors$1.blue30;
+  var aiSkeletonElementBackground = colors$1.blue80;
 
   // AI Modal tokens
   var aiOverlay = colors$1.rgba(colors$1.blue100, 0.5);
 
-  //// Not used in phase 2 / possibly remove?
-  var slugCalloutGradientTop = colors$1.rgba(colors$1.gray100, 0.85);
-  var slugCalloutGradientBottom = colors$1.rgba(colors$1.gray90, 0.85);
-  var aiGradientStart01 = colors$1.rgba(colors$1.blue20, 0.2);
-  var aiGradientStart02 = 'transparent';
-  var aiGradientEnd = 'rgba(38, 38, 38, 0)';
-  var slugCalloutAuraStart = aiAuraStart;
-  var slugCalloutAuraEnd = aiAuraEnd;
-  var slugCalloutGradientTopHover = colors$1.rgba(colors$1.gray80, 0.55);
-  var slugCalloutGradientBottomHover = colors$1.rgba(colors$1.gray80Hover, 0.55);
-  var slugCalloutAuraStartHover01 = colors$1.rgba(colors$1.blue20Hover, 0.3);
-  var slugCalloutAuraEndHover01 = colors$1.rgba(colors$1.gray100, 0);
-  var slugCalloutAuraStartHover02 = 'transparent';
-  var slugCalloutAuraEndHover02 = 'transparent';
-  var slugCalloutGradientTopSelected = colors$1.rgba(colors$1.gray80, 0.85);
-  var slugCalloutGradientBottomSelected = colors$1.rgba(colors$1.gray80Hover, 0.85);
-  var slugCalloutAuraStartSelected = colors$1.rgba(colors$1.blue20, 0.2);
-  var slugCalloutAuraEndSelected = colors$1.rgba(colors$1.gray100, 0);
-
   // One off tokens for caret
-  var slugCalloutCaretCenter = '#3F68AF';
-  var slugCalloutCaretBottom = '#3D4655';
-  var slugCalloutCaretBottomBackgroundActions = '#192436';
-  var slugCalloutCaretBottomBackground = '#213250';
+  var aiPopoverCaretCenter = '#3F68AF';
+  var aiPopoverCaretBottom = '#3D4655';
+  var aiPopoverCaretBottomBackgroundActions = '#192436';
+  var aiPopoverCaretBottomBackground = '#213250';
 
   // Chat tokens
   var chatPromptBackground = colors$1.gray100;
@@ -2131,6 +2016,8 @@
   var chatAvatarBot = colors$1.gray50;
   var chatAvatarAgent = colors$1.gray30;
   var chatAvatarUser = colors$1.blue50;
+  var chatShellBackground = colors$1.gray90;
+  var chatHeaderBackground = colors$1.gray90;
 
   var g100$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -2250,32 +2137,15 @@
     aiAuraHoverBackground: aiAuraHoverBackground,
     aiAuraHoverStart: aiAuraHoverStart,
     aiAuraHoverEnd: aiAuraHoverEnd,
-    slugCalloutShadowOuter01: slugCalloutShadowOuter01,
-    slugCalloutShadowOuter02: slugCalloutShadowOuter02,
+    aiPopoverShadowOuter01: aiPopoverShadowOuter01,
+    aiPopoverShadowOuter02: aiPopoverShadowOuter02,
     aiSkeletonBackground: aiSkeletonBackground,
     aiSkeletonElementBackground: aiSkeletonElementBackground,
     aiOverlay: aiOverlay,
-    slugCalloutGradientTop: slugCalloutGradientTop,
-    slugCalloutGradientBottom: slugCalloutGradientBottom,
-    aiGradientStart01: aiGradientStart01,
-    aiGradientStart02: aiGradientStart02,
-    aiGradientEnd: aiGradientEnd,
-    slugCalloutAuraStart: slugCalloutAuraStart,
-    slugCalloutAuraEnd: slugCalloutAuraEnd,
-    slugCalloutGradientTopHover: slugCalloutGradientTopHover,
-    slugCalloutGradientBottomHover: slugCalloutGradientBottomHover,
-    slugCalloutAuraStartHover01: slugCalloutAuraStartHover01,
-    slugCalloutAuraEndHover01: slugCalloutAuraEndHover01,
-    slugCalloutAuraStartHover02: slugCalloutAuraStartHover02,
-    slugCalloutAuraEndHover02: slugCalloutAuraEndHover02,
-    slugCalloutGradientTopSelected: slugCalloutGradientTopSelected,
-    slugCalloutGradientBottomSelected: slugCalloutGradientBottomSelected,
-    slugCalloutAuraStartSelected: slugCalloutAuraStartSelected,
-    slugCalloutAuraEndSelected: slugCalloutAuraEndSelected,
-    slugCalloutCaretCenter: slugCalloutCaretCenter,
-    slugCalloutCaretBottom: slugCalloutCaretBottom,
-    slugCalloutCaretBottomBackgroundActions: slugCalloutCaretBottomBackgroundActions,
-    slugCalloutCaretBottomBackground: slugCalloutCaretBottomBackground,
+    aiPopoverCaretCenter: aiPopoverCaretCenter,
+    aiPopoverCaretBottom: aiPopoverCaretBottom,
+    aiPopoverCaretBottomBackgroundActions: aiPopoverCaretBottomBackgroundActions,
+    aiPopoverCaretBottomBackground: aiPopoverCaretBottomBackground,
     chatPromptBackground: chatPromptBackground,
     chatPromptBorderStart: chatPromptBorderStart,
     chatPromptBorderEnd: chatPromptBorderEnd,
@@ -2285,6 +2155,8 @@
     chatAvatarBot: chatAvatarBot,
     chatAvatarAgent: chatAvatarAgent,
     chatAvatarUser: chatAvatarUser,
+    chatShellBackground: chatShellBackground,
+    chatHeaderBackground: chatHeaderBackground,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -4525,10 +4397,10 @@
     g100: colors$1.gray70
   };
   var tagColorGray = {
-    whiteTheme: colors$1.gray80,
-    g10: colors$1.gray80,
-    g90: colors$1.gray20,
-    g100: colors$1.gray20
+    whiteTheme: colors$1.gray100,
+    g10: colors$1.gray100,
+    g90: colors$1.gray10,
+    g100: colors$1.gray10
   };
   var tagHoverGray = {
     whiteTheme: colors$1.gray20Hover,
@@ -4543,10 +4415,10 @@
     g100: colors$1.coolGray70
   };
   var tagColorCoolGray = {
-    whiteTheme: colors$1.coolGray80,
-    g10: colors$1.coolGray80,
-    g90: colors$1.coolGray20,
-    g100: colors$1.coolGray20
+    whiteTheme: colors$1.coolGray100,
+    g10: colors$1.coolGray100,
+    g90: colors$1.coolGray10,
+    g100: colors$1.coolGray10
   };
   var tagHoverCoolGray = {
     whiteTheme: colors$1.coolGray20Hover,
@@ -4561,10 +4433,10 @@
     g100: colors$1.warmGray70
   };
   var tagColorWarmGray = {
-    whiteTheme: colors$1.warmGray80,
-    g10: colors$1.warmGray80,
-    g90: colors$1.warmGray20,
-    g100: colors$1.warmGray20
+    whiteTheme: colors$1.warmGray100,
+    g10: colors$1.warmGray100,
+    g90: colors$1.warmGray10,
+    g100: colors$1.warmGray10
   };
   var tagHoverWarmGray = {
     whiteTheme: colors$1.warmGray20Hover,
@@ -4572,6 +4444,66 @@
     g90: colors$1.warmGray70Hover,
     g100: colors$1.warmGray70Hover
   };
+  var tagBorderRed = {
+    whiteTheme: colors$1.red40,
+    g10: colors$1.red40,
+    g90: colors$1.red50,
+    g100: colors$1.red50
+  };
+  var tagBorderBlue = {
+    whiteTheme: colors$1.blue40,
+    g10: colors$1.blue40,
+    g90: colors$1.blue50,
+    g100: colors$1.blue50
+  };
+  var tagBorderCyan = {
+    whiteTheme: colors$1.cyan40,
+    g10: colors$1.cyan40,
+    g90: colors$1.cyan50,
+    g100: colors$1.cyan50
+  };
+  var tagBorderTeal = {
+    whiteTheme: colors$1.teal40,
+    g10: colors$1.teal40,
+    g90: colors$1.teal50,
+    g100: colors$1.teal50
+  };
+  var tagBorderGreen = {
+    whiteTheme: colors$1.green40,
+    g10: colors$1.green40,
+    g90: colors$1.green50,
+    g100: colors$1.green50
+  };
+  var tagBorderMagenta = {
+    whiteTheme: colors$1.magenta40,
+    g10: colors$1.magenta40,
+    g90: colors$1.magenta50,
+    g100: colors$1.magenta50
+  };
+  var tagBorderPurple = {
+    whiteTheme: colors$1.purple40,
+    g10: colors$1.purple40,
+    g90: colors$1.purple50,
+    g100: colors$1.purple50
+  };
+  var tagBorderGray = {
+    whiteTheme: colors$1.gray40,
+    g10: colors$1.gray40,
+    g90: colors$1.gray50,
+    g100: colors$1.gray50
+  };
+  var tagBorderCoolGray = {
+    whiteTheme: colors$1.coolGray40,
+    g10: colors$1.coolGray40,
+    g90: colors$1.coolGray50,
+    g100: colors$1.coolGray50
+  };
+  var tagBorderWarmGray = {
+    whiteTheme: colors$1.warmGray40,
+    g10: colors$1.warmGray40,
+    g90: colors$1.warmGray50,
+    g100: colors$1.warmGray50
+  };
 
   var tokens$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -4604,7 +4536,17 @@
     tagHoverCoolGray: tagHoverCoolGray,
     tagBackgroundWarmGray: tagBackgroundWarmGray,
     tagColorWarmGray: tagColorWarmGray,
-    tagHoverWarmGray: tagHoverWarmGray
+    tagHoverWarmGray: tagHoverWarmGray,
+    tagBorderRed: tagBorderRed,
+    tagBorderBlue: tagBorderBlue,
+    tagBorderCyan: tagBorderCyan,
+    tagBorderTeal: tagBorderTeal,
+    tagBorderGreen: tagBorderGreen,
+    tagBorderMagenta: tagBorderMagenta,
+    tagBorderPurple: tagBorderPurple,
+    tagBorderGray: tagBorderGray,
+    tagBorderCoolGray: tagBorderCoolGray,
+    tagBorderWarmGray: tagBorderWarmGray
   });
 
   var index$1 = /*#__PURE__*/Object.freeze({
@@ -5181,15 +5123,15 @@
   var ai = TokenGroup.create({
     name: 'AI',
     properties: ['background'],
-    tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end', 'slug-callout-gradient-top-hover', 'slug-callout-gradient-bottom-hover', 'slug-callout-aura-start-hover-01', 'slug-callout-aura-start-hover-02', 'slug-callout-aura-end-hover-01', 'slug-callout-aura-end-hover-02', 'slug-callout-gradient-top-selected', 'slug-callout-gradient-bottom-selected', 'slug-callout-aura-start-selected', 'slug-callout-aura-end-selected', 'ai-gradient-start-01', 'ai-gradient-start-02', 'ai-gradient-end',
+    tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover',
     // Phase 2
-    'slug-callout-shadow-outer-01', 'slug-callout-shadow-outer-02',
+    'ai-popover-shadow-outer-01', 'ai-popover-shadow-outer-02',
     // Linear gradient refactor
     'ai-inner-shadow', 'ai-aura-start', 'ai-aura-start-table', 'ai-aura-end', 'ai-aura-hover-background', 'ai-aura-hover-start', 'ai-aura-hover-end', 'ai-border-strong', 'ai-border-start', 'ai-border-end', 'ai-drop-shadow', 'ai-skeleton-background', 'ai-skeleton-element-background', 'ai-overlay',
     // Caret tokens
-    'slug-callout-caret-center', 'slug-callout-caret-bottom', 'slug-callout-caret-bottom-background', 'slug-callout-caret-bottom-background-actions',
+    'ai-popover-caret-center', 'ai-popover-caret-bottom', 'ai-popover-caret-bottom-background', 'ai-popover-caret-bottom-background-actions',
     // Chat tokens
-    'chat-prompt-background', 'chat-prompt-border-start', 'chat-prompt-border-end', 'chat-bubble-user', 'chat-bubble-agent', 'chat-bubble-agent-border', 'chat-avatar-bot', 'chat-avatar-agent', 'chat-avatar-user']
+    'chat-prompt-background', 'chat-prompt-border-start', 'chat-prompt-border-end', 'chat-bubble-user', 'chat-bubble-agent', 'chat-bubble-agent-border', 'chat-avatar-bot', 'chat-avatar-agent', 'chat-avatar-user', 'chat-shell-background', 'chat-header-background']
   });
   var group = TokenGroup.create({
     name: 'All',
@@ -5231,7 +5173,7 @@
   var tag = TokenGroup.create({
     name: 'Tag',
     properties: [],
-    tokens: ['tag-background-red', 'tag-color-red', 'tag-hover-red', 'tag-background-magenta', 'tag-color-magenta', 'tag-hover-magenta', 'tag-background-purple', 'tag-color-purple', 'tag-hover-purple', 'tag-background-blue', 'tag-color-blue', 'tag-hover-blue', 'tag-background-cyan', 'tag-color-cyan', 'tag-hover-cyan', 'tag-background-teal', 'tag-color-teal', 'tag-hover-teal', 'tag-background-green', 'tag-color-green', 'tag-hover-green', 'tag-background-gray', 'tag-color-gray', 'tag-hover-gray', 'tag-background-cool-gray', 'tag-color-cool-gray', 'tag-hover-cool-gray', 'tag-background-warm-gray', 'tag-color-warm-gray', 'tag-hover-warm-gray']
+    tokens: ['tag-background-red', 'tag-color-red', 'tag-hover-red', 'tag-background-magenta', 'tag-color-magenta', 'tag-hover-magenta', 'tag-background-purple', 'tag-color-purple', 'tag-hover-purple', 'tag-background-blue', 'tag-color-blue', 'tag-hover-blue', 'tag-background-cyan', 'tag-color-cyan', 'tag-hover-cyan', 'tag-background-teal', 'tag-color-teal', 'tag-hover-teal', 'tag-background-green', 'tag-color-green', 'tag-hover-green', 'tag-background-gray', 'tag-color-gray', 'tag-hover-gray', 'tag-border-red', 'tag-border-blue', 'tag-border-cyan', 'tag-border-teal', 'tag-border-green', 'tag-border-magenta', 'tag-border-purple', 'tag-border-gray', 'tag-border-cool-gray', 'tag-border-warm-gray', 'tag-background-cool-gray', 'tag-color-cool-gray', 'tag-hover-cool-gray', 'tag-background-warm-gray', 'tag-color-warm-gray', 'tag-hover-warm-gray']
   });
 
   var components = /*#__PURE__*/Object.freeze({
@@ -5639,11 +5581,14 @@
   exports.aiBorderStart = aiBorderStart$3;
   exports.aiBorderStrong = aiBorderStrong$3;
   exports.aiDropShadow = aiDropShadow$3;
-  exports.aiGradientEnd = aiGradientEnd$3;
-  exports.aiGradientStart01 = aiGradientStart01$3;
-  exports.aiGradientStart02 = aiGradientStart02$3;
   exports.aiInnerShadow = aiInnerShadow$3;
   exports.aiOverlay = aiOverlay$3;
+  exports.aiPopoverCaretBottom = aiPopoverCaretBottom$3;
+  exports.aiPopoverCaretBottomBackground = aiPopoverCaretBottomBackground$3;
+  exports.aiPopoverCaretBottomBackgroundActions = aiPopoverCaretBottomBackgroundActions$3;
+  exports.aiPopoverCaretCenter = aiPopoverCaretCenter$3;
+  exports.aiPopoverShadowOuter01 = aiPopoverShadowOuter01$3;
+  exports.aiPopoverShadowOuter02 = aiPopoverShadowOuter02$3;
   exports.aiSkeletonBackground = aiSkeletonBackground$3;
   exports.aiSkeletonElementBackground = aiSkeletonElementBackground$3;
   exports.background = background$8;
@@ -5677,9 +5622,11 @@
   exports.chatBubbleAgent = chatBubbleAgent$3;
   exports.chatBubbleAgentBorder = chatBubbleAgentBorder$3;
   exports.chatBubbleUser = chatBubbleUser$3;
+  exports.chatHeaderBackground = chatHeaderBackground$3;
   exports.chatPromptBackground = chatPromptBackground$3;
   exports.chatPromptBorderEnd = chatPromptBorderEnd$3;
   exports.chatPromptBorderStart = chatPromptBorderStart$3;
+  exports.chatShellBackground = chatShellBackground$3;
   exports.field01 = field01$7;
   exports.field02 = field02$7;
   exports.field03 = field03$3;
@@ -5742,26 +5689,6 @@
   exports.skeletonElement = skeletonElement$7;
   exports.slugBackground = slugBackground$3;
   exports.slugBackgroundHover = slugBackgroundHover$3;
-  exports.slugCalloutAuraEnd = slugCalloutAuraEnd$3;
-  exports.slugCalloutAuraEndHover01 = slugCalloutAuraEndHover01$3;
-  exports.slugCalloutAuraEndHover02 = slugCalloutAuraEndHover02$3;
-  exports.slugCalloutAuraEndSelected = slugCalloutAuraEndSelected$3;
-  exports.slugCalloutAuraStart = slugCalloutAuraStart$3;
-  exports.slugCalloutAuraStartHover01 = slugCalloutAuraStartHover01$3;
-  exports.slugCalloutAuraStartHover02 = slugCalloutAuraStartHover02$3;
-  exports.slugCalloutAuraStartSelected = slugCalloutAuraStartSelected$3;
-  exports.slugCalloutCaretBottom = slugCalloutCaretBottom$3;
-  exports.slugCalloutCaretBottomBackground = slugCalloutCaretBottomBackground$3;
-  exports.slugCalloutCaretBottomBackgroundActions = slugCalloutCaretBottomBackgroundActions$3;
-  exports.slugCalloutCaretCenter = slugCalloutCaretCenter$3;
-  exports.slugCalloutGradientBottom = slugCalloutGradientBottom$3;
-  exports.slugCalloutGradientBottomHover = slugCalloutGradientBottomHover$3;
-  exports.slugCalloutGradientBottomSelected = slugCalloutGradientBottomSelected$3;
-  exports.slugCalloutGradientTop = slugCalloutGradientTop$3;
-  exports.slugCalloutGradientTopHover = slugCalloutGradientTopHover$3;
-  exports.slugCalloutGradientTopSelected = slugCalloutGradientTopSelected$3;
-  exports.slugCalloutShadowOuter01 = slugCalloutShadowOuter01$3;
-  exports.slugCalloutShadowOuter02 = slugCalloutShadowOuter02$3;
   exports.slugGradient = slugGradient$3;
   exports.slugGradientHover = slugGradientHover$3;
   exports.slugHollowHover = slugHollowHover$3;