:root {
    --text: #ecebee;
    --text2: #f9fafa;
    --text-dark: #b7bcc2;
    --topnav-background: #282b2f;
    --background: #131416;
    --model-background: #1c1e21;
    --model-element: #242629;
    --primary: #0084ff;
    --primary-light: #277ff1;
    --secondary: #1b2c42;
    --accent: #743fde;
    --muted: hsl(240 3.7% 15.9%);
    --light-text: hsl(240, 5.1%, 45.9%);

    --border: rgb(52, 56, 61);
    --button-border: rgb(52, 56, 61);
    --button-hover: color-mix(in srgb, #131416 90%, white);
    --icon-color: #b7bcc2;

}


[data-theme='light'] {
    --text: #50565e;
    --text2: #808893;
    --text-dark: #808893;
    --topnav-background: #f4f5f6;
    --background: #fafafa;
    --model-background: #1c1e21;
    --model-element: #242629;
    --primary: #0084ff;
    --primary-light: #277ff1;
    --secondary: #1b2c42;
    --accent: #743fde;
    --muted: hsl(240 3.7% 15.9%);
    --light-text: hsl(240, 5.1%, 45.9%);

    --border: rgba(33, 35, 39, 0.07);
    --button-border: rgb(238, 240, 241);
    --button-hover: color-mix(in srgb, #fafafa 90%, black);
    --icon-color: #808893;
}

/*--text: #ecebee;*/
/*--text2: #f9fafa;*/
/*--text-dark: #b7bcc2;*/
/*--background: #131416;*/
/*--model-background: #1c1e21;*/
/*--primary: #0084ff;*/
/*--primary-light: #277ff1;*/
/*--secondary: #1b2c42;*/
/*--accent: #743fde;*/
/*--muted: hsl(240 3.7% 15.9%);*/
/*--light-text: hsl(240, 5.1%, 45.9%);*/

body {
    background-color: var(--background);
    height: 100%;
}

html {
    height: 100%;
}