/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

html,
* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: "Roboto Light", sans-serif;
    font-size: 14px;
    scroll-behavior: smooth;
    color: #444;
}

body {
    display: flex;
    flex-direction: column;
    min-width: 1280px;
    background-color: #f4f4f4;
    background-repeat: no-repeat;
}

header {
    margin: 0;
    padding: 0;
}

main {
    flex: 1 0 auto;
    margin: 0;
    padding: 0;
}

footer {
    flex-shrink: 0;
    padding-bottom: 4rem;
    font-size: 1rem;
    background-color: #a8a8a8;
}

h1 {
    margin-top: 0;
    font-family: "Roboto Light";
    letter-spacing: 0.1rem;
    line-height: 3rem;
    color: #666;
}

h2 {
    font-family: "Roboto Light";
    letter-spacing: 0.025rem;
    color: #606060;
}

h3 {
    font-family: "Roboto Light";
    font-size: 1.1rem;
    letter-spacing: 0.05rem;
    color: #888;
}

p {
    line-height: 1.6rem;
}

a {
    color: #0978e7;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

ul,
ol {
    line-height: 1.25rem;
    margin-bottom: 0.5rem;
}

li {
    margin: 0.25rem;
}

.translation_missing {
    background-color: #ff00ff;
}

.hidden {
    display: none !important;
}

/**
 * Common components
 */

.nav-bar {
    position: relative;
    display: block;
    font-family: "Roboto Light", sans-serif;
    background-color: #292929;
    border-bottom: 3px solid #6f969f;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
    z-index: 4;
}

.nav-bar .assumed-tto {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 3rem;
    padding: 0 0.5rem;
    color: #fff;
    background-color: #dd4444;
    border-bottom: 2px solid #cc2222;
    z-index: 255;
}

.nav-bar .assumed-tto-container {
    display: flex;
    width: auto;
    margin: 0 auto;
}

.nav-bar .assumed-tto-left {
    flex-grow: 1;
    font-size: 1.1rem;
    line-height: 3rem;
}

.nav-bar .assumed-tto-left .tto-display-name {
    font-weight: bold;
    text-decoration: underline;
}

.nav-bar .assumed-tto-right {
    padding: 0.25rem 0 0 0;
}

.nav-bar .return-to-true-tto-identity-button {
    display: block;
    padding: 0.33rem 0.66rem;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #ffeeee;
    background-color: #dd4444;
    border-color: #aa0000;
    text-decoration: none;
    border-width: 1px;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.nav-bar .return-to-true-tto-identity-button:hover {
    background-color: #cd3434;
    border-color: #9a0000;
}

.nav-bar .assumed-tto-spacer {
    height: 3rem;
}

.nav-bar-content {
    position: relative;
    display: flex;
}

.nav-bar .nav-bar-content .logo-link {
    height: 4rem;
    box-sizing: border-box;
    outline: none;
    border: none;
}

.nav-bar .nav-bar-content .logo {
    height: 2.5rem;
    margin: 0.75rem 0.5rem;
    box-sizing: border-box;
    border: none;
    outline: none;
}

.nav-bar .nav-bar-content .menu-bar {
    display: flex;
    width: 100%;
    height: 4rem;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.nav-bar .nav-bar-content .menu-bar .item {
    display: inline-block;
    padding: 1.5rem 2.0rem 0 2.0rem;
    height: 100%;
    color: #e8e8e8;
    font-size: 1rem;
    text-decoration: none;
    background-color: transparent;
    box-sizing: border-box;
    overflow: visible;
    cursor: pointer;
}

.nav-bar .nav-bar-contnet .menu-bar .item.noninteractive {
    cursor: default;
}

.nav-bar .nav-bar-content .menu-bar .item.title {
    font-weight: 600;
}

.nav-bar .nav-bar-content .menu-bar .item:not(.noninteractive):hover {
    text-decoration: none;
    background-color: #6f969f;
}

.nav-bar .nav-bar-content .menu-bar .group .item:hover+.dropdown,
.dropdown:hover {
    display: block;
}

.nav-bar .nav-bar-content .menu-bar .group.dropdown-group:hover {
    background-color: #6f969f;
}

.nav-bar .nav-bar-content .menu-bar .group.dropdown-group.dropdown-group-right {
    margin-left: auto;
}

.nav-bar .nav-bar-content .menu-bar .item.noninteractive.user-profile-item {
    padding-top: 0;
}

.nav-bar .user-profile {
    display: flex;
}

.nav-bar .user-profile .user-profile-icon,
.nav-bar .user-profile .user-profile-display-name {
    display: inline-block;
}

.nav-bar .user-profile .user-profile-icon {
    margin: 1rem 0.5rem 0 0;
    width: 2rem;
    height: 2rem;
}

.nav-bar .user-profile .user-profile-display-name {
    padding-top: 1.5rem;
}

.nav-bar .group {
    position: relative;
    display: inline-block;
}

.nav-bar .group .dropdown {
    display: none;
    position: absolute;
    width: 24rem;
    left: 0;
    background-color: #313131;
    border-top: 2px solid #00c9c9;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.nav-bar .group .dropdown.dropdown-right {
    left: auto;
    right: 0;
}

.nav-bar .group:hover .dropdown {
    display: block;
}

.nav-bar .group .dropdown .section {
    border-bottom: 1px solid #494949;
}

.nav-bar .group .dropdown .item {
    display: block;
    padding: 1.5rem;
    background-color: #313131;
}

.nav-bar .group .dropdown .item.noninteractive {
    padding: 1rem;
    color: #6f969f;
    font-variant: small-caps;
    border-bottom: 1px solid #494949;
    cursor: default;
}

.nav-bar .group .dropdown .item.dropdown-item {
    border-left: 2px solid #313131;
}

.nav-bar .group .dropdown .item.dropdown-item:hover {
    background-color: #292929;
    border-left: 2px solid #00c9c9;
}

.nav-bar .group .dropdown .sign-out-container {
    padding-top: 0.5rem;
}

.nav-bar .group .dropdown .sign-out-container .sign-out-button {
    display: block;
    padding: 0.5rem;
    margin: 1rem auto;
    width: 10rem;
    text-align: center;
}

.notice,
.alert {
    position: fixed;
    top: 7rem;
    left: 50%;
    transform: translateX(-50%);
    margin: 1rem auto;
    padding: 0.75rem 0.75rem 0.75rem 1.25rem;
    width: 24rem;
    color: #fff;
    border: 1px solid #777;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(8px);
    box-sizing: border-box;
    z-index: 5;
}

.notice {
    background-color: rgba(30, 30, 30, 0.72);
}

.alert {
    background-color: rgba(215, 53, 53, 0.9);
    border: 1px solid #b52525;
}

.notice-icon {
    margin: 0.4rem 1rem 0 0;
}

.alert-icon {
    font-size: 1.25rem;
    margin: 0.3rem 1rem 0 0;
}

.notice-content,
.alert-content {
    display: flex;
    align-content: center;
    justify-content: space-between;
}

.notice-message,
.notice-dismiss,
.alert-message,
.alert-dismiss {
    display: flex;
    align-self: center;
}

.notice-message,
.notice-dismiss {
    color: #fff;
}

.alert-message,
.alert-dismiss {
    color: #fff;
}

.notice-message,
.alert-message {
    margin: 0 auto 0 0;
}

.notice-dismiss,
.alert-dismiss {
    background: transparent;
    padding: 0.5rem;
    font-size: 1rem;
    border: none;
    background: none;
    cursor: pointer;
}

.notice-dismiss:hover,
.alert-dismiss:hover {}

.main-container {
    max-width: 44rem;
    margin: 0 auto 5rem auto;
    padding: 2rem;
    box-sizing: content-box;
}

.main-container.with-sidebar {
    margin-left: 24rem;
    width: 64rem;
    max-width: 64rem;
}

.main-container.wide {
    width: 96rem;
    max-width: 90vw;
}

.container {
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #bbb;
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.25);
}

/* Space the comp element mapping prompt from the letterhead prompt below it. */
.container.comp-element-mapping-required {
    margin-bottom: 1.5rem;
}

.button {
    display: inline-block;
    padding: 0.33rem 1rem;
    font-size: 1rem;
    line-height: 1.5rem;
    text-decoration: none;
    color: #444;
    background-color: #eaeaea;
    border: 1px solid #aaa;
    border-radius: 3px;
    cursor: pointer;
}

.button:hover {
    background-color: #d4d4d4;
    text-decoration: none;
}

.button.primary-button {
    color: #fff;
    background-color: #5a78af;
    border: 1px solid #4a689f;
}

.button.primary-button:hover {
    background-color: #4a689f;
    border: 1px solid #3a588f;
}

.button.secondary-button {
    color: #fff;
    background-color: #5aaf71;
    border: 1px solid #4a9f61;
}

.button.secondary-button:hover {
    background-color: #4a9f61;
    border: 1px solid #3a8f51;
}

.button.primary-button:disabled,
.button.secondary-button:disabled {
    color: #eee;
    text-decoration: none;
    text-shadow: none;
    background-color: #c8c8c8;
    border: 1px solid #bbb;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.button.delete-button {
    color: #fff;
    background-color: #dd4444;
    border-color: #aa0000;
}

.button.delete-button:hover {
    background-color: #cd3434;
    border-color: #9a0000;
}

.button.delete-button:disabled {
    color: #eee;
    text-decoration: none;
    background-color: #c8c8c8;
    border: 1px solid #bbb;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.button.cancel-button {
    align-self: baseline !important;
    color: #808080;
    text-decoration: none;
    background-color: #eee;
    border: 1px solid #ccc;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.button.cancel-button:hover {
    text-decoration: none;
    background-color: #dedede;
    border-color: #bcbcbc;
}

.sign-up-left-pane {
    margin: 4rem 0rem 0 25%;
    padding: 2rem;
}

.sign-up-right-pane {
    margin-right: 25%;
}

.auth-links {
    font-size: 1.1rem;
    color: #444;
}

.footer-border {
    height: 10px;
    background-repeat: repeat-x;
    background-size: 36px;
}

.footer-content {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
    margin: 0 auto;
    padding: 2rem 0 1rem 0;
    width: 90vw;
    max-width: 80rem;
    color: #292929;
}

.footer-logo-container {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    width: 33.33%;
}

.footer-logo {
    height: 4rem;
}

.footer-address,
.footer-contact {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    width: 33.33%;
    line-height: 1.5rem;
    color: #fff;
}

.footer-contact .phone-label,
.footer-contact .phone-number {
    padding-right: 1rem;
}

.footer-copyright {
    margin: 0 auto;
    width: 90vw;
    max-width: 80rem;
    color: #fff;
}

/**
 * Modals
 */

.modal {
    display: none;
    z-index: 255;
}

.modal.active {
    display: block;
}

.modal .mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5)
}

