/* Wamda Ibda3 — top bar + Wamda header builder.
   RTL-first: everything uses logical properties so "start" is the right side in
   Arabic and the left side in English, with no duplicated rules. */

/* ---------------------------------------------------------------- shared */
.wamda-hb {
	box-sizing: border-box;
	font-size: var( --wamda-topbar-fs, 14px );
	line-height: 1.4;
}

.wamda-hb *,
.wamda-hb *::before,
.wamda-hb *::after {
	box-sizing: border-box;
}

.wamda-hb__inner {
	display: flex;
	align-items: center;
	gap: var( --wamda-topbar-gap, 16px );
	width: 100%;
	max-width: var( --wamda-container, 1200px );
	margin-inline: auto;
	padding-inline: clamp( 12px, 3vw, 28px );
}

.wamda-hb--w-full > .wamda-hb__inner {
	max-width: none;
}

.wamda-hb__zone {
	display: flex;
	align-items: center;
	gap: var( --wamda-topbar-gap, 16px );
	min-width: 0;
}

.wamda-hb__zone--start {
	justify-content: flex-start;
}

.wamda-hb__zone--center {
	flex: 1 1 auto;
	justify-content: center;
	min-width: 0;
}

.wamda-hb__zone--end {
	justify-content: flex-end;
}

.wamda-hb__zone:empty {
	display: none;
}

.wamda-hb__el {
	display: flex;
	align-items: center;
	min-width: 0;
}

.wamda-hb__el--ticker {
	flex: 1 1 auto;
	min-width: 0;
}

/* Items, icons, text */
.wamda-hb__item {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
	transition: color .18s ease, opacity .18s ease;
}

.wamda-hb__item:hover,
.wamda-hb__item:focus-visible {
	color: var( --wamda-topbar-hover, #fff );
	text-decoration: none;
}

.wamda-hb__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: var( --wamda-topbar-icon, 18px );
	line-height: 1;
	flex: 0 0 auto;
}

.wamda-hb__icon .wamda-svg,
.wamda-hb__icon img.wamda-svg-file {
	width: 1em;
	height: 1em;
	display: block;
}

