.banner {
    border-bottom: var(--color-panedivider) .5px solid;
    display: flex;
    font-size: 1.03846154em;
    font-weight: 600;
    justify-content: center;
    line-height: 2.07692308em;
    overflow: hidden;
    padding: 0 2em;

    .message {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    > .spacer {
        flex: 1;
    }

    > a {
        border: none;
        color: inherit;
        margin: 0;
        padding: 0 .5em;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    // extra space after the last link after spacer, i.e., the one immediately before the X button
    .spacer ~ a:last-of-type {
        padding-right: 1em;
    }

    > label {
        color: inherit;
        cursor: pointer;
        font-size: 1.69230769em;
        position: absolute;
        right: 9px;
        text-decoration: none;
        top: -3px;
    }
}

#architecture-warning-container {
    background-color: var(--accent-red);
    color: white;
}