.modal .content {
    position: fixed;
    display: block;
    padding: 1rem;
    width: 48rem;
    top: 5rem;
    left: calc((100vw - 48rem) / 2);
    color: #444;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.25);
}

.modal.wide .content {
    width: 96rem;
    left: calc((100vw - 96rem) / 2);
}

.modal.tall .content {
    top: 2rem;
}

.modal .content h2 {}

.modal .content .close-button {
    position: absolute;
    padding: 1rem;
    top: 0;
    right: 0;
    font-size: 1.5rem;
    line-height: 1rem;
    color: #888;
    background: none;
    border: none;
    cursor: pointer;
}

.modal .controls {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}

.modal .controls.multiple-controls {
    justify-content: space-between;
}

/**
 * Select Facility Modal
 */

.select-facility-modal .content .input {
    margin: 0;
    padding: 0.25rem 0.5rem;
    width: 100%;
    font-size: 1rem;
    line-height: 2rem;
    color: #555;
    border: 1px solid #aaa;
    box-sizing: border-box;
}

.select-facility-modal .content .filter-status {
    margin: 1rem auto 0.5rem 0.25rem;
    color: #888;
}

.select-facility-modal .content .results {
    margin: 1rem 0;
    padding: 0;
    height: 36rem;
    max-height: 36rem;
    overflow-y: scroll;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.select-facility-modal .content .results.no-results {
    padding: 1rem 0.5rem;
    color: #888;
}

.select-facility-modal .content .results .facility-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.select-facility-modal .content .results .facility-list .facility {
    display: flex;
    margin: 0;
    padding: 0.5rem 0.25rem;
    border: 1px solid #ddd;
    cursor: pointer;
}

.select-facility-modal .content .results .facility-list .facility:hover {
    background-color: #f4f4f8;
}

.select-facility-modal .content .results .facility-list .facility.selected {
    color: #fff;
    background-color: #5a78af;
    border: 1px solid #4a689f;
}

.select-facility-modal .content .results .facility-list .facility .details {
    margin-right: auto;
}

.select-facility-modal .content .results .facility-list .facility .details .display-name {
    font-size: 1rem;
}

.select-facility-modal .content .results .facility-list .facility .details .address {
    font-size: 0.8rem;
    color: #777;
}

.select-facility-modal .content .results .facility-list .facility.selected .details .address {
    font-size: 0.8rem;
    color: #f0f0f0;
}

.select-facility-modal .content .results .facility-list .facility .last-updated {}

.select-facility-modal .content .results .facility-list .facility .last-updated .label {
    font-size: 0.8rem;
    color: #bbb;
}

.select-facility-modal .content .results .facility-list .facility.selected .last-updated .label {
    font-size: 0.8rem;
    color: #eee;
}

.select-facility-modal .content .controls {
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
}

/**
 * Forms
 */

.form-submission {
    position: fixed;
    padding: 0.5rem;
    left: 0;
    bottom: 0;
    width: 100%;
    color: #888;
    border: 1px solid #ccc;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ccc;
    background-color: #e9e9e9;
    box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.25);
    z-index: 255;
}

.form-submission-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-submission-controls a:hover {
    text-decoration: none;
}

.form-submission-controls .prev-facility,
.form-submission-controls .next-facility {
    width: 16rem;
}

.form-submission-controls .prev-facility a,
.form-submission-controls .next-facility a {
    display: flex;
}

.form-submission-controls .prev-facility-icon,
.form-submission-controls .next-facility-icon {
    display: block;
    color: #ccc;
    text-decoration: none;
}

.form-submission-controls .prev-facility-icon {
    margin-right: 1rem;
}

.form-submission-controls .next-facility-icon {
    margin-left: 1rem;
}

.form-submission-controls .prev-facility-name,
.form-submission-controls .next-facility-name {
    display: block;
    width: 14rem;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-submission-controls a:hover .prev-facility-name,
.form-submission-controls a:hover .next-facility-name {
    text-decoration: underline;
}

.form-submission-controls .go-to-facility {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    padding: 0 1.5rem;
    margin: 0 1.5rem;
}

.form-submission-controls .save-facility {
    margin: 0 1rem 0 auto;
}

.form-sidebar {
    width: 22rem;
    position: fixed;
    left: 2rem;
    top: 10.667rem;
}

.form-navigation {
    margin-bottom: 2rem;
    background-color: #e9e9e9;
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.25);
}

.form-navigation h3,
.form-readiness h3 {
    position: relative;
    display: block;
    margin: 0;
    padding: 0.5rem;
    color: #888;
    border: 1px solid #ccc;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ccc;
}

.form-navigation .item,
.form-readiness .item {
    position: relative;
    display: block;
    padding: 0.5rem;
    color: #444;
    border: 1px solid #ccc;
    border-top: none;
    border-bottom: 1px solid #bbb;
    text-decoration: none;
}

.form-navigation .item:last-of-type,
.form-readiness .item:last-of-type {
    border-bottom: none;
}

.form-navigation .item:hover {
    background-color: #d9d9d9;
}

.form-navigation .item.active {
    color: #fff;
    background-color: #3378f6;
    border-right: 1px solid #2368e6;
    border-bottom: 1px solid #2368e6;
    border-left: 1px solid #2368e6;
}

.form-readiness {
    background-color: #e9e9e9;
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.25);
}

.form-readiness .item {
    display: flex;
    gap: 1rem;
}

.form-readiness .item.highlightable:hover {
    background-color: #f0efd1;
}

.form-readiness .item.result {
    display: block;
    line-height: 2.5rem;
    text-align: center;
    background-color: #e9e9e9;
}

.form-readiness .item.result .icon {
    display: block;
    margin: 0 auto;
    font-size: 2.5rem;
}

.form-readiness .item .icon {
    width: 2.25rem;
    font-size: 2rem;
    line-height: 2.5rem;
    text-align: center;
    color: #ccc;
}

.form-readiness .item .message {
    width: 17rem;
}

.form-readiness .item.result span {
    display: block;
}

.form-readiness .item.result .icon.valid {
    color: #64b369;
}

.form-readiness .item.result .icon.invalid {
    color: #d5cb3f;
}

.form {
    width: 40rem;
    padding: 2rem;
    box-sizing: content-box;
}

.form.wide {
    width: auto;
}

.form h2 {
    margin-top: 0;
    font-family: "Roboto Light";
    color: #888;
    text-shadow: none;
}

.form.wide .two-column {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: normal;
    align-items: normal;
    align-content: normal;
}

.form.wide .two-column .column {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    box-sizing: border-box;
}

.form.wide .two-column.close-budget-year-dates .column {
    flex: 1 1 0;
}

.form.wide .two-column.close-budget-year-dates .column:first-child {
    padding-right: 1rem;
}

.form .column.left {
    width: 60%;
    padding-right: 1rem;
}

.form .column.right {
    width: 40%;
    margin-left: 1rem;
}

.form .column .section {
    padding: 1rem;
    border: 1px solid #ccc;
}

.form-errors {
    margin: 0 0 1rem 0;
    font-size: 1.5rem;
    color: rgba(217, 24, 24, 0.75);
}

.form-errors p {
    margin-bottom: 0.5rem;
    font-family: "Roboto Medium";
    font-size: 1.25rem;
}

.form-errors ol li {
    font-size: 1.1rem;
}

.field {
    padding: 0.5rem;
}

.closed-budget-years {
    margin-top: 2.5rem;
}

.close-budget-year-container {
    margin-top: 4rem;
    padding: 1rem;
    background-color: #f4f4f4;
    border: 1px solid #ccc;
}

.close-budget-year-confirm {
    margin: 2.5rem 0 1.5rem 0;
}

.summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    border: 1px solid #ccc;
}

.summary.valid {
    background-color: #e7f4e8;
}

.summary.invalid {
    background-color: #faf7dd;
}

.summary .icon {
    font-size: 1.5rem;
    line-height: 1;
}

.summary .icon.valid {
    color: #64b369;
}

.summary .icon.invalid {
    color: #d5cb3f;
}

.summary strong {
    font-family: "Roboto Regular";
}

.close-budget-year-container strong {
    font-family: "Roboto Medium";
}

.field:hover {
    background-color: #f4f4f4;
}

.field.short {
    padding: 0 1rem;
}

.field .control {
    display: flex;
    align-items: center;
    gap: 1rem;
    z-index: 1;
}

.field .control-label {
    width: 10rem;
}

.field .control-input {
    flex: 1;
}

.field .control-input .options {
    padding: 0.5rem;
    border: none;
}

.field .control-input .options .option {
    align-items: center;
    white-space: nowrap;
}

.field .label {
    display: block;
    padding: 0.5rem;
    font-family: "Roboto Regular";
    font-size: 1rem;
    text-align: left;
    color: #444;
}

.field .label.radio-label {
    margin: auto auto 1rem auto;
}

.field .control-description {
    display: block;
    position: relative;
    padding: 0.33rem;
    background-color: #8fb6bf;
    border-radius: 0.66rem;
    cursor: default;
}

.field .control-description .icon {
    position: relative;
    width: 0.25rem;
    height: 0.25rem;
    color: #fff;
    line-height: 0.45rem;
    font-family: serif;
    font-size: 0.9rem;
    font-weight: bold;
    text-align: center;
    z-index: 1;
}

.field .control-description .popup {
    position: absolute;
    display: none;
    left: 1.5rem;
    bottom: 0;
    padding: 0.75rem;
    color: #fff;
    background-color: #444e;
    border: 1px solid #888;
    width: 30rem;
    font-size: 1rem;
    line-height: 1.5rem;
}

.field .control-description:hover .popup {
    display: block;
}

.field .control-options {
    display: flex;
    flex-wrap: wrap;
    margin-left: 13rem;
}

.field .computable-value-options {
    display: flex;
    align-items: center;
    white-space: nowrap;
    gap: 2rem;
    margin: 0;
    padding: 0;
    border: none;
}

.field .computable-value-label.disabled {
    color: #ccc;
}

.field input {
    margin: 0;
    padding: 0.25rem 0.5rem;
    width: 100%;
    font-size: 1rem;
    line-height: 2rem;
    color: #555;
    border: 1px solid #aaa;
    box-sizing: border-box;
}

.field input.can-error {
    margin-bottom: 0;
}

