@codingame/monaco-vscode-katex-common 26.2.2 → 27.0.0

package/vscode/src/vs/workbench/contrib/chat/browser/widget/chatContentParts/media/chatQuestionCarousel.css

@@ -3,7 +3,21 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-.chat-question-carousel-container {
+/* question carousel - this is above edits and todos */
+.interactive-session .interactive-input-part > .chat-question-carousel-widget-container:empty {
+	display: none;
+}
+
+/* input specific styling */
+.interactive-session .interactive-input-part > .chat-question-carousel-widget-container .chat-question-carousel-container {
+	margin: 0;
+	border: 1px solid var(--vscode-input-border, transparent);
+	background-color: var(--vscode-editor-background);
+	border-radius: 4px;
+}
+
+/* general questions styling */
+.interactive-session .chat-question-carousel-container {
 	margin: 8px 0;
 	border: 1px solid var(--vscode-chat-requestBorder);
 	border-radius: 4px;
@@ -13,474 +27,389 @@
 	container-type: inline-size;
 }
 
-.chat-question-carousel-summary {
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-	padding: 12px 16px;
-}
-
-.chat-question-summary-item {
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
-	align-items: baseline;
-	gap: 0;
-	font-size: var(--vscode-chat-font-size-body-s);
-}
-
-.chat-question-summary-label {
-	color: var(--vscode-descriptionForeground);
-	word-wrap: break-word;
-	overflow-wrap: break-word;
-}
-
-.chat-question-summary-label::after {
-	content: ': ';
-	white-space: pre;
-}
-
-.chat-question-summary-answer-title {
-	color: var(--vscode-foreground);
-	font-weight: 600;
-	word-wrap: break-word;
-	overflow-wrap: break-word;
-}
-
-.chat-question-summary-answer-desc {
-	color: var(--vscode-foreground);
-	word-wrap: break-word;
-	overflow-wrap: break-word;
-}
-
-.chat-question-summary-skipped {
-	color: var(--vscode-descriptionForeground);
-	font-style: italic;
-	font-size: var(--vscode-chat-font-size-body-s);
-}
-
-.chat-question-header-row {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	gap: 8px;
-	min-width: 0;
-	padding-bottom: 5px;
-	margin-left: -16px;
-	margin-right: -16px;
-	padding-left: 16px;
-	padding-right: 16px;
-	border-bottom: 1px solid var(--vscode-chat-requestBorder);
-}
-
-.chat-question-header-row .chat-question-title {
-	flex: 1;
-	min-width: 0;
-	word-wrap: break-word;
-	overflow-wrap: break-word;
-}
-
-/* Close button container in header */
-.chat-question-close-container {
-	flex-shrink: 0;
-}
-
-.chat-question-close-container .monaco-button.chat-question-close {
-	min-width: 22px;
-	width: 22px;
-	height: 22px;
-	padding: 0;
-	border: none;
-	background: transparent !important;
-	color: var(--vscode-foreground) !important;
-}
-
-.chat-question-close-container .monaco-button.chat-question-close:hover:not(.disabled) {
-	background: var(--vscode-toolbar-hoverBackground) !important;
-}
-
-/* Footer row with step indicator and navigation */
-.chat-question-footer-row {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 4px 16px;
-	border-top: 1px solid var(--vscode-chat-requestBorder);
-	background: var(--vscode-chat-requestBackground);
-}
-
-/* Step indicator (e.g., "2/4") */
-.chat-question-step-indicator {
-	font-size: var(--vscode-chat-font-size-body-s);
-	color: var(--vscode-descriptionForeground);
-}
-
-.chat-question-carousel-nav {
-	display: flex;
-	align-items: center;
-	gap: 4px;
-	flex-shrink: 0;
-	margin-left: auto;
-}
-
-.chat-question-nav-arrows {
-	display: flex;
-	align-items: center;
-	gap: 4px;
-}
-
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow {
-	min-width: 22px;
-	width: 22px;
-	height: 22px;
-	padding: 0;
-	border: none;
-}
-
-/* Secondary buttons (prev, next) use gray secondary background */
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-prev,
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-next {
-	background: var(--vscode-button-secondaryBackground) !important;
-	color: var(--vscode-button-secondaryForeground) !important;
-}
-
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-prev:hover:not(.disabled),
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-next:hover:not(.disabled) {
-	background: var(--vscode-button-secondaryHoverBackground) !important;
-}
-
-/* Submit button (next on last question) uses primary background */
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-submit {
-	background: var(--vscode-button-background) !important;
-	color: var(--vscode-button-foreground) !important;
-	width: auto;
-	min-width: auto;
-	padding: 0 8px;
-}
-
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-submit:hover:not(.disabled) {
-	background: var(--vscode-button-hoverBackground) !important;
-}
-
-/* Close button uses transparent background */
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-close {
-	background: transparent !important;
-	color: var(--vscode-foreground) !important;
-}
-
-.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-close:hover:not(.disabled) {
-	background: var(--vscode-toolbar-hoverBackground) !important;
+/* input part wrapper */
+.interactive-session .interactive-input-part > .chat-question-carousel-widget-container {
+	width: 100%;
+	position: relative;
 }
 
-.chat-question-carousel-content {
+/* container and header */
+.interactive-session .chat-question-carousel-container .chat-question-carousel-content {
 	display: flex;
 	flex-direction: column;
 	background: var(--vscode-chat-requestBackground);
 	padding: 8px 16px 10px 16px;
 	overflow: hidden;
-}
-
-.chat-question-title {
-	font-weight: 500;
-	font-size: var(--vscode-chat-font-size-body-s);
-	margin: 0;
-}
-
-.chat-question-title-main {
-	font-weight: 500;
-}
 
-.chat-question-title-subtitle {
-	font-weight: normal;
-	color: var(--vscode-descriptionForeground);
-}
-
-.chat-question-message {
-	font-size: var(--vscode-chat-font-size-body-s);
-	color: var(--vscode-foreground);
-	margin: 0;
-	line-height: 1.5;
-}
-
-.chat-question-message p {
-	margin-top: 0;
-	margin-bottom: 4px;
+	.chat-question-header-row {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		gap: 8px;
+		min-width: 0;
+		padding-bottom: 5px;
+		margin-left: -16px;
+		margin-right: -16px;
+		padding-left: 16px;
+		padding-right: 16px;
+		border-bottom: 1px solid var(--vscode-chat-requestBorder);
+
+		.chat-question-title {
+			flex: 1;
+			min-width: 0;
+			word-wrap: break-word;
+			overflow-wrap: break-word;
+			font-weight: 500;
+			font-size: var(--vscode-chat-font-size-body-s);
+			margin: 0;
+
+			.rendered-markdown {
+				a {
+					color: var(--vscode-textLink-foreground);
+				}
+
+				a:hover,
+				a:active {
+					color: var(--vscode-textLink-activeForeground);
+				}
+
+				p {
+					margin: 0;
+				}
+			}
+
+			.chat-question-title-main {
+				font-weight: 500;
+			}
+
+			.chat-question-title-subtitle {
+				font-weight: normal;
+				color: var(--vscode-descriptionForeground);
+			}
+		}
+
+		.chat-question-close-container {
+			flex-shrink: 0;
+
+			.monaco-button.chat-question-close {
+				min-width: 22px;
+				width: 22px;
+				height: 22px;
+				padding: 0;
+				border: none;
+				background: transparent !important;
+				color: var(--vscode-foreground) !important;
+			}
+
+			.monaco-button.chat-question-close:hover:not(.disabled) {
+				background: var(--vscode-toolbar-hoverBackground) !important;
+			}
+		}
+	}
 }
 
-.chat-question-input-container {
+/* questions list and freeform area */
+.interactive-session .chat-question-carousel-container .chat-question-input-container {
 	display: flex;
 	flex-direction: column;
 	margin-top: 4px;
 	min-width: 0;
-}
-
-/* List-style selection UI (similar to QuickPick) */
-.chat-question-list {
-	display: flex;
-	flex-direction: column;
-	gap: 3px;
-	outline: none;
-	padding: 4px 0;
-}
 
-.chat-question-list:focus-visible {
-	outline: 1px solid var(--vscode-focusBorder);
-	outline-offset: -1px;
-}
-
-.chat-question-list-item {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	padding: 3px 8px;
-	cursor: pointer;
-	border-radius: 3px;
-	user-select: none;
-}
-
-.chat-question-list-item:hover {
-	background-color: var(--vscode-list-hoverBackground);
-}
-
-.interactive-input-part .chat-question-carousel-widget-container .chat-question-input-container {
+	/* some hackiness to get the focus looking right */
 	.chat-question-list-item:focus:not(.selected),
 	.chat-question-list:focus {
 		outline: none;
 	}
 
-}
-
-/* Single-select: highlight entire row when selected */
-.chat-question-list-item.selected {
-	background-color: var(--vscode-list-activeSelectionBackground);
-	color: var(--vscode-list-activeSelectionForeground);
-}
+	.chat-question-list:focus-visible {
+		outline: 1px solid var(--vscode-focusBorder);
+		outline-offset: -1px;
+	}
 
-.chat-question-list:focus-within .chat-question-list-item.selected {
-	outline-width: 1px;
-	outline-style: solid;
-	outline-offset: -1px;
-	outline-color: var(--vscode-focusBorder);
-}
+	.chat-question-list:focus-within .chat-question-list-item.selected {
+		outline-width: 1px;
+		outline-style: solid;
+		outline-offset: -1px;
+		outline-color: var(--vscode-focusBorder);
+	}
 
-.chat-question-list-item.selected:hover {
-	background-color: var(--vscode-list-activeSelectionBackground);
-}
+	.chat-question-list {
+		display: flex;
+		flex-direction: column;
+		gap: 3px;
+		outline: none;
+		padding: 4px 0;
+
+		.chat-question-list-item {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			padding: 3px 8px;
+			cursor: pointer;
+			border-radius: 3px;
+			user-select: none;
+
+			.chat-question-list-indicator {
+				width: 16px;
+				height: 16px;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				flex-shrink: 0;
+				margin-left: auto;
+			}
+
+			.chat-question-list-indicator.codicon-check {
+				color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
+			}
+
+			/* Label in list item */
+			.chat-question-list-label {
+				font-size: var(--vscode-chat-font-size-body-s);
+				flex: 1;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
+
+			.chat-question-list-label-title {
+				font-weight: 600;
+			}
+
+			.chat-question-list-label-desc {
+				font-weight: normal;
+				color: var(--vscode-descriptionForeground);
+			}
+		}
+
+		.chat-question-list-item:hover {
+			background-color: var(--vscode-list-hoverBackground);
+		}
+
+		/* Single-select: highlight entire row when selected */
+		.chat-question-list-item.selected {
+			background-color: var(--vscode-list-activeSelectionBackground);
+			color: var(--vscode-list-activeSelectionForeground);
+
+			.chat-question-label {
+				color: var(--vscode-list-activeSelectionForeground);
+			}
+
+			.chat-question-list-label-desc {
+				color: var(--vscode-list-activeSelectionForeground);
+				opacity: 0.8;
+			}
+
+			.chat-question-list-indicator.codicon-check {
+				color: var(--vscode-list-activeSelectionForeground);
+			}
+
+			.chat-question-list-number {
+				background-color: transparent;
+				color: var(--vscode-list-activeSelectionForeground);
+				border-color: var(--vscode-list-activeSelectionForeground);
+				border-bottom-color: var(--vscode-list-activeSelectionForeground);
+				box-shadow: none;
+			}
+		}
+
+		.chat-question-list-item.selected:hover {
+			background-color: var(--vscode-list-activeSelectionBackground);
+		}
+
+		/* Checkbox for multi-select */
+		.chat-question-list-checkbox {
+			flex-shrink: 0;
+		}
+
+		.chat-question-list-checkbox.monaco-custom-toggle {
+			margin-right: 0;
+		}
+	}
 
-/* todo: change to use keybinding service so we don't have to recreate this */
-.chat-question-list-number,
-.chat-question-freeform-number {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	min-width: 14px;
-	padding: 0px 4px;
-	border-style: solid;
-	border-width: 1px;
-	border-radius: 3px;
-	font-size: 11px;
-	font-weight: normal;
-	background-color: var(--vscode-keybindingLabel-background);
-	color: var(--vscode-keybindingLabel-foreground);
-	border-color: var(--vscode-keybindingLabel-border);
-	border-bottom-color: var(--vscode-keybindingLabel-bottomBorder);
-	box-shadow: inset 0 -1px 0 var(--vscode-widget-shadow);
-	flex-shrink: 0;
-}
+	.chat-question-freeform {
+		margin-left: 8px;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 8px;
+
+		.chat-question-freeform-number {
+			height: fit-content;
+		}
+
+		/* this is probably legacy too */
+		.chat-question-freeform-label {
+			font-size: var(--vscode-chat-font-size-body-s);
+			color: var(--vscode-descriptionForeground);
+		}
+
+		.chat-question-freeform-textarea {
+			width: 100%;
+			min-height: 24px;
+			max-height: 200px;
+			padding: 3px 8px;
+			border: 1px solid var(--vscode-input-border, var(--vscode-chat-requestBorder));
+			background-color: var(--vscode-input-background);
+			color: var(--vscode-input-foreground);
+			border-radius: 4px;
+			resize: none;
+			font-family: var(--vscode-chat-font-family, inherit);
+			font-size: var(--vscode-chat-font-size-body-s);
+			box-sizing: border-box;
+			overflow-y: hidden;
+			align-content: center;
+		}
+
+		.chat-question-freeform-textarea:focus {
+			outline: 1px solid var(--vscode-focusBorder);
+			border-color: var(--vscode-focusBorder);
+		}
+
+		.chat-question-freeform-textarea::placeholder {
+			color: var(--vscode-input-placeholderForeground);
+		}
 
-.chat-question-freeform-number {
-	height: fit-content;
-}
+	}
 
-.chat-question-list-item.selected .chat-question-list-number {
-	background-color: transparent;
-	color: var(--vscode-list-activeSelectionForeground);
-	border-color: var(--vscode-list-activeSelectionForeground);
-	border-bottom-color: var(--vscode-list-activeSelectionForeground);
-	box-shadow: none;
+	/* todo: change to use keybinding service so we don't have to recreate this */
+	.chat-question-list-number,
+	.chat-question-freeform-number {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		min-width: 14px;
+		padding: 0px 4px;
+		border-style: solid;
+		border-width: 1px;
+		border-radius: 3px;
+		font-size: 11px;
+		font-weight: normal;
+		background-color: var(--vscode-keybindingLabel-background);
+		color: var(--vscode-keybindingLabel-foreground);
+		border-color: var(--vscode-keybindingLabel-border);
+		border-bottom-color: var(--vscode-keybindingLabel-bottomBorder);
+		box-shadow: inset 0 -1px 0 var(--vscode-widget-shadow);
+		flex-shrink: 0;
+	}
 }
 
-/* Selection indicator (checkmark) for single select - positioned on right */
-.chat-question-list-indicator {
-	width: 16px;
-	height: 16px;
+/* footer with step indicator and nav buttons */
+.interactive-session .chat-question-carousel-container .chat-question-footer-row {
 	display: flex;
+	justify-content: space-between;
 	align-items: center;
-	justify-content: center;
-	flex-shrink: 0;
-	margin-left: auto;
-}
+	padding: 4px 16px;
+	border-top: 1px solid var(--vscode-chat-requestBorder);
+	background: var(--vscode-chat-requestBackground);
 
-.chat-question-list-indicator.codicon-check {
-	color: var(--vscode-list-activeSelectionForeground, var(--vscode-foreground));
-}
+	.chat-question-step-indicator {
+		font-size: var(--vscode-chat-font-size-body-s);
+		color: var(--vscode-descriptionForeground);
+	}
 
-.chat-question-list-item.selected .chat-question-list-indicator.codicon-check {
-	color: var(--vscode-list-activeSelectionForeground);
-}
+	.chat-question-carousel-nav {
+		display: flex;
+		align-items: center;
+		gap: 4px;
+		flex-shrink: 0;
+		margin-left: auto;
+	}
 
-/* Checkbox for multi-select */
-.chat-question-list-checkbox {
-	flex-shrink: 0;
-}
+	.chat-question-nav-arrows {
+		display: flex;
+		align-items: center;
+		gap: 4px;
+	}
 
-.chat-question-list-checkbox.monaco-custom-toggle {
-	margin-right: 0;
-}
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow {
+		min-width: 22px;
+		width: 22px;
+		height: 22px;
+		padding: 0;
+		border: none;
+	}
 
+	/* Secondary buttons (prev, next) use gray secondary background */
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-prev,
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-next {
+		background: var(--vscode-button-secondaryBackground) !important;
+		color: var(--vscode-button-secondaryForeground) !important;
+	}
 
-/* Label in list item */
-.chat-question-list-label {
-	font-size: var(--vscode-chat-font-size-body-s);
-	color: var(--vscode-foreground);
-	flex: 1;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-prev:hover:not(.disabled),
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-next:hover:not(.disabled) {
+		background: var(--vscode-button-secondaryHoverBackground) !important;
+	}
 
-.chat-question-list-label-title {
-	font-weight: 600;
-}
+	/* Submit button (next on last question) uses primary background */
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-submit {
+		background: var(--vscode-button-background) !important;
+		color: var(--vscode-button-foreground) !important;
+		width: auto;
+		min-width: auto;
+		padding: 0 8px;
+	}
 
-.chat-question-list-label-desc {
-	font-weight: normal;
-	color: var(--vscode-descriptionForeground);
-}
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-nav-submit:hover:not(.disabled) {
+		background: var(--vscode-button-hoverBackground) !important;
+	}
 
-.chat-question-list-item.selected .chat-question-list-label {
-	color: var(--vscode-list-activeSelectionForeground);
-}
+	/* Close button uses transparent background */
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-close {
+		background: transparent !important;
+		color: var(--vscode-foreground) !important;
+	}
 
-.chat-question-list-item.selected .chat-question-list-label-desc {
-	color: var(--vscode-list-activeSelectionForeground);
-	opacity: 0.8;
-}
+	.chat-question-carousel-nav .monaco-button.chat-question-nav-arrow.chat-question-close:hover:not(.disabled) {
+		background: var(--vscode-toolbar-hoverBackground) !important;
+	}
 
-/* Legacy styles for backwards compatibility (to be removed) */
-.chat-question-options {
-	display: flex;
-	flex-direction: column;
-	gap: 0;
-	min-width: 0;
 }
 
-.chat-question-option {
+/* summary (after finished) */
+.interactive-session .chat-question-carousel-summary {
 	display: flex;
-	align-items: flex-start;
+	flex-direction: column;
 	gap: 8px;
-	padding: 3px 0;
-	min-width: 0;
-}
-
-.chat-question-option input[type="radio"],
-.chat-question-option input[type="checkbox"] {
-	appearance: none;
-	-webkit-appearance: none;
-	-moz-appearance: none;
-	width: 18px;
-	height: 18px;
-	min-width: 18px;
-	min-height: 18px;
-	flex-shrink: 0;
-	margin: 0;
-	border: 1px solid var(--vscode-checkbox-border);
-	background-color: var(--vscode-checkbox-background);
-	border-radius: 3px;
-	cursor: pointer;
-	position: relative;
-	outline: none;
-}
-
-.chat-question-option input[type="radio"] {
-	border-radius: 50%;
-}
-
-.chat-question-option input[type="radio"]:checked,
-.chat-question-option input[type="checkbox"]:checked {
-	background-color: var(--vscode-checkbox-selectBackground, var(--vscode-checkbox-background));
-}
-
-.chat-question-option input[type="checkbox"]:checked::after {
-	content: '';
-	position: absolute;
-	top: 3px;
-	left: 6px;
-	width: 4px;
-	height: 8px;
-	border: solid var(--vscode-checkbox-foreground);
-	border-width: 0 2px 2px 0;
-	transform: rotate(45deg);
-}
-
-.chat-question-option input[type="radio"]:checked::after {
-	content: '';
-	position: absolute;
-	top: 4px;
-	left: 4px;
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background-color: var(--vscode-checkbox-foreground);
-}
-
-.chat-question-option input[type="radio"]:focus,
-.chat-question-option input[type="checkbox"]:focus {
-	outline: 1px solid var(--vscode-focusBorder);
-	outline-offset: 1px;
-}
-
-.chat-question-option input[type="radio"]:hover,
-.chat-question-option input[type="checkbox"]:hover {
-	background-color: var(--vscode-inputOption-hoverBackground);
-}
-
-.chat-question-option label {
-	flex: 1;
-	font-size: var(--vscode-chat-font-size-body-s);
-	color: var(--vscode-foreground);
-	cursor: pointer;
-	word-wrap: break-word;
-	overflow-wrap: break-word;
-	min-width: 0;
-}
-
+	padding: 8px;
+
+	.chat-question-summary-item {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		align-items: baseline;
+		gap: 0;
+		font-size: var(--vscode-chat-font-size-body-s);
+	}
 
-.chat-question-freeform {
-	margin-left: 8px;
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	gap: 8px;
-}
+	.chat-question-summary-label {
+		color: var(--vscode-descriptionForeground);
+		word-wrap: break-word;
+		overflow-wrap: break-word;
+	}
 
-.chat-question-freeform-label {
-	font-size: var(--vscode-chat-font-size-body-s);
-	color: var(--vscode-descriptionForeground);
-}
+	.chat-question-summary-label::after {
+		content: ': ';
+		white-space: pre;
+	}
 
-.chat-question-freeform-textarea {
-	width: 100%;
-	min-height: 24px;
-	max-height: 200px;
-	padding: 3px 8px;
-	border: 1px solid var(--vscode-input-border, var(--vscode-chat-requestBorder));
-	background-color: var(--vscode-input-background);
-	color: var(--vscode-input-foreground);
-	border-radius: 4px;
-	resize: none;
-	font-family: var(--vscode-chat-font-family, inherit);
-	font-size: var(--vscode-chat-font-size-body-s);
-	box-sizing: border-box;
-	overflow-y: hidden;
-	align-content: center;
-}
+	.chat-question-summary-answer-title {
+		color: var(--vscode-foreground);
+		font-weight: 600;
+		word-wrap: break-word;
+		overflow-wrap: break-word;
+	}
 
-.chat-question-freeform-textarea:focus {
-	outline: 1px solid var(--vscode-focusBorder);
-	border-color: var(--vscode-focusBorder);
-}
+	.chat-question-summary-answer-desc {
+		color: var(--vscode-foreground);
+		word-wrap: break-word;
+		overflow-wrap: break-word;
+	}
 
-.chat-question-freeform-textarea::placeholder {
-	color: var(--vscode-input-placeholderForeground);
+	.chat-question-summary-skipped {
+		color: var(--vscode-descriptionForeground);
+		font-style: italic;
+		font-size: var(--vscode-chat-font-size-body-s);
+	}
 }