@import '../../../assets/@theme/styles/_text-overflow.scss';

.pentest-header {
  width: 100vw;

  .header-info {
    position: absolute;
    margin-left: 10rem;
    margin-right: 10rem;
    text-align: center;

    .project-title {
      @include multiLineEllipsis($font-size: 1.5rem, $font-weight: bold, $line-height: 2rem, $lines-to-show: 1, $max-width: 32rem);
    }

    .pentest-ref {
      font-size:  1.5rem;
      font-weight: bold;
      line-height: 2rem;
    }
  }

  .header-info-mobile{
    position: absolute;
    margin-left: 10rem;
    margin-right: 10rem;
    text-align: center;

    .pentest-ref {
      font-size:  1.5rem;
      font-weight: bold;
      line-height: 2rem;
    }
  }

  .exit-button-container {
    .exit-element-icon {
    }

    .exit-element-text {
      padding-left: 0.5rem;
    }
  }

  .pentest-status-container {
    position: fixed;
    right: 4rem;
    // display: flex;
    // align-content: flex-end;

    .timer-component {
      height: 2rem !important;
      max-height: 2rem !important;
      margin: 0.5rem 2.25rem 1rem 0;
    }

    .complete-pentest-button {
      // position: absolute;

      .action-element-text {
        padding-left: 0.5rem;
      }
    }

    .pentest-status-dialog {
      margin: 1rem 2.25rem 1rem 0;

      .status {
        width: 12rem;
      }

      .basic {
        background-color: nb-theme(color-basic-default);
      }

      .info {
        background-color: nb-theme(color-info-default);
      }

      .warning {
        background-color: nb-theme(color-warning-default);
      }

      .success {
        background-color: nb-theme(color-success-default);
      }
    }

    .save-pentest-button {
      // height: 1rem !important;
      margin: 1rem 0 1rem 0;
    }
  }
}