.field input:read-only {
    color: #777;
    background-color: #f4f4f4;
}

.field input,
.field textarea,
.field select,
.budget-year-comparison-column-select {
    font-family: "Roboto Regular";
}

.field textarea {
    margin: 0;
    padding: 0.25rem 0.5rem;
    width: 100%;
    font-size: 1rem;
    color: #555;
    border: 1px solid #aaa;
    resize: vertical;
}

.field select,
.budget-year-comparison-column-select {
    display: block;
    margin: 0;
    padding: 0 0.5rem;
    width: 100%;
    height: 2.75rem;
    font-size: 1rem;
    line-height: 2.75rem;
    color: #555;
    background-color: #ebebeb;
    border-radius: 0;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

.field input[type="file"] {
    padding: 2rem;
    color: #555;
    background-color: #eee;
    border: 1px solid #ccc;
}

.field input.computable-value {
    display: none;
    margin-bottom: 0;
}

.field input.computable-value.active {
    display: block;
}

.field .replace-uploaded-document-container {
    padding: 1rem;
    border: 1px solid #aaa;
}

.field .replace-uploaded-document-checkbox,
.field .replace-uploaded-document-label {
    width: auto;
}

.replace-uploaded-document-checkbox {
    margin: 0 0.5rem 0 0;
}

.replace-uploaded-document-input {
    display: none;
}

.replace-uploaded-document-checkbox:checked~.replace-uploaded-document-input {
    display: block;
}

.section.optional-section {
    display: none;
    margin: 0 0 2rem 0;
    padding: 0;
    border: none;
}

.section.optional-section .optional-section {
    display: none;
    margin: 0;
}

.optional-section h3 {
    margin: 0.5rem 0;
}

.optional-section.facility-is-owned {
    display: block;
}

.field:has(#is_leased_true:checked)~.optional-section.facility-is-owned {
    display: none;
}

.field:has(#is_leased_true:checked)~.optional-section.facility-is-leased {
    display: block;
}

.field:has(#is_annual_lease_true:checked)~.optional-section {
    display: block;
}

.field:has(#provides_healthcare_services_true:checked)~.optional-section.facility-provides-healthcare-services {
    display: block;
}

.field input[type="radio"],
.field input[type="checkbox"] {
    margin: 0.5rem;
    width: 1rem;
    height: 1rem;
    box-sizing: border-box;
}

#user_remember_me {
    margin: 0 0.5rem;
}

.field .radio-label,
.field .checkbox-label {
    font-size: 1rem;
}

.field .field_with_errors input {
    margin-bottom: 0;
    border: 3px solid rgba(217, 24, 24, 0.5);
}

.field .field_with_errors select {
    margin-bottom: 0;
    border: 3px solid rgba(217, 24, 24, 0.5);
}

.field .error,
.facilities-section .error {
    margin: 0 auto 1rem auto;
    padding: 1rem;
    color: rgba(217, 24, 24, 0.75);
    background-color: rgba(217, 24, 24, 0.1);
    border: 2px solid rgba(217, 24, 24, 0.25);
}

.field .error.hidden {
    height: 0;
    padding: 0;
    visibility: hidden;
}

/* Align field-level errors with the input column (see .control-options at 13rem). */
.submittal-configuration-form .field .error {
    margin-left: 13rem;
    margin-right: 0;
}

.field-divider {
    margin: 1.5rem auto 2rem auto;
    width: 100%;
    height: 0;
    border-top: 1px solid #d8d8d8;
}

.form-buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: normal;
    align-content: normal;
    margin: 2rem 0 0 0;
}

.form-buttons.multiple-controls {
    justify-content: space-between;
}

.form-buttons .form-buttons-error {
    align-self: center;
    margin-right: 1rem;
}

.form-buttons.centered {
    justify-content: space-around;
}

.form-buttons .form-submit-button,
.form-buttons .form-cancel-button {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
}

.facility-extended-metadata {
    margin-top: 2rem;
    border: 1px solid #ccc;
}

.facility-extended-metadata h3 {
    margin: 0 0 0.5rem 0;
    padding: 1rem;
}

.facility-extended-metadata.disabled {
    background-color: #f0f0f4;
}

.facility-extended-metadata.disabled .field-divider {
    margin: 0 auto 1rem auto;
}

.facility-extended-metadata.disabled label {
    color: #888;
}

.facility-extended-metadata.disabled input {
    color: #888;
    background-color: #f4f4f8;
    border: 1px solid #ccc;
}

/**
 * Auth
 */

.sign-in-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: normal;
    align-content: normal;
}

.sign-in-logo,
.sign-in-form {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
}

.sign-in-logo .logo {
    width: 42rem;
    padding: 11rem 8rem 8rem 0;
}

.already-have-an-account {
    text-align: right;
}

.already-have-an-account h4 {
    margin-bottom: 0;
    font-weight: normal;
    color: #666;
}

.already-have-an-account p {
    line-height: 1rem;
}

.already-have-an-account a {
    font-size: 1.25rem;
}

.registration-status {
    margin: 0 auto 2rem auto;
    padding: 0 2rem;
    width: 100%;
    max-width: 40rem;
    background-color: #ffffd8;
    border: 1px solid #ddddaf;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.33);
}

.registration-status p {
    color: #666;
    font-weight: bold;
}

.registration-status a {
    margin-bottom: 1rem;
}

.user-is-not-activated-notification {
    margin-bottom: 3rem;
    padding: 1rem 2rem 2rem 2rem;
    width: auto;
    color: #6d3913;
    background-color: rgba(218, 114, 39, 0.25);
    border: 3px solid #ecb893;
    border-radius: 0.5rem;
}

.user-is-not-activated-notification h2 {
    margin-top: 0.5rem;
    color: #da7227;
    text-shadow: 1px 1px 0 #b0b0b0;
}

.user-is-not-activated-notification ul {
    padding-left: 0;
}

.user-is-not-activated-notification ul li {
    display: inline list-item;
}

.user-is-not-activated-form-notification {
    margin: -1rem 0 0 0;
    padding: 1rem;
    color: #6c5d0d;
    background-color: rgba(217, 186, 26, 0.25);
    border: 2px solid #ecb893;
}

/**
 * Facility Dashboard
 */

#map-content {
    min-width: 1280px;
    background-color: #eaeaef;
}

#map {
    position: absolute;
    left: 512px;
    width: 768px;
    height: 55vh;
    z-index: 1;
}

@media screen and (min-width: 1281px) {
    #map {
        width: calc(100vw - 528px);
    }
}

#map-canvas {
    width: 100%;
    height: 100%;
    z-index: 1;
}

.mapboxgl-marker {
    cursor: pointer;
}

.mapboxgl-popup-content {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    padding: 0 !important;
    width: 288px;
    max-width: 288px;
    box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.75) !important;
}

.mapboxgl-popup-content .popup-image {
    position: relative;
    flex: 0 0 96px;
    align-self: stretch;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 3px 0 0 3px;
    border-right: 1px solid #ccc;
    box-sizing: border-box;
}

.mapboxgl-popup-content .popup-details {
    position: relative;
    padding: 0.25rem 0.5rem 0.25rem 0.5rem;
}

.mapboxgl-popup-content h3 {
    margin: 0;
    font-size: 1rem;
}

.mapboxgl-popup-content p {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.25rem;
}

#map-controls {
    position: absolute;
    top: 10px;
    right: 64px;
    z-index: 2;
}

#map-controls .map-recenter-button,
#map-controls .map-style-button {
    padding: 0.5rem 1.0rem;
    color: #666;
    background-color: #f4f4f8;
    border: 1px solid #d4d4d8;
    border-radius: 4px;
}

#map-controls .map-recenter-button.active,
#map-controls .map-style-button.active {
    background-color: #d4d4d8;
    border: 1px solid #b4b4b8;
}

#map-controls .map-recenter-button {
    margin-right: 2rem;
}

#facilities {
    position: relative;
    width: 512px;
    height: 55vh;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.25);
    z-index: 2;
}

.facilities-controls {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: normal;
    align-items: normal;
    align-content: normal;
    margin: 0 auto;
    padding: 0;
    height: 4rem;
    background-color: #eaeaea;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
    z-index: 3;
}

.facilities-search {
    position: relative;
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
}

#facilities-filter-input {
    position: relative;
    margin: 0.75rem 1rem 0.75rem 0.5rem;
    padding: 0.5rem 0.25rem;
    width: 22rem;
    font-size: 1.1rem;
    border: 1px solid #aaa;
    z-index: 1;
}

#facilities-filter-clear-input-button {
    position: absolute;
    margin: 0.8rem 0 0 -3.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 1.25rem;
    color: #999;
    background-color: transparent;
    border: none;
    z-index: 2;
}

#facilities-filter-clear-input-button:hover {
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.25)
}

.facilities-count {
    position: relative;
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    line-height: 4rem;
    color: #777;
}

#facility-list {
    height: calc(55vh - 4rem);
    overflow-y: scroll;
}

#facility-list .facilities {
    width: 497px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

#facility-list .facility {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: normal;
    align-items: normal;
    align-content: normal;
    margin: 0 auto;
    padding: 0;
    border-bottom: 1px solid #ccc;
    background-color: #f4f4f4;
    box-sizing: border-box;
    cursor: pointer;
}

#facility-list .facility.highlight {
    transition: transform 0.15s ease-in;
}

#facility-list .facility.dim {
    opacity: 0.66;
}

#facility-list .facility .facility-thumbnail {
    position: relative;
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    width: 192px;
    min-width: 192px;
    height: 128px;
    background-color: #d8d8d8;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#facility-list .facility .facility-content {
    display: block;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    padding: 0 1rem;
}

#facility-list .facility .facility-content .facility-data,
#facility-list .facility .facility-content .facility-controls {
    display: block;
    position: relative;
}

#facility-list .facility .facility-content .facility-data h3 {
    width: 277px;
    margin: 0.5rem auto;
    font-family: "Roboto Medium";
    font-size: 1rem;
    font-weight: normal;
    letter-spacing: -0.25px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #555;
}

#facility-list .facility .facility-content .facility-data h4 {
    width: 277px;
    margin: 0 auto 0.5rem auto;
    font-family: "Roboto Regular";
    font-size: 0.9rem;
    font-weight: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #555;
}

#facility-list .facility .facility-content .facility-submission-stage {
    display: flex;
    flex-direction: row;
    padding: 0.5rem;
    border: 1px solid #d8d8d8;
    border-radius: 3px;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-indicator,
