// ==========================================================================
//
// Name:           UI Color Palette
// Description:    The color palette of material design.
// Version:        2.1.0
//
// Author:         Denis Malinochkin
// Git:            https://github.com/mrmlnc/material-color
//
// twitter:        @mrmlnc
//
// ==========================================================================

// Palettes
// --------------------------------------------------------------------------

// Red
@list-red:                             #ffebee, #ffcdd2, #ef9a9a, #e57373, #ef5350,
                                       #f44336, #e53935, #d32f2f, #c62828, #b71c1c,
                                       #ff8a80, #ff5252, #ff1744, #d50000;

// Pink
@list-pink:                            #fce4ec, #f8bbd0, #f48fb1, #f06292, #ec407a,
                                       #e91e63, #d81b60, #c2185b, #ad1457, #880e4f,
                                       #ff80ab, #ff4081, #f50057, #c51162;

// Purple
@list-purple:                          #f3e5f5, #e1bee7, #ce93d8, #ba68c8, #ab47bc,
                                       #9c27b0, #8e24aa, #7b1fa2, #6a1b9a, #4a148c,
                                       #ea80fc, #e040fb, #d500f9, #aa00ff;

// Deep Purple
@list-deep-purple:                     #ede7f6, #d1c4e9, #b39ddb, #9575cd, #7e57c2,
                                       #673ab7, #5e35b1, #512da8, #4527a0, #311b92,
                                       #b388ff, #7c4dff, #651fff, #6200ea;

// Indigo
@list-indigo:                          #e8eaf6, #c5cae9, #9fa8da, #7986cb, #5c6bc0,
                                       #3f51b5, #3949ab, #303f9f, #283593, #1a237e,
                                       #8c9eff, #536dfe, #3d5afe, #304ffe;

// Blue
@list-blue:                            #e3f2fd, #bbdefb, #90caf9, #64b5f6, #42a5f5,
                                       #2196f3, #1e88e5, #1976d2, #1565c0, #0d47a1,
                                       #82b1ff, #448aff, #2979ff, #2962ff;

// Light Blue
@list-light-blue:                      #e1f5fe, #b3e5fc, #81d4fa, #4fc3f7, #29b6f6,
                                       #03a9f4, #039be5, #0288d1, #0277bd, #01579b,
                                       #80d8ff, #40c4ff, #00b0ff, #0091ea;

// Cyan
@list-cyan:                            #e0f7fa, #b2ebf2, #80deea, #4dd0e1, #26c6da,
                                       #00bcd4, #00acc1, #0097a7, #00838f, #006064,
                                       #84ffff, #18ffff, #00e5ff, #00b8d4;

// Teal
@list-teal:                            #e0f2f1, #b2dfdb, #80cbc4, #4db6ac, #26a69a,
                                       #009688, #00897b, #00796b, #00695c, #004d40,
                                       #a7ffeb, #64ffda, #1de9b6, #00bfa5;

// Green
@list-green:                           #e8f5e9, #c8e6c9, #a5d6a7, #81c784, #66bb6a,
                                       #4caf50, #43a047, #388e3c, #2e7d32, #1b5e20,
                                       #b9f6ca, #69f0ae, #00e676, #00c853;

// Light Green
@list-light-green:                     #f1f8e9, #dcedc8, #c5e1a5, #aed581, #9ccc65,
                                       #8bc34a, #7cb342, #689f38, #558b2f, #33691e,
                                       #ccff90, #b2ff59, #76ff03, #64dd17;

// Lime
@list-lime:                            #f9fbe7, #f0f4c3, #e6ee9c, #dce775, #d4e157,
                                       #cddc39, #c0ca33, #afb42b, #9e9d24, #827717,
                                       #f4ff81, #eeff41, #c6ff00, #aeea00;

// Yellow
@list-yellow:                          #fffde7, #fff9c4, #fff59d, #fff176, #ffee58,
                                       #ffeb3b, #fdd835, #fbc02d, #f9a825, #f57f17,
                                       #ffff8d, #ffff00, #ffea00, #ffd600;

// Amber
@list-amber:                           #fff8e1, #ffecb3, #ffe082, #ffd54f, #ffca28,
                                       #ffc107, #ffb300, #ffa000, #ff8f00, #ff6f00,
                                       #ffe57f, #ffd740, #ffc400, #ffab00;

