a:focus {
	box-shadow: unset;
}

.wc-booster-demo-importer {
	padding: 20px;
}

.wc-booster-demo-importer-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 30px;
	background-color: #fff;
}

.wc-booster-demo-importer-topbar .topbar-title {
	margin: 0;
	font-size: 1.6em;
}

.wc-booster-demo-importer-topbar .demo-importer-type {
	margin: 0;
	display: flex;
	gap: 2px;
}

.wc-booster-demo-importer-topbar .demo-importer-type li a {
	padding: 15px 30px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	margin: 0;
	transition: background-color 0.6s ease-in-out;
	text-decoration: none;
}

.wc-booster-demo-importer-topbar .demo-importer-type li.active a {
	background-color: #efefef80;
	border-bottom: 2px solid #4b73de;
}

.wc-booster-demo-importer-topbar .demo-importer-type li:hover a {
	background-color: #efefef80;
}

.topbar-button {
	display: flex;
	gap: 25px;
}

svg,
.topbar-button span svg,
.favourite-button svg {
	width: 20px;
	height: 20px;
	fill: #3c434a;
	cursor: pointer;
}

.favourite-button.type {
	position: relative;
}

.favourite-button.typesvg {
	fill: #f80000;
}

.wishlist-count {
	font-size: 0.875em;
	position: absolute;
	top: -6px;
	background: #3c434a;
	color: #fff;
	min-width: 16px;
	height: 16px;
	border-radius: 50px;
	justify-content: center;
	display: flex;
	right: -14px;
	align-items: center;
}

.wc-booster-demo-importer-wrapper {
	position: relative;
}

.wc-booster-demo-importer-content {
	padding: 40px;
	box-shadow: rgb(100 100 111 / 7%) 0px 7px 29px 0px;
	position: relative;
	cursor: auto;

}

.wc-booster-demo-importer-content.show-pro .free-theme,
.wc-booster-demo-importer-content.show-free .pro-theme {
	display: none;
}


.wc-booster-demo-importer-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 40px;
}

.wc-booster-demo-importer-item {
	display: none;
}

.wc-booster-demo-importer-content.show-fav .wc-booster-demo-importer-item.fav,
.wc-booster-demo-importer-content.show-all .wc-booster-demo-importer-item,
.wc-booster-demo-importer-content.show-pro .wc-booster-demo-importer-item.pro-theme,
.wc-booster-demo-importer-content.show-free .wc-booster-demo-importer-item.free-theme {
	display: block;
}

.wc-booster-demo-importer-item .demo-importer-featured-image {
	position: relative;
	display: flex;
	cursor: pointer;
}


.demo-importer-featured-image .card-wrapper,
.demo-item-popup-pro .demo-item-popup-content .card-wrapper {
	position: absolute;
	overflow: hidden;
	width: 110px;
	height: 110px;
	top: -6px;
	left: -6px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.demo-importer-featured-image .card-wrapper::before,
.demo-item-popup-pro .demo-item-popup-content .card-wrapper::before {
	content: 'Pro';
	position: absolute;
	width: 150%;
	height: 40px;
	background-color: #4b73de;
	transform: rotate(-45deg) translateY(-20px);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.23);
}

.demo-importer-featured-image .card-wrapper::after,
.demo-item-popup-pro .demo-item-popup-content .card-wrapper::after {
	content: '';
	position: absolute;
	width: 10px;
	bottom: 0;
	left: 0;
	height: 10px;
	z-index: -1;
	box-shadow: 101px -100px #4b73de;
	background-color: #4b73de;
}

.free-theme .demo-importer-featured-image .card-wrapper::before {
	content: 'Free';
	background-color: #f45a2a;
}

.free-theme .demo-importer-featured-image .card-wrapper::after {
	box-shadow: 101px -100px #f45a2a;
	background-color: #f45a2a;
}

.wc-booster-demo-importer-item .demo-importer-featured-image img {
	width: 100%;
	height: 360px;
	object-fit: cover;
	object-position: top;
}

.overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	background-color: #000000ad;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.7s ease, visibility 0.7s ease;
}

.wc-booster-demo-importer-item:hover .overlay,
.wc-booster-demo-importer-item:hover .details-icon,
.popup-content-slider-item-wrapper .featured-image:hover .view-demo,
.popup-content-slider-item-wrapper .featured-image:hover .overlay {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.7s ease, visibility 0.7s ease;
}

.wc-booster-demo-importer-item .details-icon,
.popup-content-slider-item-wrapper .view-demo {
	cursor: pointer;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.7s ease, visibility 0.7s ease;
}

