/* Dynamic Test Color */
@function dynamic-text-color($color) {
    @if (lightness($color) < 50) {
        @return $white; // Lighter backgorund, return dark color
    }

    @else {
        @return $black; // Darker background, return light color
    }
}

@function focus-color($color, $bg) {
    @if (lightness($bg) < 50) {
        @return lighten($color, 25%); // Lighter background, return dark color
    }

    @else {
        @return darken($color, 25%); // Darker background, return light color
    }
}

@mixin linkstyles {
    outline-style: dashed;
    outline-width: 2px;
    outline-color: lighten($secondary, 25%);
    box-shadow: 0 0 0 2px darken($primary, 20%),
                inset 0 0 3px 1px lighten($primary, 25%);
}