// Orange
@list-orange:                          #fff3e0, #ffe0b2, #ffcc80, #ffb74d, #ffa726,
                                       #ff9800, #fb8c00, #f57c00, #ef6c00, #e65100,
                                       #ffd180, #ffab40, #ff9100, #ff6d00;

// Deep Orange
@list-deep-orange:                     #fbe9e7, #ffccbc, #ffab91, #ff8a65, #ff7043,
                                       #ff5722, #f4511e, #e64a19, #d84315, #bf360c,
                                       #ff9e80, #ff6e40, #ff3d00, #dd2c00;

// Brown
@list-brown:                           #efebe9, #d7ccc8, #bcaaa4, #a1887f, #8d6e63,
                                       #795548, #6d4c41, #5d4037, #4e342e, #3e2723;

// Grey
@list-grey:                            #fafafa, #f5f5f5, #eeeeee, #e0e0e0, #bdbdbd,
                                       #9e9e9e, #757575, #616161, #424242, #212121;

// Blue Grey
@list-blue-grey:                       #eceff1, #cfd8dc, #b0bec5, #90a4ae, #78909c,
                                       #607d8b, #546e7a, #455a64, #37474f, #263238;



// Definitions
// --------------------------------------------------------------------------

// Red
@red:                              extract(@list-red, 6);

@red-50:                           extract(@list-red, 1);
@red-100:                          extract(@list-red, 2);
@red-200:                          extract(@list-red, 3);
@red-300:                          extract(@list-red, 4);
@red-400:                          extract(@list-red, 5);
@red-500:                          extract(@list-red, 6);
@red-600:                          extract(@list-red, 7);
@red-700:                          extract(@list-red, 8);
@red-800:                          extract(@list-red, 9);
@red-900:                          extract(@list-red, 10);
@red-A100:                         extract(@list-red, 11);
@red-A200:                         extract(@list-red, 12);
@red-A400:                         extract(@list-red, 13);
@red-A700:                         extract(@list-red, 14);


// Pink
@pink:                             extract(@list-pink, 6);

@pink-50:                          extract(@list-pink, 1);
@pink-100:                         extract(@list-pink, 2);
@pink-200:                         extract(@list-pink, 3);
@pink-300:                         extract(@list-pink, 4);
@pink-400:                         extract(@list-pink, 5);
@pink-500:                         extract(@list-pink, 6);
@pink-600:                         extract(@list-pink, 7);
@pink-700:                         extract(@list-pink, 8);
@pink-800:                         extract(@list-pink, 9);
@pink-900:                         extract(@list-pink, 10);
@pink-A100:                        extract(@list-pink, 11);
@pink-A200:                        extract(@list-pink, 12);
@pink-A400:                        extract(@list-pink, 13);
@pink-A700:                        extract(@list-pink, 14);


// Purple
@purple:                           extract(@list-purple, 6);

@purple-50:                        extract(@list-purple, 1);
@purple-100:                       extract(@list-purple, 2);
@purple-200:                       extract(@list-purple, 3);
@purple-300:                       extract(@list-purple, 4);
@purple-400:                       extract(@list-purple, 5);
@purple-500:                       extract(@list-purple, 6);
@purple-600:                       extract(@list-purple, 7);
@purple-700:                       extract(@list-purple, 8);
@purple-800:                       extract(@list-purple, 9);
@purple-900:                       extract(@list-purple, 10);
@purple-A100:                      extract(@list-purple, 11);
@purple-A200:                      extract(@list-purple, 12);
@purple-A400:                      extract(@list-purple, 13);
@purple-A700:                      extract(@list-purple, 14);


// Deep Purple
@deep-purple:                      extract(@list-deep-purple, 6);

@deep-purple-50:                   extract(@list-deep-purple, 1);
@deep-purple-100:                  extract(@list-deep-purple, 2);
@deep-purple-200:                  extract(@list-deep-purple, 3);
@deep-purple-300:                  extract(@list-deep-purple, 4);
@deep-purple-400:                  extract(@list-deep-purple, 5);
@deep-purple-500:                  extract(@list-deep-purple, 6);
@deep-purple-600:                  extract(@list-deep-purple, 7);
@deep-purple-700:                  extract(@list-deep-purple, 8);
@deep-purple-800:                  extract(@list-deep-purple, 9);
@deep-purple-900:                  extract(@list-deep-purple, 10);
@deep-purple-A100:                 extract(@list-deep-purple, 11);
@deep-purple-A200:                 extract(@list-deep-purple, 12);
@deep-purple-A400:                 extract(@list-deep-purple, 13);
@deep-purple-A700:                 extract(@list-deep-purple, 14);


