@function mergeColorMaps($bulma-colors, $custom-colors)
  // We return at least Bulma's hard-coded colors
  $merged-colors: $bulma-colors

  // We want a map as input
  @if type-of($custom-colors) == 'map'
    @each $name, $components in $custom-colors
      // The color name should be a string
      // and the components either a single color
      // or a colors list with at least one element
      @if type-of($name) == 'string' and (type-of($components) == 'list' or type-of($components) == 'color') and length($components) >= 1
        $color-base: null
        $color-invert: null
        $color-light: null
        $color-dark: null
        $value: null

        // The param can either be a single color
        // or a list of 2 colors
        @if type-of($components) == 'color'
          $color-base: $components
          $color-invert: findColorInvert($color-base)
          $color-light: findLightColor($color-base)
          $color-dark: findDarkColor($color-base)
        @else if type-of($components) == 'list'
          $color-base: nth($components, 1)
          // If Invert, Light and Dark are provided
          @if length($components) > 3
            $color-invert: nth($components, 2)
            $color-light: nth($components, 3)
            $color-dark: nth($components, 4)
            // If only Invert and Light are provided
          @else if length($components) > 2
            $color-invert: nth($components, 2)
            $color-light: nth($components, 3)
            $color-dark: findDarkColor($color-base)
            // If only Invert is provided
          @else
            $color-invert: nth($components, 2)
            $color-light: findLightColor($color-base)
            $color-dark: findDarkColor($color-base)

        $value: ($color-base, $color-invert, $color-light, $color-dark)

        // We only want to merge the map if the color base is an actual color
        @if type-of($color-base) == 'color'
          // We merge this colors elements as map with Bulma's colors map
          // (we can override them this way, no multiple definition for the same name)
          // $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert, $color-light, $color-dark)))
          $merged-colors: map_merge($merged-colors, ($name: $value))

  @return $merged-colors

@function powerNumber($number, $exp)
  $value: 1
  @if $exp > 0
    @for $i from 1 through $exp
      $value: $value * $number
  @else if $exp < 0
    @for $i from 1 through -$exp
      $value: divide($value, $number)
  @return $value

@function str-split($string, $separator: '-')
    $i: str-index($string, $separator)
    @if $i != null
        @return append(str-slice($string, 1, $i - 1), str-split(str-slice($string, $i + str-length($separator)), $separator))
    @return $string

@function colorLuminance($color)
  @if type-of($color) != 'color'
    @return 0.55
  $color-rgb: ('red': red($color),'green': green($color),'blue': blue($color))
  @each $name, $value in $color-rgb
    $adjusted: 0
    $value: divide($value, 255)
    @if $value < 0.03928
      $value: divide($value, 12.92)
    @else
      $value: divide(($value + .055), 1.055)
      $value: powerNumber($value, 2)
    $color-rgb: map-merge($color-rgb, ($name: $value))
  @return (map-get($color-rgb, 'red') * .2126) + (map-get($color-rgb, 'green') * .7152) + (map-get($color-rgb, 'blue') * .0722)


