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

/* label */
.label{
    display: block;

    font-family: 'Exo 2', sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: calc(17/14);
    color: #000000;
}
.label--mb{
    margin-bottom: 2px;
}
.label--mb4{
    margin-bottom: 4px;
}
.label--fz12{
    font-size: 12px;
}

/* label--required */
.label--required{
    position: relative;

    display: inline-block;
}
.label--required::after{
    position: absolute;
    content: "*";

    display: block;

    top: 0;
    right: -10px;

    width: 10px;
    height: 10px;

    font-size: 14px;

    color: #C80000;
}
.label--no-required{
    color: #888888;
}





/* select */
.select{
    width: 100%;
    height: 28px;

    padding: 0 1.846em 0 0.923em;

    font-size: 13px;
    font-weight: 400;
    color: #000;
    line-height: calc(16/13);

    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 2px;

    cursor: pointer;
}
.select:disabled{
    border: 1px solid rgba(0, 0, 0, 0.1);

    pointer-events: none;
}




/* select-generate-report */
.select-generate-report{
    height: 29px;

    padding: 0 0.923em 0 0.923em;

    font-size: 13px;
    font-weight: 400;
    color: #000;
    line-height: calc(16/13);

    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 2px;

    cursor: pointer;
}
.select-generate-report:disabled{
    background: rgba(0, 0, 0, 0.2);
    cursor: not-allowed;
}



/* select-grouping */
.select-grouping{
    height: 23px;

    padding: 0 5px;

    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 2px;

    cursor: pointer;
}






/* сброс стилей input type:number */
.input-number-reset{
	display: inline-block;
	padding: 0;
	margin: 0;
	border: none;

	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-moz-appearance: textfield;
}
.input-number-reset::-webkit-outer-spin-button,
.input-number-reset::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
.input-number-reset:hover,
.input-number-reset:focus{
	-moz-appearance: number-input;
}

/* сброс стилей input type:search */
.input-search-reset::-webkit-search-cancel-button {
    -webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-moz-appearance: textfield;

    opacity: 0;
    pointer-events: none;
}

.input-search-reset:focus::-webkit-search-cancel-button {
    -webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-moz-appearance: textfield;
    
    opacity: 0;
    pointer-events: none;
}


/* Input */
.input{
    width: 100%;
    padding: .462em .923em;
    font-family: inherit;
    font-size: 13px;
    color: #000;
    font-weight: 400;
    line-height: calc(16/13);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 2px;
    background-color: #FFFFFF;
}
.input--now100{
    width: auto;
}
.input--maxw400{
    max-width: 400px;
}
.input--w90{
    width: 90px;
}
.input--pr34{
    padding-right: 34px;
}




/* textarea */
.textarea {	
	resize: none;

	padding: 16.5px 14px;

	border: 1px solid rgba(0, 0, 0, 0.23);

	background: #FFFFFF;
	border-radius: 8px;

	font-family: 'Exo 2', sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: calc(20/14);
	color: #000000;

    transition: border .2s linear, box-shadow .2s linear;

    scrollbar-width: thin;
    /* не стилизуем цвет скроллбара и ползунка */
    /* чтобы не терять эффект ховера в блинк-браузерах */
}
.textarea::placeholder {
	font-family: 'Exo 2', sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: calc(20/14);
	color: #888888;
}
.textarea:hover {
    border: 1px solid #b2b2b2;
}
.textarea:focus {
	outline: none;
	border: 1px solid #fac000;
    box-shadow: #fac000 0px 0px 0px 1px;
}