.header-row .visual-header.with-subtitle.with-warning {
  flex-direction: row;
  display: flex; }

.header-row .visual-header .visual-title-and-subtitle-container {
  display: inline-block;
  width: 100%; }

.scalar-layout {
  display: table;
  table-layout: fixed;
  height: 100%;
  width: 100%;
  position: absolute; }
  .scalar-layout .header-row {
    width: 100%;
    height: 36px; }
  .scalar-layout .scalar-component {
    width: 100%; }

.minimal-chart-layout {
  height: 100%;
  width: 100%;
  position: absolute;
  display: flex;
  flex-direction: column; }
  .minimal-chart-layout .chart-component {
    display: flex;
    flex-grow: 1; }
    .minimal-chart-layout .chart-component > div {
      flex-grow: 1; }
    .minimal-chart-layout .chart-component .screenreader-unavailable {
      height: 100%; }
    .minimal-chart-layout .chart-component .chart-layout-container {
      height: 100%; }

.scalar-and-chart-layout, .scalar-and-submetrics-and-chart-layout {
  height: 100%;
  width: 100%;
  position: absolute;
  display: flex;
  flex-direction: column; }
  .scalar-and-chart-layout .header-row, .scalar-and-submetrics-and-chart-layout .header-row {
    height: 72px;
    width: 100%;
    white-space: nowrap; }
    .scalar-and-chart-layout .header-row .visual-header, .scalar-and-submetrics-and-chart-layout .header-row .visual-header {
      display: inline-block;
      vertical-align: top;
      width: 60%; }
    .scalar-and-chart-layout .header-row .scalar-component, .scalar-and-submetrics-and-chart-layout .header-row .scalar-component {
      display: inline-flex;
      justify-content: flex-end;
      width: 40%; }
      .scalar-and-chart-layout .header-row .scalar-component.large-scalar-size, .scalar-and-submetrics-and-chart-layout .header-row .scalar-component.large-scalar-size {
        flex-direction: row; }
      .scalar-and-chart-layout .header-row .scalar-component.small-scalar-size, .scalar-and-submetrics-and-chart-layout .header-row .scalar-component.small-scalar-size {
        flex-direction: column; }
      .scalar-and-chart-layout .header-row .scalar-component .scalar-component-value, .scalar-and-submetrics-and-chart-layout .header-row .scalar-component .scalar-component-value {
        position: relative; }
        .scalar-and-chart-layout .header-row .scalar-component .scalar-component-value.large-scalar-size, .scalar-and-submetrics-and-chart-layout .header-row .scalar-component .scalar-component-value.large-scalar-size {
          top: -4px;
          flex-shrink: 0; }
  .scalar-and-chart-layout .chart-component, .scalar-and-submetrics-and-chart-layout .chart-component {
    display: flex;
    flex-grow: 1; }
    .scalar-and-chart-layout .chart-component > div, .scalar-and-submetrics-and-chart-layout .chart-component > div {
      flex-grow: 1; }
    .scalar-and-chart-layout .chart-component .screenreader-unavailable, .scalar-and-submetrics-and-chart-layout .chart-component .screenreader-unavailable {
      height: 100%; }
    .scalar-and-chart-layout .chart-component .chart-layout-container, .scalar-and-submetrics-and-chart-layout .chart-component .chart-layout-container {
      height: 100%; }

.scalar-and-submetrics-and-chart-layout .header-row {
  height: 60px; }