@font-face {
    font-family: "Long Shot";
    src: url('/fonts/Long_Shot.ttf');
    src: url('/fonts/Long_Shot.ttf') format('truetype');
}

[data-theme=light],
:root:not([data-theme=dark]) {
    --pico-text-selection-color: rgba(255, 34, 250, 0.25);
    --pico-primary: #FF22FA;
    --pico-primary-background: #FF22FA;
    --pico-primary-underline: rgba(255, 34, 250, 0.5);
    --pico-primary-hover: #b819b5;
    --pico-primary-hover-background: #b819b5;
    --pico-primary-focus: rgba(255, 34, 250, 0.5);
    --pico-primary-hover-underline: rgba(255, 34, 250, 0.25);
    --pico-primary-inverse: #fff;

    --pico-secondary: #0658FE;
    --pico-secondary-background: #0658FE;
    --pico-secondary-underline: rgba(6, 88, 254, 0.5);
    --pico-secondary-hover: #0547cb;
    --pico-secondary-hover-background: #0547cb;
    --pico-secondary-focus: rgba(6, 88, 254, 0.5);
    --pico-secondary-hover-underline: rgba(6, 88, 254, 0.25);
    --pico-secondary-focus: rgba(6, 88, 254, 0.25);
    --pico-secondary-inverse: #fff;
}

@media only screen and (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --pico-background-color: #121212;
        --pico-text-selection-color: rgba(184, 25, 181, 0.1875);
        --pico-primary: #b819b5;
        --pico-primary-background: #b819b5;
        --pico-primary-underline: rgba(184, 25, 181, 0.5);
        --pico-primary-hover: #FF22FA;
        --pico-primary-hover-background: #FF22FA;
        --pico-primary-focus: rgba(184, 25, 181, 0.375);
        --pico-primary-hover-underline: rgba(255, 34, 250, 0.1875);
        --pico-primary-inverse: #fff;

        --pico-secondary: #0547cb;
        --pico-secondary-background: #0547cb;
        --pico-secondary-underline: rgba(5, 71, 203, 0.5);
        --pico-secondary-hover:  #0658FE;
        --pico-secondary-hover-background: #0658FE;
        --pico-secondary-focus: rgba(5, 71, 203, 0.5);
        --pico-secondary-hover-underline: rgba(5, 71, 203, 0.25);
        --pico-secondary-focus: rgba(5, 71, 203, 0.25);
        --pico-secondary-inverse: #fff;
    }
}

[data-theme=dark] {
    --pico-background-color: #121212;
    --pico-text-selection-color: rgba(184, 25, 181, 0.1875);
    --pico-primary: #b819b5;
    --pico-primary-background: #b819b5;
    --pico-primary-underline: rgba(184, 25, 181, 0.5);
    --pico-primary-hover: #FF22FA;
    --pico-primary-hover-background: #FF22FA;
    --pico-primary-focus: rgba(184, 25, 181, 0.375);
    --pico-primary-hover-underline: rgba(255, 34, 250, 0.1875);
    --pico-primary-inverse: #fff;
    
    --pico-secondary: #0547cb;
    --pico-secondary-background: #0547cb;
    --pico-secondary-underline: rgba(5, 71, 203, 0.5);
    --pico-secondary-hover:  #0658FE;
    --pico-secondary-hover-background: #0658FE;
    --pico-secondary-focus: rgba(5, 71, 203, 0.5);
    --pico-secondary-hover-underline: rgba(5, 71, 203, 0.25);
    --pico-secondary-focus: rgba(5, 71, 203, 0.25);
    --pico-secondary-inverse: #fff;
}

:root{
    --app-color-invalid: #9b2318;
}

* {
    font-family: 'Montserrat', sans-serif;
}

html {
    scroll-behavior: smooth;
}

.center {
    text-align: center;
}