$accent: red;
/**
 * @# Icon
 **/

[class*=' socicon-'],
[class*=' socicon-']:before,
[class^='socicon-'],
[class^='socicon-']:before {
	line-height: inherit !important;
}

.wolf-core-icon {
	display: inline-block;
	//line-height: 1;
	transition: all 0.3s;
	font-size: 50px;
	text-align: center;

	a {
		color: inherit;
	}

	i,
	.elementor-icon svg {
		width: 1em;
		height: 1em;
		position: relative;
		display: block;
	}
}

.fab {
	font-size: inherit;
}

.fa-stack {
	width: 2em !important;
}

.wolf-core-icon-view-stacked {
	.wolf-core-icon {
		background-color: $accent;
		padding: 0.5em;
		color: #fff;
		fill: #fff;
	}
}

.wolf-core-icon-view-framed {
	.wolf-core-icon {
		padding: 0.5em;
		border: 3px solid transparent;
		background-color: transparent;
		fill: $accent;
		color: $accent;
		border-color: $accent;
	}
}

.wolf-core-icon-shape-circle {
	.wolf-core-icon {
		border-radius: 50%;
	}
}

/* Round */
.wolf-core-icon-background-style-rounded,
.wolf-core-icon-background-style-rounded-outline {
	.wolf-core-icon-container {
		border-radius: 999em;
	}
}

.wolf-core-icon-background-style-rounded-less,
.wolf-core-icon-background-style-rounded-less-outline {
	.wolf-core-icon-container {
		border-radius: 0.5em;
	}
}

/* Outline */
.wolf-core-icon-background-style-rounded-outline,
.wolf-core-icon-background-style-boxed-outline,
.wolf-core-icon-background-style-rounded-less-outline {
	.wolf-core-icon-container {
		background-color: transparent !important;
	}
}

/* Ban */
.wolf-core-icon-background-style-ban {
	.wolf-core-icon-container {
		background-color: transparent !important;
		border: none !important;
	}
}

/* Rounded */
.wolf-core-icon-background-style-rounded-less,
.wolf-core-icon-background-style-rounded-less-outline {
	.wolf-icon,
	.wolf-core-icon-background-fill {
		border-radius: 3px;
	}

	.fa-stack-4x {
		&.wolf-icon,
		.wolf-core-icon-background-fill {
			border-radius: 4px;
		}
	}

	.fa-stack-5x {
		&.wolf-icon,
		.wolf-core-icon-background-fill {
			border-radius: 5px;
		}
	}
}

.wolf-core-icon-revert-yes {
	.elementor-icon-box-wrapper {
		flex-direction: row-reverse!important;
		margin-right: auto!important;

		.elementor-icon-box-icon {
			margin-left: var(--icon-box-icon-margin, 15px) !important;
			margin-right: auto!important;
		}

		.elementor-icon-box-content{
			flex-grow: 0;
		}
	}

	.elementor-icon-list-item{

		& > a{
			flex-direction: row-reverse !important;
			margin-right: auto !important;
		}

		.elementor-icon-list-icon {
			margin-left: var(--icon-box-icon-margin, 7px) !important;
			margin-right: auto !important;
		}

		.elementor-icon-list-text {
			//flex-grow: 0;
			padding-inline-start: 0!important;
		}
	}
}