body {
  padding: 5px 30px;
  max-width : 500px;
  min-width : 300px;
  margin: 0 auto;
}

.form-control {
  border-color: var(--bs-gray-500);
}

.form-control:valid:focus, .form-control.is-valid:focus {
  border-color: var(--bs-gray-700);
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0);
}

.btn-primary {
  background-color: #337ab7;
  border-color: #2e6da4;
  --bs-btn-disabled-bg: #337ab7;
}

.btn-primary:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.form-check {
  line-height: 1.45rem;
  min-height: 0.8rem;
  max-height: 0.8rem;
  height: 0.8rem !important;
}

.form-check-label {
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.col-sm {
  max-width: 50%;
  padding-right: 1px;
  padding-left: 1px;
  overflow: hidden;
}

.options_div {
  margin-top: 20px;
}

#browsebutton {
  --bs-btn-bg: var(--bs-gray-100);
  --bs-btn-color: var(--bs-gray-800);
  --bs-btn-border-color: var(--bs-gray-500);
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--bs-gray-300);
  --bs-btn-hover-border-color: var(--bs-gray-800);
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #516f8c;
  --bs-btn-active-border-color: #000;
}

#input_div {
  padding-left: 5px;
  padding-right: 2px;
}

#file-selector {
    display: none;
}

#make_button_div {
  padding-left: 2px;
  padding-right: 5px;
}

.btn-primary {
  --bs-btn-hover-bg: #337ab7;
  --bs-btn-focus-box-shadow: none;
}

#ingredients_list {
  color:#132c3b;
  text-decoration: underline;
  text-decoration-style: dotted;
  cursor: pointer;
}

#img_cocktail {
  width: auto;
  height: auto;
  min-height: 200px;
  max-height: 640px;
  min-width: 50%;
  object-fit: contain;
  border: none;
  user-select: none;
}

#github_link {
  color: #2a6181
}

#github_link_div {
  margin-top: 20px;
}

#generative_model_link {
  color: #2a6181
}