/* Mlokole Binti — header, language switcher, dropdowns, mobile navigation */

/* ---------- Language switcher ---------- */
.ast-builder-html-element p:has(.mlb-lang) { margin: 0; }
.mlb-lang {
	display: inline-flex; align-items: center; gap: 2px; padding: 3px;
	border: 1px solid rgba(255, 255, 255, .32); border-radius: 999px;
	background: rgba(255, 255, 255, .06); line-height: 1; white-space: nowrap;
}
.mlb-lang__opt {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 32px; padding: 0 10px; border-radius: 999px;
	color: rgba(255, 255, 255, .88) !important; text-decoration: none !important;
	font: 600 12.5px/1 var(--mlb-body, 'Poppins', sans-serif); letter-spacing: .08em;
	transition: background-color .18s ease, color .18s ease;
}
.mlb-lang__opt:hover { background: rgba(255, 255, 255, .14); color: #fff !important; }
.mlb-lang__opt.is-active { background: var(--mlb-gold, #D4AF69); color: var(--mlb-navy, #10244A) !important; }
.mlb-lang__opt:focus-visible { outline: 3px solid var(--mlb-gold, #D4AF69); outline-offset: 2px; }
.mlb-lang .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* ---------- Desktop header ---------- */
@media (min-width: 922px) {
	#masthead .site-header-primary-section-right { gap: 14px; flex-wrap: nowrap; }
	#masthead .ast-builder-layout-element[data-section="section-hb-html-1"] { display: flex; align-items: center; }
	#masthead .mlb-hide-desktop { display: none !important; }

	/* dropdowns: directly under the parent, stable on hover and keyboard */
	#ast-desktop-header .main-header-menu .menu-item { position: relative; }
	#ast-desktop-header .main-header-menu > .menu-item > .sub-menu {
		top: 100% !important; margin-top: 0 !important; z-index: 1001;
		transition: opacity .16s ease, transform .16s ease, visibility 0s linear .22s !important;
	}
	#ast-desktop-header .main-header-menu > .menu-item:hover > .sub-menu,
	#ast-desktop-header .main-header-menu > .menu-item:focus-within > .sub-menu,
	#ast-desktop-header .main-header-menu > .menu-item.focus > .sub-menu {
		visibility: visible !important; opacity: 1 !important; left: 0; right: auto;
		transform: none !important; transition-delay: 0s !important; pointer-events: auto;
	}
	#ast-desktop-header .main-header-menu > .menu-item:nth-last-child(-n+2) > .sub-menu { left: auto !important; right: 0 !important; }
	#ast-desktop-header .main-header-menu .sub-menu .menu-link { white-space: nowrap; }
	#masthead .main-header-menu > .menu-item > .menu-link:focus-visible { outline: 2px solid var(--mlb-gold, #D4AF69); outline-offset: -6px; border-radius: 6px; }
}

/* ---------- Mobile header (Astra < 922px) ---------- */
@media (max-width: 921px) {
	#ast-mobile-header .site-primary-header-wrap { min-height: 64px; }
	#ast-mobile-header .site-header-primary-section-right { display: flex; align-items: center; gap: 10px; }
	#ast-mobile-header .custom-logo { max-height: 34px; width: auto; }
	#ast-mobile-header .mlb-lang__opt { min-width: 44px; height: 38px; font-size: 13px; }
	#ast-mobile-header .menu-toggle {
		width: 46px; height: 46px; padding: 0 !important; border-radius: 12px !important;
		display: inline-flex; align-items: center; justify-content: center;
		background: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .2) !important;
	}
	#ast-mobile-header .menu-toggle:focus-visible { outline: 3px solid var(--mlb-gold, #D4AF69); outline-offset: 2px; }

	/* the panel */
	#ast-mobile-header .ast-mobile-header-content {
		background: var(--mlb-navy, #10244A) !important;
		border-top: 1px solid rgba(212, 175, 105, .3);
		box-shadow: 0 18px 40px rgba(11, 26, 55, .35);
		max-height: calc(100vh - 64px); max-height: calc(100svh - 64px);
		overflow-y: auto; overscroll-behavior: contain;
		padding: 8px 0 20px;
	}
	#ast-mobile-header .ast-mobile-header-content .main-header-menu { background: transparent !important; }
	#ast-mobile-header .ast-mobile-header-content .menu-item { position: relative; border: 0 !important; }
	#ast-mobile-header .ast-mobile-header-content .main-header-menu > .menu-item { border-bottom: 1px solid rgba(255, 255, 255, .08) !important; }
	#ast-mobile-header .ast-mobile-header-content .menu-link {
		display: flex !important; align-items: center; min-height: 52px;
		padding: 0 64px 0 20px !important;
		color: #fff !important; font: 500 16px/1.3 var(--mlb-body, 'Poppins', sans-serif) !important;
		border: 0 !important; background: transparent !important;
	}
	#ast-mobile-header .ast-mobile-header-content .current-menu-item > .menu-link,
	#ast-mobile-header .ast-mobile-header-content .current-menu-ancestor > .menu-link { color: var(--mlb-gold, #D4AF69) !important; }
	#ast-mobile-header .ast-mobile-header-content .menu-link:focus-visible { outline: 2px solid var(--mlb-gold, #D4AF69); outline-offset: -4px; }

	/* accordion toggles */
	#ast-mobile-header .ast-mobile-header-content .ast-menu-toggle {
		position: absolute !important; top: 4px !important; right: 10px !important;
		width: 44px !important; height: 44px !important; padding: 0 !important;
		display: inline-flex !important; align-items: center; justify-content: center;
		border-radius: 10px !important; border: 1px solid rgba(255, 255, 255, .18) !important;
		background: rgba(255, 255, 255, .06) !important; color: #fff !important; cursor: pointer;
	}
	#ast-mobile-header .ast-mobile-header-content .ast-menu-toggle .ast-icon,
	#ast-mobile-header .ast-mobile-header-content .ast-menu-toggle svg { color: #fff; fill: #fff; transition: transform .2s ease; }
	#ast-mobile-header .ast-mobile-header-content .ast-submenu-expanded > .ast-menu-toggle svg,
	#ast-mobile-header .ast-mobile-header-content .ast-submenu-expanded > .ast-menu-toggle .ast-icon { transform: rotate(180deg); }
	#ast-mobile-header .ast-mobile-header-content .menu-link .dropdown-menu-toggle { display: none !important; }
	#ast-mobile-header .ast-mobile-header-content .sub-menu {
		background: var(--mlb-navy-2, #0B1A37) !important; border: 0 !important; box-shadow: none !important; padding: 4px 0 !important;
	}
	#ast-mobile-header .ast-mobile-header-content .sub-menu .menu-link {
		min-height: 48px; padding-left: 36px !important; font-size: 15px !important; color: rgba(255, 255, 255, .86) !important;
	}
	#ast-mobile-header .ast-mobile-header-content .sub-menu .menu-link::before {
		content: ""; width: 6px; height: 6px; margin-right: 12px; border-radius: 50%; background: var(--mlb-gold, #D4AF69); flex: none;
	}
	#ast-mobile-header .ast-mobile-header-content .ast-header-social-1-wrap { padding: 16px 20px 0; }
	#masthead .main-header-menu > .menu-item > .menu-link::after { display: none; }
}
@media (max-width: 360px) {
	#ast-mobile-header .custom-logo { max-height: 28px; }
	#ast-mobile-header .site-header-primary-section-right { gap: 6px; }
	#ast-mobile-header .mlb-lang__opt { min-width: 40px; padding: 0 8px; }
}

