.meta_inputs_container {
  margin-top: 20px;
  display: flex;
}

.meta_inputs {
  flex: 1;
  display: grid;
  grid-template-columns: 10fr 9fr;
  margin-right: 20px;
  gap: 0px 10px;
}

.time_controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0px 10px;
}

.copy_link_container {
  position: relative;
  width: 100%;
  max-width: 750px;
  margin-top: 50px;
  height: 50px;
  border-radius: 7px;
}

.copy_link_container input {
  height: 100%;
  width: 100%;
  border-radius: inherit;
  background: var(--secondary-color);
  outline: none;
  border: none;
  font-size: 16px;
  color: var(--text-color);
  padding: 0px 20px;
}
.copy_icon {
  position: absolute;
  top: 50%;
  right: 0px;
  padding: 0px 18px;
  cursor: pointer;
  border-top-right-radius: inherit;
  border-bottom-right-radius: inherit;
  transform: translateY(-50%);
  background: var(--secondary-color);
  height: 100%;
  color: var(--text-color);
  border: none;
  outline: none;
}

.main_inputs_container {
  display: grid;
  /* grid-template-columns: 3fr 1fr 1fr; */
  grid-template-columns: 3fr 2fr;
  align-items: flex-start;
  gap: 0px 10px;
}
.main_inputs_container_dropdowns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.description_input {
  margin-top: 20px;
}
.title_input {
  margin-bottom: 20px;
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 0px 10px;
}

.host_name_form_control {
  position: relative;
}

.host_auto_complete {
  position: absolute;
  z-index: 10;
  margin-top: 5px;
  width: 100%;
  list-style: none;
  background: var(--secondary-color);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--box-shadow-dark);
  max-height: 250px;
  overflow-y: scroll;
}
.host_auto_complete::-webkit-scrollbar {
  width: 5px;
}
.host_auto_complete::-webkit-scrollbar-track {
  background: inherit;
}
.host_auto_complete::-webkit-scrollbar-thumb {
  background-color: var(--text-color-secondary);
  border-radius: 10px;
}
.host_auto_complete li {
  display: flex;
  align-items: center;
  padding: 5px;
  cursor: pointer;
}
.host_auto_complete li:hover {
  background: var(--component-color);
}
.host_profile_image {
  height: 65px;
  width: 45px;
  margin-right: 10px;
}
.host_name {
  font-size: 14px;
  font-weight: 500;
}

@media screen and (max-width: 870px) {
  .meta_inputs_container {
    flex-direction: column;
    margin: 0px;
  }
  .meta_inputs_container button {
    width: 100% !important;
    margin-top: 10px;
  }

  .meta_inputs {
    margin: 20px 0px;
  }
  .meta_inputs .form_control div {
    /* height: auto !important; */
  }
  .meta_inputs .time_controls .time_control div {
    height: auto !important;
  }
}

@media screen and (max-width: 550px) {
  .meta_inputs {
    grid-template-columns: 1fr;
    gap: 28px 0px;
  }

  .time_controls .time_control div {
    width: 100%;
  }
  .main_inputs_container {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}
