.sst-erb-global-header,
.sst-erb-global-header *,
.sst-erb-user-menu,
.sst-erb-user-menu * {
	box-sizing: border-box;
}

.sst-erb-global-header {
	position: relative;
	z-index: 9995;
	width: 100%;
	background: #032B44;
	border-bottom: 1px solid rgba(0, 131, 156, 0.75);
	color: #fff;
	font-family: inherit;
}

.sst-erb-global-header__inner {
	width: min(100%, 1440px);
	min-height: 76px;
	margin: 0 auto;
	padding: 10px 30px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.sst-erb-global-header__brand,
.sst-erb-global-header__user-area {
	min-width: 0;
}

.sst-erb-global-header__logo-link,
.sst-erb-global-header__site-name {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: #fff;
}

.sst-erb-global-header__logo-img {
	display: block;
	width: auto;
	height: auto;
	max-height: 54px;
	max-width: 210px;
	object-fit: contain;
}

.sst-erb-global-header__site-name {
	font-size: 22px;
	font-weight: 700;
}

.sst-erb-global-header__user-area {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.sst-erb-user-menu {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	color: #fff;
}

.sst-erb-user-menu__greeting {
	display: flex;
	align-items: baseline;
	gap: 5px;
	font-size: 14px;
	line-height: 1.3;
	white-space: nowrap;
}

.sst-erb-user-menu__greeting span {
	font-weight: 400;
	color: rgba(255,255,255,.88);
}

.sst-erb-user-menu__greeting strong {
	font-weight: 700;
	color: #fff;
}

.sst-erb-user-menu__trigger {
	appearance: none;
	-webkit-appearance: none;
	width: 38px;
	height: 38px;
	min-width: 38px;
	min-height: 38px;
	padding: 0;
	border: 2px solid #9BE9F4;
	border-radius: 50%;
	background: #E8FBFF;
	color: #032B44;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: none;
	outline: none;
	transition: border-color .18s ease, transform .18s ease, background-color .18s ease;
}

.sst-erb-user-menu__trigger:hover,
.sst-erb-user-menu__trigger:focus-visible,
.sst-erb-user-menu.is-open .sst-erb-user-menu__trigger {
	border-color: #24D0E8;
	background: #fff;
	transform: translateY(-1px);
}

.sst-erb-user-menu__avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-weight: 500;
	line-height: 1;
	text-transform: uppercase;
}

.sst-erb-user-menu__avatar--small {
	width: 100%;
	height: 100%;
	font-size: 12px;
}

.sst-erb-user-menu__avatar--large {
	width: 54px;
	height: 54px;
	margin: 0 auto 7px;
	background: #E8FBFF;
	color: #032B44;
	font-size: 16px;
}

.sst-erb-user-menu__dropdown {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 10020;
	width: 232px;
	padding: 16px 10px 10px;
	border: 1px solid #00839C;
	border-radius: 14px;
	background: #063B50;
	color: #fff;
	box-shadow: 0 16px 40px rgba(0, 20, 32, .22);
	transform-origin: top right;
}

.sst-erb-user-menu__dropdown[hidden] {
	display: none !important;
}

.sst-erb-user-menu.is-open .sst-erb-user-menu__dropdown {
	animation: sstErbUserMenuIn .16s ease-out both;
}

.sst-erb-user-menu__profile {
	text-align: center;
	padding: 8px 8px 10px;
}

.sst-erb-user-menu__name {
	font-size: 16px;
	line-height: 1.25;
	font-weight: 700;
	color: #fff;
	word-break: break-word;
}

.sst-erb-user-menu__email {
	margin-top: 4px;
	font-size: 12px;
	line-height: 1.4;
	color: rgba(255,255,255,.76);
	word-break: break-word;
}

.sst-erb-user-menu__divider {
	height: 1px;
	margin: 4px 0;
	background: rgba(255,255,255,.72);
}

.sst-erb-user-menu__item {
	min-height: 42px;
	padding: 9px 10px;
	display: flex;
	align-items: center;
	gap: 10px;
	border-radius: 8px;
	text-decoration: none !important;
	color: #DDE9ED !important;
	font-size: 14px;
	font-weight: 600;
	transition: background-color .16s ease, color .16s ease;
}

.sst-erb-user-menu__item:hover,
.sst-erb-user-menu__item:focus-visible {
	background: rgba(255,255,255,.08);
	color: #fff !important;
}

.sst-erb-user-menu__item svg {
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
	fill: currentColor;
}

@keyframes sstErbUserMenuIn {
	from { opacity: 0; transform: translateY(-5px) scale(.985); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 760px) {
	.sst-erb-global-header__inner {
		min-height: 64px;
		padding: 8px 14px;
		gap: 12px;
	}

	.sst-erb-global-header__logo-img {
		max-height: 42px;
		max-width: 138px;
	}

	.sst-erb-global-header__site-name {
		font-size: 17px;
	}

	.sst-erb-user-menu {
		gap: 8px;
	}

	.sst-erb-user-menu__greeting {
		max-width: min(45vw, 170px);
		font-size: 12px;
		white-space: normal;
		text-align: right;
		line-height: 1.15;
		justify-content: flex-end;
		flex-wrap: wrap;
	}

	.sst-erb-user-menu__trigger {
		width: 36px;
		height: 36px;
		min-width: 36px;
		min-height: 36px;
	}

	.sst-erb-user-menu__dropdown {
		width: min(232px, calc(100vw - 28px));
		right: 0;
	}
}

@media (max-width: 430px) {
	.sst-erb-global-header__logo-img {
		max-width: 115px;
		max-height: 38px;
	}

	.sst-erb-user-menu__greeting {
		max-width: 125px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sst-erb-user-menu__trigger,
	.sst-erb-user-menu__item {
		transition: none;
	}

	.sst-erb-user-menu.is-open .sst-erb-user-menu__dropdown {
		animation: none;
	}
}


/* v1.6.1 — Desktop header composition aligned to the approved visual reference.
 * The reference uses a centered ~1120px content rail inside a taller #032B44
 * header, with the logo at left and greeting/avatar at right.
 */
@media (min-width: 761px) {
	.sst-erb-global-header {
		min-height: 136px;
		background: #032B44;
		border-bottom: 0;
	}

	.sst-erb-global-header__inner {
		width: min(calc(100% - 48px), 1120px);
		min-height: 136px;
		margin: 0 auto;
		padding: 20px 0 36px;
		gap: 28px;
	}

	.sst-erb-global-header__logo-img {
		max-height: 72px;
		max-width: 190px;
	}

	.sst-erb-global-header__user-area {
		align-self: center;
	}

	.sst-erb-user-menu {
		gap: 10px;
	}

	.sst-erb-user-menu__greeting {
		font-size: 16px;
		line-height: 1.25;
		gap: 5px;
	}

	.sst-erb-user-menu__trigger {
		width: 36px;
		height: 36px;
		min-width: 36px;
		min-height: 36px;
		border-width: 1px;
	}

	.sst-erb-user-menu__dropdown {
		top: calc(100% + 6px);
		width: 236px;
		padding: 16px 10px 10px;
		border: 1px solid #00839C;
		border-radius: 14px;
		background: #063B50;
		box-shadow: 0 14px 28px rgba(0, 20, 32, .18);
	}

	.sst-erb-user-menu__profile {
		padding: 8px 8px 12px;
	}

	.sst-erb-user-menu__avatar--large {
		width: 54px;
		height: 54px;
		margin-bottom: 7px;
	}

	.sst-erb-user-menu__name {
		font-size: 16px;
	}

	.sst-erb-user-menu__email {
		font-size: 12px;
	}

	.sst-erb-user-menu__item {
		min-height: 44px;
		padding: 10px;
		font-size: 14px;
	}
}


/* v1.6.2 — Uniform SST header contract */
.sst-erb-global-header {
	background: #032B44 !important;
	border: 0 !important;
	border-bottom: 2px solid #00839C !important;
}


/* v1.7.1 — Fixed SST Header
 * The JS companion measures the real rendered header height and creates a
 * spacer immediately after it. This prevents page/Tutor content from being
 * hidden below the fixed header, even if an administrator later changes the
 * header height from SST Plataforma > CSS personalizado.
 */
.sst-erb-global-header {
	position: fixed !important;
	top: var(--sst-erb-admin-bar-offset, 0px) !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 9995 !important;
}

.sst-erb-global-header-spacer {
	display: block !important;
	width: 100% !important;
	height: var(--sst-erb-fixed-header-height, 0px);
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	pointer-events: none !important;
	visibility: hidden !important;
}

/* Keep anchor navigation from landing underneath the fixed header. */
html {
	scroll-padding-top: calc(
		var(--sst-erb-fixed-header-height, 0px) +
		var(--sst-erb-admin-bar-offset, 0px) +
		12px
	);
}


/* v1.7.2 — Tutor LMS 4 Learning Area viewport adaptation
 *
 * Tutor's modern Learning Area is designed as an app-like viewport and its
 * root uses viewport-based sizing. Once the SST header becomes fixed, the
 * usable Tutor viewport is no longer the full screen. These rules consume
 * the height calculated by sst-erb-user-header.js.
 */
.tutor-learning-area.sst-erb-learning-area-adapted {
	min-height: var(
		--sst-erb-learning-area-height,
		calc(
			100dvh -
			var(--sst-erb-fixed-header-height, 0px) -
			var(--sst-erb-admin-bar-offset, 0px)
		)
	) !important;
}

/* Compatibility for themes/custom CSS that make Tutor's root fixed.
 * A fixed element ignores the normal-flow spacer, so it must receive both
 * a top offset and an explicit remaining viewport height.
 */
.tutor-learning-area.sst-erb-learning-area-adapted--fixed {
	top: var(
		--sst-erb-learning-area-inline-top,
		calc(
			var(--sst-erb-fixed-header-height, 0px) +
			var(--sst-erb-admin-bar-offset, 0px)
		)
	) !important;
	height: var(
		--sst-erb-learning-area-inline-height,
		var(--sst-erb-learning-area-height, auto)
	) !important;
	max-height: var(
		--sst-erb-learning-area-inline-height,
		var(--sst-erb-learning-area-height, none)
	) !important;
}

/* The modern Learning Area contains its own sticky/header/content regions.
 * Give descendants the same available-height token so future visual
 * overrides can use it without hard-coded pixel values.
 */
.tutor-learning-area.sst-erb-learning-area-adapted {
	--sst-erb-tutor-available-height: var(--sst-erb-learning-area-height);
}


/* v1.7.3 — Offset Tutor LMS 4 native fixed Learning Area chrome.
 *
 * The normal Learning Area content already follows the SST spacer. Tutor's
 * own .tutor-learning-header and .tutor-learning-sidebar can be fixed/sticky,
 * so they ignore that spacer. JS measures Tutor's native header and exposes
 * the exact offsets below.
 */
.tutor-learning-header.sst-erb-tutor-learning-header-offset {
	top: var(--sst-erb-learning-area-top, 0px) !important;
}

/* Sidebar begins AFTER both headers:
 * SST header + WordPress admin bar + Tutor native Learning Header.
 */
.tutor-learning-sidebar.sst-erb-tutor-learning-sidebar-offset {
	top: var(
		--sst-erb-tutor-sidebar-top,
		calc(
			var(--sst-erb-learning-area-top, 0px) +
			var(--sst-erb-tutor-native-header-height, 0px)
		)
	) !important;
	height: var(--sst-erb-tutor-sidebar-height, auto) !important;
	max-height: var(--sst-erb-tutor-sidebar-height, none) !important;
}

/* Keep the Tutor native header below the SST header in the stacking order,
 * while preserving Tutor's normal precedence over its own body/sidebar.
 */
.sst-erb-global-header {
	z-index: 9995 !important;
}

.tutor-learning-header.sst-erb-tutor-learning-header-offset {
	z-index: 9990 !important;
}


/* v1.8.0 — Tutor quiz header offset.
 * Quiz screens can use a fixed/sticky .tutor-quiz-header that ignores the
 * regular fixed-header spacer. Keep it immediately below the SST Header.
 */
.tutor-quiz-header.sst-erb-tutor-quiz-header-offset {
	top: var(
		--sst-erb-tutor-quiz-header-top,
		calc(
			var(--sst-erb-fixed-header-height, 0px) +
			var(--sst-erb-admin-bar-offset, 0px)
		)
	) !important;
	z-index: 9990 !important;
}


/* v1.8.3 — Mobile quiz pagination relocation.
 * On screens <=760px JS moves Tutor's question pagination inside
 * .tutor-quiz-question-meta. Desktop keeps Tutor's native DOM untouched.
 */
@media (max-width: 760px) {
	.tutor-quiz-question-meta.sst-erb-mobile-pagination-host {
		flex-wrap: wrap !important;
	}

	.tutor-quiz-question-meta
		> .tutor-quiz-questions-pagination.sst-erb-mobile-quiz-pagination {
		order: 100 !important;
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-top: 8px !important;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
	}
}