/**
 * TutorBridgePro V23 Global Header
 *
 * Announcement bar, primary navigation, language switcher, theme control,
 * authentication actions and responsive mobile navigation.
 */

.announcement-bar {
	background: var(--tbp-brand-navy-950, #071a31);
	color: #dce8f4;
	font-size: var(--tbp-font-size-xs);
}

.announcement-bar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--tbp-space-4);
	min-height: 38px;
}

.announcement-bar__message {
	display: flex;
	align-items: center;
	gap: var(--tbp-space-3);
	min-width: 0;
}

.announcement-bar__badge {
	flex-shrink: 0;
	padding: 0.2rem 0.65rem;
	border: 1px solid rgb(243 206 104 / 35%);
	border-radius: var(--tbp-radius-pill);
	background: rgb(255 255 255 / 6%);
	color: var(--tbp-brand-gold-300, #f3ce68);
	font-family: var(--tbp-font-en);
	font-weight: var(--tbp-font-weight-bold);
	line-height: 1.3;
}

.announcement-bar__link {
	display: inline-flex;
	align-items: center;
	gap: var(--tbp-space-2);
	flex-shrink: 0;
	color: var(--tbp-brand-gold-300, #f3ce68);
	font-weight: var(--tbp-font-weight-bold);
	text-decoration: none;
}

.announcement-bar__link:hover {
	color: var(--tbp-white, #ffffff);
}

.site-header {
	position: sticky;
	z-index: 900;
	top: 0;
	width: 100%;
	border-block-end: 1px solid var(--tbp-color-border);
	background: color-mix(in srgb, var(--tbp-color-surface) 92%, transparent);
	box-shadow: none;
	backdrop-filter: blur(20px);
	transition:
		background-color var(--tbp-transition-normal),
		box-shadow var(--tbp-transition-normal),
		border-color var(--tbp-transition-normal);
}

.admin-bar .site-header {
	top: 32px;
}

.site-header.is-scrolled {
	box-shadow: var(--tbp-shadow-md);
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: clamp(1.25rem, 2.5vw, 2.5rem);
	min-height: 92px;
}

.site-branding {
	flex-shrink: 0;
}

.site-branding__link {
	display: inline-flex;
	align-items: center;
	color: var(--tbp-color-heading);
	text-decoration: none;
}

.site-branding__logo {
	display: block;
	width: min(220px, 32vw);
	max-height: 64px;
	height: auto;
}

.site-branding__logo--dark {
	display: none;
}

html[data-theme="dark"] .site-branding__logo--light {
	display: none;
}

html[data-theme="dark"] .site-branding__logo--dark {
	display: block;
}

.site-branding__name {
	font-size: var(--tbp-font-size-xl);
	font-weight: var(--tbp-font-weight-extrabold);
}

.primary-navigation {
	min-width: 0;
	margin-inline: auto;
}

.primary-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: clamp(1rem, 1.8vw, 1.75rem);
	padding: 0;
	margin: 0;
	list-style: none;
}

.primary-menu > li {
	position: relative;
	margin: 0;
}

.primary-menu > li > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--tbp-color-text-muted);
	font-size: var(--tbp-font-size-sm);
	font-weight: var(--tbp-font-weight-bold);
	white-space: nowrap;
	text-decoration: none;
	transition: color var(--tbp-transition-fast);
}

.primary-menu > li > a::after {
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	height: 2px;
	border-radius: var(--tbp-radius-pill);
	background: var(--tbp-color-accent);
	content: "";
	transform: scaleX(0);
	transition: transform var(--tbp-transition-fast);
}

.primary-menu > li > a:hover,
.primary-menu > .current-menu-item > a,
.primary-menu > .current_page_item > a {
	color: var(--tbp-color-heading);
}

.primary-menu > li > a:hover::after,
.primary-menu > .current-menu-item > a::after,
.primary-menu > .current_page_item > a::after {
	transform: scaleX(1);
}

.site-header__actions {
	display: flex;
	align-items: center;
	gap: var(--tbp-space-3);
	flex-shrink: 0;
}

.tbp-language-switcher {
	display: flex;
	align-items: center;
}

.tbp-language-switcher > div,
.tbp-language-switcher .trp-language-switcher {
	margin: 0 !important;
}

.tbp-language-switcher :is(a, button, select) {
	font-family: var(--tbp-font-en);
	font-weight: var(--tbp-font-weight-semibold);
}

.theme-switch {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--tbp-color-border);
	border-radius: var(--tbp-radius-pill);
	background: var(--tbp-color-surface);
	color: var(--tbp-color-heading);
	box-shadow: var(--tbp-shadow-sm);
	cursor: pointer;
	transition:
		border-color var(--tbp-transition-fast),
		background-color var(--tbp-transition-fast),
		color var(--tbp-transition-fast),
		transform var(--tbp-transition-fast);
}

