:root {
	--hx-sidebar-brand-logo-background-color: var(--bs-primary);
	--main-bg: var(--bs-white);
	--product-variant-height: 90px;
	--card-list-padding: 1.5rem;
	--card-order-detail-padding: 1.5rem;
	--table-th-font-size: var(--size-12);
	--hx-chiplist-gap: .5rem;
	--green-indicator: #0A8A00;
	--orange-indicator: #DB9330;
	--red-indicator: #DE2121;
	--grey-indicator: #808080;
	--blue-indicator: #3398FF;
	--grey-muted: #888888;
	--grey-muted-rgb: 136, 136, 136;
	/* TODO: Bootstrap breakpoints (will be added in Bootstrap 5.3) */
	--bs-breakpoint-xs: 0;
	--bs-breakpoint-sm: 576px;
	--bs-breakpoint-md: 768px;
	--bs-breakpoint-lg: 992px;
	--bs-breakpoint-xl: 1200px;
	--bs-breakpoint-xxl: 1400px;
	--bs-spacer-1: .25rem;
	--bs-spacer-2: .5rem;
	--bs-spacer-3: 1rem;
	--bs-spacer-4: 1.5rem;
	--bs-spacer-5: 3rem;
	--customer-support-banner-spacer-y: 8.75rem;
	--hx-chip-list-gap: var(--size-10);
	/* Reserves space for scrollbar to prevent content shifting when loading content */
	/*	scrollbar-gutter: stable both-edges;*/
}

h1,
h2 {
	font-weight: bold;
}

.hx-grid-empty-data-row td {
	border-bottom: 0;
}

#blazor-error-ui {
	background: lightyellow;
	bottom: 0;
	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
	display: none;
	left: 0;
	padding: 0.6rem 1.25rem 0.7rem 1.25rem;
	position: fixed;
	width: 100%;
	z-index: 10000;
}

#blazor-error-ui .dismiss {
	cursor: pointer;
	position: absolute;
	right: 0.75rem;
	top: 0.5rem;
}

.hx-chip-list-reset-btn i,
.chip-category-list__reset-btn i{
	font-size: var(--size-16);
	margin-left: var(--size-2);
}

@media(min-width: 576px) {
	.quantity-selector-tooltip {
		--bs-tooltip-max-width: 35ch;
	}
}


/*Cookie banner*/
#termsfeed-com---nb {
	background-color: var(--bs-white);

	& .cc-nb-okagree,
	& .cc-nb-reject,
	& .cc-nb-changep {
		padding: 0.375rem 1rem;
		font-size: 0.875rem;
		border-radius: 50rem;
		border-width: 2px;
		border-style: solid;
		margin-right: .5rem!important;
		margin-bottom: .5rem!important;
		&:focus {
			box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), .5)
		}
	}

	& .cc-nb-okagree {
		background-color: var(--bs-primary);
		border-color: var(--bs-primary);
	}

	& .cc-nb-reject,
	& .cc-nb-changep{
		color: var(--bs-primary);
		background-color: var(--bs-white);
		border-color: var(--bs-primary);
	}
}

.messenger-text-dark {
	color: var(--bs-dark) !important;
	& .btn-close {
		filter: none;
	}
}

.backdrop-highlighted-element {
	z-index: 1055;
	position: relative;
}

.no-scroll {
	position: fixed;
	overflow-y: scroll;
	width: 100%;
}