﻿.sideSearchComponent {
  font-size: 18px;
  line-height: 24px;
}
    .sideSearchComponent .title {
        font-size: 20px;
        line-height: 26px;
        color: var(--mainTitleColor);
        padding-bottom: 8px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
        margin-bottom: 12px;
    }
    .sideSearchComponent .titleNoLine {
        font-size: 20px;
        line-height: 26px;
        color: var(--mainTitleColor);
    }
.sideSearchComponent .searchContainer {
  display: flex;
  flex-direction: column;
  padding: 0;
  /* override */
  /* override */
}
.sideSearchComponent .searchContainer .selectInputContainer {
  margin-bottom: 10px;
}
.sideSearchComponent .searchContainer .selectInputContainer .selectTitle {
  padding: 0 16px 8px 0;
  padding-inline-start: 16px;
  padding-inline-end: 0;
}
.sideSearchComponent .searchContainer .selectInputContainer input,
.sideSearchComponent .searchContainer .selectInputContainer select {
  width: 100%;
  height: 34px;
  line-height: 34px;
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.5019607843);
  padding: 0 16px;
}
.sideSearchComponent .searchContainer .selectInputContainer .selectDropdown .option {
  padding: 4.5px 16px;
}
.sideSearchComponent .searchContainer .buttons {
  display: flex;
  align-items: center;
  align-self: flex-end;
  margin-inline-start: auto;
  margin-top: 6px;
}
.sideSearchComponent .searchContainer .buttons .clearBtn {
  font-size: 14px;
  color: var(--textColor);
  padding: 0 24px;
  font-weight: 700;
}
.sideSearchComponent .searchContainer .buttons .searchBtn {
  /* box-shadow: none;
   background-color: $buttonColor;
   border-radius: 2px;
   padding: 5px 24px;
   font-size: 14px;
   font-weight: 700;
   color: $white;
   border: none;*/
}
.sideSearchComponent .searchContainer .selectField {
  position: relative;
  background-image: url("/img/tum.img/angle-arrow-down-black.svg");
  background-size: 12px;
  background-repeat: no-repeat;
  background-position: center center;
  background-position-x: 18px;
}
.sideSearchComponent .searchContainer .selectField.toggle {
  border-radius: 2px 2px 0 0;
  background-image: url("/img/tum.img/angle-arrow-up-black.svg");
}
.sideSearchComponent .searchContainer .selectField .selectBtn {
  width: 100%;
  background-color: transparent;
  color: var(--textColor);
  border: 1px solid rgba(0, 0, 0, 0.5019607843);
  border-radius: 2px;
  cursor: pointer;
  position: relative;
  height: 34px;
  line-height: 32px;
  padding: 0 16px;
}
.sideSearchComponent .searchContainer .selectField .selectBtn.toggle {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.sideSearchComponent .searchContainer .selectField .selectDropdown {
  position: absolute;
  top: 100%;
  width: 100%;
  border: 1px solid rgba(0, 0, 0, 0.5019607843);
  border-top: 0;
  border-radius: 0 0 2px 2px;
  overflow: hidden;
  background: #fff;
  z-index: 1;
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0);
  -webkit-transform-origin: top center;
  transform-origin: top center;
  visibility: hidden;
  transition: 0.2s ease;
}
.sideSearchComponent .searchContainer .selectField .selectDropdown .option {
  padding: 8px 16px;
  cursor: pointer;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.sideSearchComponent .searchContainer .selectField .selectDropdown .option:last-child {
  border-bottom: none;
}
.sideSearchComponent .searchContainer .selectField .selectDropdown .option:hover {
  background-color: #143f7c;
  color: #fff;
}
.sideSearchComponent .searchContainer .selectField .selectDropdown.toggle {
  z-index: 100;
  visibility: visible;
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}
.sideSearchComponent.sideSearch2 .searchContainer {
  padding: 4px 0 0 0;
}
.sideSearchComponent.sideSearch2 .searchContainer .selectInputContainer {
  margin-bottom: 10px;
}
.sideSearchComponent.sideSearch2 .searchContainer .selectInputContainer .selectTitle {
  padding: 0 0 8px 0;
}
.sideSearchComponent.sideSearch3 .searchContainer {
  padding: 0;
}

/* override */
@media screen and (max-width: 1199px) {
  .selectField {
    background-position-x: 14px;
  }
  .selectField .selectBtn {
    padding: 0 12px;
  }
  .selectField .selectDropdown .option {
    padding: 8px 12px;
  }
}
