/* SELECT */

:root {
  /* ===== Серые №0  ===== */
  --select-default-width: 100%;
  --select-default-height:40px;
  --select-default-lineheight:40px;
  --select-default-font-size:16px;
  --select-shadow: 0px 5px 10px 0px rgba(154, 96, 76, 0.75);

  --select-border-color: #BBBBBB;
  --select-border-color-hover: #e5a089;
  --select-border-color-active: #e5a089;
  --select-border-radius: 25px;
  --select-border-radius-active: 25px 25px 0 0;

  --select-background : #FFFFFF;
  --select-background-hover : #FFE2D9;
  --select-background-active :#FFE2D9;

  --select-ico-up: url("/images/icons/s-cau.svg");
  --select-ico-down: url("/images/icons/s-cad.svg");
  --select-ico-group-up: url("/images/icons/s-g-cau.svg");
  --select-ico-group-down: url("/images/icons/s-g-cad.svg");
  --select-ico-search: url("/images/icons/s-search.svg");

  --select-color:#434343;
  --select-color-active:#434343;
  --select-padding:0px 0px 0px 0px;


  --select-input-color:blue;
  --select-text-font: Roboto;
  --select-text-size: 16px;
  --select-option-font: Roboto;

  --select-group-font: Roboto;
  --select-group-padding-left: 35px;

  --select-group-font: Roboto;
  --select-group-font-size: 14px;
  --select-group-font-active: Roboto Medium;
  --select-group-background: #fff;
  --select-group-background-hover:#FFE4D9;
  --select-group-background-active:#FFE4D9;

  --select-option-font: Roboto;
  --select-option-font-active: Roboto Medium;
  --select-option-background: #FFF;
  --select-option-background-hover: #FFE4D9;
  --select-option-background-active: #FFE4D9 ;
  --select-option-lineheight : 40px;
}

.IT4Select {
  display: inline-block;
  width: var(--select-default-width);
  max-height: var(--select-default-height);
  position: relative;
  padding: var(--select-padding);
  vertical-align: top;
  text-align: left;
  border-radius: var(--select-border-radius);
}

.IT4CI {
  display: block;
  line-height: var(--select-default-lineheight);
  padding: 0 40px 0 15px;
  overflow: hidden;
  font-size: var(--select-default-font-size);
  height: var(--select-default-height);
  width: var(--select-default-width);
  font-family: var(--select-text-font);
  border-radius: var(--select-border-radius);
  color: var(--select-color);
  background-repeat: no-repeat;
  background-position-x: calc(100% - 10px);
  background-color: var(--select-background);
  background-image: var(--select-ico-down);
  background-size: 30px;
  background-position-y: center;
  text-align: left;
}

.Color .IT4CI {
  background-color: var(--select-background-hover);
}

.IT4Select.OpenList .IT4CI {
  background-color: var(--select-background-active);
  color: var(--select-color-active);
  border-color: var(--select-border-color-hover);
  background-image: var(--select-ico-up);
  margin-top: -1px;
  margin-left: -1px;
  width: calc(100% + 2px);
  -webkit-box-shadow: var(--select-shadow);
  -moz-box-shadow: var(--select-shadow);
  box-shadow: var(--select-shadow);
  position: absolute;
  top: 0;
  overflow: hidden;
  padding-right: 40px;
  display: block;
}

.IT4CI:hover {
  background-color: var(--select-background-hover);
  cursor: pointer;
}

.IT4SI {
  display: none;
}

.IT4SOption {
  top: -20px;
  position: relative;
  z-index: 10;
  display: none;
  border-radius: 0 0 20px 20px;
  background: #fff;
  width: 100%;
  overflow-x: hidden;
  max-height: 400px;
  padding: 30px 5px 5px 5px;
}

input.IT4FO:focus {
  background-color: #fff;
}

input.IT4FO::placeholder {
  color: #434343;

}

