// RIVER Design-System - Defaults: Notifications //

// Define design colors for notifications used in the design system here.
// Color maps may include a range (eg, 500: blue, 600: darkblue, ...), and references (eg, 'normal' = 500, 'title' = 'normal', ...).

// Design Map for Notification Colours
@if(design-setting('defaults')
    // Output notifications defaults if maps are enabled, or 'notifications' has been whitelisted
    and (
        design-setting('defaults.maps', false) == true
        or list-contains(design-setting('defaults.maps'), 'notifications')
    )
) {
    $design-map-notifications: (
        // Whether to output this map as CSS Variables; options include: false (default), true
        '_variables':       false,

        'success': (
            // Range
            700: #047857,
            500: #10b981,
            300: #a7f3d0,
            // References
            'text':         700,
            'normal':       500,
            'border':       500,
            'bg':           300,
        ),

        'info': (
            // Range
            700:            #3A61D8,
            500:            #4B72E6,
            300:            #E1E7FE,
            // References
            'text':         700,
            'normal':       500,
            'border':       500,
            'bg':           300,
        ),

        'warning': (
            // Range
            700: #c2410c,
            500: #f97316,
            300: #fed7aa,
            // References
            'text':         700,
            'normal':       500,
            'border':       500,
            'bg':           300,
        ),

        'error': (
            // Range
            700: #be123c,
            500: #f43f5e,
            300: #fecdd3,
            // References
            'text':         700,
            'normal':       500,
            'border':       500,
            'bg':           300,
        ),

    ) !default;

    // Apply the map
    $design-map: design-map-set('notifications', $design-map-notifications);
}

// To update the map, you can use any of:
// design-map-set('notifications', (...)); design-map-update('notifications', (...)); design-map-deep-update('notifications', (...))