.rabino-product-actions-auto {
	display: inline-flex;
	margin: 10px 5px;
}

.rabino-product-action {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 42px;
	padding: 8px 13px !important;
	border: 1px solid color-mix(in srgb, currentColor 22%, transparent) !important;
	border-radius: var(--rabino-lists-radius, 10px) !important;
	color: inherit !important;
	background: transparent !important;
	font: 700 13px/1.4 var(--rabino-lists-font, inherit) !important;
	cursor: pointer;
	box-shadow: none !important;
	transition: .2s ease;
}

.rabino-product-action:hover,
.rabino-product-action.is-active {
	color: var(--rabino-lists-color) !important;
	border-color: color-mix(in srgb, var(--rabino-lists-color) 55%, transparent) !important;
	background: color-mix(in srgb, var(--rabino-lists-color) 7%, transparent) !important;
}

.rabino-product-action svg,
.rabino-product-action img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.rabino-product-action svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.rabino-favorite-button.is-active svg { fill: currentColor; }
.rabino-product-action.is-loading { opacity: .55; pointer-events: none; }

.rabino-product-action__tip {
	position: absolute;
	right: 50%;
	bottom: calc(100% + 9px);
	z-index: 30;
	transform: translateX(50%) translateY(3px);
	min-width: max-content;
	padding: 6px 9px;
	border-radius: 7px;
	color: #fff;
	background: #172033;
	font: 500 11px/1.5 var(--rabino-lists-font, inherit);
	box-shadow: 0 7px 20px rgba(0, 0, 0, .14);
	opacity: 0;
	pointer-events: none;
	transition: .18s;
}

.rabino-product-action:hover .rabino-product-action__tip,
.rabino-product-action:focus-visible .rabino-product-action__tip {
	opacity: 1;
	transform: translateX(50%);
}

.rabino-compare {
	width: min(100%, 1280px);
	margin: 30px auto;
	color: inherit;
	font-family: var(--rabino-lists-font, inherit);
}

.rabino-compare * { box-sizing: border-box; }

.rabino-compare > header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 16px;
	padding: 22px 24px;
	border: 1px solid rgba(20, 30, 45, .09);
	border-radius: calc(var(--rabino-lists-radius, 12px) + 5px);
	background: #fff;
	box-shadow: 0 7px 28px rgba(20, 30, 45, .045);
}

.rabino-compare header h1 {
	margin: 0 !important;
	color: inherit !important;
	font: 800 23px/1.6 var(--rabino-lists-font, inherit) !important;
}

.rabino-compare header p {
	margin: 3px 0 0 !important;
	color: #6b7280 !important;
	font-size: 13px;
}

.rabino-compare header > span {
	padding: 7px 11px;
	border-radius: 99px;
	color: var(--rabino-lists-color);
	background: color-mix(in srgb, var(--rabino-lists-color) 8%, transparent);
	font-weight: 800;
}

.rabino-compare__picker {
	position: relative;
	margin-bottom: 16px;
	padding: 18px 22px;
	border: 1px solid rgba(20, 30, 45, .09);
	border-radius: calc(var(--rabino-lists-radius, 12px) + 3px);
	background: #fff;
}

.rabino-compare__picker > label {
	display: block;
	margin-bottom: 8px;
	font-weight: 800;
}

.rabino-compare__picker > div:first-of-type {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 8px;
}

.rabino-compare__picker input {
	width: 100% !important;
	min-height: 46px !important;
	padding: 9px 13px !important;
	border: 1px solid #dce2e8 !important;
	border-radius: 11px !important;
	background: #fff !important;
	font: 500 13px var(--rabino-lists-font, inherit) !important;
}

.rabino-compare__picker input:focus {
	border-color: var(--rabino-lists-color) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--rabino-lists-color) 12%, transparent) !important;
	outline: 0;
}

.rabino-compare__picker > div > button {
	min-height: 46px;
	padding: 8px 18px !important;
	border: 0 !important;
	border-radius: 11px !important;
	color: #fff !important;
	background: var(--rabino-lists-color) !important;
	font: 800 13px var(--rabino-lists-font, inherit) !important;
	cursor: pointer;
}

