/* Joe's Palette */

:root {
  --color-link: var(--color-orange);

  /* can we remove these? */
  --color-success: var(--color-dark);
  --color-info: var(--color-grey);
  --color-warning: var(--color-maroon);
  --color-danger: var(--color-maroon);
  --color-required-label: var(--color-orange);
  --color-tr-background: var(--color-dark);
  --color-tr-alternate-background: var(--color-dark);

  --margin-bottom: 1rem;
  --margin-bottom-small: 0.3rem;
  --border-radius: 5px;
  --border: 1px solid var(--color-beige);
  --padding-base: 10px;
  --outline-input: 2px solid var(--color-beige);



  --font-family: "National Park", "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
  --font-family-headline: "National Park", "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
  --font-weight: 800;

  --color-dark: #302f2a;
  --color-grey: #5a5855;
  --color-beige: #dacb88;
  --color-maroon: #862b18;
  --color-orange: #e85e13;
  --color-light-brown: #a28245;
  --color-dark-brown: #ac582a;
  --color-grey-brown: #6b5239;
  --color-v-dark: #0d0d0d;

  --color-background: var(--color-dark);
  --color-primary: var(--color-orange);
  --color-header-night: var(--color-orange);

  --color-closed-eye: var(--color-grey);

  /* Default to darker mode until render */
  --color-card-bg-1: var(--color-dark);
  --color-card-bg-2: var(--color-dark);
  --color-card-bg-3: var(--color-dark);
  --color-card-bg-4: var(--color-dark);
  --color-card-label: var(--color-dark);
  --color-card-value: var(--color-dark);
  --color-card-value-1: var(--color-dark);
  --color-card-label-4: var(--color-dark);
  --color-night-subheader: var(color-orange);

  --color-chart-grid: var(--color-beige);
  --color-chart-button: var(--color-maroon);
  --color-chart-button-active: var(--color-grey-brown);
  --color-chart-axes-1: var(--color-light-brown);
  --color-chart-axes-2: var(--color-light-brown);
  --color-chart-legend: var(--color-beige);
  --color-trace-light-1: var(--color-beige);
  --color-trace-light-2: var(--color-light-brown);
  --color-trace-deep: var(--color-orange);
  --color-trace-rem: var(--color-maroon);
  --color-trace-ibi: var(--color-v-dark);
  --color-trace-hypnogram: var(--color-orange);

}