.wamda-hb__text {
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Buttons */
.wamda-hb__btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 14px;
	border-radius: 999px;
	font-weight: 600;
	font-size: .95em;
	text-decoration: none;
	line-height: 1.3;
	white-space: nowrap;
	transition: transform .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.wamda-hb__btn:hover,
.wamda-hb__btn:focus-visible {
	transform: translateY( -1px );
	text-decoration: none;
}

.wamda-hb__btn--link {
	padding: 4px 2px;
	border-radius: 6px;
	color: inherit;
	font-weight: 500;
}

.wamda-hb__btn--link:hover {
	color: var( --wamda-topbar-hover, #fff );
}

.wamda-hb__btn--btn {
	background: var( --wamda-primary, #2563eb );
	color: #fff;
	box-shadow: 0 6px 18px -10px rgba( 0, 0, 0, .55 );
}

.wamda-hb__btn--btn:hover {
	background: var( --wamda-primary-hover, #1d4ed8 );
	color: #fff;
}

.wamda-hb__btn--outline {
	border: 1px solid currentColor;
	color: inherit;
	background: transparent;
}

.wamda-hb__btn--outline:hover {
	background: currentColor;
	color: var( --wamda-topbar-bg, #0f172a );
}

.wamda-hb__btn--pill {
	background: rgba( 255, 255, 255, .14 );
	color: inherit;
}

.wamda-hb__btn--pill:hover {
	background: rgba( 255, 255, 255, .24 );
}

.wamda-hb__btn--icon {
	padding: 7px;
	border-radius: 50%;
	background: rgba( 255, 255, 255, .12 );
}

.wamda-hb__btn--icon .wamda-hb__text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset( 50% );
}

/* Language switcher */
.wamda-hb__lang {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.wamda-hb__lang ul {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wamda-hb__lang a {
	color: inherit;
	text-decoration: none;
	padding: 3px 8px;
	border-radius: 999px;
	font-weight: 600;
	text-transform: uppercase;
	font-size: .85em;
}

.wamda-hb__lang a:hover,
.wamda-hb__lang .is-active > a,
.wamda-hb__lang .current-lang > a {
	background: rgba( 255, 255, 255, .16 );
}

/* Inline search */
.wamda-hb__search {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba( 255, 255, 255, .12 );
	max-width: 220px;
}

.wamda-hb__search input[type='search'] {
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	width: 100%;
	min-width: 0;
	padding: 0;
	box-shadow: none;
	outline: none;
}

.wamda-hb__search input::placeholder {
	color: inherit;
	opacity: .7;
}

/* Social icons inside the stack */
.wamda-hb .wamda-social {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wamda-hb .wamda-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: calc( var( --wamda-topbar-icon, 18px ) + 14px );
	height: calc( var( --wamda-topbar-icon, 18px ) + 14px );
	border-radius: 50%;
	color: inherit;
	font-size: var( --wamda-topbar-icon, 18px );
	background: rgba( 255, 255, 255, .1 );
	transition: background-color .18s ease, transform .18s ease, color .18s ease;
}

.wamda-hb .wamda-social__link:hover {
	background: rgba( 255, 255, 255, .22 );
	color: var( --wamda-topbar-hover, #fff );
	transform: translateY( -1px );
}

/* Inline dark-mode toggle */
.wamda-dark-toggle--inline {
	position: static;
	inset: auto;
	width: calc( var( --wamda-topbar-icon, 18px ) + 14px );
	height: calc( var( --wamda-topbar-icon, 18px ) + 14px );
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	background: rgba( 255, 255, 255, .12 );
	color: inherit;
	cursor: pointer;
	box-shadow: none;
}

.wamda-dark-toggle--inline:hover {
	background: rgba( 255, 255, 255, .24 );
}

.wamda-dark-toggle--inline .wamda-dark-toggle__icon::before {
	content: '\1F319';
	font-size: .95em;
	line-height: 1;
}

.wamda-html,
.wamda-hb__html {
	min-width: 0;
}

/* ---------------------------------------------------------------- top bar */
.wamda-topbar {
	position: relative;
	z-index: 60;
	min-height: var( --wamda-topbar-h, 44px );
	display: flex;
	align-items: center;
	background: var( --wamda-topbar-bg, #0f172a );
	color: var( --wamda-topbar-color, #e2e8f0 );
}

.wamda-topbar--gradient {
	background: linear-gradient( 90deg, var( --wamda-topbar-bg, #0f172a ), var( --wamda-topbar-bg2, #2563eb ) );
}

.wamda-topbar--soft {
	background: color-mix( in srgb, var( --wamda-topbar-bg, #0f172a ) 12%, #fff );
	color: var( --wamda-topbar-bg, #0f172a );
}

.wamda-topbar--glass {
	background: rgba( 15, 23, 42, .6 );
	-webkit-backdrop-filter: blur( 10px );
	backdrop-filter: blur( 10px );
}

.wamda-topbar--dark {
	background: #0b1120;
	color: #e2e8f0;
}

.wamda-hb--border {
	border-block-end: 1px solid var( --wamda-topbar-border, rgba( 255, 255, 255, .12 ) );
}

.wamda-hb--sticky {
	position: sticky;
	top: 0;
}

.wamda-topbar .wamda-hb__inner {
	min-height: var( --wamda-topbar-h, 44px );
}

/* The ticker borrows the top-bar palette when it sits inside it. */
.wamda-topbar .wamda-ticker {
	background: transparent;
	border: 0;
	box-shadow: none;
	min-height: 0;
	width: 100%;
}

.wamda-topbar .wamda-ticker__inner {
	padding-inline: 0;
	max-width: none;
}

/* Two-row variant: news drops to its own line. */
.wamda-topbar--two_rows .wamda-hb__inner {
	flex-wrap: wrap;
	row-gap: 4px;
	padding-block: 6px;
}

.wamda-topbar--two_rows .wamda-hb__zone--center {
	flex-basis: 100%;
	order: 3;
	justify-content: center;
}

/* --------------------------------------------------------- header builder */
.wamda-header {
	position: relative;
	z-index: 50;
	background: var( --wamda-header-bg, #fff );
	color: var( --wamda-header-text, #0f172a );
	font-size: inherit;
}

.wamda-header .wamda-hb__inner {
	padding-block: var( --wamda-header-pad, 20px );
	gap: clamp( 12px, 2.4vw, 32px );
}

.wamda-header--shadow {
	box-shadow: 0 10px 30px -22px rgba( 15, 23, 42, .45 );
}

.wamda-header--sticky {
	position: sticky;
	top: 0;
}

.wamda-header--transparent {
	background: transparent;
	box-shadow: none;
}

.wamda-header--compact .wamda-hb__zone--center {
	flex: 0 1 auto;
	justify-content: flex-start;
}

.wamda-header--compact .wamda-hb__zone--end {
	flex: 1 1 auto;
}

.wamda-header .wamda-hb__branding {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.wamda-header .wamda-hb__branding img {
	display: block;
	height: auto;
	max-height: 56px;
	width: auto;
}

.wamda-hb__sitetitle {
	font-weight: 800;
	font-size: 1.35em;
	color: inherit;
	text-decoration: none;
}

.wamda-hb__tagline {
	font-size: .8em;
	opacity: .7;
}

/* Primary menu */
.wamda-hb__nav .wamda-hb__menu {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var( --wamda-header-menu-gap, 22px );
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var( --wamda-header-menu-fs, 16px );
}

.wamda-hb__menu li {
	position: relative;
	margin: 0;
}

.wamda-hb__menu a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var( --wamda-header-link, #0f172a );
	text-decoration: none;
	font-weight: 600;
	padding-block: 6px;
	transition: color .18s ease;
}

.wamda-hb__menu a:hover,
.wamda-hb__menu .current-menu-item > a,
.wamda-hb__menu .current-menu-ancestor > a {
	color: var( --wamda-header-link-hover, #2563eb );
}

/* Sub-menus */
.wamda-hb__menu .sub-menu {
	position: absolute;
	inset-inline-start: 0;
	top: calc( 100% + 10px );
	min-width: 210px;
	margin: 0;
	padding: 8px;
	list-style: none;
	background: var( --wamda-header-bg, #fff );
	border-radius: 14px;
	box-shadow: 0 24px 50px -28px rgba( 15, 23, 42, .5 );
	opacity: 0;
	visibility: hidden;
	transform: translateY( 8px );
	transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
	z-index: 5;
}

.wamda-hb__menu li:hover > .sub-menu,
.wamda-hb__menu li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY( 0 );
}

.wamda-hb__menu .sub-menu .sub-menu {
	top: -8px;
	inset-inline-start: 100%;
}

.wamda-hb__menu .sub-menu a {
	display: flex;
	padding: 8px 10px;
	border-radius: 9px;
	font-weight: 500;
}

.wamda-hb__menu .sub-menu a:hover {
	background: rgba( 37, 99, 235, .08 );
}

/* The relocated mobile-menu bar (CTA + hamburger) sits in this slot. */
.wamda-hb__cta-slot {
	display: flex;
	align-items: center;
	gap: 10px;
}

/* ------------------------------------------------------------- responsive */
.wamda-hb--hide-mobile {
	display: none;
}

@media ( min-width: 782px ) {
	.wamda-hb--hide-mobile {
		display: flex;
	}

	.wamda-hb--hide-desktop {
		display: none;
	}
}

@media ( max-width: 1024px ) {
	.wamda-header .wamda-hb__nav {
		display: none;
	}

	.wamda-header .wamda-hb__zone--center:empty,
	.wamda-header .wamda-hb__zone--center > .wamda-hb__el--menu {
		display: none;
	}
}

@media ( max-width: 782px ) {
	.wamda-hb--wrap .wamda-hb__inner {
		flex-wrap: wrap;
		row-gap: 6px;
		padding-block: 8px;
		justify-content: center;
	}

	.wamda-hb--wrap .wamda-hb__zone {
		flex-wrap: wrap;
		justify-content: center;
	}

	.wamda-hb--wrap .wamda-hb__zone--center {
		flex-basis: 100%;
		order: 3;
	}

	.wamda-hb__search {
		max-width: 150px;
	}

	.wamda-topbar {
		font-size: calc( var( --wamda-topbar-fs, 14px ) - 1px );
	}
}

/* Dark scheme: soften the built header surfaces. */
.wamda-dark .wamda-header {
	background: #0b1120;
	color: #e6edf7;
}

.wamda-dark .wamda-hb__menu a {
	color: #e6edf7;
}

.wamda-dark .wamda-hb__menu .sub-menu {
	background: #111a2e;
}

/* =====================================================================
   5.0.21 — the menu button is one of the header buttons (mobile only)
   It inherits .wamda-hb__btn + .wamda-hb__btn--* exactly like the booking
   and account buttons; only the <button> reset and the icon swap are here.
   ===================================================================== */

button.wamda-hb__btn {
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

button.wamda-hb__btn--outline {
	border: 1px solid currentColor;
}

.wamda-hb__mtoggle .wamda-hb__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.15em;
	height: 1.15em;
	color: inherit;
}

.wamda-hb__mtoggle .wamda-hb__icon svg,
.wamda-hb__mtoggle .wamda-hb__icon img {
	width: 1em;
	height: 1em;
}

/* Exactly one glyph at a time: menu when closed, close when open. */
.wamda-hb__mtoggle > .wamda-hb__mtclose {
	display: none;
}

.wamda-hb__mtoggle[aria-expanded="true"] > .wamda-hb__mticon {
	display: none;
}

.wamda-hb__mtoggle[aria-expanded="true"] > .wamda-hb__mtclose {
	display: inline-flex;
}

/* The wrapper keeps the same rhythm as the sibling icons. */
.wamda-hb__el--mtoggle {
	display: inline-flex;
	align-items: center;
}

/* =====================================================================
   5.0.22 — the menu button replaces the old mobile bar completely
   ===================================================================== */

.wamda-header-actions {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-inline-start: auto;
}

.wamda-hb__mtoggle--float {
	position: fixed;
	inset-block-end: 18px;
	inset-inline-end: 18px;
	z-index: 9990;
	box-shadow: 0 12px 30px -12px rgba( 0, 0, 0, .5 );
}

/* The old bar must never render again, whatever cached markup exists. */
.wamda-menu-bar,
.wamda-menu-toggle:not([data-wamda-menu-toggle]) {
	display: none !important;
}

/* ---------------------------------------------------------------- 5.0.23
   Fixed builder: logo + main menu + independent action buttons.
   ---------------------------------------------------------------------- */
.wamda-hb__zone{display:flex;align-items:center;min-width:0}
.wamda-hb__zone--center{flex:1 1 auto;justify-content:center}
.wamda-hb__zone--end{justify-content:flex-end;gap:var(--wamda-hb-btn-gap,10px)}
.wamda-hb__actions{display:flex;align-items:center;gap:var(--wamda-hb-btn-gap,10px);flex-wrap:nowrap}
.wamda-hb__actions .wamda-hb__btn{border-radius:var(--wamda-hb-btn-radius,999px)}
.wamda-hb__actions .wamda-hb__icon,
.wamda-hb__actions .wamda-hb__icon svg,
.wamda-hb__actions .wamda-hb__icon img{width:var(--wamda-hb-btn-icon,18px);height:var(--wamda-hb-btn-icon,18px);font-size:var(--wamda-hb-btn-icon,18px)}
.wamda-hb__actions .wamda-hb__btn--icon,
.wamda-hb__actions .wamda-hb__btn--t-menu.wamda-hb__btn--icon{padding:8px;aspect-ratio:1/1;justify-content:center}
.wamda-hb__lang{display:inline-flex;align-items:center;gap:6px}
.wamda-header--compact .wamda-hb__zone--center{justify-content:flex-start;flex:0 1 auto}
.wamda-header--compact .wamda-hb__zone--end{flex:1 1 auto}