.theme-switch:hover {
	border-color: var(--tbp-color-primary);
	background: var(--tbp-color-blue-100);
	color: var(--tbp-color-primary);
	transform: translateY(-1px);
}

.theme-switch__icon--sun {
	display: none;
}

html[data-theme="dark"] .theme-switch__icon--moon {
	display: none;
}

html[data-theme="dark"] .theme-switch__icon--sun {
	display: block;
}

.site-header__login {
	color: var(--tbp-color-heading);
	font-size: var(--tbp-font-size-sm);
	font-weight: var(--tbp-font-weight-extrabold);
	white-space: nowrap;
	text-decoration: none;
}

.site-header__login:hover {
	color: var(--tbp-color-primary);
}

.site-header__register {
	white-space: nowrap;
}

.menu-toggle {
	display: none;
	width: 44px;
	height: 44px;
	padding: 9px;
	border: 1px solid var(--tbp-color-border);
	border-radius: var(--tbp-radius-md);
	background: var(--tbp-color-surface);
	color: var(--tbp-color-heading);
	cursor: pointer;
}

.menu-toggle span {
	display: block;
	width: 100%;
	height: 2px;
	margin-block: 5px;
	border-radius: var(--tbp-radius-pill);
	background: currentColor;
	transition:
		transform var(--tbp-transition-fast),
		opacity var(--tbp-transition-fast);
}

.menu-toggle[aria-expanded="true"] span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] span:nth-child(2) {
	opacity: 0;
}

.menu-toggle[aria-expanded="true"] span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

.mobile-navigation {
	border-block-start: 1px solid var(--tbp-color-border);
	background: var(--tbp-color-surface);
	box-shadow: var(--tbp-shadow-md);
}

.mobile-navigation[hidden] {
	display: none;
}

.mobile-navigation__inner {
	display: grid;
	gap: var(--tbp-space-6);
	padding-block: var(--tbp-space-6);
}

.mobile-menu {
	display: grid;
	gap: var(--tbp-space-2);
	padding: 0;
	margin: 0;
	list-style: none;
}

.mobile-menu li {
	margin: 0;
}

.mobile-menu a {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding-inline: var(--tbp-space-4);
	border-radius: var(--tbp-radius-md);
	color: var(--tbp-color-heading);
	font-weight: var(--tbp-font-weight-semibold);
	text-decoration: none;
}

.mobile-menu a:hover,
.mobile-menu .current-menu-item > a,
.mobile-menu .current_page_item > a {
	background: var(--tbp-color-surface-soft);
	color: var(--tbp-color-primary);
}

.mobile-navigation__actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tbp-space-3);
}

html[data-theme="dark"] .site-header {
	background: color-mix(in srgb, var(--tbp-color-surface) 92%, transparent);
}

html[data-theme="dark"] .announcement-bar {
	background: #04101f;
}

@media (max-width: 1180px) {
	.primary-menu {
		gap: 1rem;
	}

	.primary-menu > li > a {
		font-size: 0.82rem;
	}

	.site-header__login,
	.site-header__register {
		display: none;
	}
}

@media (max-width: 980px) {
	.announcement-bar__inner {
		justify-content: center;
		min-height: 42px;
		text-align: center;
	}

	.announcement-bar__link {
		display: none;
	}

	.primary-navigation {
		display: none;
	}

	.site-header__inner {
		min-height: 78px;
	}

	.site-branding__logo {
		width: min(190px, 48vw);
	}

	.menu-toggle {
		display: block;
	}
}

@media screen and (max-width: 782px) {
	.admin-bar .site-header {
		top: 46px;
	}
}