// Indigo
@indigo:                           extract(@list-indigo, 6);

@indigo-50:                        extract(@list-indigo, 1);
@indigo-100:                       extract(@list-indigo, 2);
@indigo-200:                       extract(@list-indigo, 3);
@indigo-300:                       extract(@list-indigo, 4);
@indigo-400:                       extract(@list-indigo, 5);
@indigo-500:                       extract(@list-indigo, 6);
@indigo-600:                       extract(@list-indigo, 7);
@indigo-700:                       extract(@list-indigo, 8);
@indigo-800:                       extract(@list-indigo, 9);
@indigo-900:                       extract(@list-indigo, 10);
@indigo-A100:                      extract(@list-indigo, 11);
@indigo-A200:                      extract(@list-indigo, 12);
@indigo-A400:                      extract(@list-indigo, 13);
@indigo-A700:                      extract(@list-indigo, 14);


// Blue
@blue:                             extract(@list-blue, 6);

@blue-50:                          extract(@list-blue, 1);
@blue-100:                         extract(@list-blue, 2);
@blue-200:                         extract(@list-blue, 3);
@blue-300:                         extract(@list-blue, 4);
@blue-400:                         extract(@list-blue, 5);
@blue-500:                         extract(@list-blue, 6);
@blue-600:                         extract(@list-blue, 7);
@blue-700:                         extract(@list-blue, 8);
@blue-800:                         extract(@list-blue, 9);
@blue-900:                         extract(@list-blue, 10);
@blue-A100:                        extract(@list-blue, 11);
@blue-A200:                        extract(@list-blue, 12);
@blue-A400:                        extract(@list-blue, 13);
@blue-A700:                        extract(@list-blue, 14);


// Light Blue
@light-blue:                       extract(@list-light-blue, 6);

@light-blue-50:                    extract(@list-light-blue, 1);
@light-blue-100:                   extract(@list-light-blue, 2);
@light-blue-200:                   extract(@list-light-blue, 3);
@light-blue-300:                   extract(@list-light-blue, 4);
@light-blue-400:                   extract(@list-light-blue, 5);
@light-blue-500:                   extract(@list-light-blue, 6);
@light-blue-600:                   extract(@list-light-blue, 7);
@light-blue-700:                   extract(@list-light-blue, 8);
@light-blue-800:                   extract(@list-light-blue, 9);
@light-blue-900:                   extract(@list-light-blue, 10);
@light-blue-A100:                  extract(@list-light-blue, 11);
@light-blue-A200:                  extract(@list-light-blue, 12);
@light-blue-A400:                  extract(@list-light-blue, 13);
@light-blue-A700:                  extract(@list-light-blue, 14);


// Cyan
@cyan:                             extract(@list-cyan, 6);

@cyan-50:                          extract(@list-cyan, 1);
@cyan-100:                         extract(@list-cyan, 2);
@cyan-200:                         extract(@list-cyan, 3);
@cyan-300:                         extract(@list-cyan, 4);
@cyan-400:                         extract(@list-cyan, 5);
@cyan-500:                         extract(@list-cyan, 6);
@cyan-600:                         extract(@list-cyan, 7);
@cyan-700:                         extract(@list-cyan, 8);
@cyan-800:                         extract(@list-cyan, 9);
@cyan-900:                         extract(@list-cyan, 10);
@cyan-A100:                        extract(@list-cyan, 11);
@cyan-A200:                        extract(@list-cyan, 12);
@cyan-A400:                        extract(@list-cyan, 13);
@cyan-A700:                        extract(@list-cyan, 14);


// Teal
@teal:                             extract(@list-teal, 6);

@teal-50:                          extract(@list-teal, 1);
@teal-100:                         extract(@list-teal, 2);
@teal-200:                         extract(@list-teal, 3);
@teal-300:                         extract(@list-teal, 4);
@teal-400:                         extract(@list-teal, 5);
@teal-500:                         extract(@list-teal, 6);
@teal-600:                         extract(@list-teal, 7);
@teal-700:                         extract(@list-teal, 8);
@teal-800:                         extract(@list-teal, 9);
@teal-900:                         extract(@list-teal, 10);
@teal-A100:                        extract(@list-teal, 11);
@teal-A200:                        extract(@list-teal, 12);
@teal-A400:                        extract(@list-teal, 13);
@teal-A700:                        extract(@list-teal, 14);


