/* Переключатель языка: в меню шапки, в мобильной панели и в подвале. Токены из design.css.
   Тема Gillion навязывает пунктам меню свой Montserrat и line-height 40px. В Montserrat нет иврита,
   поэтому «עב» рисовался системным фолбэком и выглядел инородно, а высокий line-height сдвигал текст
   внутри пилюли. Поэтому шрифт, кегль и интерлиньяж задаём здесь принудительно. */

.msi-langs { display: inline-flex; align-items: center; gap: 6px; }

.msi-lang {
	display: inline-flex; align-items: center; justify-content: center;
	box-sizing: border-box; min-width: 44px; height: 32px; padding: 0 12px;
	border: 1px solid #D3DAE6; border-radius: 999px;
	font-family: 'Rubik', 'Heebo', 'Assistant', 'Arial Hebrew', 'Noto Sans Hebrew', system-ui, sans-serif !important;
	font-size: 13px !important; font-weight: 600 !important; line-height: 1 !important;
	letter-spacing: .02em; text-decoration: none; text-transform: none !important;
	color: var(--ms-navy); background: #EDF1F7;
	transition: color .15s, background .15s, border-color .15s;
}
/* У ивритской метки свой стек: латинские шрифты интерфейса иврит не покрывают (Heebo для неивритских
   языков дозаказан в msi_fonts_url). Кегль крупнее и вес выше: у ивритских букв нет верхних и нижних
   выносных, при одном размере с латиницей они выглядят мельче и тоньше. */
.msi-lang[lang="he"], .msi-lang[hreflang="he"] {
	font-family: 'Rubik', 'Heebo', 'Assistant', 'Arial Hebrew', 'Noto Sans Hebrew', system-ui, sans-serif !important;
	font-size: 16px !important; font-weight: 700 !important; padding-top: 4px;
}
.msi-lang:hover { color: var(--ms-navy); border-color: var(--ms-navy); background: var(--ms-surface); }
.msi-lang.is-current { background: var(--ms-navy); border-color: var(--ms-navy); color: #fff; }
.msi-lang.is-current:hover { background: var(--ms-navy-2); border-color: var(--ms-navy-2); color: #fff; }
.msi-lang-name { display: none; }

/* в меню шапки — только коды языков, места мало.
   Пункт меню у темы высотой во всю строку (60px), а наш — по высоте пилюли, поэтому переключатель
   «висел» выше подписей меню: растягиваем li и центрируем содержимое по вертикали. */
/* Меню темы — display:table с пунктами float:left и line-height 60px у ссылок: ни align-self, ни
   height:100% там не работают. Поэтому пункт переключателя получает ту же высоту строки и центрирует
   пилюли сам. Высота вынесена в переменную: поменяется шапка — правим в одном месте. */
ul.sh-nav > li.msi-langs-item { float: left; height: var(--ms-navbar-h, 60px); }
ul.sh-nav > li.msi-langs-item, .msi-langs-item { display: flex; align-items: center; }
.msi-langs--menu { margin-inline-start: 18px; }

/* в подвале — коды и полные названия */
.msi-langs-footer { background: var(--ms-surface); border-top: 1px solid var(--ms-border); padding: 14px 24px; text-align: center; }
.msi-langs--footer { gap: 8px; flex-wrap: wrap; justify-content: center; }
.msi-langs--footer .msi-lang { height: 34px; gap: 8px; min-width: 0; padding: 0 14px; font-size: 14px !important; }
.msi-langs--footer .msi-lang-name { display: inline; font-weight: 600; }

/* Мобильная панель темы (.sh-nav-mobile) раскладывает пункты по-своему: ссылки блочные, со своим
   line-height и отступами, из-за чего пилюли наезжали друг на друга и текст уезжал за край.
   Поэтому здесь геометрия задаётся явно. */
@media (max-width: 991px) {
	li.msi-langs-item, .msi-langs-item {
		display: flex !important; float: none !important; width: 100%;
		justify-content: center; align-items: center; height: auto !important; padding: 14px 0 !important;
	}
	/* разделитель пунктов тема рисует абсолютным li::after — у нашего пункта он проходил
	   ровно по центру пилюль и перечёркивал метки языков */
	li.msi-langs-item::after, li.msi-langs-item::before { display: none !important; content: none !important; }
	.msi-langs--menu { margin: 0 !important; gap: 10px; }
	.msi-langs--menu .msi-lang {
		display: inline-flex !important; float: none !important; position: static !important;
		width: auto !important; min-width: 54px; height: 36px !important; margin: 0 !important;
		padding: 0 14px !important; font-size: 14px !important; line-height: 1 !important;
	}
	.msi-langs--menu .msi-lang[lang="he"] { font-size: 16px !important; padding-top: 3px !important; }
}

/* Превью для администратора: язык заведён, но ещё не открыт публично (msi_langs_live). */
.msi-lang.is-draft { border-style: dashed; color: var(--ms-muted, #6b7280); background: transparent; }
.msi-lang.is-draft:hover { border-color: var(--ms-navy); color: var(--ms-navy); }
.msi-lang.is-draft.is-current { background: var(--ms-muted, #6b7280); border-color: var(--ms-muted, #6b7280); color: #fff; }
.msi-langs-note { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: var(--ms-muted, #6b7280); }

/* Тема гасит фон ссылок меню правилом `html .menu-item a{background:transparent!important}` и красит их своим
   серым — внутри переключателя (шапка, мобильная панель, подвал) возвращаем свои цвета. !important только на фон. */
.msi-langs .msi-lang { color: var(--ms-navy) !important; background: #EDF1F7 !important; }
.msi-langs .msi-lang:hover { color: var(--ms-navy) !important; border-color: var(--ms-navy); background: var(--ms-surface) !important; }
.msi-langs .msi-lang.is-current { background: var(--ms-navy) !important; border-color: var(--ms-navy); color: #fff !important; }
.msi-langs .msi-lang.is-draft { color: var(--ms-muted, #6b7280); background: transparent !important; }
/* текущий язык всегда залит, даже если он ещё не открыт публично */
.msi-langs .msi-lang.is-draft.is-current { background: var(--ms-navy) !important; border-color: var(--ms-navy); color: #fff; }
.msi-langs .msi-lang.is-draft:hover { color: var(--ms-navy); }
