.ui-actions-bar {
	--ui-actions-bar-elements-gap-x: 12px;
}

.ui-actions-bar {
	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
	min-height: 28px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: var(--ui-actions-bar-elements-gap-x);
}

.ui-actions-bar .ui-nav-panel {
	margin-right: 0;
}

.ui-actions-bar__panel.--wide {
	flex: 1;
}

.ui-actions-bar__buttons {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	flex: 1;
	gap: var(--ui-actions-bar-elements-gap-x);
}

/* for old template support */
.ui-actions-bar .ui-actions-bar__buttons > .ui-btn,
.ui-actions-bar .ui-actions-bar__buttons > .ui-btn ~ .ui-btn,
.ui-actions-bar .ui-actions-bar__buttons > .ui-btn ~ .ui-btn-split,
.ui-actions-bar .ui-actions-bar__buttons > .ui-btn-split ~ .ui-btn {
	margin-left: 0;
	margin-right: 0;
}