.dravin-wishlist-button {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 24px;
	min-height: 24px;
	padding: 0;
	color: #999999;
	font: inherit;
	line-height: 1;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.dravin-wishlist-button svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.dravin-wishlist-icon-active {
	display: none;
}

.dravin-wishlist-button.is-active .dravin-wishlist-icon-inactive {
	display: none;
}

.dravin-wishlist-button.is-active .dravin-wishlist-icon-active {
	display: inline-flex;
}

.dravin-wishlist-toast {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10;
	display: block;
	max-width: calc(100% - 32px);
	padding: 9px 12px;
	color: #ffffff;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
	pointer-events: none;
	visibility: hidden;
	background: rgba(0, 0, 0, 0.72);
	border-radius: 4px;
	opacity: 0;
	transform: translate(-50%, -50%);
	transition: opacity 0.18s ease, visibility 0.18s ease;
}

.dravin-product-card.is-showing-toast .dravin-wishlist-toast {
	visibility: visible;
	opacity: 1;
}

.dravin-wishlist-page {
	width: 100%;
}

.dravin-wishlist-empty {
	display: grid;
	gap: 12px;
	justify-items: center;
	padding: 48px 16px;
	text-align: center;
	border: 1px solid #ececec;
	border-radius: 8px;
}

.dravin-wishlist-empty.is-hidden {
	display: none;
}

.dravin-wishlist-empty-icon {
	display: inline-flex;
	color: #e44c4c;
	font-size: 34px;
}

.dravin-wishlist-empty p {
	margin: 0;
	color: #58595b;
	font-size: 16px;
	font-weight: 600;
}

.dravin-continue-shopping,
.dravin-add-to-cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 9px 16px;
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	background: #202124;
	border: 1px solid #202124;
	border-radius: 4px;
}

.dravin-wishlist-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	margin-top: 10px;
}

.dravin-remove-wishlist {
	min-height: 34px;
	padding: 8px 10px;
	color: #e44c4c;
	background: #fff5f5;
	border: 1px solid rgba(228, 76, 76, 0.22);
	border-radius: 4px;
}

.dravin-wishlist-layout-list .dravin-wishlist-items {
	display: flex;
	flex-direction: column;
}

.dravin-wishlist-layout-list .dravin-product-card {
	display: grid;
	grid-template-columns: minmax(120px, 190px) 1fr;
	gap: 16px;
	align-items: stretch;
}

.dravin-wishlist-layout-list .dravin-product-image {
	height: 100%;
	min-height: 190px;
}

.dravin-wishlist-badge {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #202124;
	font-size: 24px;
	line-height: 1;
	text-decoration: none;
}

.dravin-wishlist-badge svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.dravin-wishlist-badge-count {
	--dravin-badge-offset-x: 0px;
	--dravin-badge-offset-y: 0px;
	position: absolute;
	right: calc(-7px + var(--dravin-badge-offset-x));
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	color: #ffffff;
	font-size: 10px;
	font-weight: 600;
	line-height: 1;
	background: #e44c4c;
	border-radius: 50%;
}

.dravin-badge-position-top-right .dravin-wishlist-badge-count {
	top: calc(-7px + var(--dravin-badge-offset-y));
}

.dravin-badge-position-bottom-right .dravin-wishlist-badge-count {
	bottom: calc(-7px + var(--dravin-badge-offset-y));
}

@media (max-width: 767px) {
	.dravin-wishlist-layout-list .dravin-product-card {
		grid-template-columns: 110px 1fr;
		gap: 10px;
	}

	.dravin-wishlist-layout-list .dravin-product-image {
		min-height: 150px;
	}

	.dravin-wishlist-toast {
		font-size: 12px;
	}
}

/* Loading state - disable interaction while request is in flight */
.dravin-atc-btn.is-loading {
	opacity: 0.6;
	cursor: wait;
	pointer-events: none;
}

/* Added state - button becomes a "View Cart" link; keep it fully clickable */
.dravin-atc-btn.is-added {
	background: #202124;
	color: #ffffff;
	cursor: pointer;
	pointer-events: auto;
	opacity: 1;
	text-decoration: none;
}

.dravin-atc-btn.is-added:hover {
	opacity: 0.85;
}

/* -- Skeleton loader for wishlist page -- */
@keyframes dravin-shimmer {
	0%   { background-position: -400px 0; }
	100% { background-position:  400px 0; }
}

.dravin-skeleton-card {
	background: #ffffff;
	border-radius: 8px;
	overflow: hidden;
	padding-bottom: 12px;
}

.dravin-skeleton-img,
.dravin-skeleton-line,
.dravin-skeleton-btn {
	background: linear-gradient(90deg, #ebebeb 25%, #f5f5f5 50%, #ebebeb 75%);
	background-size: 800px 100%;
	animation: dravin-shimmer 1.4s infinite linear;
	border-radius: 4px;
}

.dravin-skeleton-img {
	width: 100%;
	height: 253px;   /* matches mobile_default image_height from widget */
	border-radius: 0;
	margin-bottom: 10px;
}

.dravin-skeleton-line {
	margin: 0 10px 8px;
	height: 14px;
}

.dravin-skeleton-line--title {
	width: 75%;
	height: 16px;
}

.dravin-skeleton-line--cat {
	width: 40%;
}

.dravin-skeleton-line--price {
	width: 55%;
	height: 16px;
}

.dravin-skeleton-actions {
	display: flex;
	gap: 8px;
	padding: 6px 10px 0;
}

.dravin-skeleton-btn {
	height: 36px;
	flex: 0 0 auto;
}

.dravin-skeleton-btn--remove {
	width: 40px;
}

.dravin-skeleton-btn--atc {
	flex: 1;
}

@media (min-width: 768px) {
	.dravin-skeleton-img {
		height: 280px; /* matches tablet_default */
	}
}

@media (min-width: 1025px) {
	.dravin-skeleton-img {
		height: 327px; /* matches desktop default */
	}
}
