.wbp-bottom-nav {
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--wbp-white);
	border-top: 1px solid var(--wbp-border);
	padding: 0.35rem 0 calc(0.35rem + env(safe-area-inset-bottom));
	z-index: 100;
	box-shadow: 0 -4px 16px rgba(27, 48, 34, 0.06);
}

.wbp-bottom-nav__list {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	list-style: none;
	margin: 0;
	padding: 0;
}

.wbp-bottom-nav__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.2rem;
	padding: 0.5rem 0.25rem;
	font-size: 0.65rem;
	font-weight: 600;
	color: var(--wbp-text-muted);
	text-align: center;
	min-height: 56px;
	justify-content: center;
}

.wbp-bottom-nav__link svg {
	width: 22px;
	height: 22px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
}

.wbp-bottom-nav__link.is-active,
.wbp-bottom-nav__link:hover {
	color: var(--wbp-green-primary);
}

@media (max-width: 900px) {
	.wbp-bottom-nav {
		display: block;
	}

	body {
		padding-bottom: calc(72px + env(safe-area-inset-bottom));
	}
}