#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-display-name {
    display: block;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-label {
    margin-right: 6px;
    font-size: 14px;
    line-height: 14px;
    color: #666;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-indicator {
    width: 12px;
    height: 12px;
    margin-top: 1px;
    background-color: #ccc;
    border-radius: 6px;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-indicator.facility-submission-stage-indicator-blue {
    background-color: #7070d0;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-indicator.facility-submission-stage-indicator-yellow {
    background-color: #e1c840;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-indicator.facility-submission-stage-indicator-green {
    background-color: #46b93c;
}

#facility-list .facility .facility-content .facility-submission-stage .facility-submission-stage-display-name {
    flex: 1;
    margin-left: 6px;
    font-size: 14px;
    line-height: 14px;
    color: #666;
}

#facility-list .facility .facility-content .facility-controls {
    display: flex;
    line-height: 1.5rem;
}

#facility-list .facility .facility-content .facility-controls .facility-list-button {
    font-size: 0.9rem;
    margin: 0.5rem 0.5rem 0.5rem 0;
    padding: 0.5rem 0.75rem;
    line-height: 1rem;
}

#facility-list .add-new-facility {
    position: relative;
    display: flex;
    justify-content: center;
    margin: 4rem 0;
}

#detail-content {
    position: relative;
    margin: 0;
    padding: 0;
    min-width: 1280px;
}

#facility-detail {
    position: relative;
    display: flow-root;
    margin-bottom: 2rem;
    padding: 0;
    background-color: #f4f4f4;
    border-top: 1px solid #888;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.25), 0 2px 5px rgba(0, 0, 0, 0.25);
    z-index: 3;
}

#facility-detail .facility {
    position: relative;
    display: block;
}

#facility-detail .facility-tab-controls {
    display: flex;
    margin-bottom: -1px;
    background-color: #eee;
}

#facility-detail .facility-tab-control {
    padding: 1rem;
    background: #ddd;
    color: #777;
    font-weight: bold;
    border: 1px solid #ccc;
    cursor: pointer;
}

#facility-detail .facility-tab-control.active {
    color: #666;
    background: #f4f4f4;
    border-bottom: #f4f4f4;
}

#facility-detail .facility .facility-tab {
    display: block;
    padding: 1rem;
    border-top: 1px solid #ccc;
}

#facility-detail .facility h2 {
    margin-top: 0;
}

#facility-detail .facility h4 {
    margin-top: 3rem;
    padding: 0;
    color: #666;
    font-weight: normal;
}

#facility-detail .facility .facility-submission-stage-indicator-container {
    display: block;
    position: relative;
    width: 640px;
    min-width: 640px;
    height: 128px;
    min-height: 128px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-1.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-2.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-3.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-4.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-1.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-2.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-3.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-4.fill-blue,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-5.fill-blue {
    background-color: #7070d0;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-1.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-2.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-3.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-4.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-1.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-2.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-3.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-4.fill-yellow,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-5.fill-yellow {
    background-color: #e1c840;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-1.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-2.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-3.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-4.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-1.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-2.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-3.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-4.fill-green,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-5.fill-green {
    background-color: #46b93c;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-1,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-2,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-3,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 128px;
    height: 10px;
    top: 41px;
    background-color: #ccc;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-1 {
    left: 64px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-2 {
    left: 192px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-3 {
    left: 320px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment-4 {
    left: 448px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-1,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-2,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-3,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-4,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-5 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    top: 36px;
    border-radius: 10px;
    background-color: #ccc;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-1 {
    left: 54px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-2 {
    left: 182px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-3 {
    left: 310px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-4 {
    left: 438px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-pip-5 {
    left: 566px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-1,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-2,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-3,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-4,
#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-5 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 96px;
    top: 76px;
    color: #666;
    font-size: 13px;
    text-align: center;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-1 {
    left: 16px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-2 {
    left: 144px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-3 {
    left: 272px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-4 {
    left: 400px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-label-5 {
    left: 528px;
}

#facility-detail .facility .facility-submission-stage-indicator-container .facility-submission-stage-indicator-segment {}

#facility-detail .facility .facility-data .facility-full-height-pane,
#facility-detail .facility .facility-data .facility-top-pane,
#facility-detail .facility .facility-data .facility-bottom-pane {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: normal;
    align-items: normal;
    align-content: normal;
}

#facility-detail .facility .facility-data .facility-full-height-pane {
    padding-bottom: 1rem;
}

#facility-detail .facility .facility-data .facility-top-pane {
    padding-bottom: 0;
    border-bottom: 1px solid #ccc;
}

#facility-detail .facility .facility-data .facility-top-pane .facility-right-pane h3 {
    margin-top: 0;
}

#facility-detail .facility .facility-data .facility-bottom-pane {
    padding-bottom: 1rem;
}

#facility-detail .facility .facility-data .facility-full-width-pane,
#facility-detail .facility .facility-data .facility-left-pane,
#facility-detail .facility .facility-data .facility-right-pane {
    display: block;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    margin: 0;
    padding: 1rem 1rem 0 1rem;
    box-sizing: border-box;
}

#facility-detail .facility .facility-data .facility-full-width-pane {
    width: 100%;
}

#facility-detail .facility .facility-data .facility-top-pane .facility-left-pane,
#facility-detail .facility .facility-data .facility-bottom-pane .facility-left-pane {
    padding-right: 1.5rem;
}

#facility-detail .facility .facility-data .facility-top-pane .facility-right-pane,
#facility-detail .facility .facility-data .facility-bottom-pane .facility-right-pane {
    padding-left: 1.5rem;
}

#facility-detail .facility .facility-data .facility-top-pane .facility-left-pane {
    width: 40%;
}

#facility-detail .facility .facility-data .facility-top-pane .facility-right-pane {
    width: 60%;
}

#facility-detail .facility .facility-data .facility-bottom-pane .facility-left-pane {
    width: 34vw;
    min-width: 453px;
}

#facility-detail .facility .facility-data .facility-bottom-pane .facility-right-pane {
    padding-left: 1.5rem;
    width: 64vw;

}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section {
    margin-bottom: 3rem;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section:last-child,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section:last-child {
    margin-bottom: 1rem;
}

#facility-detail .facility .facility-data-section .facility-data-content {
    margin-bottom: 2rem;
    padding: 1rem;
    font-size: 0.9rem;
    border: 1px solid #ccc;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 1px;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table thead,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-table thead {
    text-align: left;
    border-bottom: 1px solid #292929;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table th,
#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table td,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-table th,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-table td {
    padding: 0.5rem;
    border-bottom: 1px solid #d4d4d8;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table tr:first-child {
    width: 50%;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-table .label,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-table .label {
    width: 50%;
    font-family: 'Roboto Medium';
    font-weight: bold;
    color: #555;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-data-value,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-data-value {
    width: 50%;
    font-family: "Roboto Regular";
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-floor-plan-item,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-floor-plan-item,
#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-site-photo-item,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-site-photo-item {
    position: relative;
    display: inline-block;
    width: 192px;
    vertical-align: top;
    box-sizing: border-box;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-thumbnail,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-thumbnail {
    margin: 0;
    padding: 0;
    width: 192px;
    height: 128px;
    object-fit: cover;
    border: 1px solid #b4b4b8;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content .facility-pdf-thumbnail,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content .facility-pdf-thumbnail {
    width: 192px;
    height: 128px;
    background-repeat: no-repeat;
    background-size: 33%;
    background-position: 50% 50%;
    border: 1px solid #b4b4b8;
}

#facility-detail .facility .facility-data .facility-left-pane .facility-data-section .facility-data-content p,
#facility-detail .facility .facility-data .facility-right-pane .facility-data-section .facility-data-content p {
    position: absolute;
    display: inline;
    bottom: 5px;
    left: 0;
    margin: 0;
    padding: 0 0.5rem;
    font-size: 0.7rem;
    line-height: 1.5rem;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
}

#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-floor-plans-hint,
#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photos-hint {
    margin: 1rem;
}

/* Each site photo is a grid cell: the image, with a kebab options menu in its
   top-right corner and its "Default" badge rendered directly below it. */
#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo {
    position: relative;
    display: inline-block;
    width: 192px;
    margin: 0 0.75rem 0.75rem 0;
    vertical-align: top;
}

#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-default-badge {
    display: block;
    margin-top: 0.35rem;
    text-align: center;
    font-size: 0.75rem;
    font-weight: bold;
    color: #15803d;
}

/* The kebab toggle mirrors the .primary-button colors, border, and (absent)
   box-shadow, including its hover state. */
#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-menu-toggle {
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 2;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    padding: 0;
    line-height: 1;
    color: #fff;
    background-color: #5a78af;
    border: 1px solid #4a689f;
    border-radius: 3px;
    font-size: 1.1rem;
    cursor: pointer;
}

#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-menu-toggle:hover {
    background-color: #4a689f;
    border: 1px solid #3a588f;
}

/* The dropdown options mirror the nav-bar menu items, which sit on the dark
   nav-bar background -- so the container carries that same dark background. */
#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-menu {
    position: absolute;
    top: 30px;
    right: 4px;
    z-index: 3;
    min-width: 140px;
    background-color: #313131;
    border: 1px solid #1c1c1c;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-menu .facility-site-photo-set-default-button {
    display: block;
    width: 100%;
    padding: 0.5rem 0.75rem;
    color: #e8e8e8;
    background-color: #313131;
    border: none;
    border-left: 2px solid #313131;
    text-align: left;
    font-size: 0.8rem;
    cursor: pointer;
}

#facility-detail .facility .facility-data .facility-data-section .facility-data-content .facility-site-photo .facility-site-photo-menu .facility-site-photo-set-default-button:hover {
    background-color: #292929;
    border-left: 2px solid #00c9c9;
}

#facility-detail .facility .facility-condition-assessments-assets-dashboard {
    overflow-x: scroll;
}

#facility-detail .facility .facility-walkthrough-iframe {
    height: 80vh;
}

#facility-detail .facility .summary-tables-container {
    display: flex;
}

#facility-detail .facility .summary-table-container {
    display: block;
    width: 33%;
    padding: 1rem 4rem 2rem 4rem;
    border-right: 1px solid #dbdbdb;
    border-left: 1px solid #dbdbdb;

}

#facility-detail .facility .summary-table-container:first-of-type {
    padding-left: 0;
    border: none;
}

#facility-detail .facility .summary-table-container:last-of-type {
    padding-right: 0;
    border: none;
}

#facility-detail-hint {
    position: relative;
    display: block;
    margin: 10rem auto;
    width: 32rem;
    font-family: 'Roboto Light';
    font-size: 1.25rem;
    text-align: center;
}

