/**
 * DELTITECH mobile tab bar (v1.0.238) — see inc/dt-tabbar.php.
 *
 * Glozin's mobile navigation bar as a floating liquid-glass pill: a dark
 * glass lens behind the current item, stroke icons that each animate in
 * their own way when pressed (dt-tabbar.js adds .is-pop), green counters.
 *
 * `html body.dt-tb #glozin-mobile-navigation-bar` outweighs Glozin's
 * utility classes and custom-animations-v6.css; `!important` only where
 * those use it.
 */

html body.dt-tb #glozin-mobile-navigation-bar {
	--ink: #0a0a0a;
	--ink-2: #2b2b2b;
	--muted: #6b6b70;
	--green: #4cd964;
	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--spring: cubic-bezier(0.34, 1.56, 0.64, 1);
	--tb-h: 64px;
	--tb-pad: 5px;
	--tb-gap: 10px;
	position: fixed !important;
	top: auto !important;
	right: 12px !important;
	bottom: calc(var(--tb-gap) + env(safe-area-inset-bottom, 0px)) !important;
	left: 12px !important;
	z-index: 1000 !important;
	height: var(--tb-h);
	margin: 0 !important;
	padding: var(--tb-pad) !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.62) 55%, rgba(255, 255, 255, 0.56) 100%) !important;
	-webkit-backdrop-filter: blur(22px) saturate(190%) brightness(1.04) !important;
	backdrop-filter: blur(22px) saturate(190%) brightness(1.04) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 -1px 0 rgba(255, 255, 255, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.4), inset 0 -12px 24px -18px rgba(10, 10, 10, 0.12), 0 1px 2px rgba(10, 10, 10, 0.05), 0 18px 40px -14px rgba(10, 10, 10, 0.32) !important;
	font-family: "Inter", -apple-system, "SF Pro Text", system-ui, sans-serif;
	-webkit-font-smoothing: antialiased;
	isolation: isolate;
	overflow: visible !important;
	-webkit-tap-highlight-color: transparent;
	-webkit-user-select: none;
	user-select: none;
	animation: dt-tb-in 0.9s var(--spring) 0.15s both;
}

/* Refracted rim (the About page's glass). */
html body.dt-tb #glozin-mobile-navigation-bar::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	padding: 1.2px;
	border-radius: inherit;
	background: linear-gradient(160deg, #fff, rgba(255, 255, 255, 0.15) 32%, rgba(255, 255, 255, 0.04) 60%, rgba(255, 255, 255, 0.75) 100%);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	pointer-events: none;
}

/* Elementor's wrappers: transparent, full height, one row. */
html body.dt-tb #glozin-mobile-navigation-bar :is(.elementor, .e-con, .e-con-inner, .elementor-widget, .elementor-widget-container, .elementor-section, .elementor-container, .elementor-column, .elementor-widget-wrap) {
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	--padding-top: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--padding-right: 0px;
}

html body.dt-tb #glozin-mobile-navigation-bar :is(.e-con-inner, .elementor-container, .elementor-widget-wrap) {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: none !important;
}

html body.dt-tb #glozin-mobile-navigation-bar > .elementor > .e-con {
	display: flex !important;
	width: 100% !important;
}

html body.dt-tb #glozin-mobile-navigation-bar .elementor-widget {
	position: static !important;
	flex: 1 1 0 !important;
	width: auto !important;
	min-width: 0;
}

html body.dt-tb #glozin-mobile-navigation-bar .glozin-navigation-bar-elementor {
	height: 100%;
	justify-content: center !important;
}

/* Item. */
html body.dt-tb #glozin-mobile-navigation-bar a.glozin-navigation-bar-item {
	position: relative;
	z-index: 1;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 100%;
	height: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 999px;
	color: var(--ink-2) !important;
	text-decoration: none !important;
	outline-offset: -3px;
	touch-action: manipulation;
	transition: color 0.35s var(--ease), transform 0.45s var(--spring);
}

html body.dt-tb #glozin-mobile-navigation-bar a.glozin-navigation-bar-item.is-pressing {
	transform: scale(0.88);
	transition-duration: 0.12s;
}

html body.dt-tb #glozin-mobile-navigation-bar .glozin-navigation-bar__icon {
	position: relative;
	display: grid !important;
	place-items: center;
	width: 24px;
	height: 24px;
	margin: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
}

