/** CSS for a run environment view component. */

@use 'frontend/app/styles/common';

:host {
  @include common.border-bottom-gray;
  @include common.border-right-gray;
  flex-grow: 1;
}

:host:not(.dark-theme) {
  mat-card {
    @include common.overview-card;
  }
}

mat-card {
  @include common.overview-card-height;
}

mat-card-title {
  @include common.overview-card-title;
}

b {
  font-weight: 500;
}

:host.dark-theme {
  border: none;

  mat-card {
    @include common.overview-card-dark-theme;
  }

  mat-card-title {
    background-color: common.$dark-theme-card-title-background-color;
    color: common.$dark-theme-card-title-color;
    padding: 16px;
    margin: -16px -16px 16px;
  }

  .key-label {
    font-weight: 500;
  }
}
