.ct-background-modal {
	
	.ct-color-picker-modal {
		--position: relative;
		z-index: 0;
		top: initial;
		right: initial;
		margin: 0 -14px;
		box-shadow: none;
		border-radius: 0;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		background: transparent;

		.ct-color-picker-top {
			padding: 20px 14px;
		}

		// .ct-color-picker-skins li:not(:last-child) {
		// 	margin-right: 14.5px;
		// }

		.components-color-picker {
			--cpm-ph: 14px;
			padding-bottom: 0;
		}
	}

	.ct-color-picker-single {
		.ct-tooltip-top {
			display: none;
		}
	}
}

.ct-image-tab,
.ct-patterns-tab {
	.ct-color-picker-modal {
		margin-top: 20px;
		border-top: 1px solid #eee;

		.ct-color-picker-top {
			border-bottom: none;
		}

		.components-color-picker {
			padding-top: 0;
		}

		&:before {
			position: absolute;
			content: '';
			top: -7px;
			right: 20px;
			width: 12px;
			height: 12px;
			background: #fff;
			border-top: 1px solid #e6e6e6;
			border-left: 1px solid #e6e6e6;
			transform: rotate(45deg);
		}
	}
}


// color tab
.ct-color-tab .ct-control {
	margin-top: 0;

	> header > section {
		display: none;
	}
}