:root {
    --deep-black: #0e0e0e;
    --charcoal-black: #333333;
    --grey-black: #8A8A8A;
    --grey-black-o25: #8a8a8a3b;
    --ivory-white: #fff3da;
    --simple-white: #ffffff;
    --background-white: #fffcf6;
    --glowing-gold: #E3C88F;
    --rich-gold: #D3A348;
    --luxury-gold: #C6962C;
    --dark-gold: #B38315;
    --dark-gold-o5: #b3831517;
    --subtle-shadow: rgba(0, 0, 0, 0.1);
    --negative-colour: #ff4d4d;
    --negative-colour-o25: #ff4d4d4b;
    --positive-colour: #51e273;
    --neutral-colour: #ffc107;
}

html {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    height: 100%;
}

body {
    margin: 0;
    padding: 0;
    color: #000000;
    background-color: var(--simple-white);
    font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

    h1:focus {
        outline: none;
    }
}

.inline-arrow {
    border: solid;
    border-width: 0 0.18em 0.18em 0;
    display: inline-block;
    padding: 0.25em;
}

.inline-arrow--right {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.inline-arrow--left {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.inline-arrow--up {
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.inline-arrow--down {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* Set of css to handle blazor quirks */
.validation-message {
    color: var(--negative-colour);
    font-size: 0.8125rem;
}