// Green
@green:                            extract(@list-green, 6);

@green-50:                         extract(@list-green, 1);
@green-100:                        extract(@list-green, 2);
@green-200:                        extract(@list-green, 3);
@green-300:                        extract(@list-green, 4);
@green-400:                        extract(@list-green, 5);
@green-500:                        extract(@list-green, 6);
@green-600:                        extract(@list-green, 7);
@green-700:                        extract(@list-green, 8);
@green-800:                        extract(@list-green, 9);
@green-900:                        extract(@list-green, 10);
@green-A100:                       extract(@list-green, 11);
@green-A200:                       extract(@list-green, 12);
@green-A400:                       extract(@list-green, 13);
@green-A700:                       extract(@list-green, 14);


// Light Green
@light-green:                      extract(@list-light-green, 6);

@light-green-50:                   extract(@list-light-green, 1);
@light-green-100:                  extract(@list-light-green, 2);
@light-green-200:                  extract(@list-light-green, 3);
@light-green-300:                  extract(@list-light-green, 4);
@light-green-400:                  extract(@list-light-green, 5);
@light-green-500:                  extract(@list-light-green, 6);
@light-green-600:                  extract(@list-light-green, 7);
@light-green-700:                  extract(@list-light-green, 8);
@light-green-800:                  extract(@list-light-green, 9);
@light-green-900:                  extract(@list-light-green, 10);
@light-green-A100:                 extract(@list-light-green, 11);
@light-green-A200:                 extract(@list-light-green, 12);
@light-green-A400:                 extract(@list-light-green, 13);
@light-green-A700:                 extract(@list-light-green, 14);


// Lime
@lime:                             extract(@list-lime, 6);

@lime-50:                          extract(@list-lime, 1);
@lime-100:                         extract(@list-lime, 2);
@lime-200:                         extract(@list-lime, 3);
@lime-300:                         extract(@list-lime, 4);
@lime-400:                         extract(@list-lime, 5);
@lime-500:                         extract(@list-lime, 6);
@lime-600:                         extract(@list-lime, 7);
@lime-700:                         extract(@list-lime, 8);
@lime-800:                         extract(@list-lime, 9);
@lime-900:                         extract(@list-lime, 10);
@lime-A100:                        extract(@list-lime, 11);
@lime-A200:                        extract(@list-lime, 12);
@lime-A400:                        extract(@list-lime, 13);
@lime-A700:                        extract(@list-lime, 14);


//Yellow
@yellow:                           extract(@list-yellow, 6);

@yellow-50:                        extract(@list-yellow, 1);
@yellow-100:                       extract(@list-yellow, 2);
@yellow-200:                       extract(@list-yellow, 3);
@yellow-300:                       extract(@list-yellow, 4);
@yellow-400:                       extract(@list-yellow, 5);
@yellow-500:                       extract(@list-yellow, 6);
@yellow-600:                       extract(@list-yellow, 7);
@yellow-700:                       extract(@list-yellow, 8);
@yellow-800:                       extract(@list-yellow, 9);
@yellow-900:                       extract(@list-yellow, 10);
@yellow-A100:                      extract(@list-yellow, 11);
@yellow-A200:                      extract(@list-yellow, 12);
@yellow-A400:                      extract(@list-yellow, 13);
@yellow-A700:                      extract(@list-yellow, 14);


// Amber
@amber:                            extract(@list-amber, 6);

@amber-50:                         extract(@list-amber, 1);
@amber-100:                        extract(@list-amber, 2);
@amber-200:                        extract(@list-amber, 3);
@amber-300:                        extract(@list-amber, 4);
@amber-400:                        extract(@list-amber, 5);
@amber-500:                        extract(@list-amber, 6);
@amber-600:                        extract(@list-amber, 7);
@amber-700:                        extract(@list-amber, 8);
@amber-800:                        extract(@list-amber, 9);
@amber-900:                        extract(@list-amber, 10);
@amber-A100:                       extract(@list-amber, 11);
@amber-A200:                       extract(@list-amber, 12);
@amber-A400:                       extract(@list-amber, 13);
@amber-A700:                       extract(@list-amber, 14);


