.wbbShopProductListPanel {
	padding: 20px;
	border: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
	background: var(--wcfContentBackground, transparent);
}

.wbbShopProductPagination {
	display: flex;
	align-items: center;
	min-height: 36px;
}

.wbbShopProductPagination--top {
	margin-bottom: 20px;
}

.wbbShopProductPagination--bottom {
	margin-top: 20px;
}

.wbbShopProductGrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 470px), 1fr));
	gap: 20px;
}

.wbbShopProductCard {
	display: flex;
	flex-direction: column;
	min-width: 0;
	border: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
	border-radius: var(--wcfBorderRadius, 4px);
	background: var(--wcfContentBackground, transparent);
	overflow: hidden;
	transition: border-color 180ms ease-out;
}

.wbbShopProductCard:hover {
	border-color: var(--wcfContentBorder, rgba(255, 255, 255, 0.18));
}

.wbbShopProductCardCover {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 4.5;
	background: var(--wcfSidebarBackground, rgba(255, 255, 255, 0.04));
	overflow: hidden;
}

.wbbShopProductCardCover:focus-visible {
	outline: 2px solid var(--wcfLinkColor, #4da3ff);
	outline-offset: -2px;
}

.wbbShopProductCardCover img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 240ms ease-out;
}

.wbbShopProductCard:hover .wbbShopProductCardCover img {
	transform: scale(1.015);
}

.wbbShopProductCover--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wcfContentDimmedText, #999);
	text-decoration: none;
}

.wbbShopProductCoverPlaceholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 16px;
	font-size: 0.82rem;
	text-align: center;
}

.wbbShopProductCardContent {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
	padding: 12px 14px 10px;
}

.wbbShopProductCardHeader {
	margin: 0 0 8px;
}

.wbbShopProductCardTitle {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.35;
}

.wbbShopProductCardTitle a {
	color: var(--wcfContentText, inherit);
	text-decoration: none;
}

