:root {
    --brand: #978876;
    --brand-dark: #776856;
    --brand-nocturno: #574836;
    --brand-light: #f5f4f0;

    --brand-warning: #fef8f8;
    --brand-warning-dark: #c00000;

    --cp-brand-purple: purple;

    --brand-1: white;
    --brand-2: white;
    --brand-3: white;

    --workspace: #101010;
    --panel: #3e4240;
    --panel-header: #909090;

    --border-outer: #202020;
    --border-inner: #080808;

    --text-active: #c0c0c0;
    --text-muted: #b0b0b0;

    --text-info: #606060;
    --text-info-reverse: #e0e0e0;

    --option-hover: #4e5250;
    /*--option-selected: #2e3230;*/
    --option-selected: #101010;

    --text-1: white;
    --text-2: black;
    --text-3: silver;
    --text-4: silver;
    --text-5: silver;

    --outer-border: purple;
    --dragger-color: white;
    --dragger-opacity: 15%;

    --active-input-field: lightyellow;
}

.text-brand { color: var(--brand); }
.text-brand-dark { color: var(--brand-dark); }
.text-brand-light { color: var(--brand-light); }
.text-brand-nocturno { color: var(--brand-nocturno); }

.bg-brand { background-color: var(--brand); }
.bg-brand-dark { background-color: var(--brand-dark); }
.bg-brand-light { background-color: var(--brand-light); }
.bg-brand-nocturno { background-color: var(--brand-nocturno); }
.bg-brand-warning { background-color: var(--brand-warning) !important;}

.border-brand-warning { border-color: var(--brand-warning-dark) !important;}