:root {

    /* =======================================================
       BACKGROUND
    ======================================================= */

    --bg:                 #15171C;
    --bg-secondary:       #1B1F26;
    --bg-tertiary:        #232933;
    --bg-elevated:        #2B313D;
    --bg-hover:           #343C49;

    /* =======================================================
       SURFACES
    ======================================================= */

    --surface:            #20252E;
    --surface-light:      #2A303B;
    --surface-lighter:    #363E4A;

    /* =======================================================
       BORDER
    ======================================================= */

    --border:             #3A4351;
    --border-light:       #495363;

    /* =======================================================
       TEXT
    ======================================================= */

    --text:               #EEF2F6;
    --text-secondary:     #C7CED8;
    --text-muted:         #9AA4B3;
    --text-disabled:      #727D8D;

    /* =======================================================
       PRIMARY
    ======================================================= */

    --primary:            #87A8D8;
    --primary-hover:      #97B5E1;
    --primary-active:     #6D93C8;

    /* =======================================================
       SECONDARY
    ======================================================= */

    --secondary:          #A9B8CC;
    --secondary-hover:    #B7C5D7;
    --secondary-active:   #8C9CAF;

    /* =======================================================
       ACCENTS
    ======================================================= */

    --accent-purple:      #B39DDB;
    --accent-pink:        #E5A9C7;
    --accent-cyan:        #8ECAD6;
    --accent-green:       #A6D6A4;
    --accent-yellow:      #E7D79A;
    --accent-orange:      #E6BB96;

    /* =======================================================
       BUTTONS
    ======================================================= */

    --btn-primary:        var(--primary);
    --btn-primary-hover:  var(--primary-hover);
    --btn-primary-active: var(--primary-active);

    --btn-secondary:      #434D5B;
    --btn-secondary-hover:#505B6A;
    --btn-secondary-active:#39424F;

    --btn-danger:         #C98E97;
    --btn-danger-hover:   #D7A1A8;
    --btn-danger-active:  #B77A84;

    /* =======================================================
       INPUTS
    ======================================================= */

    --input-bg:           #232832;
    --input-border:       #3E4858;
    --input-focus:        #87A8D8;
    --input-placeholder:  #7E8796;

    /* =======================================================
       CARDS
    ======================================================= */

    --card-bg:            #1E232C;
    --card-header:        #252B35;
    --card-hover:         #2C333F;

    /* =======================================================
       SIDEBAR
    ======================================================= */

    --sidebar-bg:         #14181E;
    --sidebar-hover:      #252C36;
    --sidebar-active:     #313A47;

    /* =======================================================
       TABLES
    ======================================================= */

    --table-header:       #262C36;
    --table-row:          #1F242D;
    --table-row-hover:    #2A303A;

    /* =======================================================
       SUCCESS
    ======================================================= */

    --success:            #9BCB9A;
    --success-bg:         #233127;
    --success-border:     #47684A;
    --success-text:       #D7F0D5;

    /* =======================================================
       INFO
    ======================================================= */

    --info:               #91C3D8;
    --info-bg:            #1F2D35;
    --info-border:        #486A79;
    --info-text:          #D8EEF5;

    /* =======================================================
       WARNING
    ======================================================= */

    --warning:            #D9C488;
    --warning-bg:         #342E1E;
    --warning-border:     #74663A;
    --warning-text:       #F5EDCF;

    /* =======================================================
       ERROR
    ======================================================= */

    --error:              #D79A9A;
    --error-bg:           #362425;
    --error-border:       #7A4A4C;
    --error-text:         #F6DDDD;

    /* =======================================================
       BADGES
    ======================================================= */

    --badge-blue:         #8FB2E0;
    --badge-green:        #9ED59B;
    --badge-yellow:       #E6CF90;
    --badge-red:          #D89A9A;
    --badge-purple:       #BCA7DD;

    /* =======================================================
       STATUS
    ======================================================= */

    --online:             #88C48D;
    --offline:            #6F7886;
    --busy:               #D79A9A;
    --away:               #DCC487;

    /* =======================================================
       SHADOWS
    ======================================================= */

    --shadow-sm:          rgba(0,0,0,.15);
    --shadow-md:          rgba(0,0,0,.25);
    --shadow-lg:          rgba(0,0,0,.35);

    /* =======================================================
       OVERLAY
    ======================================================= */

    --overlay:            rgba(8,10,15,.55);
    --overlay-strong:     rgba(8,10,15,.72);

    /* =======================================================
       SCROLLBAR
    ======================================================= */

    --scrollbar:          #434C59;
    --scrollbar-hover:    #5C6776;

}