﻿:root {
  --fontsize-headline-big: 1.25rem; /* 20px */
  --fontsize-headline-medium: 1rem; /* 16px */
  --fontsize-headline-small: 0.875rem; /* 14px */

  --fontsize-text-big: 0.75rem; /* 12px; */
  --fontsize-text-medium: 0.688rem; /* 11px */
  --fontsize-text-small: 0.625rem; /* 10px */

  --font-weight-black: 900;
  --font-weight-bold: 700;
  --font-weight-semibold: 600;
  --font-weight-regular: 400;

  /* TODO Define h* value hierarchy */
  h1 {
    color: var(--color-brand-blue-900-main);
    font-weight: var(--font-weight-bold);
    font-size: 1rem;
    line-height: 1rem;
  }

  h2 {
    color: var(--color-brand-blue-900-main);
    font-weight: var(--font-weight-black);
    font-size: 1rem;
    line-height: 1rem;
  }

  h3 {
    font-size: 1.75rem;
  }

  h4 {
    font-size: 1.5rem;
  }

  h5 {
    font-size: 1.25rem;
  }

  h6 {
    font-size: 1rem;
  }

  .headline {
    font-size: var(--fontsize-headline-small);
    font-weight: var(--font-weight-black);
  }

  .datagrid-block-header {
    font-weight: var(--font-weight-bold);
  }

  .datagrid-block-text {
    font-weight: var(--font-weight-regular);
    font-size: var(--fontsize-text-medium);
    color: var(--text-neutral-subline);
  }
}