html body.dt-tb #glozin-mobile-navigation-bar .glozin-navigation-bar__icon .glozin-svg-icon {
	display: block;
	width: 24px;
	height: 24px;
	color: inherit;
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i {
	display: block;
	width: 24px;
	height: 24px;
	overflow: visible;
	transform-box: view-box;
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i,
html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i * {
	fill: none !important;
	stroke: currentColor;
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i :is(path, circle, g) {
	transform-box: fill-box;
}

/* Icons injected late (Elementor cache) fade in rather than pop. */
html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i.is-late {
	animation: dt-tb-fade 0.4s var(--ease) both;
}

html body.dt-tb #glozin-mobile-navigation-bar .glozin-navigation-bar__title {
	margin: 0 !important;
	font: 600 10.5px/1 "Inter", -apple-system, system-ui, sans-serif !important;
	letter-spacing: 0.005em;
	color: var(--muted) !important;
	white-space: nowrap;
	transition: color 0.35s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar a.glozin-navigation-bar-item.is-active {
	color: #fff !important;
}

html body.dt-tb #glozin-mobile-navigation-bar a.glozin-navigation-bar-item.is-active .glozin-navigation-bar__title {
	color: rgba(255, 255, 255, 0.92) !important;
}

/* Lens: dark glass behind the current item (dt-tabbar.js sets --x / --w). */
html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-lens {
	position: absolute;
	top: var(--tb-pad);
	bottom: var(--tb-pad);
	left: 0;
	z-index: 0;
	width: var(--w, 0px);
	border-radius: 999px;
	background: linear-gradient(150deg, #34343a 0%, #121214 55%, #050505 100%) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26), inset 0 0 0 1px rgba(255, 255, 255, 0.06), inset 0 12px 20px -14px rgba(255, 255, 255, 0.4), 0 10px 22px -10px rgba(10, 10, 10, 0.55);
	opacity: 0;
	transform: translateX(var(--x, 0px));
	pointer-events: none;
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-lens.is-on {
	opacity: 1;
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-lens::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 60%) !important;
}

/* Counters. */
html body.dt-tb #glozin-mobile-navigation-bar .header-counter {
	position: absolute !important;
	top: -6px !important;
	right: -11px !important;
	left: auto !important;
	display: inline-grid !important;
	place-items: center;
	min-width: 18px !important;
	height: 18px !important;
	margin: 0 !important;
	padding: 0 5px !important;
	border-radius: 999px !important;
	background: var(--green) !important;
	box-shadow: 0 0 0 2px #fff, 0 4px 10px -4px rgba(26, 128, 48, 0.6) !important;
	font: 700 10.5px/1 "Inter", -apple-system, system-ui, sans-serif !important;
	color: #fff !important;
	font-variant-numeric: tabular-nums;
	transform-origin: 50% 60%;
	transition: transform 0.4s var(--spring), opacity 0.3s;
}

html body.dt-tb #glozin-mobile-navigation-bar .header-counter.empty-counter,
html body.dt-tb #glozin-mobile-navigation-bar .header-counter.is-zero {
	opacity: 0 !important;
	transform: scale(0.3);
}

html body.dt-tb #glozin-mobile-navigation-bar .header-counter.is-bump {
	animation: dt-tb-bump 0.6s var(--spring);
}

/* -------------------------------------------------------------------------
 * Press animations (one per icon)
 * ---------------------------------------------------------------------- */

