/* 20.01.2022 в связи с разработкой мобильной версии было принято решение об организации стилей:
1) Отступить от стандартной файловой структуры проекта БЭМ, которая подразумевает наличие уровней
переопределения при разделении проекта на платформы (например: mobile, desktop)
2) Создать отдельные папки с независимыми друг от друга стилями для desktop и mobile
учитывая, что при этом будет происходить copy-paste
Ссылка на документацию БЭМ для разделения проекта на платформы:
https://ru.bem.info/methodology/redefinition-levels */


.info{
	width: 18px;
	height: 18px;

	background: url("../../img/icons/icon-info-gray-17x17.svg") center no-repeat;
}
.info:hover{
	background: url("../../img/icons/icon-info-black-17x17.svg") center no-repeat;
}


/* word-candidate */
.word-candidate{
	padding: 3px 4px;
	line-height: 1;
	border-radius: 2px;
}
.word-candidate--yellow{
	background-color: rgba(255, 219, 77, 0.5);
}


/* bottom-panel */
.bottom-panel{
	display: none;

	position: fixed;

	bottom: 15px;
	left: 15px;

	z-index: 99;
}
.bottom-panel--show{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.bottom-panel__btn{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;


	font-family: inherit;
	border: 0;
    text-decoration: none;
    cursor: pointer;

	padding: 10px;

	-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1), 0px 10px 20px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1), 0px 10px 20px rgba(0, 0, 0, 0.2);
	border-radius: 2px;
}
.bottom-panel__btn + .bottom-panel__btn{
	margin-left: 10px;
}
.bottom-panel__btn--purple{
	background-color: #8D67CC;
}
.bottom-panel__btn--red{
	background-color: #C80000;
}
.bottom-panel__icon-arrow{
	display: block;

	width: 10px;
	height: 11px;

	background: url("../../img/icons/arrow-right-white-10x11.svg") center no-repeat;
}
.bottom-panel__text{
	margin: 0 10px;
	font-family: 'Exo 2', sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: calc(16.8/14);
	color: #FFFFFF;
}
.bottom-panel__icon-key{
	padding: 2px 5px;
	font-size: 13px;
	line-height: 1.23;
	color: rgba(255,255,255,.6);
	border: 1px solid rgba(255,255,255,.6);
	border-radius: 4px;
}