/* ---------- Program cards: image + title only (descriptions live on program pages) ---------- */
.mlb-card__text { display: none !important; }

/* ---------- Kiswahili-only article notice ---------- */
.mlb-lang-note {
	margin: 0 0 24px !important; padding: 14px 18px; border-radius: 12px;
	background: #FFF8E8; border: 1px solid #EBD8A8; color: var(--mlb-ink, #202938);
	font: 500 15px/1.5 var(--mlb-body, 'Poppins', sans-serif) !important; max-width: 72ch;
}
.mlb-lang-note a { color: var(--mlb-royal, #1D4ED8); font-weight: 600; }

/* desktop submenu links */
@media (min-width: 922px) {
	#ast-desktop-header .main-header-menu .sub-menu .menu-link {
		display: flex !important; align-items: center; min-height: 44px; padding: 10px 20px !important;
		line-height: 1.35 !important; font-family: var(--mlb-body, 'Poppins', sans-serif) !important;
		font-size: 14.5px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important;
	}
	#ast-desktop-header .main-header-menu .sub-menu .current-menu-item > .menu-link { color: var(--mlb-royal, #1D4ED8) !important; background: var(--mlb-ivory, #F8F6F0) !important; }
	#ast-desktop-header .main-header-menu .sub-menu .menu-link:focus-visible { outline: 2px solid var(--mlb-gold, #D4AF69); outline-offset: -2px; }
}

/* mobile header fit: logo + language + menu always on one row */
@media (max-width: 921px) {
	#ast-mobile-header .ast-builder-grid-row { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: nowrap; }
	#ast-mobile-header .site-header-primary-section-left { flex: 0 1 auto; min-width: 0; }
	#ast-mobile-header .site-header-primary-section-right { flex: 0 0 auto; gap: 8px !important; margin-left: auto; }
	#ast-mobile-header .site-branding, #ast-mobile-header .site-logo-img { min-width: 0; padding: 0 !important; }
	#ast-mobile-header .custom-logo { width: auto !important; height: auto !important; max-height: 30px !important; max-width: min(44vw, 190px) !important; }
	#ast-mobile-header .ast-builder-layout-element { margin: 0 !important; padding: 0 !important; }
	#ast-mobile-header .mlb-lang__opt { min-width: 42px; height: 38px; padding: 0 8px; }
	#ast-mobile-header .menu-toggle { width: 44px; height: 44px; }
}
@media (max-width: 359px) {
	#ast-mobile-header .site-primary-header-wrap { padding-left: 12px !important; padding-right: 12px !important; }
	#ast-mobile-header .custom-logo { max-width: 38vw !important; }
	#ast-mobile-header .mlb-lang__opt { min-width: 38px; padding: 0 6px; font-size: 12px; }
}

/* mobile panel links: beat the desktop header line-height */
@media (max-width: 921px) {
	#masthead #ast-mobile-header .main-header-menu > .menu-item > .menu-link,
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link {
		line-height: 1.3 !important; padding-top: 12px !important; padding-bottom: 12px !important; height: auto !important;
	}
	#masthead #ast-mobile-header .main-header-menu > .menu-item > .menu-link { min-height: 52px; font-size: 16px !important; text-transform: none !important; letter-spacing: 0 !important; }
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link { min-height: 46px; font-size: 15px !important; text-transform: none !important; }
}

/* mobile panel: stacked list + readable submenu (override desktop dropdown styles) */
@media (max-width: 921px) {
	#masthead #ast-mobile-header .ast-mobile-header-content .main-header-menu { display: block !important; flex-wrap: wrap !important; width: 100%; }
	#masthead #ast-mobile-header .ast-mobile-header-content .main-header-menu > .menu-item { display: block; width: 100%; }
	#masthead #ast-mobile-header .main-header-menu .sub-menu {
		position: static !important; width: 100% !important; min-width: 0 !important; margin: 0 !important;
		background: var(--mlb-navy-2, #0B1A37) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
		visibility: visible; opacity: 1; transform: none;
	}
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link { color: rgba(255, 255, 255, .88) !important; background: transparent !important; padding-left: 36px !important; }
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link:hover { color: #fff !important; padding-left: 36px !important; }
	#masthead #ast-mobile-header .main-header-menu .sub-menu .current-menu-item > .menu-link { color: var(--mlb-gold, #D4AF69) !important; }
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link > .ast-icon,
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link > svg,
	#masthead #ast-mobile-header .main-header-menu .sub-menu .menu-link .icon-arrow { display: none !important; }
}

/* logo uses all remaining width in the mobile header */
@media (max-width: 921px) {
	#ast-mobile-header .custom-logo { max-width: min(calc(100vw - 202px), 230px) !important; max-height: 32px !important; }
}
@media (max-width: 359px) {
	#ast-mobile-header .custom-logo { max-width: calc(100vw - 170px) !important; }
}

/* desktop: dropdown arrow sits inline, never adds height */
@media (min-width: 922px) {
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link { align-items: center; flex-wrap: nowrap; white-space: nowrap; }
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle {
		display: inline-flex !important; align-items: center; height: auto !important; line-height: 1 !important;
		position: static !important; margin: 0 0 0 4px !important; padding: 0 !important; width: auto !important;
	}
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle svg { width: 10px; height: 10px; }
}

/* compact desktop (small laptops / landscape tablets) */
@media (min-width: 922px) {
	#ast-desktop-header .site-header-primary-section-right > .ast-builder-layout-element { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; }
}
@media (min-width: 922px) and (max-width: 1199px) {
	#ast-desktop-header .custom-logo { max-width: 168px !important; height: auto !important; }
	#masthead .site-header-primary-section-right { gap: 10px !important; }
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link { padding-left: 8px !important; padding-right: 8px !important; font-size: 13.5px !important; }
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link::after { left: 8px; right: 8px; }
	#ast-desktop-header .ast-header-button-1 .ast-custom-button { padding: 11px 14px !important; font-size: 13.5px !important; }
	#ast-desktop-header .ast-header-button-1 .ast-custom-button::after { display: none; }
	#ast-desktop-header .mlb-lang__opt { min-width: 36px; padding: 0 8px; }
}