:root {
    /* Color Pallete */
    --bg-desktop: #b8a7ff;
    --bg-window: #ede5ff;
    --bg-title: #8167f7;
    --button: #d9d2ff;

    --black: #000;

    --light: #ffffff;
    --dark: #3a2f63;
    --shadow: #725fbd;

    /* Misc */
    --padding: 8px;
}

html,
body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
}

@font-face {
    font-family: pixelFont;
    src: url(assets/fonts/VCR_OSD_MONO_1.001.ttf);
}

* {
    image-rendering: pixelated;
    font-family: pixelFont;
    border-radius: 0 !important;
    box-sizing: border-box;
    -webkit-user-select: none;
    user-select: none;
    transition: width 0.25s, height 0.25s, background 0.5s ease, color 0.5s ease, border-color 0.5s ease;
}

body {
    cursor: url("assets/cursor.png"), auto;
    background: url("assets/images/wallpaper.png");
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    border-radius: 0px;
    background: var(--bg-window);

    border: 2px solid var(--dark);
    border-right-color: var(--light);
    border-top-color: var(--light);
}

::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background: var(--bg-title);

    border: 2px solid var(--light);
    border-right-color: var(--dark);
    border-top-color: var(--dark);
}

.shadow {
    box-shadow: -4px 4px 0 var(--shadow);
}

@media (max-width: 720px) {
    #start-menu {
        width: 75% !important;
        height: 50% !important;
    }

    .file-list {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* Mouse Cursor */
.desktop-icon,
.folder,
.file-item,
#breadcrumb,
.taskbar-icon,
a,
button,
.title-bar button {
    cursor: url("../assets/click.png"), pointer;
}

.title-bar {
    cursor: url("../assets/move.png"), grab;
}