@use '../utilities/main_utilities' as *;

html{scroll-behavior: smooth}
@media (prefers-reduced-motion: reduce){
    html{scroll-behavior: auto}
}

/* Footer fixed to bottom */
html,body{height: 100%}
body{display: flex;flex-direction: column;}
main, .main{ flex: 1 0 auto }

body {
    background: $color-bg;
    color: $color-text;
    font-family: $font-family;
    line-height: $line-height;
    overflow-x: hidden;
    @include reset; /* Margin 0, padding 0. Testing new @use/@forward as globals aren't allowed... */

    @include color-scheme(dark) {
        background: $color-bg--dark;
        color: $color-text--dark;
    }
}