.stx-custom-palette-wrap {
	.header {
		display: flex;
		align-items: center;
		padding: 5px 0 20px;

		button {
			margin-left: auto;
			text-decoration: none;
		}
	}

	ul {
		li {
			white-space: nowrap;
			padding: 2px 0;
		}
		a {
			display: flex;
			align-items: center;
			text-decoration: none;
			color: #555d66;
			font-weight: 500;
			font-size: 14px;

			span {
				margin-left: 7px;
			}
		}
	}

	.stx-custom-palette-color {
		height: 30px;
		width: 30px;
		display: block;
		border-radius: 50%;
		border: 1px solid #ccc;
		margin: 2px;

		&.active {
			margin: 0;
			border: 3px solid #8fd7ee;
		}
	}
}

.globa-color-popover {
	border-radius: 100px !important;
}

.stax-color-component.allows-global {
	.components-popover__content {
		border: none;
		border-radius: 5px !important;
	}
}
.global-color-picker {
	.dashicon {
		width: auto !important;
		font-size: 16px !important;
		line-height: normal;
		display: flex;
		align-items: center;
		margin-right: 0 !important;
	}

	svg {
		margin-right: 0 !important;
	}

	&.active {
		color: $wp-blue;
	}
}
