/* Export/preview: pin the bar and lock scroll while the menu is open. */

.navbar-pro-bar {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
}

.navbar-pro-spacer {
	height: var(--navbar-pro-bar-height);
}

.navbar-pro.navbar-pro--flush .navbar-pro-spacer {
	height: 0;
}

.navbar-pro.scrolled-down:not(.is-open) .navbar-pro-bar {
	transform: translateY(-100%);
	pointer-events: none;
}

.navbar-pro.scrolled-up .navbar-pro-bar,
.navbar-pro.is-open .navbar-pro-bar {
	transform: translateY(0);
}

.navbar-pro.is-open .navbar-pro-bar {
	bottom: 0;
	z-index: 60;
	overflow: hidden;
}

body.navbar-pro-lock {
	overflow: hidden;
}

.navbar-pro.navbar-pro--no-max-width .navbar-pro-inner,
.navbar-pro[data-navbar-pro-max-width="0"] .navbar-pro-inner,
.navbar-pro[data-navbar-pro-max-width="false"] .navbar-pro-inner {
	max-width: none;
}

@media (max-width: 1199px) {
	.navbar-pro-inner {
		flex-wrap: nowrap;
		gap: 0;
		height: var(--navbar-pro-bar-height);
	}

	.navbar-pro-logo {
		flex: 1 1 auto;
		flex-shrink: 1;
		min-width: 0;
		max-width: calc(100% - 48px);
	}

	.navbar-pro-logo img {
		flex-shrink: 1;
		max-width: 100%;
	}

	.navbar-pro-end {
		display: none;
		position: absolute;
		top: var(--navbar-pro-bar-height);
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1;
		flex: none;
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		margin: 0;
		padding: 24px 32px 96px;
		overflow-y: auto;
		background: var(--navbar-pro-bar-bg);
	}

	.navbar-pro.is-open .navbar-pro-end {
		display: flex;
	}
}

@media (min-width: 992px) {
	.navbar-pro[data-navbar-pro-hamburger="md"] .navbar-pro-inner,
	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-inner,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-inner {
		gap: 0.75rem;
	}

	.navbar-pro[data-navbar-pro-hamburger="md"] .navbar-pro-logo,
	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-logo,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo {
		flex: none;
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="md"] .navbar-pro-logo img,
	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-logo img,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo img {
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="md"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="md"].is-open .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="sm"].is-open .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-end {
		display: flex;
		position: static;
		top: auto;
		right: auto;
		bottom: auto;
		left: auto;
		z-index: auto;
		flex-direction: row;
		align-items: center;
		width: auto;
		height: auto;
		margin-left: auto;
		padding: 0;
		overflow: visible;
	}

	.navbar-pro[data-navbar-pro-hamburger="md"].is-open .navbar-pro-bar,
	.navbar-pro[data-navbar-pro-hamburger="sm"].is-open .navbar-pro-bar,
	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-bar {
		bottom: auto;
		overflow: visible;
	}
}

@media (min-width: 768px) {
	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-inner,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-inner {
		gap: 0.75rem;
	}

	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-logo,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo {
		flex: none;
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-logo img,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo img {
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="sm"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="sm"].is-open .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-end {
		display: flex;
		position: static;
		top: auto;
		right: auto;
		bottom: auto;
		left: auto;
		z-index: auto;
		flex-direction: row;
		align-items: center;
		width: auto;
		height: auto;
		margin-left: auto;
		padding: 0;
		overflow: visible;
	}

	.navbar-pro[data-navbar-pro-hamburger="sm"].is-open .navbar-pro-bar,
	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-bar {
		bottom: auto;
		overflow: visible;
	}
}

@media (min-width: 576px) {
	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-inner {
		gap: 0.75rem;
	}

	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo {
		flex: none;
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-logo img {
		max-width: none;
	}

	.navbar-pro[data-navbar-pro-hamburger="xs"] .navbar-pro-end,
	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-end {
		display: flex;
		position: static;
		top: auto;
		right: auto;
		bottom: auto;
		left: auto;
		z-index: auto;
		flex-direction: row;
		align-items: center;
		width: auto;
		height: auto;
		margin-left: auto;
		padding: 0;
		overflow: visible;
	}

	.navbar-pro[data-navbar-pro-hamburger="xs"].is-open .navbar-pro-bar {
		bottom: auto;
		overflow: visible;
	}
}

@media print {
	.navbar-pro,
	.navbar-pro-spacer {
		display: none !important;
	}
}