.wbbShopProductCardTitle a:hover {
	color: var(--wcfLinkColor, #4da3ff);
}

.wbbShopProductCardTitle a:focus-visible,
.wbbShopPrice:focus-visible {
	outline: 2px solid var(--wcfLinkColor, #4da3ff);
	outline-offset: 2px;
}

.wbbShopProductCardRating {
	display: flex;
	align-items: center;
	gap: 5px;
	margin-top: 4px;
	color: var(--wcfContentDimmedText, #999);
	font-size: 0.88rem;
}

.wbbShopProductCardExcerpt {
	min-height: 2.9em;
	color: var(--wcfContentDimmedText, #bbb);
	font-size: 0.92rem;
	line-height: 1.45;
}

.wbbShopProductCardExcerpt .messageText {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.wbbShopProductCardExcerpt p {
	margin: 0;
}

.wbbShopProductCardPurchaseRow {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 10px;
}

.wbbShopProductCardBadges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px;
	min-width: 0;
}

.wbbShopProductCardLabels {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 5px;
	margin: 0;
}

.wbbShopPrice {
	flex: 0 0 auto;
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--wcfLinkColor, #4da3ff);
	text-decoration: none;
	white-space: nowrap;
}

.wbbShopPrice:hover {
	text-decoration: underline;
}

.wbbShopProductCardFooter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	min-height: 42px;
	padding: 10px 14px;
	border-top: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
	background: var(--wcfSidebarBackground, rgba(255, 255, 255, 0.03));
	color: var(--wcfContentDimmedText, #aaa);
	font-size: 0.84rem;
}

.wbbShopProductCardStat {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.wbbShopProductCardStat--likes woltlab-core-reaction-summary {
	display: inline-flex;
}

.wbbShopProductReactionFooter.entry__footer,
.wbbShopReviewReactionFooter.entry__footer,
.wbbShopProductDetailEntry.entry > .entry__footer,
.wbbShopReviewReactionTarget.entry > .entry__footer,
.wbbShopReviewReactionTarget.entry .commentContent > .entry__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 10px;
	row-gap: 5px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
}

.wbbShopProductDetailEntry.entry > .entry__footer > .entry__footerButtons,
.wbbShopReviewReactionTarget.entry > .entry__footer > .entry__footerButtons,
.wbbShopReviewReactionTarget.entry .commentContent > .entry__footer > .entry__footerButtons {
	margin-inline-start: auto;
}

.wbbShopProductReactionSummary,
.wbbShopReviewReactionSummary {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	flex: 0 1 auto;
}

.wbbShopProductReviewsPreview {
	margin-top: 16px;
}

.wbbShopProductDetailMain .productDescription.messageText {
	margin-top: 20px;
}

.wbbShopProductDetailMain .productDescription.messageText img {
	max-width: 100%;
	height: auto;
}

.wbbShopProductTabMenu > .tabMenuContent#versions,
.wbbShopProductTabMenu > .tabMenuContent#reviews {
	margin-top: 20px;
}

.wbbShopProductTabMenu > .tabMenuContent#reviews > .wbbShopReviewToolbar {
	margin-top: 0;
}

.wbbShopProductTabMenu > .tabMenuContent#reviews > .wbbShopReviewList {
	margin-top: 0;
}

.wbbShopReviewToolbar {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin: 0 0 16px;
}

.wbbShopReviewToolbar.boxHeadlineNavigation {
	justify-content: flex-end;
}

.wbbShopReviewListItem.box64 {
	align-items: flex-start;
}

.wbbShopReviewListItem.box64 > div:last-child {
	flex: 1 1 auto;
	min-width: 0;
}

.wbbShopReviewToolbar .wbbShopReviewAddButton {
	margin-left: auto;
}

.wbbShopReviewRating {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.wbbShopReviewRating .icon {
	color: var(--wcfStatusWarningForeground);
}

.wbbShopReviewRating .icon:not([data-type='solid']) {
	opacity: 0.35;
}


.wbbShopLabelFilter {
	margin-bottom: 20px;
	padding: 16px;
	border: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
	border-radius: var(--wcfBorderRadius, 6px);
}

.wbbShopProductDetailLabelList {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.contentHeader.wbbShopProductDetailHeader .contentTitle {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.wbbShopProductDetailTitleText {
	min-width: 0;
}

.contentHeader .contentHeaderMetaList.wbbShopReviewRating,
.contentHeader .contentHeaderMetaList > li.wbbShopReviewRating {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.contentHeader.wbbShopProductDetailHeader {
	margin-bottom: 10px;
}

.contentHeader.wbbShopProductDetailHeader .contentHeaderMetaData {
	margin-top: 5px;
}

.wbbShopReviewList {
	list-style: none;
	padding: 0;
	margin: 0;
}

.wbbShopReviewListItem + .wbbShopReviewListItem {
	margin-top: 16px;
}

.wbbShopReviewMetaData {
	margin-top: 4px;
}

.wbbShopReviewFooter.comment__footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-top: 12px;
}

.wbbShopReviewFooter .comment__reactions {
	min-height: 32px;
}

.wbbShopReviewFooter .comment__buttons {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

.wbbShopReviewCount {
	margin-left: 4px;
}

.wbbShopSidebarItemList .wbbShopSidebarBadgeList {
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
}

.wbbShopSidebarItemList .sidebarItemTitle > h3 {
	margin-top: 0;
}

.wbbShopCategoryList .sidebarItemTitle > h3 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.wbbShopCategoryList .sidebarItemTitle > h3 > :first-child {
	min-width: 0;
}

.wbbShopCategoryList .sidebarItemTitle > h3 > .badge {
	flex: 0 0 auto;
	margin-left: auto;
}

.wbbShopSidebarItemList .wbbShopSidebarReviewRating {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
}

.wbbShopSidebarItemList .wbbShopSidebarReviewRating .wbbShopReviewRating {
	gap: 1px;
}

.wbbShopSidebarItemList .wbbShopSidebarReviewRating .icon {
	font-size: 12px;
}

.wbbShopSidebarItemList .wbbShopSidebarFallbackIcon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	color: var(--wcfSidebarDimmedText, rgba(255, 255, 255, 0.55));
}

.wbbShopProductTagList {
	margin-top: 20px;
	margin-bottom: 12px;
}

.wbbShopProductTagList .labelList {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wbbShopFeatureList {
	list-style: none;
	padding: 0;
	margin: 16px 0;
}

.wbbShopFeatureList li {
	padding: 8px 0;
	border-bottom: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
}

.wbbShopScreenshotGrid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 12px;
	margin-top: 12px;
}

.wbbShopScreenshotGrid img {
	width: 100%;
	height: auto;
	border-radius: var(--wcfBorderRadius, 6px);
}

.wbbShopVersionList {
	list-style: none;
	padding: 0;
	margin: 0;
}

.wbbShopVersionList li {
	padding: 8px 0;
	border-bottom: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
}

.wbbShopSubpageNav {
	margin-bottom: 16px;
}

@media (max-width: 800px) {
	.wbbShopProductListPanel {
		padding: 12px;
	}

	.wbbShopProductGrid {
		gap: 14px;
	}

	.wbbShopProductCardCover {
		aspect-ratio: 16 / 8;
	}

	.wbbShopProductCardPurchaseRow {
		align-items: flex-start;
	}

	.wbbShopPurchaseBox {
		flex-direction: column;
		align-items: flex-start;
	}

	.wbbShopPurchaseBoxAction {
		width: 100%;
		justify-content: space-between;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wbbShopProductCard,
	.wbbShopProductCardCover img {
		transition: none;
	}
}


/* Customer dashboard */
.wbbShopCustomerShell {
    padding: 24px;
    border: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
    background: var(--wcfContentBackground, transparent);
}

.wbbShopCustomerDashboard {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
    gap: 32px;
    align-items: start;
}

.wbbShopCustomerPrimary,
.wbbShopCustomerSecondary {
    min-width: 0;
}

.wbbShopCustomerPanel + .wbbShopCustomerPanel {
    margin-top: 32px;
}

.wbbShopCustomerPanelHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 40px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
}

.wbbShopCustomerPanelTitle {
    margin: 0;
    color: var(--wcfContentText, inherit);
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.3;
}

.wbbShopCustomerList {
    margin: 0;
    padding: 0;
    list-style: none;
}

.wbbShopCustomerListItem {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 76px;
    padding: 14px 0;
    border-bottom: 1px solid var(--wcfContentBorderInner, rgba(255, 255, 255, 0.08));
}

.wbbShopCustomerList--compact .wbbShopCustomerListItem {
    min-height: 66px;
    padding-block: 12px;
}

.wbbShopCustomerItemIcon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--wcfContentDimmedText, #999);
}

.wbbShopCustomerItemBody {
    min-width: 0;
}

.wbbShopCustomerItemTitleLine,
.wbbShopCustomerItemMeta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.wbbShopCustomerItemTitleLine {
    gap: 6px;
}

.wbbShopCustomerItemTitle {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--wcfLinkColor, #4da3ff);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
}

.wbbShopCustomerItemTitle:hover {
    text-decoration: underline;
}

.wbbShopCustomerItemTitle:focus-visible,
.jsWbbShopCopyValue:focus-visible {
    outline: 2px solid var(--wcfLinkColor, #4da3ff);
    outline-offset: 2px;
}

.wbbShopCustomerVersion {
    color: var(--wcfContentDimmedText, #999);
    font-weight: 500;
}

.wbbShopCustomerItemMeta {
    gap: 4px 10px;
    margin-top: 4px;
    color: var(--wcfContentDimmedText, #999);
    font-size: 0.84rem;
    line-height: 1.4;
}

.wbbShopCustomerItemMeta > span + span::before,
.wbbShopCustomerItemMeta > code::before {
    content: "·";
    margin-right: 10px;
    color: var(--wcfContentBorder, rgba(255, 255, 255, 0.22));
}

.wbbShopCustomerItemMeta code {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.wbbShopCustomerItemAction {
    justify-self: end;
}

.wbbShopPackageServerSteps {
    margin: 16px 0 20px;
    padding-left: 24px;
    color: var(--wcfContentDimmedText, #999);
    line-height: 1.55;
}

.wbbShopPackageServerSteps li + li {
    margin-top: 6px;
}

.wbbShopCredentialGroup + .wbbShopCredentialGroup {
    margin-top: 14px;
}

.wbbShopCredentialGroup > label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.wbbShopCopyField {
    display: flex;
    align-items: stretch;
    gap: 6px;
}

.wbbShopCopyField input {
    flex: 1 1 auto;
    min-width: 0;
}

.wbbShopCopyField .button {
    flex: 0 0 40px;
    width: 40px;
    min-height: 36px;
    padding-inline: 0;
}

.wbbShopCopyStatus {
    min-height: 1.4em;
    margin: 8px 0 0;
    color: var(--wcfStatusSuccessText, var(--wcfContentDimmedText, #999));
    font-size: 0.84rem;
}

/* Pending bank transfer guidance */
.wbbShopBankTransferNotice {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 14px;
    margin-top: 18px;
    padding: 16px;
    border: 1px solid var(--wcfContentBorder, rgba(255, 255, 255, 0.16));
    border-radius: var(--wcfBorderRadius, 4px);
    background: var(--wcfSidebarBackground, rgba(255, 255, 255, 0.04));
    color: var(--wcfContentText, inherit);
}

.wbbShopCustomerListItem > .wbbShopBankTransferNotice {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 2px;
}

.wbbShopBankTransferNoticeIcon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--wcfStatusWarningForeground, var(--wcfContentText, inherit));
}

.wbbShopBankTransferNoticeBody {
    min-width: 0;
}

.wbbShopBankTransferNoticeTitle {
    margin: 0 0 4px;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.35;
}

.wbbShopBankTransferNoticeIntro,
.wbbShopBankTransferNoticeNext,
.wbbShopBankTransferNoticeLegal {
    max-width: 72ch;
}

.wbbShopBankTransferNoticeIntro {
    margin: 0;
}

.wbbShopBankTransferDetails {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 20px;
    margin: 14px 0;
}

.wbbShopBankTransferDetails > div {
    min-width: 0;
}

.wbbShopBankTransferDetails dt {
    margin-bottom: 2px;
    color: var(--wcfContentDimmedText, #999);
    font-size: 0.8rem;
    font-weight: 600;
}

.wbbShopBankTransferDetails dd {
    margin: 0;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.wbbShopBankTransferDetails code {
    font-size: 0.94em;
    user-select: all;
}

.wbbShopBankTransferNoticeNext {
    margin: 0;
    font-weight: 600;
}

.wbbShopBankTransferNoticeLegal {
    margin: 10px 0 0;
    color: var(--wcfContentDimmedText, #999);
    font-size: 0.84rem;
}

/* Global reminder for signed-in customers with unpaid bank orders */
.wbbShopOpenBankOrderBanner {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    margin-bottom: 20px;
    padding: 14px 16px;
    border: 1px solid var(--wcfContentBorder, rgba(255, 255, 255, 0.16));
    border-radius: var(--wcfBorderRadius, 4px);
    background: var(--wcfSidebarBackground, rgba(255, 255, 255, 0.04));
    color: var(--wcfContentText, inherit);
}

.wbbShopOpenBankOrderBannerIcon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--wcfStatusWarningForeground, var(--wcfContentText, inherit));
}

.wbbShopOpenBankOrderBannerBody {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 2px;
}

.wbbShopOpenBankOrderBannerTitle {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
}

.wbbShopOpenBankOrderBannerText {
    max-width: 72ch;
    color: var(--wcfContentDimmedText, #999);
    font-size: 0.9rem;
    line-height: 1.45;
}

.wbbShopOpenBankOrderBannerAction {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .wbbShopCustomerShell {
        padding: 18px;
    }

    .wbbShopCustomerDashboard {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }
}

@media (max-width: 600px) {
    .wbbShopCustomerShell {
        padding: 14px;
    }

    .wbbShopCustomerListItem {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 10px;
    }

    .wbbShopCustomerItemIcon {
        width: 32px;
        height: 32px;
    }

    .wbbShopCustomerItemAction {
        grid-column: 2;
        justify-self: start;
    }

    .wbbShopCustomerItemAction .button {
        min-height: 40px;
    }

    .wbbShopBankTransferNotice {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 10px;
        padding: 14px;
    }

    .wbbShopBankTransferNoticeIcon {
        width: 32px;
        height: 32px;
    }

    .wbbShopBankTransferDetails {
        grid-template-columns: minmax(0, 1fr);
    }

    .wbbShopOpenBankOrderBanner {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 10px;
        padding: 14px;
    }

    .wbbShopOpenBankOrderBannerIcon {
        width: 32px;
        height: 32px;
    }

    .wbbShopOpenBankOrderBannerAction {
        grid-column: 2;
        justify-self: start;
        white-space: normal;
    }
}

.wbbShopExtensionList { list-style: none; padding: 0; }
.wbbShopExtensionList > li { padding: 20px 0; border-bottom: 1px solid var(--wcfContentBorderInner); }
.wbbShopExtensionList > li p { margin: 10px 0; }
