/* C2FO app colors from screenshot */
:root {
    --c2fo-dark-background: #3D4A5C;
    --c2fo-primary-blue: #4A90A4;
    --c2fo-secondary-blue: #5BA3B8;
    --c2fo-accent-blue: #6BB6CB;
    --c2fo-light-gray: #F8F9FA;
    --c2fo-gray: #9CA3AF;
    --c2fo-dark-gray: #374151;
    --c2fo-white: #FFFFFF;
}

body {
    background-color: var(--c2fo-dark-background);
    color: var(--c2fo-white);
}

button[name='sign-in'] {
    background-color: var(--c2fo-accent-blue) !important;
    border-color: var(--c2fo-accent-blue);
    color: var(--c2fo-white) !important;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

button[name='sign-in']:hover {
    background-color: var(--c2fo-secondary-blue) !important;
}

a {
    color: var(--c2fo-accent-blue);
    background-color: transparent;
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--c2fo-white);
    text-decoration: underline;
}

/* this will break with a Liquidity change. */
.bg-error-100 a {
    background-color: inherit;
    color: var(--c2fo-accent-blue);
}

#language-switcher input[type='submit'] {
    color: var(--c2fo-white);
    background-color: transparent;
    border: 1px solid var(--c2fo-gray);
    padding: 6px 10px;
    margin: 2px;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-size: 13px;
}

#language-switcher input[type='submit']:hover {
    background-color: var(--c2fo-accent-blue);
    border-color: var(--c2fo-accent-blue);
}

#privacy-policy {
    color: var(--c2fo-gray);
}

#privacy-policy a {
    color: var(--c2fo-gray);
    background-color: transparent;
}

#privacy-policy a:hover {
    color: var(--c2fo-white);
    text-decoration: underline;
}
