@font-face {
    font-family: Work Sans;
    src: url('../../fonts/WorkSans.ttf');
}

@font-face {
    font-family: Noto Sans;
    src: url('../../fonts/NotoSans.ttf');
}

@font-face {
    font-family: "SegoeFlunetIcons";
    src: url("../../fonts/SegoeIcons.ttf");
}

@font-face {
    font-family: "JetBrainsMono";
    src: url("../../fonts/JetBrainsMono.ttf");
}

:root {
    font-family: 'Work Sans', 'Noto Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --font-family-default: 'Work Sans', 'Noto Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

@media (prefers-color-scheme: dark) {
    body {
        background: #262626;
        transition: all 0.2s ease-in-out;
    }

    :root {
        --on-card-background: rgb(105, 105, 105);
        --main-background: rgba(38, 38, 38, 0.5);
        --display-background: #262626;
        --card-background: rgba(255, 255, 255, 0.15);
        --text-color-uni-50: rgba(255, 255, 255, 0.5);
        --text-color-uni: #FFFFFF;
        --shadow-color: rgba(0, 0, 0, 0.3);
        --shadow-color-hover: rgba(0, 0, 0, 0.6);
        --scrollbar-color: linear-gradient(180deg, rgba(255, 255, 255, 0) 5%, rgba(255, 255, 255, 0.175) 5.01%, rgba(255, 255, 255, 0.175) 94.99%, rgba(255, 255, 255, 0) 95%);
    }
}

@media (prefers-color-scheme: light) {
    body {
        background: #F4F3F3;
    }

    :root {
        --card-background: #ffffff;
        --display-background: #F4F3F3;
        --on-card-background: #f5f5f5;
        --main-background: rgba(255, 255, 255, 0.5);
        --text-color-uni: #000000;
        --text-color-uni-50: rgba(0, 0, 0, 0.5);
        --shadow-color: rgba(0, 0, 0, 0.05);
        --shadow-color-hover: rgba(0, 0, 0, 0.1);
        --scrollbar-color: linear-gradient(180deg, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.1) 5.01%, rgba(0, 0, 0, 0.1) 94.99%, rgba(0, 0, 0, 0) 95%);
    }
}