@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;700&display=swap');
@import url('https://fonts.cdnfonts.com/css/sofia-pro');
@import 'minimal.css';
@import 'reset.css';




html {

    /* Colors */

    /* Basic black / white */
    --smores-binary-color-variant-00: #000000;        /* Pure Black */
    --smores-binary-color-variant-01: #FFFFFF;        /* Pure White */

    /* Color gradients */
    --smores-color-gradient-variant-1: linear-gradient(45deg, #2DDDA0 0%, #2A8AFC 100%);  /* green-blue gradient */
    --smores-color-gradient-variant-2: linear-gradient(45deg, #267DE5 0%, #8727E7 100%);  /* blue-purple gradient */
    --smores-color-gradient-variant-3: linear-gradient(45deg, #FB2E7D 0%, #FCC92A 100%);  /* red-orange-yellow gradient */
    --smores-color-gradient-variant-4: linear-gradient(45deg, #952AFD 0%, #FB2E7D 100%);  /* pink-purple gradient */
    --smores-color-gradient-variant-5: linear-gradient(45deg, #9AC4FE 0%, #CA95FE 100%);  /* lightblue-lavender gradient */
    --smores-color-gradient-variant-6: linear-gradient(45deg, #D9D9D9 0%, #747474 100%);  /* grayscale gradient */

    /* These are for situations where color gradients will not work*/
    --smores-accent-color-variant-1: #26c9b9;  /* aqua                   substitutes for green-blue gradient */
    --smores-accent-color-variant-2: #443cb4;  /* vibrant blue-purple    substitutes for blue-purple gradient */
    --smores-accent-color-variant-3: #ffa444;  /* fiery orange-yellow    substitutes for red-orange-yellow gradient */
    --smores-accent-color-variant-4: #9e299b;  /* hot pink               substitutes for pink-purple gradient */
    --smores-accent-color-variant-5: #b699ff;  /* pinkish lavender       substitutes for lightblue-lavender gradient */   /* Right now, all buttons flash lavender when clicked */
    --smores-accent-color-variant-6: #E5E5E5;  /* light grey             substitutes for grayscale gradient */

    /* These shades of purple should be the go-to colors for pretty much everything */
    --smores-primary-color-variant-900: #271E36; /* dark royal purple */
    --smores-primary-color-variant-800: #312C40; /* dark purple  */
    --smores-primary-color-variant-700: #40344C; /* medium-dark purple */
    --smores-primary-color-variant-600: #4D475A; /* medium purple   */
    --smores-primary-color-variant-500: #60546c; /* light purple  */
    --smores-primary-color-variant-400: #706c7c; /* light grayish purple  */
    --smores-primary-color-variant-300: #FF0000; /* !!!!!!!!!!!! COLOR DEPTH CURRENTLY UNUSED - BRIGHT RED !!!!!!!!!!!! */
    --smores-primary-color-variant-200: #D1CADE; /* extra light lavender (basically used only for font)  */ 

    /* Aside from things like buttons and frames, AdminConsole does not use secondary variants for much */
    /*--smores-secondary-color-variant-900: #27384F; /* Midnight */
    /*--smores-secondary-color-variant-800: #395275; /* Seaside */
    /*--smores-secondary-color-variant-700: #58779F; /* Kashmir */
    /*--smores-secondary-color-variant-600: #7B97B9; /* Ocean */
    /*--smores-secondary-color-variant-500: #ABBFD7; /* Spindle */
    /*--smores-secondary-color-variant-400: #CAD8E7; /* Pigeon */
    /*--smores-secondary-color-variant-300: #D3E0ED; /* Periwinkle */
    /*--smores-secondary-color-variant-200: #E6EFF7; /* Water */

    /* Positive and negative are unchanged from CF4*/
    --smores-positive-color-variant-900: #2C4D43; /* Emerald */
    --smores-positive-color-variant-800: #3A6559; /* Pine */
    --smores-positive-color-variant-700: #588377; /* Patina */
    --smores-positive-color-variant-600: #2DDDA0; /* Spearmint */   /* Formerly: #82A79E; /* Cascade */ 
    --smores-positive-color-variant-500: #C1D7D2; /* Geyser */
    --smores-positive-color-variant-400: #DDEBE8; /* Mint */
    --smores-positive-color-variant-300: #EBF5F3; /* Aqua */
    --smores-positive-color-variant-200: #F7FBFA; /* Seafoam */

    --smores-negative-color-variant-900: #421F26; /* Temptress */
    --smores-negative-color-variant-800: #703D47; /* Brick */  
    --smores-negative-color-variant-700: #986872; /* Mouve */
    --smores-negative-color-variant-600: #FC6DA4; /* AC-bold-pink */   /* Formerly: #A87C85; /* Caliente */
    --smores-negative-color-variant-500: #CEAFB6; /* Rose */
    --smores-negative-color-variant-400: #EDD8DC; /* Candy */
    --smores-negative-color-variant-300: #F7E6E9; /* Blush */
    --smores-negative-color-variant-200: #FFF5F7; /* Pastel Pink */

    /* Special warning colors */
    --smores-specialwarning-color-variant-100: #FC2145; /* Angry Watermelon? */












    /* Fonts */
    --smores-primary-font-family: 'Sofia Pro', sans-serif;
    --smores-primary-font-thin: normal normal 100 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-extra-light: normal normal 200 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-light: normal normal 300 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-regular: normal normal 400 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-medium: normal normal 500 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-semi-bold: normal normal 600 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-bold: normal normal 700 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-extra-bold: normal normal 800 16px 'Sofia Pro', sans-serif;
    --smores-primary-font-heavy: normal normal 900 16px 'Sofia Pro', sans-serif;
    --smores-secondary-font-family: 'Frank Ruhl Libre', serif;
    --smores-secondary-font-thin: normal normal 100 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-extra-light: normal normal 200 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-light: normal normal 300 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-regular: normal normal 400 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-medium: normal normal 500 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-semi-bold: normal normal 600 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-bold: normal normal 700 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-extra-bold: normal normal 800 16px 'Frank Ruhl Libre', serif;
    --smores-secondary-font-heavy: normal normal 900 16px 'Frank Ruhl Libre', serif;

    /* RGB Values */
    --smores-primary-shadow-rgb-values: 59, 33, 59;
    --smores-secondary-shadow-rgb-values: 39, 56, 79;
    --smores-neutral-shadow-rgb-values: 71, 63, 55;
    --smores-negative-shadow-rgb-values: 66, 31, 38;
    --smores-positive-shadow-rgb-values: 44, 77, 67;
    --smores-popup-overlay-rgb-values: 248, 245, 241;
    --smores-popup-rgb-values: 255, 255, 255;

    /* Layout */
    --smores-header-height: 120px;
    --smores-page-padding: 30px;
}