@font-face {
    font-family: Inter;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/inter-400.woff2") format("woff2");
}

@font-face {
    font-family: Inter;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/inter-700.woff2") format("woff2");
}

:root {
    --op-red: #e32028;
    --op-ink: #171717;
    --op-hover: #c41920;
    --op-page: #0a0a0a;
    --pf-v5-global--FontFamily--text: Inter, Arial, sans-serif;
    --pf-v5-global--FontFamily--heading: Inter, Arial, sans-serif;
    --pf-v5-global--primary-color--100: var(--op-red);
    --pf-v5-global--primary-color--200: var(--op-hover);
    --pf-v5-global--link--Color: var(--op-ink);
    --pf-v5-global--link--Color--hover: var(--op-hover);
}

.keycloak__loading-container {
    gap: 2rem;
    color: #d4d4d4;
    background: radial-gradient(ellipse at top, #1f1f1f 0%, var(--op-page) 60%);
    font-family: Inter, Arial, sans-serif;
}

.keycloak__loading-container::before {
    content: "";
    width: 200px;
    max-width: 80vw;
    height: 70px;
    background: url("../img/innfactory-logo.svg") no-repeat center / contain;
}

.keycloak__loading-container .pf-v5-c-spinner {
    --pf-v5-c-spinner--Color: var(--op-red);
}

.keycloak__loading-container #loading-text {
    padding-top: 0;
    color: #d4d4d4;
    font-size: 1rem;
    font-weight: 400;
}