// Orange
@orange:                           extract(@list-orange, 6);

@orange-50:                        extract(@list-orange, 1);
@orange-100:                       extract(@list-orange, 2);
@orange-200:                       extract(@list-orange, 3);
@orange-300:                       extract(@list-orange, 4);
@orange-400:                       extract(@list-orange, 5);
@orange-500:                       extract(@list-orange, 6);
@orange-600:                       extract(@list-orange, 7);
@orange-700:                       extract(@list-orange, 8);
@orange-800:                       extract(@list-orange, 9);
@orange-900:                       extract(@list-orange, 10);
@orange-A100:                      extract(@list-orange, 11);
@orange-A200:                      extract(@list-orange, 12);
@orange-A400:                      extract(@list-orange, 13);
@orange-A700:                      extract(@list-orange, 14);


// Deep Orange
@deep-orange:                      extract(@list-deep-orange, 6);

@deep-orange-50:                   extract(@list-deep-orange, 1);
@deep-orange-100:                  extract(@list-deep-orange, 2);
@deep-orange-200:                  extract(@list-deep-orange, 3);
@deep-orange-300:                  extract(@list-deep-orange, 4);
@deep-orange-400:                  extract(@list-deep-orange, 5);
@deep-orange-500:                  extract(@list-deep-orange, 6);
@deep-orange-600:                  extract(@list-deep-orange, 7);
@deep-orange-700:                  extract(@list-deep-orange, 8);
@deep-orange-800:                  extract(@list-deep-orange, 9);
@deep-orange-900:                  extract(@list-deep-orange, 10);
@deep-orange-A100:                 extract(@list-deep-orange, 11);
@deep-orange-A200:                 extract(@list-deep-orange, 12);
@deep-orange-A400:                 extract(@list-deep-orange, 13);
@deep-orange-A700:                 extract(@list-deep-orange, 14);


// Brown
@brown:                            extract(@list-brown, 6);

@brown-50:                         extract(@list-brown, 1);
@brown-100:                        extract(@list-brown, 2);
@brown-200:                        extract(@list-brown, 3);
@brown-300:                        extract(@list-brown, 4);
@brown-400:                        extract(@list-brown, 5);
@brown-500:                        extract(@list-brown, 6);
@brown-600:                        extract(@list-brown, 7);
@brown-700:                        extract(@list-brown, 8);
@brown-800:                        extract(@list-brown, 9);
@brown-900:                        extract(@list-brown, 10);


// Grey
@grey:                             extract(@list-grey, 6);

@grey-50:                          extract(@list-grey, 1);
@grey-100:                         extract(@list-grey, 2);
@grey-200:                         extract(@list-grey, 3);
@grey-300:                         extract(@list-grey, 4);
@grey-400:                         extract(@list-grey, 5);
@grey-500:                         extract(@list-grey, 6);
@grey-600:                         extract(@list-grey, 7);
@grey-700:                         extract(@list-grey, 8);
@grey-800:                         extract(@list-grey, 9);
@grey-900:                         extract(@list-grey, 10);


// Blue Grey
@blue-grey:                        extract(@list-blue-grey, 6);

@blue-grey-50:                     extract(@list-blue-grey, 1);
@blue-grey-100:                    extract(@list-blue-grey, 2);
@blue-grey-200:                    extract(@list-blue-grey, 3);
@blue-grey-300:                    extract(@list-blue-grey, 4);
@blue-grey-400:                    extract(@list-blue-grey, 5);
@blue-grey-500:                    extract(@list-blue-grey, 6);
@blue-grey-600:                    extract(@list-blue-grey, 7);
@blue-grey-700:                    extract(@list-blue-grey, 8);
@blue-grey-800:                    extract(@list-blue-grey, 9);
@blue-grey-900:                    extract(@list-blue-grey, 10);



// UI Color Application
// --------------------------------------------------------------------------

// Typography
@ui-display-4:                     @grey-600;
@ui-display-3:                     @grey-600;
@ui-display-2:                     @grey-600;
@ui-display-1:                     @grey-600;
@ui-headline:                      @grey-900;
@ui-title:                         @grey-900;
@ui-subhead-1:                     @grey-900;
@ui-body-2:                        @grey-900;
@ui-body-1:                        @grey-900;
@ui-caption:                       @grey-600;
@ui-menu:                          @grey-900;
@ui-button:                        @grey-900;