#action-center {
    position: relative;
    margin: 0;
    padding: 1rem 1rem 5rem 1rem;
}

/**
 * Document Uploader
 */

.uploader-options {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
    margin-bottom: 2rem;
    width: 100%;
}

.uploader-options .uploader-option {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
    margin: 0 0.75rem;
    padding: 2rem;
    width: calc(33.3333% - 1rem);
    box-sizing: border-box;
}

.uploader-options .uploader-option:first-of-type {
    margin-left: 0;
}

.uploader-options .uploader-option:last-of-type {
    margin-right: 0;
}

.uploader-option-vertical-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.uploader-options .uploader-option .uploader-option-title {
    flex-grow: 0;
    margin-top: 0;
}

.uploader-options .uploader-option .uploader-option-description {
    flex-grow: 0;
}

.uploader-options .uploader-option .uploader-option-description p {
    margin: 0 auto;
}

.uploader-options .uploader-option .uploader-option-description ul {
    margin: 0 auto 1rem auto;
    line-height: 1.5rem;
}

.uploader-options .uploader-option .uploader-option-vertical-spacer {
    flex-grow: 1;
}

.uploader-options .uploader-option .uploader-option-button {
    flex-grow: 0;
    margin: 2rem auto 0 auto;
}

.no-facilities-container {
    padding: 2rem;
}

.no-facilities-container h4 {
    margin-bottom: 0;
}

.no-facilities-container a {
    font-size: 1.25rem;
    font-weight: normal;
}

/**
 * Management Tables
 */

.document-library,
.tto-identities,
.tto-members,
.tto-member-invitations,
.tto-custom-facets,
.facility-condition-assessments-assets,
.facility-import-creating,
.facility-import-updating {
    padding: 2rem;
    box-sizing: border-box;
}

.facility-import-creating,
.facility-import-updating {
    padding: 0;
}

table.data-table,
.document-library table,
.tto-identities table,
.tto-members table,
.tto-member-invitations table,
.tto-custom-facets table,
.facility-condition-assessments-assets-preview table,
.facility-condition-assessments-assets table,
.facility-condition-assessments-assets-dashboard table,
.facility-import-creating table,
.facility-import-updating table {
    font-size: 0.8125rem;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

table.data-table thead,
.document-library table thead,
.tto-identities table thead,
.tto-members table thead,
.tto-member-invitations table thead,
.tto-custom-facets table thead,
.facility-condition-assessments-assets-preview table thead,
.facility-condition-assessments-assets table thead .facility-condition-assessments-assets-dashboard table thead,
.facility-import-creating table thead,
.facility-import-updating table thead {
    background: #cfcfcf;
}

table.data-table thead th,
table.data-table tbody td,
.document-library table thead th,
.document-library table tbody td,
.tto-identities table thead th,
.tto-identities table tbody td,
.tto-members table thead th,
.tto-members table tbody td,
.tto-member-invitations table thead th,
.tto-member-invitations table tbody td,
.tto-custom-facets table thead th,
.tto-custom-facets table tbody td,
.facility-condition-assessments-assets-preview table thead th,
.facility-condition-assessments-assets-preview table tbody td,
.facility-condition-assessments-assets table thead th,
.facility-condition-assessments-assets table tbody td,
.facility-condition-assessments-assets-dashboard table thead th,
.facility-condition-assessments-assets-dashboard table tbody td,
.facility-import-creating table tbody td,
.facility-import-updating table tbody td {
    position: relative;
    padding: 0.25rem 0.5rem;
    border: 1px solid #c8c8c8;
    border-left: 1px solid #f0f0f0;
    border-right: 1px solid #f0f0f0;
}

table.data-table thead th,
.document-library table thead th,
.tto-identities table thead th,
.tto-members table thead th,
.tto-member-invitations table thead th,
.facility-condition-assessments-assets-preview table thead th,
.facility-condition-assessments-assets table thead th,
.facility-condition-assessments-assets-dashboard table thead th,
.facility-import-creating table thead th,
.facility-import-updating table thead th {
    font-family: "Roboto Medium";
    font-size: 0.85rem;
    font-weight: normal;
    text-align: left;
    letter-spacing: 0.05rem;
    white-space: nowrap;
    color: #555;
    background-color: #e8e8e8;
    border: 1px solid #c8c8c8;
}

table.data-table thead th.highlight {
    background-color: #dbdbdb;
}

table.data-table thead th a,
.document-library table thead th a,
.tto-identities table thead th a,
.tto-members table thead th a,
.tto-member-invitations table thead th a,
.tto-custom-facets table thead th a,
.facility-condition-assessments-assets-preview table thead th a,
.facility-condition-assessments-assets table thead th a,
.facility-condition-assessments-assets-dashboard table thead th a,
.facility-import-creating table thead th a,
.facility-import-updating table thead th a {
    margin-right: 1.5rem;
}

table.data-table thead th .sort,
.document-library table thead th .sort,
.tto-identities table thead th .sort,
.tto-members table thead th .sort,
.tto-member-invitations table thead th .sort,
.tto-custom-facets table thead th .sort,
.facility-condition-assessments-assets-preview table thead th .sort,
.facility-condition-assessments-assets table thead th .sort,
.facility-condition-assessments-assets-dashboard table thead th .sort,
..facility-import-creating table thead th .sort,
.facility-import-updating table thead th .sort {
    position: absolute;
    top: 0.15rem;
    right: 0.15rem;
    width: 1rem;
}

table.data-table tbody td.highlight {
    background-color: #f4f4f4;
}

table.data-table tbody td:first-of-type,
.document-library table tbody td:first-of-type,
.tto-identities table tbody td:first-of-type,
.tto-members table tbody td:first-of-type,
.tto-member-invitations table tbody td:first-of-type,
.tto-custom-facets table tbody td:first-of-type,
.facility-condition-assessments-assets-preview table tbody td:first-of-type,
.facility-condition-assessments-assets table tbody td:first-of-type,
.facility-condition-assessments-assets-dashboard table tbody td:first-of-type,
.facility-import-creating table tbody td:first-of-type,
.facility-import-updating table tbody td:first-of-type {
    border-left: 1px solid #c8c8c8;
}

table.data-table tbody td:last-of-type,
.document-library table tbody td:last-of-type,
.tto-identities table tbody td:last-of-type,
.tto-members table tbody td:last-of-type,
.tto-member-invitations table tbody td:last-of-type,
.tto-custom-facets table tbody td:last-of-type,
.facility-condition-assessments-assets-preview table tbody td:last-of-type,
.facility-condition-assessments-assets table tbody td:last-of-type,
.facility-condition-assessments-assets-dashboard table tbody td:last-of-type,
.facility-import-creating table tbody td:last-of-type,
.facility-import-updating table tbody td:last-of-type {
    min-width: 20%;
    border-right: 1px solid #c8c8c8;
}

table.data-table tbody td.no-assets,
.document-library table tbody td.no-assets,
.tto-identities table tbody td.no-assets,
.tto-members table tbody td.no-assets,
.tto-member-invitations table tbody td.no-assets,
.tto-custom-facets table tbody td.no-assets,
.facility-condition-assessments-assets-preview table tbody td.no-assets,
.facility-condition-assessments-assets table tbody td.no-assets,
.facility-condition-assessments-assets-dashboard table tbody td.no-assets,
.facility-import-creating table tbody td.no-assets,
.facility-import-updating table tbody td.no-assets {
    padding: 2rem;
    text-align: center;
}

table.data-table tbody td .table-manage-button,
.document-library table tbody td .table-manage-button,
.tto-identities table tbody td .table-manage-button,
.tto-members table tbody td .table-manage-button,
.tto-member-invitations table tbody td .table-manage-button,
.tto-custom-facets table tbody td .table-manage-button,
.facility-condition-assessments-assets-preview table tbody td .table-manage-button,
.facility-condition-assessments-assets table tbody td .table-manage-button,
.facility-import-creating table tbody td .table-manage-button,
.facility-import-updating table tbody td .table-manage-button {
    display: inline-block;
    margin: 0 0.5rem 0.5rem 0;
    padding: 0.5rem;
    color: #0978e7;
    background-color: transparent;
    border: 1px solid #0978e7;
    border-radius: 0.25rem;
    cursor: pointer;
}

table.data-table tbody td .table-manage-button.delete {
    color: #aa0000;
    border-color: #aa0000;
}

.document-library table tbody td.no-documents,
.tto-identities table tbody td.no-tto-identities,
.tto-members table tbody td.no-members,
.tto-member-invitations table tbody td.no-member-invitations,
.tto-custom-facets table tbody td.no-custom-facets,
.facility-condition-assessments-assets-preview table tbody td.no-facility-condition-assessment-assets,
.facility-condition-assessments-assets table tbody td.no-facility-condition-assessment-assets,
.facility-condition-assessments-assets-dashboard table tbody td.no-facility-condition-assessment-assets,
.facility-import-creating table tbody td.no-facilities,
.facility-import-updating table tbody td.no-facilities {
    text-align: center;
    padding: 2rem;
    font-size: 1rem;
}

.data-table tr.highlight,
.summary-table tr.highlight {
    background-color: #dbdbdb;
}

.summary-table {
    width: 100%;
    border-collapse: collapse;
}

.summary-table th,
.summary-table td {
    padding: 0.5rem 0;
}

.summary-table tbody th,
.summary-table td {
    border-bottom: 1px dotted #aaa;
}

.summary-table th:first-of-type,
.summary-table td:first-of-type {
    text-align: left;
}

.summary-table thead th:last-of-type,
.summary-table td:last-of-type {
    text-align: right;
}

.admin-temporarily-join-tto-button {
    font-size: 0.8125rem;
    color: #0978e7;
    text-decoration: none;
    background-color: transparent;
    cursor: pointer;
}

.facility-document-preview,
.facility-image-preview {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    height: 64px;
    border: 1px solid #b4b4b8;
}

.facility-document-preview {
    margin: 0 auto;
    width: 48px;
    background-position: 75% 50%;
    background-repeat: no-repeat;
    background-size: 80%;
    border: none;
}

.facility-image-preview {
    width: 96px;
    object-fit: cover;
}

.member-invitation-link {
    width: 100%;
    height: 2.5rem;
    margin: 0 0 0.5rem 0;
    padding: 0.5rem;
    font-size: 0.9rem;
    line-height: 1rem;
    background-color: #f8f8f8;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
}

.copy-member-invitation-link {
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
    line-height: 1rem;
}

.asset-table {
    width: 100%;
    border-collapse: collapse;
}

.asset-table th,
.asset-table td {
    padding: 0.75rem 1.5rem;
    text-align: left;
}

.asset-table th:first-child,
.asset-table td:first-child {
    padding-left: 0;
}

.asset-table thead tr th,
.asset-table tbody tr td {
    border-bottom: 1px dotted #666;
}

.asset-table td .button {
    min-width: 12rem;
}

/**
 * TTO Membership
 */

#tto-member-invitations-table-container h2,
#tto-members-table-container h2 {
    margin-top: 0;
}

