.cx-vui-repeater {
	&__actions {
		display: flex;
		align-items: center;
	}
	&__tip {
		color: $color__text;
		margin: 0 0 0 20px;
	}
	.cx-vui-collapse__content > & {
		margin-bottom: 25px;
	}
}

.cx-vui-repeater-item {
	&__handle {
		cursor: n-resize;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		margin: -12px 0 -10px -16px;
		svg {
			line {
				stroke: $color__border-off-panel;
			}
		}
	}
	&__heading {
		display: flex;
		border-bottom: 1px solid $color__border-in-panel;
		padding: 18px 20px 16px;
		align-items: center;
		justify-content: space-between;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		&--is-collpased {
			border-bottom: none;
		}
		&-start {
			display: flex;
			align-items: center;
			cursor: pointer;
		}
		&-end {
			display: flex;
			align-items: center;
		}
	}
	&__title,
	&__subtitle {
		font-size: 15px;
		line-height: 17px;
	}
	&__title {
		font-weight: 500;
		color: $color__accent;
		margin: 0 10px 0 0;
	}
	&__subtitle {
		font-style: italic;
		color: $color__text;
	}
	&__collapse {
		margin: 0 8px 0 0;
		&--is-collpased {
			margin: 0 8px 4px 0;
			transform: rotate( -90deg );
		}
		path {
			fill: $color__accent;
		}
	}
	&__content {
		&--is-collpased {
			display: none;
		}
	}
	&__copy,
	&__clean {
		cursor: pointer;
		width: 20px;
		height: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 0 0 10px;
		position: relative;
		.cx-vui-tooltip {
			width: 80px;
		}
		path {
			transition: all 150ms linear;
			fill: $color__text;
		}
		&:hover {
			path {
				fill: $color__accent;
			}
		}
	}
	&__confrim-del,
	&__cancel-del {
		text-decoration: underline;
	}
	&__confrim-del {
		color: $color__error;
	}
}