.IT4SOption.OpenList {
  display: block;
  -webkit-box-shadow: var(--select-shadow);
  -moz-box-shadow: var(--select-shadow);
  box-shadow: var(--select-shadow);
}

.IT4SOption .SelectOption {
  margin-left: 5px;
}

.SelectOption, .MultiSelectOption {
  font-size: var(--select-default-font-size);
  display: block;
  padding:5px;
  line-height: 20px;
  border-radius: 5px;
  background-color: var(--select-option-background);
  font-family: var(--select-option-font);
  margin: 2px 0;
  margin-left: 0px;
  color: #474747;
}

.SelectOption.SelectedItem {
  background-color: var(--select-option-background-active);
  font-family: var(--select-option-font-active);
}
.SelectOption:hover, .MultiSelectOption:hover {
  cursor: pointer;
  background-color: var(--select-option-background-hover);
}


.IT4SFind {
  padding: 0;
  display: none;
}

.IT4Select.OpenList .IT4SFind {
  display: block;
}

.IT4FO {
  display: block;
  font-size: var(--select-default-font-size);
  line-height: var(--select-default-lineheight);
  margin: 0px;
  padding: 0 40px 0 15px;
  width: 100%;
  border: none;
  background-image: var(--select-ico-search);
  background-repeat: no-repeat;
  background-size: 30px;
  background-position-x: calc(100% - 10px);
  background-position-y: center;
  background-color: #FFF5F2 ;
}

.SelectOption.IT4SHI, input[type="checkbox"] + label.MultiSelectOption.IT4SHI {
  display: none;
}

span.SelectOptGroup {
  font-size: var(--select-default-font-size);
  padding-left: var(--select-group-padding-left);
  line-height: 20px;
  font-family: var(--select-group-font);
  background-repeat: no-repeat;
  background-position-x: 5px;
  background-color: var(--select-background);
  background-image: var(--select-ico-group-down);
  background-size: 24px;
  background-position-y: 4px;
  margin: 2px 0;
  border-radius: 5px;
  display: block;
  text-transform: uppercase;
  padding-top: 5px;
  padding-bottom: 5px;
  color: #474747;
}

span.SelectOptGroup:hover {
  background-color: var(--select-group-background-hover);
  font-family: var(--select-group-font-active);
}

span.SelectOptGroup.SelectOpenGroup {
  background-image: var(--select-ico-group-up);
  font-family: var(--select-group-font-active);
}

.SelectGroupItem {
  display: none;
  padding-left: var(--select-group-padding-left);
}

.SelectGroupItem.SelectOpenGroup {
  display: block;
}

.IT4Select.OpenList .SelectPlacehold {
  z-index: 100;
  position: relative;
}

.IT4Select.OpenList .SelectPlacehold {
  display: block;
  border-radius: var(--select-border-radius);
  background-color: #FFF5F2;
  -webkit-box-shadow: var(--select-shadow);
  -moz-box-shadow: var(--select-shadow);
  box-shadow: var(--select-shadow);
  position: relative;
  padding-top: 40px;

}

input[type="checkbox"] + label.MultiSelectOption {
  background-image: url("/images/icons/s-chkbx.svg");
  display: block;
  background-size: 24px;
  background-repeat: no-repeat;
  background-position-y: center;
  background-position-x: 5px;
  line-height: 16px;
  padding: 10px;
  padding-left: 35px;
  min-height: 25px;
}
input[type="checkbox"].MultiSelectOption{
  display: none;
}

input[type="checkbox"]:checked + label.MultiSelectOption {
  background-image: url("/images/icons/s-chkbx-a.svg");
  background-color: var(--select-option-background-active);
}

input.IT4FO:focus{
  background-color: #FFF5F2;
}

.OptionALL {
  border-bottom: 1px solid;
}

.IT4CI:has(.SelectLogo) {
  padding-left: 5px;
}

.IT4CI .SelectLogo {
  width: 30px;
  height: 30px;
  margin-top: 5px;
}

.IT4CI .SelectLogo img {
  width: 30px;
}