#tto-member-invitations-table-container {
    margin-bottom: 2rem;
}

#invite-member-button {
    display: block;
    margin: 2rem auto 0rem auto;
}

#password-confirmation-error-container {
    line-height: 2rem;
}

/**
 * Custom Facets
 */

#create-custom-facet-button {
    display: table;
    margin: 2rem auto 0rem auto;
}

/**
 * Modal
 */

.modal-mask {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.modal {
    position: fixed;
    display: none;
    top: 12rem;
    left: calc(50% - 18rem);
    width: 36rem;
    padding: 2rem;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #ccc;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #bbb;
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.25);
}

.modal-mask.active,
.modal.active {
    display: block;
}

.modal-title {
    margin-top: 0;
    padding-right: 2rem;
    color: #da7227;
}

.modal-cancel-x {
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 1.25rem;
    color: #888;
    background: none;
    border: none;
    cursor: pointer;
}

.modal-cancel-x:hover {
    color: #555;
}

.modal-description {
    margin-bottom: 1rem;
    padding-right: 1rem;
}

.modal-spacer {
    margin: 0;
    height: 1.5rem;
}

.modal-label {
    display: block;
    margin: 0 0 -0.33rem 2rem;
    padding: 0;
    font-size: 0.9rem;
    color: #555;
    box-sizing: border-box;
}

.modal-input {
    display: block;
    margin: 0.5rem 0 0 2rem;
    padding: 0.5rem;
    width: auto;
    font-size: 1.1rem;
    line-height: 1.5rem;
    color: #555;
    border: 1px solid #aaa;
    border-radius: 3px;
    box-sizing: border-box;
}

.modal-input+.modal-label {
    margin-top: 1rem;
}

.modal-confirm-input {
    padding: 0.5rem;
}

.modal-buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: normal;
    align-content: normal;
    margin: 3rem 0 0 0;
}

/**
 * Admin
 */

.admin-tto-data {
    min-width: 72rem;
    padding: 2rem;
    box-sizing: border-box;
}

.admin-tto-data table {
    font-size: 0.8125rem;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.admin-tto-data table thead th {
    font-family: "Roboto Medium";
    font-size: 0.85rem;
    font-weight: normal;
    text-align: left;
    letter-spacing: 0.05rem;
    white-space: nowrap;
    color: #fff;
    background: #da7227;
    border: 1px solid #c8c8c8;
}

.admin-tto-data table thead th:first-child {
    width: 3rem;
}

.admin-tto-data table thead th,
.admin-tto-data table tbody tr td {
    position: relative;
    padding: 0.75rem 0.5rem;
    border: 1px solid #c8c8c8;
    border-left: 1px solid #f0f0f0;
    border-right: 1px solid #f0f0f0;
}

.admin-tto-data table thead th:first-child,
.admin-tto-data table tbody tr td:first-child {
    border-left: 1px solid #c8c8c8;
}

.admin-tto-data>table>tbody>tr>td:first-child {
    padding: 0;
}

.admin-tto-data table thead th:last-child,
.admin-tto-data table tbody tr td:last-child {
    border-right: 1px solid #c8c8c8;
}

.expand-arrow {
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.expand-arrow-glyph {
    display: block;
    position: relative;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    transform-origin: center;
    user-select: none;
    -webkit-user-select: none;
}

.expand-arrow.expanded .expand-arrow-glyph {
    rotate: 90deg;
}

/* The detail row's content cell starts in the second column (an empty cell fills
   the toggle column), so the amounts table lines up with the mapping's display
   name; it renders as a data-table rather than inheriting the outer asset-table's
   dotted cell borders (which bleed in via the descendant selector). */
.comp-element-mappings-table .comp-element-mappings-detail table.data-table thead th,
.comp-element-mappings-table .comp-element-mappings-detail table.data-table tbody td {
    /* Uniform padding on every cell: overrides the outer .asset-table's
       td:first-child { padding-left: 0 } bleed, which would otherwise strip the
       left padding from whichever cell happens to be first in a rowspan's
       continuation rows (e.g. the facility cell on a second override row). */
    padding: 0.25rem 0.5rem;
    border: 1px solid #c8c8c8;
    border-left: 1px solid #f0f0f0;
    border-right: 1px solid #f0f0f0;
}

/* The rowspan-ed element and prorated-pool cells align to the top so they sit
   beside the first of their facility-override rows rather than centering across
   the group. */
.comp-element-mappings-table .comp-element-mappings-detail table.data-table tbody td[rowspan] {
    vertical-align: top;
}

/* Shrink the delete button ~25% from the default asset-table button size
   (min-width 12rem, 0.33rem/1rem padding, 1rem font). */
.comp-element-mappings-table td .button.delete-button,
.budget-year-final-negotiated-leases-table td .button.delete-button {
    min-width: 9rem;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
}

.admin-tto-data .tto-data {
    display: none;
}

.admin-tto-data .tto-data.expanded {
    display: table-row;
}

.admin-tto-data .tto-data.expanded>td.inset {
    background-color: #f4f4f4;
}

.admin-tto-data .tto-data.expanded>td:nth-child(2) {
    padding: 1rem 2rem 2rem 2rem;
}

.admin-tto-data .tto-data.expanded h2 {
    color: #6f969f;
}

table.tto-primary-contact-details {
    width: auto;
    font-size: 0.9rem;
    background-color: #f4f4d0;
}

table.tto-primary-contact-details tbody tr td,
table.tto-primary-contact-details tbody tr td:first-child,
table.tto-primary-contact-details tbody tr td:last-child {
    padding: 0.5rem;
    border: none;
}

table.tto-primary-contact-details tbody tr td:first-child {
    padding-right: 2rem;
}

.admin-tto-data .tto-data-no-users,
.admin-tto-data .tto-data-no-facilities,
.admin-tto-data .tto-data-no-documents {
    margin: 1rem auto 2rem auto;
    font-weight: normal;
}

.admin-tto-data .tto-data.expanded table {
    margin-bottom: 2rem;
}

.admin-tto-data .tto-data.expanded table thead {
    background: none;
}

.admin-tto-data .tto-data.expanded table thead th {
    color: #555;
    background: none;
    border: none;
}

.admin-tto-data .tto-data.expanded table thead th.tto-data-timestamp,
.admin-tto-data .tto-data.expanded table thead td.tto-data-timestamp {
    width: 11rem;
}

.document-download-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    align-content: stretch;
}

.document-download {
    display: block;
    margin-right: 0.25rem;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: auto;
    order: 0;
}

.open-in-new-window {
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
}

.admin-assume-tto-identity .assumed-tto-identity-container {
    padding: 0.5rem;
    background-color:
}

.admin-assume-tto-identity .assumed-tto-identity-label {
    font-size: 1.1rem;
}

.admin-assume-tto-identity .tto-display-name {
    font-weight: bold;
}

/**
 * Lease Application Worksheet
 */

.a-i {
    padding: 1rem;
    border: 1px solid #ccc;
}

.a-i-table,
.offsets-table {
    font-size: 0.9rem;
    border-collapse: collapse;
    border: 1px solid #ccc;
}

.a-i-table tr,
.offsets-table tr {
    border-bottom: 1px solid #ccc;
}

.a-i-table tr:hover td,
.offsets-table tr:hover th {
    background-color: #f4f4f4;
}

.a-i-table tr.subtotal,
.offsets-table tr.subtotal {
    font-weight: bold;
    text-align: right;
}

.a-i-table td,
.offsets-table td {
    padding: 0.5rem;
}

.a-i-table td[colspan],
.offsets-table td[colspan] {
    text-align: right;
}

.a-i-table td[rowspan],
.offsets-table td[rowspan] {
    border-right: 1px solid #ccc;
}

.a-i-table h3 {
    margin: 0;
}

.a-i-table input,
.offsets-table input {
    margin: 0;
    padding: 0.25rem 0.5rem;
    width: 16rem;
    font-size: 1rem;
    line-height: 2rem;
    color: #555;
    border: 1px solid #aaa;
    box-sizing: border-box;
}

.offsets-table tbody tr:first-child td {
    text-decoration: underline;
}

.field.error #facility_condition_assessment_facility_id,
.field.error #facility_condition_assessment_assessment_date,
.field.error #facility_condition_assessment_csv {
    margin-bottom: 0;
}

#facility_condition_assessment_facility_id_error,
#facility_condition_assessment_assessment_date_error,
#facility_condition_assessment_csv_error {
    display: none;
}

.field.error #facility_condition_assessment_facility_id_error,
.field.error #facility_condition_assessment_assessment_date_error,
.field.error #facility_condition_assessment_csv_error {
    display: block;
}

#csv-summary {
    display: none;
    align-items: center;
    gap: 0.5rem;
    margin: 0 auto 1rem auto;
    padding: 1rem;
    border: 1px solid #ccc;
    background-color: #f8f8f8;
}

#csv-summary-checkmark {
    font-size: 2rem;
    color: #46b93c;
}

#csv-summary.visible {
    display: flex;
}

#facility-condition-assessments-assets-table-container {
    overflow: scroll;
}

#facility_condition_assessments_assets {
    display: block;
    overflow-x: scroll;
}

/**
 * Multi-file upload
 */

.multi-file-upload-container {
    padding: 2rem;
    box-sizing: border-box;
}

.file-input-container {
    position: relative;
    width: 100%;
    min-width: 48rem;
    height: 10rem;
    margin: 0 auto 2rem auto;
    padding: 2rem;
    border: 2px dashed #ccc;
}

.file-input-container.dragging {
    background-color: #f4f4f4;
}

