.hkcb-root {
	--hkcb-current-size: var(--hkcb-size);
	position: fixed;
	z-index: var(--hkcb-z-index);
	line-height: 1;
}

.hkcb-root.is-empty:not(.hkcb-show-empty) {
	display: none;
}

.hkcb-position-bottom-right {
	right: var(--hkcb-offset-right);
	bottom: var(--hkcb-offset-bottom);
}

.hkcb-position-bottom-left {
	left: var(--hkcb-offset-left);
	bottom: var(--hkcb-offset-bottom);
}

.hkcb-position-top-right {
	right: var(--hkcb-offset-right);
	top: var(--hkcb-offset-top);
}

.hkcb-position-top-left {
	left: var(--hkcb-offset-left);
	top: var(--hkcb-offset-top);
}

#hikacartbadge-root .hkcb-button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--hkcb-current-size);
	height: var(--hkcb-current-size);
	border-radius: 999px;
	background: var(--hkcb-button-color) !important;
	color: var(--hkcb-icon-color) !important;
	box-shadow: 0 14px 30px rgba(15, 23, 42, 0.24), 0 3px 8px rgba(15, 23, 42, 0.18);
	text-decoration: none !important;
	-webkit-tap-highlight-color: transparent;
	transition: transform 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
}

#hikacartbadge-root .hkcb-button:hover,
#hikacartbadge-root .hkcb-button:focus,
#hikacartbadge-root .hkcb-button:focus-visible,
#hikacartbadge-root .hkcb-button:active,
#hikacartbadge-root .hkcb-button:visited {
	background: var(--hkcb-button-color) !important;
	color: var(--hkcb-icon-color) !important;
	text-decoration: none !important;
	transform: translateY(-1px);
	box-shadow: 0 18px 34px rgba(15, 23, 42, 0.28), 0 5px 12px rgba(15, 23, 42, 0.2);
}

#hikacartbadge-root .hkcb-button:focus-visible {
	outline: 3px solid rgba(220, 38, 38, 0.32);
	outline-offset: 4px;
}

.hkcb-icon {
	display: inline-flex;
	width: 58%;
	height: 58%;
}

#hikacartbadge-root .hkcb-icon,
#hikacartbadge-root .hkcb-icon svg,
#hikacartbadge-root .hkcb-icon svg path {
	color: var(--hkcb-icon-color) !important;
	fill: var(--hkcb-icon-color) !important;
	stroke: none !important;
}

#hikacartbadge-root .hkcb-icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

#hikacartbadge-root .hkcb-count {
	position: absolute;
	top: -7px;
	right: -7px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 23px;
	height: 23px;
	padding: 0 6px;
	border: 2px solid #ffffff !important;
	border-radius: 999px;
	background: var(--hkcb-badge-color) !important;
	color: #ffffff !important;
	font: 700 12px/1 Arial, Helvetica, sans-serif !important;
	letter-spacing: 0 !important;
	white-space: nowrap;
	box-shadow: 0 6px 14px rgba(220, 38, 38, 0.35);
	text-shadow: none !important;
}

#hikacartbadge-root.is-empty.hkcb-show-empty .hkcb-count {
	opacity: 0.88;
}

@media (max-width: 767px) {
	.hkcb-root {
		--hkcb-current-size: var(--hkcb-mobile-size);
	}

	.hkcb-position-bottom-right {
		right: calc(var(--hkcb-mobile-offset-x) + env(safe-area-inset-right));
		bottom: calc(var(--hkcb-mobile-offset-y) + env(safe-area-inset-bottom));
	}

	.hkcb-position-bottom-left {
		left: calc(var(--hkcb-mobile-offset-x) + env(safe-area-inset-left));
		bottom: calc(var(--hkcb-mobile-offset-y) + env(safe-area-inset-bottom));
	}

	.hkcb-position-top-right {
		right: calc(var(--hkcb-mobile-offset-x) + env(safe-area-inset-right));
		top: calc(var(--hkcb-mobile-offset-y) + env(safe-area-inset-top));
	}

	.hkcb-position-top-left {
		left: calc(var(--hkcb-mobile-offset-x) + env(safe-area-inset-left));
		top: calc(var(--hkcb-mobile-offset-y) + env(safe-area-inset-top));
	}

	#hikacartbadge-root .hkcb-count {
		top: -6px;
		right: -6px;
		min-width: 22px;
		height: 22px;
		font-size: 11px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hkcb-button {
		transition: none;
	}
}