@use "settings" as edgel;

:root {
  @each $colour in (
    "blue-bright",
    "blue-muted",
    "blue-university",
    "brown",
    "burgundy",
    "centre-sport-exercise",
    "green-dark",
    "grey-dark",
    "grey-spruce",
    "jade",
    "pink",
    "purple",
    "red"
  ) {
    $edgel-palette: edgel.palette($colour);

    // Custom variable values only support SassScript inside `#{}`
    --#{edgel.$prefix}-brand-#{$colour}: #{map-get($edgel-palette, "brand-color")};
    --#{edgel.$prefix}-brand-hover-#{$colour}: #{map-get($edgel-palette, "brand-hover")};
    --#{edgel.$prefix}-brand-link-#{$colour}: #{map-get($edgel-palette, "brand-link-color")};
    --#{edgel.$prefix}-brand-bg-text-#{$colour}: #{map-get($edgel-palette, "brand-bg-text")};
    --#{edgel.$prefix}-brand-bg-text-hover-#{$colour}: #{map-get($edgel-palette, "brand-bg-text-hover")};
    --#{edgel.$prefix}-brand-as-link-#{$colour}: #{map-get($edgel-palette, "brand-as-link")};
    --#{edgel.$prefix}-brand-as-link-hover-#{$colour}: #{map-get($edgel-palette, "brand-as-link-hover")};
  }
}
