/**
 * Update Post Field widget — minimal styles.
 *
 * Most visual styling comes from Voxel's existing `ts-action-con`,
 * `ts-term-dropdown`, and popup classes. This file handles only our
 * custom states and the editor placeholder.
 *
 * @package VX_ICP\Modules\Update_Post_Field
 */

/*
 * Button layout — Voxel scopes these to `.ts-action .ts-action-con`
 * which needs a `.ts-action` parent. Our standalone widget doesn't
 * have that wrapper, so we replicate the essential rules here.
 */
.vx-update-field .ts-action-con {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	text-decoration: none;
}

.vx-update-field .ts-action-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	line-height: 1;
}

.vx-update-field .ts-action-icon svg {
	width: var(--ts-icon-size, 20px);
	height: var(--ts-icon-size, 20px);
	fill: currentColor;
}

.vx-update-field .ts-action-icon i {
	font-size: var(--ts-icon-size, 20px);
	line-height: 1;
}

/* Loading state — reduce opacity and block clicks. */
.vx-update-field .ts-action-con.vx-pending {
	opacity: 0.5;
	pointer-events: none;
}

/* Editor placeholder wrapper. */
.vx-update-field-editor-preview .ts-action-con {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: default;
}