/* ============================================================
   NCR page header — slim top bar.

   Mirrors the Construction Submittals header so the two apps
   read as one product. These class names are new to NCR, so
   nothing else in the app picks them up.
   ============================================================ */

.header {
    position: relative;
    width:    100%;
    z-index:  10;
}

.top_bar {
    width:         100%;
    height:        56px;
    background:    #ffffff;
    border-bottom: solid 1px rgba(0, 0, 0, 0.05);
    z-index:       2;
    white-space:   nowrap;
}

.logo_container {
    display:     inline-block;
    white-space: nowrap;
}

.logo {
    font-family:  Georgia, serif;
    line-height:  56px;
    margin-right: 10px;
    font-size:    14px;
    color:        #000000;
}

.top_bar_legend_item {
    font-size:       19px;
    font-weight:     300;
    line-height:     56px;
    margin-right:    40px;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

/* Keep the logo from dominating the bar the way the old banner did. */
.top_bar_legend_item img {
    max-height: 34px;
    width:      auto;
}

.top_bar_user {
    margin-left: auto;
}

.user_icon {
    display:      inline-flex;
    align-items:  center;
    margin-right: 7px;
    font-size:    16px;
}

/* Nothing in the bar may render at its natural size. An unconstrained image
   here previously blew the header out over the table. */
.top_bar img {
    max-height: 34px;
    width:      auto;
}

.user_icon img {
    width:      100%;
    max-height: 16px;
}

/* The bar is a fixed height, so anything oversized would spill over the page
   rather than push it down; clip instead of overlapping the content below. */
.top_bar {
    overflow: hidden;
}

.ncr-logout {
    color: #b02a37;
}

/* scripts01.js reads this element's innerHTML to identify the current user,
   so it has to stay in the DOM — it just should not be on show. */
#currentuserid {
    display: none;
}
