//
// Custom utilities
//

$utilities: (
    "border": (property: border,
        responsive: true,
        values: (null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),
            0: 0,
        ),
    ),
    "border-top": (property: border-top,
        responsive: true,
        values: (null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),
            0: 0,
        ),
    ),
    "border-end": (property: border-right,
        class: border-end,
        responsive: true,
        values: (null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),
            0: 0,
        ),
    ),
    "border-bottom": (property: border-bottom,
        responsive: true,
        values: (null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),
            0: 0,
        ),
    ),
    "border-start": (property: border-left,
        class: border-start,
        responsive: true,
        values: (null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),
            0: 0,
        ),
    ),

    "border-width": (css-var: true,
        css-variable-name: border-width,
        class: border,
        values: $border-widths,
    ),

    "border-opacity": (css-var: true,
        css-variable-name: border-opacity,
        class: border-opacity,
        values: (10: .1,
            20: .2,
            30: .3,
            40: .4,
            50: .5,
            60: .6,
            70: .7,
            80: .8,
            90: .9,
            100: 1)),

    "border-style": (css-var: true,
        css-variable-name: border-style,
        class: border,
        responsive: true,
        rtl: true,
        values: dashed solid dotted outset,
    ),

    "cursor-pointer": (property: cursor,
        class: cursor,
        rtl: false,
        values: none auto pointer grab,
    ),

    "letter-spacing": (property: letter-spacing,
        class: ls,
        values: $letter-spacing-values,
    ),

    "opacity-values": (property: opacity,
        class: opacity,
        values: $opacity-values,
    ),

    "text-opacity": (property: opacity,
        class: text-opacity,
        values: $text-opacity,
    ),

    "bg-opacity": (css-var: true,
        class: bg-opacity,
        values: (10: .1,
            20: .2,
            30: .3,
            40: .4,
            50: .5,
            60: .6,
            70: .7,
            80: .8,
            90: .9,
            100: 1)),

    "grays": (property: color,
        class: text-gray,
        values: $grays,
    ),

    "bg-grays": (property: background-color,
        class: bg-gray,
        values: $grays,
    ),

    "width": (property: width,
        class: w,
        values: $custom-sizes,
    ),

    "min-width": (property: min-width,
        class: min-w,
        values: $custom-sizes,
    ),

    "max-width": (property: max-width,
        class: max-w,
        values: $custom-sizes,
    ),

    "height": (property: height,
        class: h,
        values: $custom-sizes,
    ),

    "min-height": (property: min-height,
        class: min-h,
        values: $custom-sizes,
    ),

    "max-height": (property: max-height,
        class: max-h,
        values: $custom-sizes,
    ),
);