#topBar{
    width: 100%;
    height: var(--top-bar-height);
    background-color: var(--blue-accent);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;

    display: grid;
    grid-template-areas: "daysNumber project_2026Header reviewNumber";
    grid-template-columns: 1fr 2fr 1fr;
}

#daysNumber {
    grid-area: daysNumber;
    text-align: center;
    font-weight: bold;
    color: var(--orange-accent);
}

#reviewNumber {
    grid-area: reviewNumber;
    text-align: center;
    font-weight: bold;
    color: var(--orange-accent);
}

#project_2026Header {
    grid-area: project_2026Header;
    text-align: center;
    font-size: var(--header-font-size);
    font-weight: bold;
    color: var(--orange-accent);
}