@media (max-width: 640px) {
	.announcement-bar__message > span:last-child {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.announcement-bar__badge {
		display: none;
	}

	.site-header__inner {
		gap: var(--tbp-space-2);
		min-height: 72px;
	}

	.site-branding__logo {
		width: min(165px, 44vw);
	}

	.site-header__actions {
		gap: var(--tbp-space-2);
	}

	.theme-switch,
	.menu-toggle {
		width: 40px;
		height: 40px;
	}

	.mobile-navigation__actions {
		grid-template-columns: 1fr;
	}
}

/* Stabilized Support Gaza campaign item and mobile header spacing. */
.primary-menu .tbp-menu-support-gaza > a,
.mobile-menu .tbp-menu-support-gaza > a {
	gap: 0.4rem;
	color: var(--tbp-brand-gold-600, #b58d12);
}

.primary-menu .tbp-menu-support-gaza > a::before,
.mobile-menu .tbp-menu-support-gaza > a::before {
	content: "♥";
	color: #d63d4d;
	font-size: 0.95em;
}

/* TutorBridgePro mobile header root fix v1.6.
 * Legacy layout and absolute-position conflicts were removed from their source files.
 */
@media (max-width: 760px) {
	.site-header__inner {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 0.5rem;
		min-height: 72px;
		padding-block: 0;
	}

	.site-branding {
		flex: 0 0 auto;
		min-width: 0;
		overflow: visible;
	}

	.site-branding__link {
		display: inline-flex;
		align-items: center;
		max-width: 100%;
		overflow: visible;
	}

	.site-branding__logo {
		width: 138px;
		max-width: 138px;
		max-height: 42px;
		height: auto;
		object-fit: contain;
	}

	.site-branding__logo--light {
		display: block;
	}

	.site-branding__logo--dark {
		display: none;
	}

	html[data-theme="dark"] .site-branding__logo--light {
		display: none;
	}

	html[data-theme="dark"] .site-branding__logo--dark {
		display: block;
	}

	.primary-navigation {
		display: none;
	}

	.site-header__actions {
		position: static;
		inset: auto;
		display: flex;
		align-items: center;
		flex: 0 0 auto;
		gap: 0.4rem;
		margin: 0;
		margin-inline-start: auto;
		overflow: visible;
	}

	.tbp-language-switcher {
		display: flex;
		align-items: center;
		flex: 0 0 68px;
		width: 68px;
		min-width: 68px;
		max-width: 68px;
		overflow: visible;
	}

	.tbp-language-switcher select,
	.tbp-language-switcher button {
		box-sizing: border-box;
		width: 68px;
		min-width: 68px;
		max-width: 68px;
		height: 40px;
		min-height: 40px;
		margin: 0;
		padding-inline: 0.55rem;
	}

	.tbp-language-switcher .trp-language-switcher,
	.tbp-language-switcher .trp-language-switcher > div {
		box-sizing: border-box !important;
		width: 68px !important;
		min-width: 68px !important;
		max-width: 68px !important;
		margin: 0 !important;
		overflow: visible;
	}

	.tbp-language-switcher .trp-language-switcher > div > a {
		box-sizing: border-box !important;
		width: 100% !important;
		min-height: 40px !important;
		padding-inline: 0.55rem !important;
	}

	.theme-switch,
	.menu-toggle {
		flex: 0 0 40px;
		width: 40px;
		height: 40px;
	}

	.menu-toggle {
		display: block;
		padding: 8px;
	}

	.site-header__login,
	.site-header__register {
		display: none;
	}
}

@media (max-width: 360px) {
	.site-header__inner {
		gap: 0.35rem;
	}

	.site-branding__logo {
		width: 112px;
		max-width: 112px;
		max-height: 38px;
	}

	.tbp-language-switcher,
	.tbp-language-switcher select,
	.tbp-language-switcher button,
	.tbp-language-switcher .trp-language-switcher,
	.tbp-language-switcher .trp-language-switcher > div {
		flex-basis: 60px;
		width: 60px !important;
		min-width: 60px !important;
		max-width: 60px !important;
	}

	.theme-switch,
	.menu-toggle {
		flex-basis: 36px;
		width: 36px;
		height: 36px;
	}
}

/* TranslatePress shortcode: normalize the generated nested control. */
.site-header .tbp-language-switcher {
	--tbp-language-control-width: 64px;
	--tbp-language-control-height: 48px;
}

.site-header .tbp-language-switcher .trp-shortcode-switcher__wrapper,
.site-header .tbp-language-switcher .trp-language-switcher,
.site-header .tbp-language-switcher .trp-current-language-item__wrapper {
	box-sizing: border-box !important;
	width: var(--tbp-language-control-width) !important;
	min-width: var(--tbp-language-control-width) !important;
	max-width: var(--tbp-language-control-width) !important;
	height: var(--tbp-language-control-height) !important;
	min-height: var(--tbp-language-control-height) !important;
	max-height: var(--tbp-language-control-height) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	overflow: visible !important;
}

.site-header .tbp-language-switcher .trp-language-item {
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 1px solid var(--tbp-color-border) !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: #143852 !important;
	font-family: var(--tbp-font-en) !important;
	font-weight: var(--tbp-font-weight-semibold) !important;
	line-height: 1 !important;
	text-decoration: none !important;
}

html[data-theme="dark"] .site-branding__link {
	padding: 0.35rem 0.55rem;
	border-radius: var(--tbp-radius-md, 0.75rem);
	background: #fff;
}

@media (max-width: 900px) {
	.site-header .tbp-language-switcher {
		--tbp-language-control-width: 68px;
		--tbp-language-control-height: 40px;
	}
}

@media (max-width: 360px) {
	.site-header .tbp-language-switcher {
		--tbp-language-control-width: 60px;
		--tbp-language-control-height: 36px;
	}
}
