.kev-delban-mobile-bottom-nav,
.kev-delban-mobile-bottom-nav__spacer {
	display: none;
}

@media (max-width: 781px) {
	.kev-delban-mobile-bottom-nav__spacer {
		display: block;
		height: calc(4.75rem + env(safe-area-inset-bottom));
	}

	body:has(.kev-delban-site-footer) .kev-delban-mobile-bottom-nav__spacer {
		display: none;
	}

	.kev-delban-mobile-bottom-nav {
		--kev-mobile-bottom-nav-accent: var(--wp--preset--color--crema, #d8b98a);
		--kev-mobile-bottom-nav-background: #090a0b;
		--kev-mobile-bottom-nav-border: rgb(255 253 249 / 12%);
		--kev-mobile-bottom-nav-muted: rgb(255 253 249 / 62%);
		--kev-mobile-bottom-nav-text: var(--wp--preset--color--porcelain, #fffdf9);
		position: fixed;
		z-index: 110;
		inset-inline: 0;
		bottom: 0;
		display: block;
		width: auto;
		max-width: 100%;
		padding: 0.375rem max(0.5rem, env(safe-area-inset-right)) max(0.375rem, env(safe-area-inset-bottom)) max(0.5rem, env(safe-area-inset-left));
		border-top: 1px solid var(--kev-mobile-bottom-nav-border);
		background: rgb(9 10 11 / 96%);
		box-shadow: 0 -0.5rem 1.5rem rgb(0 0 0 / 28%);
		color: var(--kev-mobile-bottom-nav-text);
		backdrop-filter: blur(14px);
		contain: layout paint;
	}

	.kev-delban-mobile-bottom-nav__inner {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		width: min(100%, 32rem);
		min-height: 4rem;
		margin-inline: auto;
	}

	.kev-delban-mobile-bottom-nav__item {
		display: flex;
		min-width: 0;
		min-height: 3rem;
		padding: 0.375rem 0.25rem 0.25rem;
		align-items: center;
		border-radius: 0.75rem;
		color: var(--kev-mobile-bottom-nav-muted);
		flex-direction: column;
		font-size: 0.6875rem;
		font-weight: 600;
		gap: 0.1875rem;
		line-height: 1.15;
		text-decoration: none;
		transition: background-color 160ms ease, color 160ms ease;
	}

	.kev-delban-mobile-bottom-nav__item.is-active {
		background: rgb(216 185 138 / 12%);
		color: var(--kev-mobile-bottom-nav-accent);
	}

	.kev-delban-mobile-bottom-nav__item:focus-visible {
		outline: 2px solid var(--kev-mobile-bottom-nav-accent);
		outline-offset: -2px;
	}

	.kev-delban-mobile-bottom-nav__icon-wrap {
		position: relative;
		display: grid;
		width: 1.75rem;
		height: 1.75rem;
		place-items: center;
	}

	.kev-delban-mobile-bottom-nav__icon {
		width: 1.375rem;
		height: 1.375rem;
		fill: none;
		stroke: currentcolor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 1.7;
	}

	.kev-delban-mobile-bottom-nav__cart-count {
		position: absolute;
		top: -0.25rem;
		right: -0.375rem;
		display: grid;
		min-width: 1.125rem;
		height: 1.125rem;
		padding-inline: 0.25rem;
		border: 2px solid var(--kev-mobile-bottom-nav-background);
		border-radius: 999px;
		background: var(--wp--preset--color--roast, #a8643a);
		place-items: center;
		color: var(--wp--preset--color--porcelain, #fffdf9);
		font-size: 0.625rem;
		font-weight: 700;
		line-height: 1;
	}

	.kev-delban-mobile-bottom-nav__label {
		overflow: hidden;
		max-width: 100%;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

@media (max-width: 781px) and (prefers-reduced-motion: reduce) {
	.kev-delban-mobile-bottom-nav__item {
		transition: none;
	}
}

@media (max-width: 781px) {
	.kev-delban-mobile-bottom-nav {
		--kev-mobile-bottom-nav-accent: #ff3a89;
		--kev-mobile-bottom-nav-background: #fffafc;
		--kev-mobile-bottom-nav-border: #efd8e2;
		--kev-mobile-bottom-nav-muted: #75676e;
		--kev-mobile-bottom-nav-text: #351126;
		background: rgb(255 250 252 / 96%);
		box-shadow: 0 -0.5rem 1.5rem rgb(91 25 61 / 12%);
	}
	.kev-delban-mobile-bottom-nav__item.is-active { background: #fff0f6; }
	.kev-delban-mobile-bottom-nav__cart-count { background: #ff3a89; color: #fff; }
}