/* FILE: global/modifiers/_colors.scss */

@each $option, $value in $customize_options {
	@if str-index( #{ $option }, 'color_' ) or str-index( #{ $option }, 'palette_' ) {
		$selector: str_replace( 'color_', '', $option );
		$selector: str_replace( '_', '-', $selector );

		.is-style-outline .wp-block-button__link.has-#{ $selector }-color, // Temporary WP5.5.1 fix. @todo Remove later.
		.has-#{ $selector }-color {

			&,
			&:hover,
			&:focus,
			&:active,
			&:visited {
				color: var(--#{ $option });
			}

		}

		.has-#{ $selector }-background-color {
			background-color: var(--#{ $option });
		}

		.has-#{ $selector }-border-color {
			border-color: var(--#{ $option });
		}
	}
}

// Force link color inheritance.

	.link-color-inherit a,
	a.link-color-inherit {

		.site & {
			color: inherit;
		}

	}