/* Self-hosted brand fonts (copied from the Bid Tool wwwroot/fonts).
   Replaces the Google Fonts <link> and the Verdana fallback the demo used to ship with. */
@font-face {
    font-family: "Clarity City";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("../fonts/ClarityCity-Light.woff2") format("woff2");
}
@font-face {
    font-family: "Clarity City";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ClarityCity-Regular.woff2") format("woff2");
}
@font-face {
    font-family: "Clarity City";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ClarityCity-Medium.woff2") format("woff2");
}
@font-face {
    font-family: "Archivo";
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url("../fonts/Archivo-Latin-Variable.woff2") format("woff2");
}

/* Loading splash before WASM boots */
.loading-progress { position: relative; display: block; width: 6rem; height: 6rem; margin: 20vh auto 1rem auto; }
.loading-progress circle { fill: none; stroke: var(--clv-color-ice-blue); stroke-width: 0.4rem; transform-origin: 50% 50%; transform: rotate(-90deg); }
.loading-progress circle:last-child { stroke: var(--clv-color-deep-teal); stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%; transition: stroke-dasharray 0.05s ease-in-out; }
.loading-progress-text { position: absolute; text-align: center; font-family: var(--clv-font-heading); inset: calc(20vh + 3.25rem) 0 auto 0; color: var(--clv-color-deep-teal); }
.loading-progress-text:after { content: var(--blazor-load-percentage-text, "Loading"); }

#blazor-error-ui {
    color: var(--clv-color-white);
    background: var(--clv-color-dark-navy);
    bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,0.2); display: none;
    left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
#blazor-error-ui .reload { color: var(--clv-color-text-link-dark); }
#blazor-error-ui .reload:hover { color: var(--clv-color-text-primary); }