/* Integrated KOL_APES product engagement icons */

html.dark-mode .kol-pec-icons,
html.light-mode .kol-pec-icons {
	display: inline-flex !important;
	gap: 12px !important;
	align-items: center !important;
	font-size: 11px !important;
	white-space: nowrap !important;
	flex-shrink: 0 !important;
	flex-wrap: wrap !important;
}

html.dark-mode .kol-pec-icon,
html.light-mode .kol-pec-icon {
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
	font-weight: 500 !important;
	flex-shrink: 0 !important;
	white-space: nowrap !important;
	transition: color 0.2s ease, transform 0.2s ease !important;
}

html.dark-mode .kol-pec-icon {
	color: #778674 !important;
}

html.light-mode .kol-pec-icon {
	color: #6b8f67 !important;
}

html.dark-mode .kol-pec-icon-symbol {
	background-color: #333333 !important;
	border: 1px solid #444444 !important;
}

html.light-mode .kol-pec-icon-symbol {
	background-color: #e8e8e8 !important;
	border: 1px solid #d0d0d0 !important;
}

html.dark-mode .kol-pec-svg-icon {
	color: #778674 !important;
	width: 14px !important;
	height: 14px !important;
}

html.light-mode .kol-pec-svg-icon {
	color: #6b8f67 !important;
	width: 14px !important;
	height: 14px !important;
}

html.dark-mode .kol-pec-count {
	font-size: 11px !important;
	color: #e0e0e0 !important;
	flex-shrink: 0 !important;
}

html.light-mode .kol-pec-count {
	font-size: 11px !important;
	color: #1f2937 !important;
	flex-shrink: 0 !important;
}

html.dark-mode .kol-pec-likes,
html.dark-mode .kol-pec-dislikes,
html.light-mode .kol-pec-likes,
html.light-mode .kol-pec-dislikes {
	cursor: pointer !important;
}

html.dark-mode .kol-pec-comments,
html.light-mode .kol-pec-comments {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
}

html.dark-mode .kol-pec-likes:hover .kol-pec-like-btn,
html.dark-mode .kol-pec-dislikes:hover .kol-pec-dislike-btn {
	color: #8fa589 !important;
	transform: scale(1.1) !important;
}

html.light-mode .kol-pec-likes:hover .kol-pec-like-btn,
html.light-mode .kol-pec-dislikes:hover .kol-pec-dislike-btn {
	color: #2e7d32 !important;
	transform: scale(1.1) !important;
}

html.dark-mode .kol-pec-comments:hover .kol-pec-svg-icon {
	color: #8fa589 !important;
}

html.light-mode .kol-pec-comments:hover .kol-pec-svg-icon {
	color: #2e7d32 !important;
}

html.dark-mode .kol-pec-likes.liked .kol-pec-like-btn {
	color: #ff6b9d !important;
}

html.light-mode .kol-pec-likes.liked .kol-pec-like-btn {
	color: #d32f2f !important;
}

html.dark-mode .kol-pec-likes.liked:hover .kol-pec-like-btn {
	color: #ff8cb3 !important;
}

html.light-mode .kol-pec-likes.liked:hover .kol-pec-like-btn {
	color: #b71c1c !important;
}

/* Comment icon filled state when sidebar is open */
html.dark-mode .kol-pec-comments.is-comments-open .kol-pec-svg-icon {
	fill: #8fa589 !important;
}

html.light-mode .kol-pec-comments.is-comments-open .kol-pec-svg-icon {
	fill: #2e7d32 !important;
}

.kol-pec-likes:focus-visible,
.kol-pec-dislikes:focus-visible,
.kol-pec-comments:focus-visible {
	outline: 2px solid #6b8f67;
	outline-offset: 2px;
	border-radius: 999px;
}

.kol-apes-product-meta-counters {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid rgba(148, 163, 184, 0.25);
}

.product_meta .kol-apes-product-meta-counters .kol-pec-icons {
	gap: 14px !important;
}

/* Product card layout safety */

html.dark-mode .kol-product-card .kol-product-card-footer,
html.light-mode .kol-product-card .kol-product-card-footer {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	row-gap: 0.5rem !important;
	column-gap: 0.75rem !important;
}

html.dark-mode .kol-product-card .kol-product-card-footer > .kol-pec-icons[data-product-id],
html.dark-mode .kol-product-card .kol-product-card-footer > .kol-apes-counters[data-product-id],
html.light-mode .kol-product-card .kol-product-card-footer > .kol-pec-icons[data-product-id],
html.light-mode .kol-product-card .kol-product-card-footer > .kol-apes-counters[data-product-id] {
	flex: 1 1 180px !important;
	min-width: 0 !important;
	margin-right: auto !important;
}

html.dark-mode .kol-product-card .kol-product-card-footer > .track-price,
html.dark-mode .kol-product-card .kol-product-card-footer > .price,
html.dark-mode .kol-product-card .kol-product-card-footer > div:first-child,
html.light-mode .kol-product-card .kol-product-card-footer > .track-price,
html.light-mode .kol-product-card .kol-product-card-footer > .price,
html.light-mode .kol-product-card .kol-product-card-footer > div:first-child {
	flex: 1 1 140px !important;
	min-width: 0 !important;
}

