/**
Demo Theme
Below, you will find a demo theme to showcase the theming for DimSum. 
You can modify the theme's styling values in accordance with the Brand Identity 
you would like to convey. 
*/

// **GLOBAL PREFIX**
// This prefix will be added to all sass classes in the system
$prefix: em-ds;

/**
Color Palette
Change these color values below to your brand colors.
*/
// Brand - Primary
$theme-color-brand-primary-900: null;
$theme-color-brand-primary-800: null; 
$theme-color-brand-primary-700: null;
$theme-color-brand-primary-600: null;
$theme-color-brand-primary-500: #00FC00;
$theme-color-brand-primary-400: null;
$theme-color-brand-primary-300: null;
$theme-color-brand-primary-200: null;
$theme-color-brand-primary-100: null;

// Brand - Secondary 
$theme-color-brand-secondary-900: null;
$theme-color-brand-secondary-800: null;
$theme-color-brand-secondary-700: null;
$theme-color-brand-secondary-600: null;
$theme-color-brand-secondary-500: null;
$theme-color-brand-secondary-400: null;
$theme-color-brand-secondary-300: null;
$theme-color-brand-secondary-200: null;
$theme-color-brand-secondary-100: null;

//Neutral - Used for text, borders, shadows, background, etc
$theme-color-neutral-1000: #000000;
$theme-color-neutral-900: #333333;
$theme-color-neutral-800: #25292F;
$theme-color-neutral-700: #353C46;
$theme-color-neutral-600: #464F5C;
$theme-color-neutral-500: #697489;
$theme-color-neutral-400: #8C93A6;
$theme-color-neutral-300: #B0B9C8;
$theme-color-neutral-200: #CBCFD7;
$theme-color-neutral-100: #E0E3E8;
$theme-color-neutral-080: #EBEDF0;
$theme-color-neutral-050: #F6F7F9;
$theme-color-neutral-000: #FFFFFF;

// Success - Used to communicate status or feedback to the user 
$theme-color-success-900: #32B87C;
$theme-color-success-800: null;
$theme-color-success-700: null;
$theme-color-success-600: null;
$theme-color-success-500: null;
$theme-color-success-400: null;
$theme-color-success-300: #D4F0E5;
$theme-color-success-200: null;
$theme-color-success-100: null;
// Danger - Used to communicate status or feedback to the user
$theme-color-danger-900: #E34256;
$theme-color-danger-800: null;
$theme-color-danger-700: null;
$theme-color-danger-600: null;
$theme-color-danger-500: null;
$theme-color-danger-400: null;
$theme-color-danger-300: null;
$theme-color-danger-200: #F7CDD2;
$theme-color-danger-100: null;
// Warning - Used to communicate status or feedback to the user
$theme-color-warning-900: #D17A00;
$theme-color-warning-800: null;
$theme-color-warning-700: #FF9400;
$theme-color-warning-600: #FBB431;
$theme-color-warning-500: #FBB431;
$theme-color-warning-400: #FBDE31;
$theme-color-warning-300: null;
$theme-color-warning-200: null;
$theme-color-warning-100: null;



// **TYPOGRAPHY**
// Typeface
// Change the typeface.
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i');
$theme-font-family: 'IBM Plex Mono', monospace;

// Type Scale
// Change the font-sizes of HTML typed tags below.
$theme-base-font-size: 13px;

// **BORDER RADIUS**
// How round would you like your containers to be?
$theme-base-border-radius: 2px; 