@use 'common/buttons';
@use 'common/theme';
@use 'common/codemirror';
@use 'common/badges';
@use 'common/switch';
@use 'common/select';
@use 'common/tooltips';
@use 'common/modal';
@use 'common/upsell';
@use 'common/toolbar';
@use 'common/wp-admin';
@use 'common/page-header';
@use 'common/list-table';
@use 'edit/form';
@use 'edit/sidebar';
@use 'edit/editor';
@use 'edit/notices';
@use 'edit/conditions';
@use 'edit/gpt';

.banner.error blockquote {
	margin-block-end: 0;
}

.button svg {
	block-size: 1rem;
	vertical-align: middle;
	line-height: 1;
	margin: 0;
}

#adminmenu a.code-snippets-edit-menu-link {
	cursor: pointer;
}

#edit-snippet-container {
	margin-block-start: 0;
}

.snippet-description-container {
	label {
		font-size: 1.16em;
		font-weight: 600;
		text-transform: unset;
	}

	.wp-editor-tools {
		padding-block-start: 5px;
	}

	.wp-editor-tabs {
		float: inline-start;
	}

	.generate-button {
		z-index: 99;
		position: relative;
	}
}

.snippet-tags-container {
	.components-form-token-field__input-container {
		background: var(--cs-color-surface);
		border-color: var(--cs-color-border);
		border-radius: 5px;

		> .components-flex {
			padding: 12px;
		}
	}
}

.above-snippet-code {
	margin-block: 0 15px;
	display: flex;
	align-items: center;
	margin-inline: 0;
	gap: 8px;

	label {
		font-size: 1.16em;
		font-weight: 600;
	}

	.expand-editor-button {
		display: flex;
		align-items: center;
		margin-inline-end: auto;
		gap: 5px;

		.dashicons {
			inline-size: 18px;
			block-size: 18px;
			font-size: 18px;
		}
	}
}

.snippet-name-wrapper {
	display: flex;
	gap: 0.5em;

	> :first-child {
		flex: 1;
	}
}

form.condition-snippet .snippet-code-container {
	display: none;
}