/* Victor Mobile Navigation — isolated iOS-style bottom capsule. */
.victor-shell-mobile-navigation {
	display: none;
}

@media ( max-width: 768px ) {
	body.victor-shell-mobile-navigation-active {
		--victor-shell-z-mobile-nav: 120;
		--victor-mobile-nav-height: 66px;
		--victor-mobile-nav-offset: 12px;
		--victor-mobile-nav-safe-area: env( safe-area-inset-bottom, 0px );
		padding-bottom: calc( var( --victor-mobile-nav-height ) + var( --victor-mobile-nav-offset ) + var( --victor-mobile-nav-safe-area ) + 14px );
	}

	.victor-shell-mobile-navigation {
		position: fixed;
		z-index: var( --victor-shell-z-mobile-nav, 120 );
		right: 0;
		bottom: calc( var( --victor-mobile-nav-offset, 12px ) + var( --victor-mobile-nav-safe-area, env( safe-area-inset-bottom, 0px ) ) );
		left: 0;
		display: block;
		box-sizing: border-box;
		width: 100%;
		padding-inline: 12px;
		pointer-events: none;
		direction: ltr;
		font-family: var( --victor-font-family, Peyda, Arial, sans-serif );
		transition: opacity .16s ease, transform .16s ease;
	}

	.victor-shell-mobile-navigation *,
	.victor-shell-mobile-navigation *::before,
	.victor-shell-mobile-navigation *::after {
		box-sizing: border-box;
	}

	.victor-shell-mobile-navigation__list {
		position: relative;
		display: grid;
		grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
		align-items: stretch;
		isolation: isolate;
		overflow: hidden;
		width: min( 100%, 420px );
		min-height: var( --victor-mobile-nav-height, 66px );
		margin: 0 auto;
		padding: 5px;
		border: 1px solid rgba( 255, 255, 255, .72 );
		border-radius: 999px;
		background: rgba( 255, 255, 255, .64 );
		box-shadow: 0 8px 24px rgba( 20, 27, 42, .08 ), 0 2px 8px rgba( 20, 27, 42, .04 ), inset 0 1px 0 rgba( 255, 255, 255, .86 );
		-webkit-backdrop-filter: blur( 28px ) saturate( 180% );
		backdrop-filter: blur( 28px ) saturate( 180% );
		list-style: none;
		pointer-events: auto;
		direction: ltr;
		animation: victor-mobile-nav-enter .28s cubic-bezier( .2, .8, .2, 1 ) both;
	}

	.victor-shell-mobile-navigation__indicator {
		position: absolute;
		z-index: 0;
		top: 5px;
		bottom: 5px;
		left: 0;
		display: block;
		width: 0;
		margin: 0;
		padding: 0;
		border: 1px solid rgba( 255, 255, 255, .68 );
		border-radius: 999px;
		background: rgba( 224, 226, 231, .62 );
		box-shadow: inset 0 1px 0 rgba( 255, 255, 255, .76 ), 0 2px 8px rgba( 30, 36, 48, .035 );
		opacity: 0;
		overflow: hidden;
		pointer-events: none;
		transform-origin: center;
		transform: translate3d( 0, 0, 0 );
		transition: transform .36s cubic-bezier( .2, .8, .2, 1 ), width .36s cubic-bezier( .2, .8, .2, 1 ), opacity .16s ease;
		will-change: transform, width;
	}

	.victor-shell-mobile-navigation__indicator::after {
		position: absolute;
		inset: 0;
		background: linear-gradient( 110deg, rgba( 255, 255, 255, .14 ) 0%, rgba( 255, 255, 255, .62 ) var( --victor-liquid-highlight-shift, 50% ), rgba( 195, 207, 228, .12 ) 100% );
		content: '';
		opacity: .62;
		transition: background-position .12s linear;
	}

	.victor-shell-mobile-navigation__list.has-active-indicator .victor-shell-mobile-navigation__indicator {
		opacity: 1;
	}

	.victor-shell-mobile-navigation__list.is-positioning-indicator .victor-shell-mobile-navigation__indicator {
		transition: none;
	}

	.victor-shell-mobile-navigation__list.is-dragging .victor-shell-mobile-navigation__indicator {
		box-shadow: inset 0 1px 0 rgba( 255, 255, 255, .9 ), 0 3px 12px rgba( 30, 36, 48, .055 ), -1px 0 0 rgba( 184, 202, 226, .13 ), 1px 0 0 rgba( 255, 220, 225, .12 );
		transition: none;
	}

	.victor-shell-mobile-navigation__entry {
		position: relative;
		z-index: 1;
		min-width: 0;
		margin: 0;
		padding: 0;
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item {
		position: relative;
		display: flex;
		width: 100%;
		min-width: 0;
		min-height: 54px;
		margin: 0;
		padding: 5px 3px 4px;
		border: 0;
		border-radius: 999px;
		background: transparent;
		box-shadow: none;
		color: var( --victor-text-muted, #737983 );
		font: inherit;
		font-size: 11.5px;
		font-weight: 500;
		line-height: 1.15;
		text-align: center;
		text-decoration: none;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		cursor: pointer;
		appearance: none;
		-webkit-appearance: none;
		-webkit-tap-highlight-color: transparent;
		touch-action: pan-y;
		user-select: none;
		-webkit-user-select: none;
		transition: color .2s ease, transform .14s cubic-bezier( .2, .8, .2, 1 );
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item:hover {
		border: 0;
		background: transparent;
		box-shadow: none;
		color: var( --victor-ink, #282b31 );
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item:active {
		border: 0;
		background: transparent;
		box-shadow: none;
		transform: scale( .97 );
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item:focus {
		background: transparent;
		box-shadow: none;
		color: var( --victor-text-muted, #737983 );
		-webkit-text-fill-color: currentColor;
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item:focus-visible {
		outline: 2px solid var( --victor-action, #155eef );
		outline-offset: -3px;
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item.is-active,
	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item.is-preview-active {
		border: 0;
		background: transparent;
		box-shadow: none;
		color: var( --victor-ink, #17191d );
		font-weight: 600;
	}

	.victor-shell-mobile-navigation__item.is-disabled {
		color: var( --victor-text-subtle, #9a9ea6 );
		cursor: default;
	}

	.victor-shell-mobile-navigation__item svg {
		width: 21px;
		height: 21px;
		fill: none;
		stroke: currentColor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 1.65;
		transition: transform .2s cubic-bezier( .2, .8, .2, 1 ), stroke-width .2s ease;
	}

	.victor-shell-mobile-navigation__item:hover svg {
		transform: translateY( -1px );
	}

	.victor-shell-mobile-navigation__item:active svg {
		transform: scale( .92 );
	}

	.victor-shell-mobile-navigation__item.is-active svg,
	.victor-shell-mobile-navigation__item.is-preview-active svg {
		stroke-width: 1.85;
		transform: translateY( -1px );
	}

	.victor-shell-mobile-navigation__menu-icon {
		position: relative;
		display: grid;
		place-items: center;
		width: 21px;
		height: 21px;
	}

	.victor-shell-mobile-navigation__menu-icon svg {
		position: absolute;
		inset: 0;
		transition: opacity .18s ease, transform .22s cubic-bezier( .2, .8, .2, 1 ), stroke-width .2s ease;
	}

	.victor-shell-mobile-navigation__menu-close-icon {
		opacity: 0;
		transform: rotate( -24deg ) scale( .72 );
	}

	.victor-shell-mobile-navigation__menu.is-menu-open .victor-shell-mobile-navigation__menu-open-icon {
		opacity: 0;
		transform: rotate( 24deg ) scale( .72 );
	}

	.victor-shell-mobile-navigation__menu.is-menu-open .victor-shell-mobile-navigation__menu-close-icon {
		opacity: 1;
		transform: rotate( 0 ) scale( 1 );
	}

	.victor-shell-mobile-navigation__icon-wrap {
		position: relative;
		display: inline-grid;
		place-items: center;
	}

	.victor-shell-mobile-navigation__cart-count {
		position: absolute;
		top: -7px;
		right: -11px;
		display: grid;
		place-items: center;
		min-width: 16px;
		height: 16px;
		padding-inline: 4px;
		border: 2px solid rgba( 255, 255, 255, .95 );
		border-radius: 999px;
		background: var( --victor-action, #155eef );
		color: #fff;
		font-size: 8.5px;
		font-weight: 800;
		font-variant-numeric: tabular-nums;
		line-height: 1;
		animation: victor-mobile-nav-badge-in .2s ease-out both;
	}

	.victor-shell-mobile-navigation__cart-count.is-empty {
		display: none;
	}

	body.vpe-size-finder-open .victor-shell-mobile-navigation,
	body.vpe-variant-sheet-open .victor-shell-mobile-navigation,
	body.vpe-cart-sheet-open .victor-shell-mobile-navigation {
		opacity: 0;
		pointer-events: none;
		transform: translateY( 12px );
		visibility: hidden;
	}
}

@media ( max-width: 760px ) {
	body.victor-shell-mobile-navigation-active.victor-product-experience-page {
		padding-bottom: calc( var( --victor-mobile-nav-height ) + var( --victor-mobile-nav-offset ) + var( --victor-mobile-nav-safe-area ) + 100px );
	}

	body.victor-shell-mobile-navigation-active.victor-product-experience-page .vpe-mobile-buybar {
		bottom: calc( var( --victor-mobile-nav-height ) + var( --victor-mobile-nav-offset ) + var( --victor-mobile-nav-safe-area ) + 8px );
	}
}

@keyframes victor-mobile-nav-enter {
	from {
		opacity: 0;
		transform: translateY( 6px ) scale( .99 );
	}

	to {
		opacity: 1;
		transform: translateY( 0 ) scale( 1 );
	}
}

@keyframes victor-mobile-nav-badge-in {
	from {
		opacity: 0;
		transform: scale( .82 );
	}

	to {
		opacity: 1;
		transform: scale( 1 );
	}
}

@media ( max-width: 390px ) {
	body.victor-shell-mobile-navigation-active {
		--victor-mobile-nav-height: 64px;
		--victor-mobile-nav-offset: 10px;
	}

	.victor-shell-mobile-navigation {
		padding-inline: 10px;
	}

	.victor-shell-mobile-navigation__list {
		padding: 4px;
	}

	.victor-shell-mobile-navigation__indicator {
		top: 4px;
		bottom: 4px;
	}

	.victor-shell-mobile-navigation .victor-shell-mobile-navigation__item {
		min-height: 54px;
		font-size: 11px;
	}

	.victor-shell-mobile-navigation__item svg {
		width: 20px;
		height: 20px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.victor-shell-mobile-navigation__list,
	.victor-shell-mobile-navigation__cart-count {
		animation: none;
	}

	.victor-shell-mobile-navigation,
	.victor-shell-mobile-navigation__indicator,
	.victor-shell-mobile-navigation__item,
	.victor-shell-mobile-navigation__item svg,
	.victor-shell-mobile-navigation__menu-icon svg {
		transition: none;
	}
}
