/*---------------------------------------------------------------------------------------------
 *  Copyright (c) Microsoft Corporation. All rights reserved.
 *  Licensed under the MIT License. See License.txt in the project root for license information.
 *--------------------------------------------------------------------------------------------*/

.chat-editor-overlay-widget {
	padding: 2px 4px;
	color: var(--vscode-foreground);
	background-color: var(--vscode-editorWidget-background);
	border-radius: 6px;
	border: 1px solid var(--vscode-contrastBorder);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	z-index: 10;
	box-shadow: 0 2px 8px var(--vscode-widget-shadow);
	overflow: hidden;
}

@keyframes pulse {
	0% {
		box-shadow: 0 2px 8px 0 var(--vscode-widget-shadow);
	}
	50% {
		box-shadow: 0 2px 8px 4px var(--vscode-widget-shadow);
	}
	100% {
		box-shadow: 0 2px 8px 0 var(--vscode-widget-shadow);
	}
}

.chat-editor-overlay-widget.busy {
	animation: pulse ease-in 2.3s infinite;
}

.chat-editor-overlay-widget .chat-editor-overlay-progress {
	align-items: center;
	display: none;
	padding: 5px 0 5px 5px;
	font-size: 12px;
	overflow: hidden;
	gap: 6px;
}

.chat-editor-overlay-widget.busy .chat-editor-overlay-progress {
	display: inline-flex;
}

.chat-editor-overlay-widget .chat-editor-overlay-progress .progress-message {
	white-space: nowrap;
	max-width: 13em;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-right: 8px;
}

.chat-editor-overlay-widget .action-item > .action-label {
	padding: 4px 6px;
	font-size: 11px;
	line-height: 14px;
	border-radius: 4px; /* same as overlay widget */
}

.chat-editor-overlay-widget .monaco-action-bar .actions-container {
	gap: 4px;
}

.chat-editor-overlay-widget .action-item.primary > .action-label {
	background-color: var(--vscode-button-background);
	color: var(--vscode-button-foreground);
}

.monaco-workbench .chat-editor-overlay-widget .monaco-action-bar .action-item.primary > .action-label:hover {
	background-color: var(--vscode-button-hoverBackground);
}

.chat-editor-overlay-widget.busy .chat-editor-overlay-progress .codicon {
	color: var(--vscode-foreground);
}

.chat-editor-overlay-widget .action-item > .action-label.codicon:not(.separator) {
	color: var(--vscode-foreground);
	width: 22px; /* align with default icon button dimensions */
	height: 22px;
	padding: 0;
	font-size: 16px;
	line-height: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.chat-diff-change-content-widget .monaco-action-bar .action-item.disabled,
.chat-editor-overlay-widget .monaco-action-bar .action-item.disabled {

	> .action-label.codicon::before,
	> .action-label.codicon,
	> .action-label,
	> .action-label:hover {
		color: var(--vscode-button-separator);
		opacity: 1;
	}
}

.chat-editor-overlay-widget .action-item.label-item {
	font-variant-numeric: tabular-nums;
}

.chat-editor-overlay-widget .monaco-action-bar .action-item.label-item > .action-label,
.chat-editor-overlay-widget .monaco-action-bar .action-item.label-item > .action-label:hover {
	color: var(--vscode-foreground);
	opacity: 1;
}

.chat-editor-overlay-widget .action-item.auto {
	position: relative;
	overflow: hidden;
}

.chat-editor-overlay-widget .action-item.auto::before {
	content: '';
	position: absolute;
	top: 0;
	left: var(--vscode-action-item-auto-timeout, -100%);
	width: 100%;
	height: 100%;
	background-color: var(--vscode-toolbar-hoverBackground);
	transition: left 0.5s linear;
}
