.simplefavorite-button,
.simplefavorites-clear {
	align-items: center;
	background: #ff7f2a;
	border: 0;
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	justify-content: center;
	line-height: 1;
	padding: 8px 10px;
	text-decoration: none;
	transition: opacity 0.15s ease, transform 0.15s ease;
}

.simplefavorite-button {
	border: 2px solid rgba(255, 255, 255, 0.85);
	height: 38px;
	opacity: 1;
	padding: 0;
	position: relative;
	width: 38px;
}

.simplefavorite-button:not(.active) {
	background: rgba(255, 127, 42, 0.72);
	color: #fff;
	opacity: 1;
}

.simplefavorites-clear {
	padding: 8px 10px;
}

.simplefavorite-button:hover,
.simplefavorites-clear:hover {
	opacity: 0.9;
}

.simplefavorite-button.active {
	background: #ff7f2a;
	border-color: #fff;
	box-shadow: 0 0 0 3px rgba(255, 127, 42, 0.35);
	color: #fff;
	opacity: 1;
}

.simplefavorite-button.loading,
.simplefavorites-clear.loading {
	cursor: wait;
	opacity: 0.65;
}

@font-face {
	font-family: favorites;
	src: url("fonts/favorites.eot");
	src: url("fonts/favorites.eot?#iefix") format("embedded-opentype"),
		url("fonts/favorites.woff2") format("woff2"),
		url("fonts/favorites.woff") format("woff"),
		url("fonts/favorites.ttf") format("truetype"),
		url("fonts/favorites.svg#favorites") format("svg");
	font-style: normal;
	font-weight: 400;
}

[class*=" sf-icon-"],
[class^="sf-icon-"] {
	font-family: favorites !important;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 1;
	speak: none;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.simplefavorite-button .sf-icon-bookmark {
	color: #fff;
	display: inline-block;
	font-size: 18px;
	opacity: 0.72;
}

.simplefavorite-button.active .sf-icon-bookmark {
	color: #fff;
	opacity: 1;
}

.simplefavorite-button.active::after {
	background: #19b56b;
	border: 2px solid #fff;
	border-radius: 50%;
	content: "";
	height: 10px;
	position: absolute;
	right: -4px;
	top: -4px;
	width: 10px;
}

.sf-icon-bookmark::before {
	content: "\e8e6";
}

.favorites-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.favorites-list li {
	margin: 0 0 12px;
}

.favorites-list-thumbnail {
	display: inline-block;
	margin-right: 10px;
	vertical-align: middle;
}

.simplefavorites-toast {
	background: rgba(18, 18, 18, 0.92);
	border-radius: 6px;
	bottom: 24px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
	color: #fff;
	font-size: 14px;
	left: 50%;
	line-height: 1.35;
	max-width: calc(100vw - 32px);
	opacity: 0;
	padding: 11px 16px;
	pointer-events: none;
	position: fixed;
	transform: translate(-50%, 12px);
	transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 999999;
}

.simplefavorites-toast.active {
	opacity: 1;
	transform: translate(-50%, 0);
}
