/**
 * Zarinacc — نوار پایین موبایل (curved + center home)
 */

.zarinacc-mobile-bottom-nav {
	display: none;
}

@media (max-width: 900px) {

	body:not(.single-product) {
		padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
	}

	body.zarinacc-body--shop {
		padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
	}

	body.single-product {
		padding-bottom: 0;
	}

	.zarinacc-mobile-bottom-nav {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 995;
		height: calc(72px + env(safe-area-inset-bottom, 0px));
		pointer-events: none;
	}

	.zarinacc-mobile-bottom-nav__center--filter .zarinacc-mobile-bottom-nav__center-circle {
		background: linear-gradient(145deg, #007cba 0%, #005a87 100%);
		box-shadow: 0 6px 18px rgba(0, 124, 186, 0.35);
	}

	.zarinacc-mobile-bottom-nav__center--filter .zarinacc-mobile-bottom-nav__center-label {
		color: #007cba;
		font-weight: 800;
	}

	.zarinacc-mobile-bottom-nav__center--shop .zarinacc-mobile-bottom-nav__center-circle {
		background: linear-gradient(145deg, var(--zarinacc-mc, #540980) 0%, #7c3aed 100%);
		color: #fff;
		border-color: transparent;
		box-shadow: 0 6px 18px rgba(84, 9, 128, 0.35);
	}

	.zarinacc-mobile-bottom-nav__center--shop .zarinacc-mobile-bottom-nav__center-label {
		color: var(--zarinacc-mc, #540980);
		font-weight: 800;
	}

	.zarinacc-mobile-bottom-nav__shell {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: calc(64px + env(safe-area-inset-bottom, 0px));
		pointer-events: auto;
		color: rgba(255, 255, 255, 0.98);
		filter: drop-shadow(0 -10px 28px rgba(84, 9, 128, 0.12));
	}

	.zarinacc-mobile-bottom-nav__curve {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: calc(64px + env(safe-area-inset-bottom, 0px));
		display: block;
	}

	.zarinacc-mobile-bottom-nav__row {
		position: relative;
		z-index: 1;
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		/* border-box (global): the safe-area padding must be added to the height, or on iPhones with a home bar
		   the 52px content box shrinks to ~18px and the icons are pushed up out of the bar. */
		height: calc(58px + env(safe-area-inset-bottom, 0px));
		padding: 0 6px calc(6px + env(safe-area-inset-bottom, 0px));
	}

	.zarinacc-mobile-bottom-nav__group {
		flex: 1;
		display: flex;
		align-items: flex-end;
		justify-content: space-around;
		gap: 2px;
		min-width: 0;
	}

	.zarinacc-mobile-bottom-nav__group--start {
		padding-left: 4px;
		padding-right: 8px;
	}

	.zarinacc-mobile-bottom-nav__group--end {
		padding-right: 4px;
		padding-left: 8px;
	}

	.zarinacc-mobile-bottom-nav__notch {
		flex: 0 0 92px;
		width: 92px;
		height: 1px;
	}

	.zarinacc-mobile-bottom-nav__item {
		flex: 1;
		display: inline-flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 1px;
		min-width: 0;
		max-width: 72px;
		padding: 6px 2px 4px;
		border: none;
		background: none;
		color: #64748b;
		font-family: inherit;
		font-size: 0.78rem;
		font-weight: 700;
		text-decoration: none;
		cursor: pointer;
		transition: color 0.2s ease, transform 0.15s ease;
	}

	.zarinacc-mobile-bottom-nav__item i {
		font-size: 1.18rem;
		line-height: 1;
		transition: color 0.2s ease, transform 0.2s ease;
	}

	.zarinacc-mobile-bottom-nav__item:active {
		transform: scale(0.94);
	}

	.zarinacc-mobile-bottom-nav__item.is-active,
	.zarinacc-mobile-bottom-nav__item:hover {
		color: var(--zarinacc-mc);
	}

	.zarinacc-mobile-bottom-nav__item.is-active i,
	.zarinacc-mobile-bottom-nav__item:hover i {
		transform: translateY(-1px);
	}

	.zarinacc-mobile-bottom-nav__icon-wrap {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.zarinacc-mobile-bottom-nav__badge {
		position: absolute;
		top: -5px;
		left: -8px;
		min-width: 16px;
		height: 16px;
		padding: 0 4px;
		border-radius: 999px;
		background: #ef4444;
		color: #fff;
		font-size: 10px;
		font-weight: 700;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: 2px solid #fff;
		line-height: 1;
	}

	.zarinacc-mobile-bottom-nav__badge[hidden] {
		display: none !important;
	}

	/* Center home FAB */
	.zarinacc-mobile-bottom-nav__center,
	.zarinacc-mobile-bottom-nav__home {
		position: absolute;
		left: 50%;
		bottom: calc(13px + env(safe-area-inset-bottom, 0px));
		transform: translateX(-50%);
		z-index: 3;
		display: inline-flex;
		flex-direction: column;
		align-items: center;
		gap: 5px;
		text-decoration: none;
		color: #64748b;
		pointer-events: auto;
		transition: transform 0.2s ease;
		border: none;
		background: none;
		padding: 0;
		font-family: inherit;
		cursor: pointer;
	}

	.zarinacc-mobile-bottom-nav__center:active,
	.zarinacc-mobile-bottom-nav__home:active {
		transform: translateX(-50%) scale(0.96);
	}

	.zarinacc-mobile-bottom-nav__center-ring,
	.zarinacc-mobile-bottom-nav__home-ring {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 66px;
		height: 66px;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.98);
		box-shadow:
			0 0 0 4px rgba(255, 255, 255, 0.95),
			0 8px 24px rgba(84, 9, 128, 0.22);
	}

	.zarinacc-mobile-bottom-nav__center-circle,
	.zarinacc-mobile-bottom-nav__home-circle {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 56px;
		height: 56px;
		border-radius: 50%;
		background: linear-gradient(145deg, #f8fafc 0%, #eef2ff 100%);
		color: #64748b;
		font-size: 1.35rem;
		border: 2px solid rgba(84, 9, 128, 0.12);
		transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
	}

	.zarinacc-mobile-bottom-nav__center-label,
	.zarinacc-mobile-bottom-nav__home-label {
		font-size: 1rem;
		font-weight: 800;
		color: #64748b;
		transition: color 0.2s ease;
		margin-top: 1px;
	}

	.zarinacc-mobile-bottom-nav__center.is-active .zarinacc-mobile-bottom-nav__center-circle,
	.zarinacc-mobile-bottom-nav__home.is-active .zarinacc-mobile-bottom-nav__home-circle,
	.zarinacc-mobile-bottom-nav__home:hover .zarinacc-mobile-bottom-nav__home-circle {
		background: linear-gradient(145deg, var(--zarinacc-mc) 0%, #7c3aed 100%);
		color: #fff;
		border-color: transparent;
		box-shadow: 0 6px 18px rgba(84, 9, 128, 0.35);
	}

	.zarinacc-mobile-bottom-nav__center.is-active .zarinacc-mobile-bottom-nav__center-label,
	.zarinacc-mobile-bottom-nav__home.is-active .zarinacc-mobile-bottom-nav__home-label,
	.zarinacc-mobile-bottom-nav__home:hover .zarinacc-mobile-bottom-nav__home-label {
		color: var(--zarinacc-mc);
	}
}