/* Home: hops, lands with a squash; the roof settles, the door swings open. */
html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i--home {
	transform-origin: 50% 100%;
	animation: dt-tb-hop 0.75s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__roof {
	transform-origin: 50% 100%;
	animation: dt-tb-roof 0.75s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__door {
	transform-origin: 50% 100%;
	animation: dt-tb-door 0.75s var(--ease);
}

/* Account: the head pops and nods, the shoulders breathe. */
html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__head {
	transform-origin: 50% 100%;
	animation: dt-tb-nod 0.8s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__body {
	transform-origin: 50% 100%;
	animation: dt-tb-shoulders 0.8s var(--ease);
}

/* Shop: the sneaker kicks forward and stomps back, speed lines trail. */
html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i__speed {
	opacity: 0;
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__shoe {
	transform-origin: 20% 100%;
	animation: dt-tb-kick 0.8s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__speed {
	animation: dt-tb-speed 0.8s var(--ease);
}

/* Wishlist: a heartbeat with a burst. */
html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i__heart {
	transform-origin: 50% 55%;
	transition: fill 0.3s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .dt-tb-i__burst {
	opacity: 0;
	transform-origin: 50% 100%;
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__heart {
	animation: dt-tb-beat 0.9s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__burst {
	animation: dt-tb-burst 0.7s var(--ease) 0.1s;
}

html body.dt-tb #glozin-mobile-navigation-bar .is-active .dt-tb-i .dt-tb-i__heart,
html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i .dt-tb-i__heart {
	fill: currentColor !important;
}

html body.dt-tb #glozin-mobile-navigation-bar a:not(.is-active).is-pop .dt-tb-i .dt-tb-i__heart {
	fill: #ff3b5c !important;
	stroke: #ff3b5c;
}

/* Bag: swings on its handle, the handle lifts. */
html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i--cart {
	transform-origin: 50% 8%;
	animation: dt-tb-swing 0.9s var(--ease);
}

html body.dt-tb #glozin-mobile-navigation-bar .is-pop .dt-tb-i__handle {
	transform-origin: 50% 100%;
	animation: dt-tb-handle 0.9s var(--ease);
}

/* Something landed in the bag (added_to_cart). */
html body.dt-tb #glozin-mobile-navigation-bar .is-added .dt-tb-i--cart {
	transform-origin: 50% 100%;
	animation: dt-tb-catch 0.7s var(--ease);
}

/* Label lifts a touch as the item is chosen. */
html body.dt-tb #glozin-mobile-navigation-bar .is-pop .glozin-navigation-bar__title {
	animation: dt-tb-label 0.6s var(--ease);
}

/* Keep the bar clear of open drawers / sheets (they sit above it anyway). */
html body.dt-tb.offcanvas-opened #glozin-mobile-navigation-bar,
html body.dt-tb.modal-opened #glozin-mobile-navigation-bar {
	pointer-events: none;
}

@media (min-width: 768px) {
	html body.dt-tb #glozin-mobile-navigation-bar {
		display: none !important;
	}
}

/* -------------------------------------------------------------------------
 * Keyframes
 * ---------------------------------------------------------------------- */

@keyframes dt-tb-in {
	from { opacity: 0; transform: translateY(calc(100% + 24px)) scale(0.94); }
	to { opacity: 1; transform: none; }
}

@keyframes dt-tb-fade {
	from { opacity: 0; transform: scale(0.6); }
	to { opacity: 1; transform: none; }
}

@keyframes dt-tb-hop {
	0% { transform: none; }
	18% { transform: translateY(1px) scale(1.12, 0.86); }
	42% { transform: translateY(-6px) scale(0.92, 1.1); }
	64% { transform: translateY(0) scale(1.1, 0.9); }
	80% { transform: translateY(-1px) scale(0.98, 1.03); }
	100% { transform: none; }
}

@keyframes dt-tb-roof {
	0%, 30% { transform: none; }
	48% { transform: translateY(-2px) rotate(-4deg); }
	70% { transform: translateY(0) rotate(2deg); }
	100% { transform: none; }
}

@keyframes dt-tb-door {
	0%, 25% { transform: none; }
	45% { transform: scale(0.6, 0.35); }
	75% { transform: scale(1.08, 1.12); }
	100% { transform: none; }
}

@keyframes dt-tb-nod {
	0% { transform: none; }
	25% { transform: translateY(-3px) scale(1.12); }
	45% { transform: translateY(-1px) rotate(-14deg); }
	65% { transform: rotate(10deg); }
	82% { transform: rotate(-4deg); }
	100% { transform: none; }
}

@keyframes dt-tb-shoulders {
	0% { transform: none; }
	25% { transform: scale(1.14, 0.88); }
	50% { transform: scale(0.96, 1.05); }
	100% { transform: none; }
}

@keyframes dt-tb-kick {
	0% { transform: none; }
	20% { transform: translate(-1px, 1px) rotate(6deg) scale(1.04, 0.94); }
	45% { transform: translate(2px, -3px) rotate(-16deg); }
	68% { transform: translate(0, 0.5px) rotate(3deg) scale(1.06, 0.92); }
	84% { transform: rotate(-2deg); }
	100% { transform: none; }
}

@keyframes dt-tb-speed {
	0%, 30% { opacity: 0; transform: translateX(3px); }
	50% { opacity: 1; transform: translateX(0); }
	80% { opacity: 0; transform: translateX(-3px); }
	100% { opacity: 0; }
}

@keyframes dt-tb-beat {
	0% { transform: none; }
	15% { transform: scale(0.72); }
	35% { transform: scale(1.32); }
	52% { transform: scale(0.94); }
	70% { transform: scale(1.1); }
	100% { transform: none; }
}

@keyframes dt-tb-burst {
	0% { opacity: 0; transform: scale(0.5); }
	40% { opacity: 1; transform: scale(1.1); }
	100% { opacity: 0; transform: scale(1.35); }
}

@keyframes dt-tb-swing {
	0% { transform: none; }
	18% { transform: rotate(-14deg); }
	40% { transform: rotate(11deg); }
	60% { transform: rotate(-6deg); }
	80% { transform: rotate(3deg); }
	100% { transform: none; }
}

@keyframes dt-tb-handle {
	0% { transform: none; }
	20% { transform: translateY(-2.5px) scaleY(1.1); }
	50% { transform: translateY(0.5px); }
	100% { transform: none; }
}

@keyframes dt-tb-catch {
	0% { transform: none; }
	30% { transform: translateY(2px) scale(1.14, 0.84); }
	60% { transform: translateY(-2px) scale(0.94, 1.08); }
	100% { transform: none; }
}

@keyframes dt-tb-label {
	0% { transform: none; }
	35% { transform: translateY(-1.5px); }
	100% { transform: none; }
}

@keyframes dt-tb-bump {
	0% { transform: scale(1); }
	35% { transform: scale(1.45); }
	60% { transform: scale(0.9); }
	100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
	html body.dt-tb #glozin-mobile-navigation-bar,
	html body.dt-tb #glozin-mobile-navigation-bar * {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}