.file-input-container .file-input-proxy {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.file-input-container .file-input {
    display: none;
}

.file-input-container .default-hint,
.file-input-container .drop-hint {
    font-size: 1.4rem;
    color: #888;
    text-align: center;
}

.file-input-container .default-hint {
    display: block;
    margin: 0.5rem auto;
}

.file-input-container .default-hint .already-have-files-hint {
    margin-top: 1.5rem;
}

.file-input-container .drop-hint {
    display: none;
    margin: 2rem auto;
}

.file-input-container.dragging .default-hint {
    display: none;
}

.file-input-container.dragging .file-input {
    display: none;
}

.file-input-container.dragging .drop-hint {
    display: block;
}

.file-list {
    margin-bottom: 2rem;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.file-list h2 {
    text-shadow: none;
    text-align: center;
    font-size: 1.25rem;
    margin: 2rem auto;
}

.file-list-item {
    display: block;
    width: 100%;
    margin: 1rem auto;
    padding: 1rem;
    border: 1px solid #ccc;
    background-color: #fafafa;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.file-list-item.display-name-required,
.file-list-item.facility-id-required,
.file-list-item.document-type-id-required {
    padding: 1rem 1rem 1rem calc(0.5rem + 1px);
    border-left: 0.5rem solid #ff4444;
}

.file-list-item.upload-successful {
    opacity: 0.5;
}

.file-list-item .fields {
    display: flex;
    position: relative;
    width: 100%;
}

.file-list-item .fields .left,
.file-list-item .fields .right {
    flex: 0;
}

.file-list-item .fields .left {
    flex-basis: 12rem;
}

.file-list-item .fields .left .preview {
    width: 10rem;
}

.file-list-item .fields .left .preview .facility-image-preview {
    width: 100%;
    height: auto;
}

.file-list-item .fields .left .preview .facility-document-preview {
    width: 5rem;
    height: 5rem;
}

.file-list-item .fields .middle {
    flex: 1;
}

.file-list-item .fields .middle .top-row,
.file-list-item .fields .middle .bottom-row {
    display: flex;
    margin-bottom: 1rem;
}

.file-list-item .fields .right {
    align-content: center;
}

.file-list-item .fields .middle .filename,
.file-list-item .fields .middle .display-name,
.file-list-item .fields .middle .facility-select,
.file-list-item .fields .middle .document-type-select {
    flex: 1;
}

.file-list-item .fields .middle .filename label,
.file-list-item .fields .middle .display-name label,
.file-list-item .fields .middle .facility-select label,
.file-list-item .fields .middle .document-type-select label {
    display: block;
    color: #888;
}

.file-list-item .fields .middle .filename .filename-value {
    margin: 0.25rem 0;
    font-size: 1rem;
}

.file-list-item .fields .middle .display-name input {
    width: 90%;
    margin: 0 0 0.25rem 0;
    padding: 0.5rem;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #555;
    border: 1px solid #aaa;
    border-radius: 3px;
}

.file-list-item.display-name-required .fields .middle .display-name input {
    outline: 2px solid #ff4444;
}

.file-list-item .fields .middle .display-name input[disabled="disabled"] {
    color: #777;
    background-color: #f4f4f4;
    border: 1px solid #ccc;
}

.file-list-item .fields .middle .facility-select select,
.file-list-item .fields .middle .document-type-select select {
    width: 90%;
    height: 2.6433333rem;
    margin: 0 0 0.25rem 0;
    padding: 0.5rem;
    color: #555;
    font-size: 1rem;
    line-height: 1.5rem;
    background-color: #f4f4f4;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.file-list-item.facility-id-required .fields .middle .facility-select select {
    outline: 2px solid #ff4444;
}

.file-list-item.document-type-id-required .fields .middle .document-type-select select {
    outline: 2px solid #ff4444;
}

.file-list-item .fields .middle .facility-select select[disabled="disabled"],
.file-list-item .fields .middle .document-type-select select[disabled="disabled"] {
    color: #777;
}

.file-list-item .fields .right .remove-file-button {
    flex-basis: 6rem;
    padding: 0.5rem 1rem;
    color: #555;
    background-color: #f4f4f4;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.file-list-item .fields .right .remove-file-button:hover {
    color: #555;
    background-color: #eaeaea;
    border: 1px solid #ccc;
}

.file-list-item .fields .right .remove-file-button:active {
    color: #555;
    background-color: #dadada;
    border: 1px solid #bbb;
}

.file-list-item .fields .right .remove-file-button[disabled="disabled"] {
    color: #ccc;
    background-color: #eee;
    border: 1px solid #ccc;
}

.file-list-item .upload-progress-container {
    position: relative;
    display: block;
    width: 100%;
    height: 1.5rem;
    background-color: #eee;
    border: 1px solid #ddd;
}

.file-list-item .upload-progress-container .upload-progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0;
    background-color: #6f969f;
}

.file-list-item .upload-progress-container .upload-progress-label {
    position: absolute;
    display: block;
    top: 0.175rem;
    left: 0;
    width: 100%;
    color: #888;
    font-size: 0.85rem;
    text-align: center;
}

.file-list-item .upload-progress-container.active .upload-progress-label {
    color: #fff;
}

.upload-button {
    display: block;
    margin: 0 auto;
}

/**
 * Facility Import
 */

.import-facilities .import-result-summary table {
    width: 100%;
    border-collapse: collapse;
}

.import-facilities .import-result-summary table td {
    border-bottom: 1px solid #ccc;
}

#import-facilities-submit,
#import-facilities-done {
    margin: 0 auto;
}

#import-facilities-long-running-action {
    display: flex;
    align-items: center;
    gap: 2rem;
    border: 1px solid #555;
    padding: 1rem;
    margin: 2rem 0.5rem 1rem 0.5rem;
    background-color: #f4f4f4;
}

#import-facilities-long-running-action .icon {
    font-size: 2rem;
}

/**
 * Import Financials
 */

body.dragging-file::before {
    content: 'Drop CSV file';
    position: fixed;
    inset: 0;
    display: grid;
    font-family: 'Roboto Medium';
    font-size: 2rem;
    color: #888;
    place-items: center;
    background: rgb(255 255 255 / 0.8);
    border: 4px dashed #999;
    z-index: 9999;
    pointer-events: none;
}

.computation-preview-modal {
    z-index: 100;
}

.map-facilities-modal {
    z-index: 101;
}

.select-facility-modal {
    z-index: 102;
}

.map-comp-elements-modal {
    z-index: 103;
}

.map-comp-elements-add-mapping-modal {
    z-index: 104;
}

.map-values-modal .mapping .control {
    display: flex;
}

.map-values-modal .mappings {
    padding: 1rem;
    height: 46rem;
    background-color: #f4f4f4;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    overflow-y: scroll;
}

.map-values-modal .mappings .mapping {
    margin: 0 0 1rem 0;
    padding: 1rem;
    background-color: #fff;
    border: 1px solid #ccc;
}

.map-values-modal .mappings .mapping .metadata-column {
    width: 46rem;
}

.map-values-modal .mapping .control .mapping-column {
    padding: 1rem;
    min-height: 2rem;
    width: 38rem;
}

.map-values-modal .mapping .control .count-column {
    text-align: right;
}

.map-values-modal .mapping .control .mapping-column.field select {
    margin: 0;
}

.map-values-modal .mapping .control .mapping-column.field .mapped-facility-controls {
    display: flex;
}

.map-values-modal .mapping .control .mapping-column.field .mapped-facility-controls .select-facility-button {
    margin-right: 2rem;
}

.map-comp-elements-modal .mappings .metadata-column .value {
    margin-bottom: 0;
}

.map-comp-elements-modal .mappings .metadata-column .count {
    font-size: 1rem;
}

.map-values-modal .mappings .comp-element-mapping {
    flex: 1;
    margin-bottom: 1rem;
    padding: 1rem;
    background-color: #fcfcfc;
    border: 1px solid #ccc;
}

.map-values-modal .mappings .comp-element-mapping .edit-mapping-label {
    margin-bottom: 1rem;
    font-size: 1.1rem;
    line-height: 2.25rem;
    font-family: 'Roboto Regular';
    color: #999;
}

.map-comp-elements-modal .filter {
    display: flex;
    align-items: center;
}

.map-comp-elements-modal .map-comp-elements-filter-input {
    position: relative;
    margin: 0.75rem 1rem 0.75rem 0;
    padding: 0.5rem 0.25rem;
    width: 22rem;
    font-size: 1.1rem;
    border: 1px solid #aaa;
    z-index: 1;
}

.map-comp-elements-modal .map-comp-elements-filter-clear-input-button {
    position: absolute;
    margin: 0.8rem 0 0 -3.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 1.25rem;
    color: #999;
    background-color: transparent;
    border: none;
    z-index: 2;
}

.map-comp-elements-modal .mappings .comp-element-mapping .edit-mapping-label .mapping-label-value-count,
.map-comp-elements-modal .mappings .comp-element-mapping .edit-mapping-label .mapping-label-comp-element,
.map-comp-elements-modal .mappings .comp-element-mapping .edit-mapping-label .mapping-label-conditional-column {
    padding: 0.5rem;
    font-family: 'Roboto Medium';
    color: #666;
    white-space: nowrap;
    background-color: #f4f4f4;
}

.map-comp-elements-modal .mappings .comp-element-mapping .mapping-controls {
    display: flex;
    justify-content: space-between;
}

.map-comp-elements-add-mapping-modal.modal.wide .content {
    width: 80rem;
    left: calc((100vw - 80rem) / 2);
}

.map-comp-elements-add-mapping-modal .mapping {
    font-size: 1.25rem;
    border: 1px solid #ccc;
}

.map-comp-elements-add-mapping-modal .mapping .description {
    padding: 1rem;
    font-family: 'Roboto Regular';
    color: #666;
    background-color: #f4f4f4;
}

.map-comp-elements-add-mapping-modal .mapping .comp-element-clause {
    display: flex;
    align-items: center;
    padding: 1rem;
    border-left: 1rem solid #f4f4f4;
}

.map-comp-elements-add-mapping-modal .mapping .comp-element-clause-label {
    flex: 0 0 18rem;
    padding-right: 2rem;
    font-family: 'Roboto Regular';
    text-align: right;
    color: #666;
}

.map-comp-elements-add-mapping-modal .mapping .comp-element-clause-control {
    display: flex;
    align-items: center;
    flex: 0 1 40rem;
    width: 40rem;
}

.map-comp-elements-add-mapping-modal .mapping .column-clause {
    display: flex;
    align-items: center;
    padding: 0 1rem 1rem 1rem;
    border-left: 1rem solid #f4f4f4;
}

.map-comp-elements-add-mapping-modal .mapping .column-clause-label {
    flex: 0 0 18rem;
    padding-right: 2rem;
    font-family: 'Roboto Regular';
    text-align: right;
    color: #666;
}

