// ------------------------------------\
// MODAL
// ------------------------------------/

// MODAL table segment done
.modal-table-segment {
  width: 100%;
  height: 200px;
  /*background-color: $green-light;*/
}

.segment-fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
}

.modal-table-segment-box {
  height: 80px;
}

.segment-done {
  display: none;
}

.a-collapseContent,
.a-list {
  .modal-table-segment {
    height: $spacer * 7;
  }

  .modal-table-segment-box {
    display: none;
  }
}

.a-modal-top {
  .a-logo {
    width:  284px;
    max-width: none;
    opacity: 1;
  }
}

.a-js-clipboardMsg {
  margin-left: 20px;
  // TODO: Disable linting for special case line heights
  line-height: 60px;
  color: $white-opacity-07;
  vertical-align: bottom;
}

.an-modal-background-greyLight {

  .modal-backdrop {
    background-color: $grey-light;
  }

  &.a-modal-background-success {
    .modal-backdrop {
      background-color: $green-light;
    }
  }

  &.a-modal-background-error {
    .modal-backdrop {
      background-color: $red-light;
    }
  }
}

.an-modal-background-blueDark {

  .modal-backdrop {
    background-color: $blue-dark;
  }

  .a-logo {
    filter: brightness(0) invert(1);
  }

  &.a-modal-background-success {
    .modal-backdrop {
      background-color: $green-light;
    }

    .a-logo {
      filter: none;
    }
  }

  &.a-modal-background-error {
    .modal-backdrop {
      background-color: $red-light;
    }

    .a-logo {
      filter: none;
    }
  }
}