.popup-content-slider-item-wrapper .view-demo:after,
.wc-booster-demo-importer-item .details-icon:after {
	content: "View Demo";
	position: absolute;
	bottom: -12px;
	font-size: 15px;
	color: #fff;
	width: 100px;
	left: -22px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.wc-booster-demo-importer-item .details-icon:after {
	content: "See Details";
	bottom: -14px;
	font-size: 14px;
	left: -20px;
}

.wc-booster-demo-importer-item .details-icon svg,
.popup-content-slider-item-wrapper .view-demo svg {
	width: 25px;
	height: 25px;
	fill: #fff;
	animation: heartbeat 1s infinite;
	animation-play-state: running;
}

.wc-booster-demo-importer-item .details-icon svg:hover,
.popup-content-slider-item-wrapper .view-demo svg:hover {
	animation-play-state: paused;
}

@keyframes heartbeat {
	0% {
		transform: scale(1);
	}

	25% {
		transform: scale(1.2);
	}

	50% {
		transform: scale(1);
	}

	75% {
		transform: scale(1.2);
	}

	100% {
		transform: scale(1);
	}
}

.demo-importer-content {
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	padding: 25px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.demo-importer-content .entry-title {
	margin: 0;
	cursor: pointer;
	font-size: 1.5em;
}

span.favourite-button.fav svg {
	fill: #f80000;
}

.favourite-button.loading svg {
	animation: heartbeat 0.9s infinite;
}



/* Demo importer popup css  */

.demo-item-popup-content {
	background-color: #f0f0f1;
	width: 75%;
	height: 570px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.5s ease, visibility 0.5s ease;
	z-index: -99;
	padding: 35px;
	border-radius: 12px;
	cursor: auto;
}

.demo-item-popup .demo-item-popup-content {
	visibility: visible;
	opacity: 1;
	z-index: 99999;
}

.demo-item-popup-pro .demo-item-popup-content .card-wrapper {
	top: -10px;
	left: -10px;
	z-index: 999;
}

.demo-item-popup-content .close {
	position: absolute;
	top: 30px;
	right: 30px;
	cursor: pointer;
	z-index: 999;
}

.demo-item-popup-content .close svg {
	width: 14px;
	height: 14px;
	fill: #3c434a;
}

.demo-item-popup-content .close:hover svg {
	fill: #4b73de;
}

.demo-item-popup .wc-booster-demo-importer-wrapper>.overlay {
	visibility: visible;
	opacity: 1;
	z-index: 9999;
	position: fixed;
	left: 0;
}

.slider-button {
	display: flex;
	align-items: center;
	gap: 20px;
}

.slider-button button,
.slider-button .buy-now,
.slider-button .visit-site {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	background-color: #4376ffe0;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	position: relative;
	min-width: 140px;
	padding: 12px 30px;
	cursor: pointer;
	border: unset;
}

.slider-button .visit-site,
.slider-button .buy-now,
.wc-booster-import-completed .slider-button button {
	display: none;
}

.wc-booster-import-completed .visit-site,
.wc-booster-import-completed .slider-button .imported-text {
	display: block;
}

.slider-button button span,
.slider-button .visit-site span,
.slider-button .buy-now span {
	position: absolute;
	right: 0;
	top: 0;
	background-color: #4b73de;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 11px 10px;
	width: 35px;
	transition: width 0.5s ease-in-out, right 0.5s ease-in-out
}

.slider-button button:disabled {
	cursor: no-drop;
	opacity: 0.6;
}

.slider-button button:disabled:hover span {
	width: 35px;
}

.slider-button button:hover span,
.slider-button .visit-site:hover span,
.slider-button .buy-now:hover span,
.slider-button button.loading span {
	width: 100%;
	right: 0;
}

.slider-button svg {
	fill: #fff;
}

.slider-button .imported-text {
	font-size: 15px;
	font-weight: 500;
	position: relative;
	display: none;
	margin-left: 30px;
}

.slider-button .imported-text:before {
	content: '\f00c';
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	font-size: 10px;
	font-style: normal;
	position: absolute;
	top: 0;
	left: -25px;
	width: 18px;
	height: 18px;
	background-color: #4b73de;
	border-radius: 50px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.popup-content-sidebar {
	margin: 0;
}

.popup-content-sidebar img {
	width: 100%;
	height: 100px;
	object-fit: cover;
	border-top-right-radius: 12px;
	border-top-left-radius: 12px;
}

.demo-item-popup-content-wrapper {
	display: flex;
	height: 570px;
	overflow: hidden;
	justify-content: space-between;
	cursor: auto;
}

.popup-content-sidebar {
	flex-basis: 10%;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 5px;
	height: calc(570px - 70px);
	overflow-y: auto;
}

.popup-content-sidebar::-webkit-scrollbar {
	display: none;
}

.popup-content-sidebar li .featured-image {
	position: relative;
	margin: 0;
	display: flex;
	border-top-right-radius: 12px;
	border-top-left-radius: 12px;
}

.popup-content-sidebar .overlay {
	visibility: hidden;
	opacity: 0;
	z-index: -9;
	border-top-right-radius: 12px;
	border-top-left-radius: 12px;
}

.popup-content-sidebar li:hover .overlay,
.popup-content-sidebar .popup-content-sidebar-item.active .overlay {
	visibility: visible;
	opacity: 1;
	z-index: 99;
}

.popup-content-sidebar .popup-content-sidebar-item {
	background-color: #e6e6e6;
	border-radius: 12px;
	cursor: pointer;
}

.popup-content-sidebar .popup-content-sidebar-item.active {
	border: 1px solid #4b73de;
}
.popup-content-sidebar .popup-content-sidebar-item.active .page-name {
	color: #4b73de;
	font-weight: 600;
}

.popup-content-sidebar-item .page-name {
	color: #3c434a;
	display: flex;
	align-items: center;
	font-size: 13px;
	justify-content: center;
	text-align: center;
	padding: 8px;
}

.popup-content-slider {
	flex-basis: 87%;
	position: relative;
}

.popup-content-slider-item-wrapper {
	display: flex !important;
	align-items: center;
	justify-content: center;
	flex-direction: row-reverse;
}

.popup-content-slider-item-wrapper .entry-content {
	flex-basis: 58%;
}

.popup-content-slider-item-wrapper .featured-image {
	position: relative;
	flex-basis: 42%;
	display: flex;
	height: calc(570px - 70px);
	overflow: hidden;
	border-radius: 12px;
}

.popup-content-slider-item-wrapper .featured-image img {
	/* height: calc(570px - 70px);
	object-fit: cover; */
	border-radius: 12px;
	width: 100%;
}

.popup-content-slider-item-wrapper .entry-content {
	padding: 0 15px 0 50px;
}

.popup-content-slider-item-wrapper .entry-content h3 {
	margin-top: 0;
}

.popup-content-slider-item-wrapper .entry-content .warning {
	background-color: #e6e6e6;
	padding: 20px;
	border-radius: 12px;
	font-style: italic;
	margin-bottom: 30px;
	transform: translate(0px);
	height: 210px;
	overflow-y: auto;
}

.popup-content-slider-item-wrapper .entry-content .warning ul {
	margin: 0;
}

.popup-content-slider-item-wrapper .entry-description {
	color: #3c434a;
	font-size: 15px;
	margin: 0 0 15px;
	line-height: 1.3;
}

.popup-content-slider .theme-name {
	font-size: 1.6em;
	margin: 0 0 15px 0;
}

.popup-content-slider-item-wrapper .featured-image .overlay {
	visibility: hidden !important;
	opacity: 0 !important;
	border-radius: 12px;
}

.popup-content-slider-item-wrapper .featured-image:hover .overlay {
	visibility: visible !important;
	opacity: 1 !important;
}

.popup-content-slider-item-wrapper .view-demo {
	z-index: 999;
}

.slider-button .arrow-path {
	transition: transform 0.3s ease-in-out;
}

.slider-button .inserter.loading .vertical-line,
.slider-button .inserter.loading .arrowhead {
	animation: vertical-move 0.6s infinite;
}

.slider-button .inserter.loading .arrowhead {
	animation: arrowhead-bounce 0.6s infinite;
}

@keyframes vertical-move {
	0% {
		transform: translateY(-15px);
	}

	50% {
		transform: translateY(0px);
	}

	100% {
		transform: translateY(-15px);
	}
}

@keyframes arrowhead-bounce {
	0% {
		transform: translateY(0px);
	}

	50% {
		transform: translateY(5px);
	}

	100% {
		transform: translateY(0px);
	}
}

@media only screen and (min-width: 1600px) {
	.demo-item-popup-content {
		width: 60%;
		height: 600px;
	}

	.popup-content-sidebar,
	.popup-content-slider-item-wrapper .featured-image

	/* ,
	.popup-content-slider-item-wrapper .featured-image img  */
		{
		height: calc(600px - 70px);
	}

	.demo-item-popup-content-wrapper {
		height: 600px;
	}
}

.console {
	background-color: #e6e6e6;
	border-radius: 12px;
	font-style: italic;
	overflow-y: auto;
	display: none;
}

.wc-booster-importing .console {
	padding: 20px 20px 20px 40px;
	margin-bottom: 30px;
	height: 210px;
	display: block;
}

.wc-booster-importing .console p {
	margin: 0 0 4px;
	font-size: 13px;
	position: relative;
}

.wc-booster-importing .console p:before {
	content: "\f129";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	font-size: 9px;
	font-style: normal;
	position: absolute;
	top: 2px;
	left: -21px;
	width: 14px;
	height: 14px;
	background-color: #4b73de;
	border-radius: 50px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wc-booster-importing .console p.result.true:before {
	content: "\f00c";
	background-color: #008b00;
}

.wc-booster-importing .console p.result.false:before {
	content: "\f00d";
	background-color: #ef6e4e;
}

.wc-booster-importing .popup-content-slider-item-wrapper .warning {
	visibility: hidden;
	opacity: 0;
	z-index: -999;
	position: absolute;
	transition: opacity 0.5s ease-in-out;
	height: 210px;
}

.checkbox-container {
	display: flex;
	gap: 20px;
	margin: 20px 0px;
}

.checkbox-container label {
	font-size: 16px;
	cursor: pointer;
}

input[type="checkbox"] {
	margin-right: 8px;
}


.demo-item-popup-pro .free-user .checkbox-container,
.demo-item-popup-pro .free-user .slider-button button {
	display: none;
}
.demo-item-popup-pro .free-user .slider-button .buy-now {
	display: block;
}