/**
 * Cirku Wishlist Frontend Styles
 */

.cirku-add-to-wishlist {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
	padding: 10px 20px;
	background: transparent;
	border: 2px solid #ddd;
	color: #333;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 14px;
	font-weight: 600;
}

.cirku-add-to-wishlist:hover {
	border-color: #e74c3c;
	color: #e74c3c;
	background: #fff;
}

.cirku-add-to-wishlist[data-in-wishlist="1"] {
	border-color: #e74c3c;
	background: #e74c3c;
	color: #fff;
}

.cirku-add-to-wishlist[data-in-wishlist="1"]:hover {
	background: #c0392b;
	border-color: #c0392b;
}

.cirku-wishlist-icon {
	display: flex;
	align-items: center;
	width: 20px;
	height: 20px;
}

.cirku-wishlist-icon svg {
	width: 100%;
	height: 100%;
}

.cirku-add-to-wishlist.loading {
	opacity: 0.6;
	pointer-events: none;
}

.cirku-add-to-wishlist.loading::after {
	content: '';
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-left: 8px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: cirku-wishlist-spin 0.6s linear infinite;
}

@keyframes cirku-wishlist-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Wishlist notice */
.cirku-wishlist-notice {
	position: fixed;
	bottom: 20px;
	right: 20px;
	background: #333;
	color: #fff;
	padding: 15px 20px;
	border-radius: 4px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	z-index: 9999;
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.3s ease;
}

.cirku-wishlist-notice.show {
	opacity: 1;
	transform: translateY(0);
}

.cirku-wishlist-notice.success {
	background: #27ae60;
}

.cirku-wishlist-notice.error {
	background: #e74c3c;
}

/* Responsive */
@media (max-width: 768px) {
	.cirku-add-to-wishlist {
		width: 100%;
		justify-content: center;
	}

	.cirku-wishlist-notice {
		left: 20px;
		right: 20px;
		bottom: 10px;
	}
}