.rabino-compare__results {
	position: absolute;
	top: calc(100% - 5px);
	right: 22px;
	left: 22px;
	z-index: 20;
	max-height: 340px;
	overflow: auto;
	padding: 7px;
	border: 1px solid #e1e6eb;
	border-radius: 13px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .15);
}

.rabino-compare__results > button {
	display: grid;
	width: 100%;
	grid-template-columns: 50px 1fr auto;
	align-items: center;
	gap: 10px;
	padding: 8px !important;
	border: 0 !important;
	border-radius: 9px !important;
	color: inherit !important;
	background: #fff !important;
	text-align: right !important;
	cursor: pointer;
}

.rabino-compare__results > button:hover { background: #f5f8fa !important; }
.rabino-compare__results img { width: 50px; height: 50px; object-fit: contain; }
.rabino-compare__results span { display: grid; }
.rabino-compare__results strong { font-size: 12px; }
.rabino-compare__results small { color: #6b7280; font-size: 11px; }
.rabino-compare__results b { color: var(--rabino-lists-color); font-size: 11px; }
.rabino-compare__searching { margin: 0; padding: 14px; text-align: center; color: #6b7280; }

.rabino-compare__scroll {
	overflow: auto;
	border: 1px solid rgba(20, 30, 45, .09);
	border-radius: calc(var(--rabino-lists-radius, 12px) + 5px);
	background: #fff;
	box-shadow: 0 12px 36px rgba(20, 30, 45, .055);
	scrollbar-width: thin;
}

.rabino-compare table {
	width: 100%;
	min-width: 760px;
	border: 0 !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	table-layout: fixed;
}

.rabino-compare th,
.rabino-compare td {
	min-width: 210px;
	padding: 17px !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(20, 30, 45, .07) !important;
	border-left: 1px solid rgba(20, 30, 45, .055) !important;
	text-align: center !important;
	vertical-align: middle !important;
	background: #fff !important;
	font: 500 13px/1.8 var(--rabino-lists-font, inherit) !important;
}

.rabino-compare th {
	position: sticky;
	right: 0;
	z-index: 4;
	min-width: 155px !important;
	width: 155px;
	color: #4b5563 !important;
	background: #f8fafc !important;
	font-weight: 800 !important;
}

.rabino-compare__products td { position: relative; padding-top: 22px !important; }

.rabino-compare__products td > a {
	display: flex;
	min-height: 230px;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	color: inherit !important;
	text-decoration: none !important;
}

.rabino-compare__products img { display: block; width: 150px; height: 150px; object-fit: contain; }
.rabino-compare__products strong { min-height: 48px; font-weight: 800; }

.rabino-compare__remove {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	width: 30px;
	height: 30px;
	padding: 0 !important;
	border: 1px solid #e5e7eb !important;
	border-radius: 50% !important;
	color: #8b95a4 !important;
	background: #fff !important;
	font-size: 20px !important;
	line-height: 1 !important;
	cursor: pointer;
}

.rabino-compare__price { min-height: 35px; color: var(--rabino-lists-color); font-weight: 800; }
.rabino-compare__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 9px; }

.rabino-compare__actions a {
	display: grid;
	min-height: 40px;
	place-items: center;
	padding: 6px !important;
	border: 1px solid var(--rabino-lists-color) !important;
	border-radius: 10px !important;
	color: var(--rabino-lists-color) !important;
	background: #fff !important;
	font-size: 11px !important;
	text-decoration: none !important;
}

.rabino-compare__actions .rabino-compare__cart { color: #fff !important; background: var(--rabino-lists-color) !important; }

.rabino-compare__empty {
	padding: 60px 22px;
	text-align: center;
	border: 1px solid rgba(20, 30, 45, .09);
	border-radius: calc(var(--rabino-lists-radius, 12px) + 5px);
	background: #fff;
}

.rabino-compare__empty > span {
	display: grid;
	width: 70px;
	height: 70px;
	margin: 0 auto 15px;
	place-items: center;
	border-radius: 22px;
	color: var(--rabino-lists-color);
	background: color-mix(in srgb, var(--rabino-lists-color) 8%, transparent);
	font-size: 31px;
}

.rabino-compare__empty h2 { margin: 0 !important; font: 800 19px/1.7 var(--rabino-lists-font, inherit) !important; }
.rabino-compare__empty p { color: #6b7280; }

.rabino-lists-toast {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 10000000;
	max-width: min(360px, calc(100vw - 44px));
	padding: 12px 15px;
	border-radius: 11px;
	color: #fff;
	background: #172033;
	font: 600 13px/1.7 var(--rabino-lists-font, inherit);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .2);
	opacity: 0;
	transform: translateY(10px);
	transition: .2s;
}

.rabino-lists-toast.is-visible { opacity: 1; transform: none; }
.rabino-lists-toast.is-error { background: #b42318; }

.rabino-login-required {
	position: fixed;
	inset: 0;
	z-index: 10000001;
	display: grid;
	place-items: center;
	padding: 20px;
	direction: rtl;
	font-family: var(--rabino-lists-font, inherit);
}

.rabino-login-required__backdrop { position: absolute; inset: 0; background: rgba(7, 12, 22, .67); backdrop-filter: blur(5px); }

.rabino-login-required section {
	position: relative;
	width: min(410px, 100%);
	padding: 30px;
	text-align: center;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 25px 80px rgba(0, 0, 0, .25);
}

.rabino-login-required [data-close] {
	position: absolute;
	top: 10px;
	left: 10px;
	border: 0;
	color: #6b7280;
	background: transparent;
	font-size: 24px;
	cursor: pointer;
}

.rabino-login-required section > span {
	display: grid;
	width: 62px;
	height: 62px;
	margin: 0 auto 14px;
	place-items: center;
	border-radius: 20px;
	color: var(--rabino-lists-color);
	background: color-mix(in srgb, var(--rabino-lists-color) 10%, transparent);
	font-size: 34px;
}

.rabino-login-required h2 { margin: 0 0 8px !important; font: 800 19px/1.7 var(--rabino-lists-font, inherit) !important; }
.rabino-login-required p { margin: 0 0 18px !important; color: #6b7280 !important; font: 500 13px/1.9 var(--rabino-lists-font, inherit) !important; }

.rabino-login-required a {
	display: inline-grid;
	min-height: 44px;
	place-items: center;
	padding: 8px 20px;
	border-radius: 11px;
	color: #fff !important;
	background: var(--rabino-lists-color);
	font-weight: 800;
	text-decoration: none !important;
}

.dark .rabino-compare > header,
.dark .rabino-compare__picker,
.dark .rabino-compare__scroll,
.dark .rabino-compare__empty,
.dark .rabino-compare td,
.dark .rabino-login-required section,
body.dark-mode .rabino-compare > header,
body.dark-mode .rabino-compare__picker,
body.dark-mode .rabino-compare__scroll,
body.dark-mode .rabino-compare__empty,
body.dark-mode .rabino-compare td,
body.dark-mode .rabino-login-required section {
	border-color: #2a3850 !important;
	color: #f3f6fb !important;
	background: #111827 !important;
}

.dark .rabino-compare th,
body.dark-mode .rabino-compare th { border-color: #2a3850 !important; color: #d7deea !important; background: #172033 !important; }

.dark .rabino-compare__picker input,
.dark .rabino-compare__results,
.dark .rabino-compare__results > button,
body.dark-mode .rabino-compare__picker input,
body.dark-mode .rabino-compare__results,
body.dark-mode .rabino-compare__results > button {
	border-color: #2a3850 !important;
	color: #f3f6fb !important;
	background: #101a2b !important;
}

.dark .rabino-compare header p,
.dark .rabino-compare__empty p,
.dark .rabino-login-required p,
body.dark-mode .rabino-compare header p,
body.dark-mode .rabino-compare__empty p,
body.dark-mode .rabino-login-required p { color: #a8b3c7 !important; }

@media (max-width: 700px) {
	.rabino-compare { margin: 16px auto; }
	.rabino-compare > header { align-items: flex-start; flex-direction: column; }
	.rabino-compare__picker { padding: 14px; }
	.rabino-compare__results { right: 14px; left: 14px; }
	.rabino-compare th { min-width: 120px !important; width: 120px; }
	.rabino-compare th,
	.rabino-compare td { min-width: 185px; padding: 12px !important; }
	.rabino-compare__products img { width: 125px; height: 125px; }
}