@function calculateInvertColor($color)
  @return if(colorLuminance($color) > 0.55, rgba(#000, 0.7), #fff)

@function findColorInvert($color, $fallback: null)
  @if type-of($color) == 'color'
    @return calculateInvertColor($color)
  @else if type-of($fallback) == 'color'
    @return calculateInvertColor($fallback)
  @return $color

@function calculateLightColor($color)
  $l: 96%
  @if lightness($color) > 96%
    $l: lightness($color)
  @return change-color($color, $lightness: $l)

@function findLightColor($color, $fallback: null)
  @if type-of($color) == 'color'
    @return calculateLightColor($color)
  @else if type-of($fallback) == 'color'
    @return calculateLightColor($fallback)
  @return $color

@function calculateDarkColor($color)
  $base-l: 29%
  $luminance: colorLuminance($color)
  $luminance-delta: (0.53 - $luminance)
  $target-l: round($base-l + ($luminance-delta * 53))
  @return change-color($color, $lightness: max($base-l, $target-l))

@function findDarkColor($color, $fallback: null)
  @if type-of($color) == 'color'
    @return calculateDarkColor($color)
  @else if type-of($fallback) == 'color'
    @return calculateDarkColor($fallback)
  @return $color

@function bulmaRgba($color, $alpha)
  @if type-of($color) != 'color'
    @return $color
  @return rgba($color, $alpha)

@function bulmaDarken($color, $amount)
  @if type-of($color) != 'color'
    @return $color
  @return darken($color, $amount)

@function bulmaLighten($color, $amount)
  @if type-of($color) != 'color'
    @return $color
  @return lighten($color, $amount)

@function bulmaToRGB($color)
  @if type-of($color) != 'color'
      @return $color
  @return red($color), green($color), blue($color)

=registerCSSVar($name, $value, $at-root: true)
  @if $at-root
    @at-root :root
      --#{$name}: #{$value}
  @else
    --#{$name}: #{$value}

=registerCSSVars($list, $at-root: true)
  @if $at-root
    @at-root :root
      @each $name, $value in $list
        --#{$name}: #{$value}
  @else
    @each $name, $value in $list
      --#{$name}: #{$value}

=registerCSSVarColor($name, $components, $prefix: '')
  $color: nth($components, 1)
  $color-invert: nth($components, 2)
  $color-light: null
  @if length($components) >= 3
    $color-light: nth($components, 3)
  @else
    $color-light: findLightColor($color)
  $color-dark: null
  @if length($components) >= 4
    $color-dark: nth($components, 4)
  @else
    $color-dark: findDarkColor($color)
  $base: $prefix + $name

  --#{$base}-h: #{hue($color)}
  --#{$base}-s: #{saturation($color)}
  --#{$base}-l: #{lightness($color)}
  --#{$base}-a: 1
  --#{$base}: hsla(var(--#{$base}-h), var(--#{$base}-s), var(--#{$base}-l), var(--#{$base}-a))

  // Invert color
  $invert-l: lightness($color-invert)
  --#{$base}-invert-l: #{$invert-l}
  --#{$base}-invert: #{$color-invert}

  // Light color
  $light-l: lightness($color-light)
  --#{$base}-light-l: #{$light-l}
  --#{$base}-light: hsla(var(--#{$base}-h), var(--#{$base}-s), var(--#{$base}-light-l), var(--#{$base}-a))

  // Dark color
  $dark-l: lightness($color-dark)
  --#{$base}-dark-l: #{$dark-l}
  --#{$base}-dark: hsla(var(--#{$base}-h), var(--#{$base}-s), var(--#{$base}-dark-l), var(--#{$base}-a))

=registerCSSVarColors($colors, $prefix: '')
  @each $name, $components in $colors
    +registerCSSVarColor($name, $components, $prefix)

@function assignCSSVar($name, $fallback)
  @return var(--#{$name}, #{$fallback})

@function unwrapCSSVar($cssVar)
  @if type-of($cssVar) == string and str-index($cssVar, "var(") == 1
    $end-at: (str-index($cssVar, ',') or 0) - 1
    @return str-slice($cssVar, 7, $end-at)
  @return $cssVar

@function bulmaCSSVarHsla($color, $alpha)
  $name: unwrapCSSVar($color)
  @if type-of($name) == 'string' // and map-has-key($colors, $name)
    @return hsla(#{var(--#{$name}-h)}, #{var(--#{$name}-s)}, #{var(--#{$name}-l)}, #{$alpha})
  @return $color

@function bulmaCSSVarDarken($name, $amount)
  @if type-of($name) == 'string' // and map-has-key($colors, $name)
    $name-l: null
    // to be able to pass calc(var(--lightness) - 5%)
    @if type-of($amount) == 'string'
      $name-l: $amount
    @else
      $name-l: calc(#{var(--#{$name}-l)} - #{$amount})
    @return hsla(#{var(--#{$name}-h)}, #{var(--#{$name}-s)}, #{$name-l}, #{var(--#{$name}-a)})
  @return $name

@function bulmaCSSVarLighten($name, $amount)
  @if type-of($name) == 'string' // and map-has-key($colors, $name)
    $name-l: null
    // to be able to pass calc(var(--lightness) - 5%)
    @if type-of($amount) == 'string'
      $name-l: $amount
    @else
      $name-l: calc(#{var(--#{$name}-l)} + #{$amount})
    @return hsla(#{var(--#{$name}-h)}, #{var(--#{$name}-s)}, #{$name-l}, #{var(--#{$name}-a)})
  @return $name

// Custom divide function by @mdo from https://github.com/twbs/bootstrap/pull/34245
// Replaces old slash division deprecated in Dart Sass
@function divide($dividend, $divisor, $precision: 10)
  $sign: if($dividend > 0 and $divisor > 0, 1, -1)
  $dividend: abs($dividend)
  $divisor: abs($divisor)
  $quotient: 0
  $remainder: $dividend
  @if $dividend == 0
    @return 0
  @if $divisor == 0
    @error "Cannot divide by 0"
  @if $divisor == 1
    @return $dividend
  @while $remainder >= $divisor
    $quotient: $quotient + 1
    $remainder: $remainder - $divisor
  @if $remainder > 0 and $precision > 0
    $remainder: divide($remainder * 10, $divisor, $precision - 1) * .1
  @return ($quotient + $remainder) * $sign
