@charset "UTF-8";

// @description
// * red-color mixin.
// * This mixin generates CSS custom properties for using red colors
// * in your application or website.

// @access public

// @version 1.0.0

// @author Khaled Mohamed

// @license MIT

// @repository: https://github.com/Black-Axis/sass-pire

// @namespace colors

// @module colors/red-color

// @dependencies:
// * - var.$red-colors-map (variable).

// @example
// * @include red-color();

// @output
// * :root {
// *     --sp-red-50: hsl(0, 100%, 98%);
// *     --sp-red-100: hsl(0, 100%, 95%);
// *     --sp-red-150: hsl(0, 85%, 87%);
// *     --sp-red-200: hsl(0, 75%, 75%);
// *     --sp-red-250: hsl(0, 70%, 64%);
// *     --sp-red-300: hsl(0, 70%, 56%);
// *     --sp-red-350: hsl(0, 65%, 47%);
// *     --sp-red-400: hsl(0, 65%, 39%);
// *     --sp-red-450: hsl(0, 60%, 35%);
// *     --sp-red-500: hsl(0, 60%, 31%);
// *     --sp-red-550: hsl(0, 55%, 28%);
// *     --sp-red-600: hsl(0, 55%, 24%);
// *     --sp-red-650: hsl(0, 50%, 22%);
// *     --sp-red-700: hsl(0, 50%, 19%);
// *     --sp-red-750: hsl(0, 45%, 16%);
// *     --sp-red-800: hsl(0, 45%, 14%);
// *     --sp-red-850: hsl(0, 40%, 12%);
// *     --sp-red-900: hsl(0, 40%, 10%);
// *     --sp-red-950: hsl(0, 35%, 8%);
// * }

@use "../../abstract/global-variables" as var;

@mixin red-color() {
    :root {
        @each $red-color-degree, $actual-color in var.$red-colors-map {
            --sp-red-#{$red-color-degree}: #{$actual-color};
        }
    }
}