.map-comp-elements-add-mapping-modal .mapping .column-clause-control {
    display: flex;
    align-items: center;
    flex: 0 1 40rem;
    width: 40rem;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values-helper-controls {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1rem solid #f4f4f4;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values-helper-controls .button {
    width: 8rem;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values {
    padding: 1rem;
    max-height: 32rem;
    border-left: 1rem solid #f4f4f4;
    overflow-y: scroll;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values table tbody tr td {
    width: 36rem;
    padding: 1rem;
    border-bottom: 1px dotted #ccc;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values table tbody tr td .unique-value {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values table tbody tr td .unique-value .unique-value-checkbox {
    flex: 0 0 auto;
}

.map-comp-elements-add-mapping-modal .mapping .allowed-values table tbody tr td .unique-value .unique-value-label {
    flex: 1 1 auto;
}

.computation-preview-modal .preview {
    height: 46rem;
    overflow-y: scroll;
}

.computation-preview-modal .preview .mapping-conflicts-title {
    font-size: 1.5rem;
}

.computation-preview-modal .mapping-conflict {
    margin: 0 1rem 1rem 0;
    padding: 1rem 1rem 2rem 1rem;
    border: 1px solid #ccc;
}

.computation-preview-modal .mapping-conflict .mapping-conflict-title {
    font-size: 1.1rem;
}

.computation-preview-modal .mapping-conflict .data-table-container {
    overflow-x: scroll;
}

.computation-preview-modal .mapping-conflict-rules {
    margin-bottom: 1rem;
    font-family: 'Roboto Regular';
}

.computation-preview-modal .mapping-conflict-rules li {
    margin: 0;
    padding: 1rem 1rem 2rem 1rem;
    font-size: 1.1rem;
    line-height: 2.75rem;
    background-color: #f6f6f6;
    border-bottom: 1px dotted #aaa;
}

.computation-preview-modal .mapping-conflict-rules li:last-of-type {
    border-bottom: none
}

.computation-preview-modal .mapping-conflict-rules li .mapped-value {
    padding: 0.5rem;
    font-family: 'Roboto Medium';
    color: #666;
    white-space: nowrap;
    background-color: #e8e8e8;
}

.computation-preview-modal .mapping-conflict-rules .mapping-conflict-controls {
    margin-top: 0.5rem;
}

.computation-preview-modal .mapping-conflict-rules .mapping-conflict-controls .button {
    margin: 0;
    padding: 0 1rem;
    height: 2rem;
    font-size: 0.9rem;
    line-height: 2rem;
}

.computation-preview-modal .mapping-conflict-rules .button:last-of-type {
    margin-left: 1rem;
}

.computation-preview-modal .mapping-conflict-message {
    margin: 0 1rem 0 0;
    padding: 1rem;
    font-family: 'Roboto Regular';
    font-size: 1.1rem;
    color: #dd4444;
    border: 1px solid #dd4444;
}

.visibility-toggle {
    display: flex;
    width: 13rem;
    cursor: pointer;
    user-select: none;
}

.visibility-toggle .icon {
    width: 1.5rem;
    height: 1.5rem;
    transform: translate(0.5rem, 0);
}

.visibility-toggle.active .icon {
    transform: translate(0, -0.5rem) rotate(-90deg);
}

.visibility-toggle .label {
    margin-left: 0.5rem;
    height: 2rem;
    line-height: 1.5rem;
}

.column-section .visibility-toggle {
    margin-top: 1.5rem;
}

.sample-data {
    overflow-x: scroll;
}

.computation-result-modal .update-summary-table {
    width: 32rem;
}

.computation-result-modal .update-failures-title {
    margin-top: 3rem;
}

.computation-result-modal .update-failures-container {
    height: 32rem;
    overflow-y: scroll;
}

/**
 * Facility Asset Tags
 */

.facility-asset-tags .error {
    padding: 2rem;
}

.facility-asset-tags #selected-facility .display-name {
    font-size: 1.25rem;
    line-height: 2.5rem;
}

.facility-asset-tags #clear-selected-facility-button {
    margin: 1rem 0;
}

/**
 * Submittals
 */

.submittal-configuration-form .metadata-section,
.submittal-configuration-form .government-document-section,
.submittal-configuration-form .tto-letterhead-section,
.submittal-configuration-form .facilities-section,
.submittal-configuration-form .comp-element-mappings-section {
    margin-bottom: 2rem;
}

.submittal-configuration-form .facilities-section .asset-table {
    margin: 0 1rem;
}

.facility-include-in-submittal,
.facility-newly-constructed {
    width: 17rem;
}

/* Keep the facility name/address column narrow so the form-input columns get
   the remaining width. */
.submittal-configuration-form .facilities-section .facility-details {
    width: 26rem;
}

/* The include-in-submittal cell now spans two columns (facility occupancy days
   moved to its own row), so keep the checkbox and its label hugging the left
   rather than letting the input stretch across the widened cell. */
.facility-include-in-submittal .control-input {
    flex: 0 0 auto;
}

.submittal-configuration-form .facilities-section .facility-supplemental-row td {
    border-top-style: hidden;
}

.facility-certificate-of-occupancy .error-message,
.facility-input-container .error-message {
    background-color: rgba(217, 24, 24, 0.1);
    padding: 1rem;
    border: 2px solid rgba(217, 24, 24, 0.25);
    color: rgba(217, 24, 24, 0.75);
}

/* The validation error fills the full width of its input container rather than
   sizing to its text. */
.facility-input-container .error-message {
    flex: 1;
}

/* Missing supporting documents are advisory, not blocking, so they are styled as
   amber warnings rather than red errors. */
.facility-certificate-of-occupancy .warning-message,
.facility-input-container .warning-message,
.facilities-section > .warning-message {
    background-color: rgba(191, 128, 0, 0.1);
    padding: 1rem;
    border: 2px solid rgba(191, 128, 0, 0.3);
    color: rgba(140, 94, 0, 0.95);
}

.facility-input-container .warning-message {
    flex: 1;
}

/* The TTO-level Financial Certification warning sits above the facilities table. */
.facilities-section > .warning-message {
    margin-bottom: 1rem;
}

/* Ribbon on the facilities dashboard linking to the manual-geolocation queue.
   It reads as a warning: a solid fill in the amber the app reserves for
   warnings (rgb(191,128,0)) with white text and a darker amber border -- the
   same solid-fill treatment the assumed-identity banner gives the red palette. */
.facility-geolocation-warning {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    color: #fff;
    background-color: #b1af2d;
    border: none;
    text-decoration: none;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.25);
    font-size: 1.1rem;
}

.facility-geolocation-warning:hover {
    background-color: #9e9e2b;
    text-decoration: none;
}

.facility-geolocation-warning-icon {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2rem;
}

/* Manual-geolocation queue: each facility is a wide card (the submittal
   configuration form's layout) with its identity -- display name and address in
   one column -- above a row of latitude, longitude, and the save button. */
.facility-geolocation-item {
    margin-top: 1rem;
}

.facility-geolocation-identity {
    margin-bottom: 1rem;
    font-size: 1.25rem;
}

.facility-geolocation-display-name {
    margin-right: 0.5rem;
}

.facility-geolocation-address {
    color: #888;
}

/* Latitude, longitude, and the save button share one row as three columns: the
   two coordinate fields split the available width and the button is sized to its
   content. */
.facility-geolocation-coordinates {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.facility-geolocation-coordinates .column {
    flex: 0;
}

.facility-geolocation-coordinates .facility-geolocation-save {
    flex: 0 0 auto;
}

.facility-geolocation-coordinates .field {
    width: 20rem;
}

.facility-geolocation-coordinates .control-label {
    width: 5rem;
}


/**
 * Global Configuration
 */

.api-keys-section {
    margin-top: 2rem;
    padding: 2rem;
}

.api-keys-section h2 {
  margin-top: 0;
  font-family: "Roboto Light";
  color: #888;
  text-shadow: none;
}

.api-keys-section .api-key-generate-form {
    margin-top: 3rem;
    padding: 1rem 0 0 0;
    border-top: 1px solid #ccc;
}

pre.api-key-token {
    padding: 1rem;
    font-size: 1.1rem;
    background-color: #d8d8d8;
}

/* Budget-year comparison: counterparty tabs */
.budget-year-comparison-tab-controls {
    display: flex;
    gap: 0.25rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #ccc;
}

.budget-year-comparison-tab-control {
    padding: 0.75rem 1.25rem;
    margin-bottom: -1px;
    background: #eee;
    color: #777;
    font-weight: bold;
    border: 1px solid #ccc;
    border-radius: 4px 4px 0 0;
    cursor: pointer;
}

/* The active tab's bottom border overlaps the controls' bottom border in white,
   so the tab reads as connected to the content card below. */
.budget-year-comparison-tab-control.active {
    color: #333;
    background: #fff;
    border-bottom-color: #fff;
}

.budget-year-comparison-tab {
    display: none;
}

.budget-year-comparison-tab.active {
    display: block;
}

.table-scroll {
    overflow-x: auto;
}

/* Fixed layout so column widths stay put when the compared years change (the
   content no longer drives the widths); the table scrolls within .table-scroll
   when it outgrows the container. */
.budget-year-comparison-table,
.budget-year-comparison-facility-table {
    table-layout: fixed;
    width: 100%;
    min-width: 52rem;
}

.budget-year-comparison-table th:first-child,
.budget-year-comparison-table td:first-child,
.budget-year-comparison-facility-table th:first-child,
.budget-year-comparison-facility-table td:first-child {
    width: 30%;
}

.budget-year-comparison-table th.numeric,
.budget-year-comparison-table td.numeric,
.budget-year-comparison-facility-table th.numeric,
.budget-year-comparison-facility-table td.numeric {
    width: 17.5%;
    text-align: right;
    white-space: nowrap;
}

.budget-year-comparison-facility-table tfoot td {
    font-weight: bold;
}

.budget-year-comparison-facility-table tfoot .summary-row-subtotal td {
    border-top: 2px solid #ccc;
    border-bottom: 2px solid #ccc;
}

.budget-year-comparison-facility-table tfoot .summary-row-annual_fmr td,
.budget-year-comparison-facility-table tfoot .summary-row-adjusted_compensation td,
.budget-year-comparison-facility-table tfoot .summary-row-prorated_amount td {
    border-top: 1px dotted #999;
}

.budget-year-comparison-spacer-row td {
    height: 1.75rem;
    border: none;
    background: none;
}

/* Separates each facility's block in the submittal generation log. */
.submittal-log-facility {
    margin-bottom: 2rem;
}

/* The boxed body of a facility's block (everything below its heading). */
.submittal-log-facility-details {
    padding: 0.5rem;
    background-color: #f8f8f8;
}