/* Inline Arabic / English language switcher (header / menu) */
.sqp-lang,
.sqp-lang--inline { display: inline-flex; align-items: center; gap: 4px; vertical-align: middle; border: 1px solid rgba(0,0,0,.15); border-radius: 8px; padding: 3px; }
.sqp-switch-li-lang { display: inline-flex; align-items: center; }

/* The language buttons sit beside the currency inside one menu item, and the
   pair never breaks onto its own line under the header. */
.sqp-switch-li { display: inline-flex !important; align-items: center; gap: 8px; flex-wrap: nowrap; white-space: nowrap; }
.sqp-switch-li .sqp-lang { flex: 0 0 auto; }

.sqp-lang-btn { border: 0; background: none; padding: 5px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; line-height: 1; color: inherit; font-weight: 600; }
.sqp-lang-btn:hover { background: rgba(0,0,0,.07); }
.sqp-lang-btn.is-active { background: #111827; color: #fff; }

@media (max-width: 600px) {
	.sqp-lang-btn { font-size: 12px; padding: 5px 8px; }
}

/* Compact enough to share the row with the currency switcher. */
.sqp-switch-li .sqp-lang { padding: 2px; }
.sqp-switch-li .sqp-lang-btn { padding: 4px 9px; font-size: 12.5px; }

/* Once moved up beside the account link the row is roomier, so the pair can
   breathe a little and stay vertically centred with its neighbours. */
.sqp-switch-li.is-beside-account,
.sqp-switch-inline { display: inline-flex !important; align-items: center; gap: 8px; margin-inline-end: 10px; vertical-align: middle; }
.sqp-switch-li.is-beside-account > a { display: none; }

/* The strip that appears under the header when the menu that normally holds
   the switchers is hidden — the phone, most of the time. */
.sqp-switch-bar {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	padding: 7px 12px;
	background: #fff;
	border-bottom: 1px solid rgba( 0, 0, 0, .08 );
	position: relative;
	z-index: 20;
}
.sqp-switch-bar[hidden] { display: none; }
.sqp-switch-bar .sqp-cur,
.sqp-switch-bar .sqp-lang { flex: 0 0 auto; }
.sqp-switch-bar .sqp-cur-toggle { padding: 4px 9px; font-size: 13px; }
.sqp-switch-bar .sqp-lang { padding: 2px; }
.sqp-switch-bar .sqp-lang-btn { padding: 4px 9px; font-size: 12.5px; }

/* The menu never shows it on a phone, so keep the strip out of print too. */
@media print {
	.sqp-switch-bar { display: none !important; }
}
