/**
 * Editor Styles
 */
@import "../../variables";

.edit-post-pinned-plugins .components-icon-button:not(.is-toggled) .ghostkit-color-palette-plugin-icon svg,
.edit-post-pinned-plugins .components-icon-button:not(.is-toggled) .ghostkit-color-palette-plugin-icon svg *,
.edit-post-pinned-plugins .components-icon-button.is-toggled .ghostkit-color-palette-plugin-icon svg,
.edit-post-pinned-plugins .components-icon-button.is-toggled .ghostkit-color-palette-plugin-icon svg *,
.edit-post-pinned-plugins .components-icon-button:hover .ghostkit-color-palette-plugin-icon svg,
.edit-post-pinned-plugins .components-icon-button:hover .ghostkit-color-palette-plugin-icon svg * {
	stroke: initial !important;
}

.ghostkit-plugin-color-palette-modal {
	.components-modal__header {
		margin-bottom: -10px;
		border-bottom: none;
	}

	.ghostkit-plugin-color-palette-list-default {
		.components-base-control__field {
			cursor: not-allowed;
		}

		.components-circular-option-picker__option-wrapper {
			pointer-events: none;
		}
	}

	h4 {
		margin-top: 24px;
	}

	// palette.
	.ghostkit-plugin-color-palette-list {
		display: flex;
		flex-wrap: wrap;

		> .ghostkit-component-color-picker-wrapper {
			margin-right: 5px;
			margin-bottom: 0;

			.ghostkit-component-color-toggle {
				padding: 0;
				border: none;
				background: none;
			}

			> .components-base-control__field {
				margin: 0;
			}
		}
	}

	// add button.
	.ghostkit-plugin-color-palette-list-add-new {
		.components-circular-option-picker__option {
			font-family: sans-serif;
			font-size: 20px;
			line-height: 20px;
			color: #fff;

			.components-color-palette__custom-color-gradient {
				color: #525252;
			}
		}
	}
}