#app-modal-overlay {
  top: 0;
  position: fixed;
  background: black;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  opacity: 0.5; }

#app-modal-container {
  position: fixed;
  display: flex;
  width: 100vw;
  height: 100vh;
  align-items: center;
  justify-content: center; }

#app-modal {
  background: white; }
  #app-modal .modal-header {
    display: flex;
    padding: 1rem;
    background: #1a314d;
    color: white;
    align-items: center; }
    #app-modal .modal-header .title {
      flex-grow: 1;
      font-weight: bold;
      font-size: 1.2rem; }
    #app-modal .modal-header i {
      cursor: pointer; }
  #app-modal .modal-content {
    padding: 1rem;
    max-height: 60vh;
    overflow-y: auto; }
    #app-modal .modal-content .loading {
      text-align: center;
      width: 100%;
      justify-content: center; }
      #app-modal .modal-content .loading img {
        width: 10em; }
    #app-modal .modal-content .modal-message {
      text-align: center;
      margin-top: 2rem;
      min-width: 15em;
      max-width: 25vw;
      overflow-wrap: break-word; }
      #app-modal .modal-content .modal-message li {
        text-align: left;
        padding-right: 2rem; }
    #app-modal .modal-content .modal-labeled-input {
      display: flex;
      align-items: center;
      margin-bottom: 2rem;
      margin-top: 2rem;
      width: 100%; }
      #app-modal .modal-content .modal-labeled-input .label {
        margin-right: 2rem;
        font-weight: bold;
        font-size: 1.1em;
        flex-grow: 1;
        width: 50%; }
      #app-modal .modal-content .modal-labeled-input input {
        width: 50%; }
      #app-modal .modal-content .modal-labeled-input select {
        width: 50%; }
    #app-modal .modal-content .modal-labeled-text {
      display: flex; }
      #app-modal .modal-content .modal-labeled-text .label {
        margin-right: 1em; }
  #app-modal .modal-actions {
    padding: 2rem; }
    #app-modal .modal-actions div {
      text-align: center; }
  #app-modal .modal-info {
    padding: 1rem; }
    #app-modal .modal-info .error-message {
      color: darkred;
      font-weight: bold;
      text-align: center; }
  #app-modal .modal-note {
    margin-top: -1.5em; }
    #app-modal .modal-note .label {
      color: darkred; }
