/* ADVERTISING PAGE */
.filter-container {
display:grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 15px; /* Space between dropdowns and buttons */
  /* padding: 10px; */
  max-width: 100%; /* Prevent overflow */
}
/* Buttons wrapper */
.filter-buttons {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 10px; /* Space between buttons */
}

/* Styling the 'Göster' button */
.show-button {
  background-color: var(--crimsonPink);
  color: white;
  padding: 10px 16px;
  min-width: 100%;
  height: 57px;
  border: 1px solid transparent;
  margin: 0 auto;
  border-radius: 17px;
  display: block;
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.show-button:hover {
  background-color: transparent;
  border-color:var(--crimsonPink);
  color:var(--crimsonPink);
}

/* Styling the 'Sıfırla' button */
.reset-button {
  background-color: var(--midnightBlue);
  color: white;
  padding: 10px 16px;
  min-width: 100%;
  margin: 0 auto;
  height: 57px;
  display: block;
  border: 1px solid transparent;
  border-radius: 17px;
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.reset-button:hover {
  background-color: transparent;
  border-color:var(--midnightBlue);
  color:var(--midnightBlue);
}
.filter_selection {
  display: grid;
      width: 100%;
  gap: 10px;
  grid-template-columns: repeat(1, 1fr);
}
.dropdown-container {
  position: relative;
  width: 100%;
}
.dropdown-toggle {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  position: relative;
  height: 57px;
  width:100%;
  margin: 0 auto;
  min-width: 100%;
  overflow:hidden;
  outline: none;
  border: 1px solid #ccc;
  border-radius: 17px;
  background-color: #fff;
  font-size: 14px;
  cursor: pointer;
}
.dropdown-toggle i {
  position: absolute;
  right: 10px;
}

.dropdown-input {
    width: 91%;
    font-size:13px;
    outline: none;
    border: none;
    position: absolute;
    inset: 0;
    padding: 6px 10px;
    height: 100%;
}

.dropdown-list {
  display: none;
  position: absolute;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  top: 100%;
  left: 0;
  width: 100%;
  margin-top: 10px;
  min-width:260px;
  padding: 10px 0;
  list-style: none;
  border: 1px solid #fff;
  border-radius: 8px;
  background-color: #fff;
  max-height: 250px;
  overflow-y: auto;
  z-index: 100;
}
.dropdown-list.active {
  display: block;
}
.dropdown-list::-webkit-scrollbar {
  height: 2px;
  width: 4px;
}

.dropdown-list::-webkit-scrollbar-track {
  border-radius: 2px;
  background: #f8f8f8;
}

.dropdown-list::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 2px;
}
.dropdown-list .dropdown-item {
  padding: 10px;
  cursor: pointer;
  font-size:13px;
  font-weight:400;
}

.dropdown-list .dropdown-item:hover {
  background-color: #FF3359;
  color:white;
}


@media screen and (min-width:576px){
    .filter_selection{
          grid-template-columns: repeat(2, 1fr);
    }
    .filter-buttons {
          grid-column: span 4;
    }
  
}
@media screen and (min-width:992px){
    .filter_selection{
          grid-template-columns: repeat(4, 1fr);
          grid-column: span 8;
    }
      .filter-container{
              gap: 50px;
       grid-template-columns: repeat(12, 1fr);
    }
}