.alert {
  border-width: 2px;
  padding: 16px;
  display: flex;
  background: $white;
  align-items: center;

  &::before {
    align-self: stretch;
    min-width: 64px;
    color: $white;
    font-family: "ForkAwesome";
    font-size: 20px;
    padding: 0.75rem 1.25rem;
    margin: -16px;
    margin-right: 16px;
  }
}

.alert.alert-success::before {
  content: "";
}

.alert.alert-info::before {
  content: "";
}

.alert.alert-warning::before {
  content: "";
}

.alert.alert-danger::before {
  content: "";
}

@each $color, $value in $theme-colors {
  .alert-#{$color} {
    border-color: $value;

    &::before {
      background-color: $value;
    }
  }

  .btn-#{$color}:hover {
    background: mix(#000, $value, 15%);
  }

  .btn-#{$color}:active {
    background: mix(#000, $value, 25%);
  }

  .btn-outline-#{$color} {
    font-weight: bold;
    background-color: $white;
  }
}

.alert,
.btn {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.btn.btn-link {
  box-shadow: none;
}

.table a:hover {
  text-decoration: none;
}
.table th {
  white-space: nowrap;
}
.nowrap {
  white-space: nowrap;
}
.badge {
  border-radius: 0.25em;
  height: 100%;
  text-align: center;
  vertical-align: baseline;
  padding: 0.4em 0.6em 0.4em;
  font-size: 75%;
  font-weight: bold;
  color: $white;
  margin-left: 4px;
}
.export-qrcode-image,
.qrcode-image {
  display: none;
  position: absolute;
  background: white;
}
.export-qrcode:hover .export-qrcode-image,
.qrcode:hover .qrcode-image {
  display: block;
}
.copyable-text {
  cursor: pointer;
  &:hover {
    background: $gray-lightest;
    box-shadow: 0px 0px 4px 4px $gray-lightest;
  }
}
.mail-card .card-header {
  cursor: pointer;
}
.nowline {
  border-top: $brand-danger solid 2px;
  display: flex;
  position: relative;
  visibility: hidden;
}
pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.5;
  word-break: break-all;
  word-wrap: break-word;
  color:#333;
  background-color: $gray-lightest;
  border: 1px solid $gray-light;
  border-radius: 3px;
}
