/*
 * Mobile quick navigation.
 *
 * The bar is hidden by default so that a missing or partially loaded mobile
 * layout can never expose its SVGs on desktop. Every icon also has hard size
 * limits to isolate it from broad SVG rules in the theme/page builder.
 */
.shopper-bottom-bar {
	display: none !important;
}

.shopper-bottom-bar,
.shopper-bottom-bar * {
	box-sizing: border-box;
}

.shopper-bottom-bar svg {
	display: block !important;
	width: 24px !important;
	height: 24px !important;
	min-width: 24px !important;
	min-height: 24px !important;
	max-width: 24px !important;
	max-height: 24px !important;
	margin: 0 !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 1.8 !important;
	stroke-linecap: round;
	stroke-linejoin: round;
}

@media (max-width: 767px) {
	/* Account remains available in the bottom bar: avoid a duplicate icon. */
	#site-header a[aria-label="Il mio account"] {
		display: none !important;
	}

	/* OceanWP duplicates the mobile search form when it builds the SIDR menu. */
	.mobile-searchform,
	.mobile-menu .search-toggle-li,
	#sidr .sidr-class-mobile-searchform,
	#sidr .sidr-class-search-toggle-li {
		display: none !important;
	}

	body.shopper-has-bottom-bar {
		padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
	}

	.shopper-bottom-bar {
		position: fixed !important;
		z-index: 999998 !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		align-items: stretch !important;
		width: 100% !important;
		max-width: none !important;
		min-height: 70px !important;
		margin: 0 !important;
		padding: 6px 8px max(6px, env(safe-area-inset-bottom, 0px)) !important;
		background: #fff !important;
		border-top: 1px solid #e5e7eb !important;
		box-shadow: 0 -4px 18px rgba(15, 23, 42, 0.12) !important;
	}

	.shopper-bottom-bar__item {
		position: relative !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 3px !important;
		min-width: 0 !important;
		min-height: 56px !important;
		margin: 0 !important;
		padding: 3px 4px !important;
		color: #171717 !important;
		font: 600 12px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
		text-align: center !important;
		text-decoration: none !important;
		background: transparent !important;
		border: 0 !important;
	}

	.shopper-bottom-bar__item:focus-visible {
		outline: 2px solid #f97316 !important;
		outline-offset: -2px !important;
	}

	.shopper-bottom-bar__label {
		display: block !important;
		max-width: 100% !important;
		overflow: hidden !important;
		color: inherit !important;
		font: inherit !important;
		white-space: nowrap !important;
		text-overflow: ellipsis !important;
	}

	.shopper-bottom-bar__badge {
		position: absolute !important;
		top: 1px !important;
		left: calc(50% + 8px) !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: auto !important;
		height: 18px !important;
		min-width: 18px !important;
		max-width: 42px !important;
		min-height: 18px !important;
		max-height: 18px !important;
		margin: 0 !important;
		padding: 0 5px !important;
		overflow: hidden !important;
		color: #fff !important;
		font: 700 10px/18px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
		background: #f97316 !important;
		border: 0 !important;
		border-radius: 999px !important;
		box-shadow: none !important;
	}

	.shopper-bottom-bar__badge[data-count="0"] {
		display: none !important;
	}
}
