:root {
  /* Color values */
  --color-green-100: #72db38;
  --color-navy: #003974;
  --color-blue: var(--color-navy);
  --color-green-20: #e3f8d7;
  --color-navy-8: #e3e8ed;
  --color-navy-3: #f2f5f8;
  --color-white: #ffffff;

  --color-dark-blue-grey: #7c98b5;

  /* Theme colors */
  --color-brand-primary: var(--color-green-100);
  --color-brand-secondary: var(--color-navy);
  --color-theme-1: var(--color-green-20);
  --color-theme-2: var(--color-navy-8);
  --color-theme-3: var(--color-navy-3);
}

.btn-primary {
  background-color: var(--color-brand-primary);
  color: var(--color-brand-secondary);
}

.btn-theme-2,
.btn-theme-1 {
  background-color: var(--color-theme-1);
  color: var(--color-brand-secondary);
}

.group:hover .btn-theme-2,
.btn-theme-2:hover,
.group:hover .btn-theme-1,
.btn-theme-1:hover {
  background-color: var(--color-brand-primary);
  color: var(--color-brand-secondary);
}