@font-face {
	font-display: swap;
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 400;
	src: url(./fonts/SourceSans3-Variable.ttf) format('truetype');
}

body {
	font-family: 'Source Sans 3' !important;
}

/* ---------- Marketplace app tags ---------- */
.app-type-badge {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	height: 20px;
	padding: 0 8px;
	position: absolute;
	right: 32px;
	top: -6px;
}

/* ---------- App type variants ---------- */

.app-type-badge.batch {
	--badge-color: #ffb46e;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.checkout {
	--badge-color: #9be169;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.fragments {
	--badge-color: #ff5f5f;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.object-definition {
	--badge-color: #5fc8ff;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.payment-methods {
	--badge-color: #4b9bff;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.site-initializer {
	--badge-color: #50d2a0;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.theme {
	--badge-color: #af78ff;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.app-type-badge.workflow-action {
	--badge-color: #7785ff;
	background-color: color-mix(in srgb, var(--badge-color) 70%, white 60%);
	color: color-mix(in srgb, var(--badge-color) 70%, black 50%);
}

.beta-badge-label {
	align-items: center;
	background-color: #d1ecfa;
	border-radius: 4px;
	color: #166e9e;
	display: flex;
	font-size: 13px;
	font-weight: 600;
	justify-content: center;
	line-height: 16px;
	padding: 4px 8px;
	text-align: center;
	vertical-align: middle;
}

/* ---------- Cards ---------- */
.card.main-image {
	border-radius: 10px !important;
}

/* ---------- Dropdowns ---------- */
.child-menu.dropdown-menu {
	border-radius: 8px !important;
	padding: 0 !important;
}

.lfr-cookie-banner-text {
	font-size: 13px;
	margin-bottom: 6px;
}

/* ---------- Facets ---------- */
.lfr-layout-structure-item-com-liferay-portal-search-web-category-facet-portlet-categoryfacetportlet,
.lfr-layout-structure-item-com-liferay-commerce-product-content-search-web-internal-portlet-cpspecificationoptionfacetsportlet {
	border-radius: 10px;
}

/* ---------- Navigation ---------- */
.lfr-nav-item.nav-item {
	border-radius: 8px;
	margin-right: 0.5rem;
	transition: all 0.3s ease-in-out;
}

.lfr-nav-item.nav-item .nav-link {
	padding: 14px 18px;
}

.lfr-nav-item.nav-item:hover {
	background-color: #ffffff !important;
	font-weight: none !important;
}

.lfr-nav-item.nav-item.dropdown:has(.child-menu.dropdown-menu .active.selected)
	.nav-link {
	color: #0053f0 !important;
	font-weight: 600;
}

.lfr-nav-item.nav-item.selected.active .nav-link {
	border-bottom: #004ad7 solid 3px !important;
	color: #0053f0 !important;
	font-weight: 600;
}

.lfr-nav-item.nav-item.selected.active .nav-link:hover {
	background-color: #ffffff !important;
	border-bottom: #004ad7 solid 3px !important;
	font-weight: 600;
}

/* ---------- Product gallery arrows ---------- */
.product-gallery .arrow.next {
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}

.product-gallery .arrow.prev {
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
}