@import 'styles.css';

.deployment-detail {
  & .upstream-downstream-list {
    margin-bottom: 30px;
  }

  & .deployment-title {
    margin: 6px 0;

    & h1 {
      display: inline-block;
    }

    & .unadded-message {
      display: inline;
    }
  }

  & .status-badge {
    display: inline-block;
    border-radius: 50px;
    padding: 4px 10px;
    margin: 6px 12px;
    font-size: small;

    & p {
      margin-bottom: 0;
    }

    &.unadded {
      background: var(--silver);
      color: white;
      vertical-align: top;
    }
  }

  & .deployment-details {
    &.border-container {
      height: 276px; /* override height */
    }
    & .border-container-content {
      height: 260px; /* override height */
    }

    & .metric {
      padding: 15px 0;
    }
    & .metric:not(:last-child) {
      border-bottom: 1px solid grey;
    }
  }

  & .border-container {
    height: 151px; /* override height */
  }

  & .border-container-content {
    height: 135px; /* override height */

    & .summary-container .metric-info {
      float: left;
    }

    & .summary-container .metric-value {
      float: right;
    }
  }

}
