/* Web Comet client-area branding. Core Paymenter assets are not modified. */
@font-face {
    font-family: "DM Sans";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/branding/webcomet/dm-sans-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "DM Sans";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/branding/webcomet/dm-sans-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
    --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
    --font-family: "DM Sans", ui-sans-serif, system-ui, sans-serif;
    --default-font-family: "DM Sans", ui-sans-serif, system-ui, sans-serif;
}
body, button, input, select, textarea {
    font-family: "DM Sans", ui-sans-serif, system-ui, sans-serif;
}
/* Paymenter's stock primary button hard-codes white text. Honor the native
 * inverted color so the lighter brand blue remains readable in dark mode. */
button.bg-primary {
    color: hsl(var(--color-inverted));
}
body > nav:not(.wc-company-links) {
    box-shadow: 0 1px 0 hsl(var(--color-neutral) / .3);
}
body > nav:not(.wc-company-links) a > img {
    height: 2.75rem;
    max-width: 10.5rem;
    object-fit: contain;
}
#login {
    width: calc(100% - 2rem);
    max-width: 30rem;
    margin: 3rem auto 0;
    padding: 0 2.5rem 2.5rem;
    background: hsl(var(--color-background-secondary));
    border: 1px solid hsl(var(--color-neutral));
    border-radius: 1.25rem;
    box-shadow: 0 12px 38px rgb(3 10 18 / .06);
}
#login > div:first-child {
    margin-block: 2rem;
}
#login > div:first-child img {
    height: 4rem;
    max-width: 100%;
    object-fit: contain;
}
#login h1 {
    font-weight: 650;
    letter-spacing: -.025em;
}
#login button[type="submit"] {
    min-height: 2.75rem;
    margin-top: .75rem;
    border-radius: .65rem;
    font-weight: 650;
}
.dark #login {
    box-shadow: 0 18px 52px rgb(0 0 0 / .22);
}
.prose a {
    color: hsl(var(--color-secondary));
    text-underline-offset: .2em;
}
body footer {
    margin-top: 5rem;
}
body footer > .container {
    margin-block: 2rem;
}
.wc-company-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .75rem 1.5rem;
    padding: 1.1rem 1.25rem;
    background: hsl(var(--color-background-secondary));
    border-top: 1px solid hsl(var(--color-neutral));
    color: hsl(var(--color-muted));
    font-size: .8125rem;
    line-height: 1.5;
}
.wc-company-links a:hover {
    color: hsl(var(--color-secondary));
    text-decoration: underline;
    text-underline-offset: .2em;
}
.wc-company-links a:focus-visible {
    outline: 2px solid hsl(var(--color-primary));
    outline-offset: 4px;
}
@media (max-width: 480px) {
    #login {
        margin-top: 1.5rem;
        padding-inline: 1.25rem;
    }
    #login > div:first-child {
        margin-block: 1.5rem;
    }
    body footer {
        margin-top: 3rem;
    }
    .wc-company-links > span {
        flex-basis: 100%;
        text-align: center;
    }
}
