/* #metric_category-id .options{ */
  /* background-color: #7ca4cf; */
  /* color: #ffffff; */
/* } */

/* #metric_category-id .Select--single .Select-value { */
  /* background-color: #7ca4cf; */
  /* color: #ffffff; */
/* } */

/* #metric_category-id .Select--single .Select-value-label { */
  /* color: #ffffff; */
/* } */
/* #metric_category-id .VirtualizedSelectFocusedOption { */
  /* background-color: #7ca4cf; */
  /* color: #ffffff */
/* } */
/* Make the modal tall and keep header/footer fixed with a scrollable body */
.tall-modal .modal-dialog {
  /* keep normal horizontal behavior (width controlled by size or your own CSS) */
  margin: 1rem auto;              /* reduce top/bottom margin so more height fits */
  height: 85vh;                   /* overall target height */
  max-height: 95vh;               /* safety cap on very small screens */
}

.tall-modal .modal-content {
  height: 100%;                   /* fill the dialog height */
  display: flex;
  flex-direction: column;         /* so body can flex and scroll */
}

.tall-modal .modal-body {
  overflow-y: auto;               /* scroll inside the body */
}