html.dark-mode .kol-product-card .kol-product-actions-right,
html.light-mode .kol-product-card .kol-product-actions-right {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: flex-end !important;
	row-gap: 0.4rem !important;
	column-gap: 0.5rem !important;
	flex: 0 1 auto !important;
	min-width: fit-content !important;
}

html.dark-mode .kol-product-card .kol-product-actions-right > .kol-pec-icons:not([data-product-id]),
html.light-mode .kol-product-card .kol-product-actions-right > .kol-pec-icons:not([data-product-id]) {
	display: contents !important;
}

html.dark-mode .kol-product-card .kol-product-actions-right .kol-pec-icons[data-product-id],
html.dark-mode .kol-product-card .kol-product-actions-right .kol-apes-counters[data-product-id],
html.light-mode .kol-product-card .kol-product-actions-right .kol-pec-icons[data-product-id],
html.light-mode .kol-product-card .kol-product-actions-right .kol-apes-counters[data-product-id] {
	flex: 1 1 100% !important;
	margin-right: auto !important;
}

html.dark-mode .kol-product-card .kol-product-actions-right .button,
html.dark-mode .kol-product-card .kol-product-actions-right .add-to-library-btn,
html.dark-mode .kol-product-card .kol-product-actions-right .custom-add-to-cart,
html.light-mode .kol-product-card .kol-product-actions-right .button,
html.light-mode .kol-product-card .kol-product-actions-right .add-to-library-btn,
html.light-mode .kol-product-card .kol-product-actions-right .custom-add-to-cart {
	flex: 0 0 auto !important;
	white-space: nowrap !important;
	margin-left: auto !important;
}

html.dark-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id],
html.light-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id],
html.dark-mode .kol-product-card .track-price .kol-pec-icons[data-product-id],
html.light-mode .kol-product-card .track-price .kol-pec-icons[data-product-id],
html.dark-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price,
html.light-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price {
	margin-top: 0.5rem !important;
	display: inline-flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 8px !important;
	max-width: 100% !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
}

html.dark-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price::-webkit-scrollbar,
html.light-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price::-webkit-scrollbar,
html.dark-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id]::-webkit-scrollbar,
html.light-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id]::-webkit-scrollbar,
html.dark-mode .kol-product-card .track-price .kol-pec-icons[data-product-id]::-webkit-scrollbar,
html.light-mode .kol-product-card .track-price .kol-pec-icons[data-product-id]::-webkit-scrollbar {
	display: none !important;
}

html.dark-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price .kol-pec-icon,
html.light-mode .kol-product-card .kol-pec-icons.kol-apes-row-near-price .kol-pec-icon,
html.dark-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id] .kol-pec-icon,
html.light-mode .kol-product-card .kol-product-card-meta .kol-pec-icons[data-product-id] .kol-pec-icon,
html.dark-mode .kol-product-card .track-price .kol-pec-icons[data-product-id] .kol-pec-icon,
html.light-mode .kol-product-card .track-price .kol-pec-icons[data-product-id] .kol-pec-icon {
	flex: 0 0 auto !important;
}

/* Legacy APES fallback support */

html.light-mode .kol-apes-counters {
	color: #1f2937;
}

html.light-mode .kol-apes-counter {
	background: white;
	border: 1px solid #e5e7eb;
	color: #1f2937;
}

html.light-mode .kol-apes-counter:hover {
	border-color: #d1d5db;
	background: #f9fafb;
}

html.light-mode .kol-apes-like-btn {
	color: #ef4444;
}

html.light-mode .kol-apes-counter.liked {
	background: #fef2f2;
	border-color: #fecaca;
}

html.light-mode .kol-apes-counter-count {
	color: #6b7280;
}

html.dark-mode .kol-apes-counters {
	color: #e0e0e0;
}

html.dark-mode .kol-apes-counter {
	background: #2a2a2a;
	border: 1px solid #333;
	color: #e0e0e0;
}

html.dark-mode .kol-apes-counter:hover {
	border-color: #444;
	background: #333;
}

html.dark-mode .kol-apes-like-btn {
	color: #f87171;
}

html.dark-mode .kol-apes-counter.liked {
	background: #7f1d1d;
	border-color: #991b1b;
}

html.dark-mode .kol-apes-counter-count {
	color: #9ca3af;
}

.kol-apes-counters {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	font-family: inherit;
}

.kol-apes-counter {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	transition: all 0.2s ease;
	user-select: none;
}

.kol-apes-counter[data-counter-type="plays"] {
	cursor: default;
}

.kol-apes-counter-icon {
	font-size: 16px;
	display: inline-flex;
	align-items: center;
}

.kol-apes-counter-count {
	font-weight: 500;
	font-size: 13px;
}

.kol-apes-counter[data-counter-type="likes"]:hover .kol-apes-like-btn {
	transform: scale(1.2);
}

.kol-apes-counter.liked .kol-apes-like-btn {
	transform: scale(1.1);
}
