#xrx-navbar-brand-header {
    display: flex;
    justify-content: space-between; 
    align-items: center; 
    /* Defect 165219: rem values in this file were authored against Bootstrap 3's 10px root.
       Bootstrap 4.6.2 (US 161718) uses the browser's 16px root, so every value is scaled by 0.625
       to keep the pre-upgrade rendering. */
    padding: 0.3125rem 0.625rem;
    background-color: #fff !important;
}

    #xrx-navbar-brand-header .nav-logo img {
        max-height: 50px; 
        height: auto;
    }


    #xrx-navbar-brand-header .app-brand {
        flex: 1 1 auto;
        text-align: center;
        font-size: 1.78rem;
        white-space: nowrap;
        /*    margin: 0 1rem; */
        margin-left: 2.375rem;
    }
    #xrx-navbar-brand-header .app-brand-new {
        flex: 1 1 auto;
        text-align: center;
        padding: 0.3125rem 0rem;
        font-size: 1.25rem;
        font-weight:bold;
        white-space: nowrap;
       /* height: 64px;*/
        /*    margin: 0 1rem; */
        margin-left: 6.75rem;
    }

#xrx-navbar-brand-header {
    border-bottom: 1px solid #ccc; 
}

#loginOverlay {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.85);
    display: none; 
    align-items: center;
    justify-content: center;
    z-index: 9999;
    flex-direction: column;
}


.spinner-ring {
    position: relative;
    width: 2.5rem;
    height: 2.5rem;
    animation: spin 1s linear infinite;
}

    .spinner-ring div {
        box-sizing: border-box;
        position: absolute;
        inset: 0;
        border: .3125rem solid transparent;
        border-radius: 50%;
    }

        .spinner-ring div:nth-child(1) {
            border-top-color: #9F3700;
        }

        .spinner-ring div:nth-child(2) {
            border-top-color: #808000;
            transform: rotate(90deg);
        }

        .spinner-ring div:nth-child(3) {
            border-top-color: #DB4437;
            transform: rotate(180deg);
        }

        .spinner-ring div:nth-child(4) {
            border-top-color: #0A0A0A;
            transform: rotate(270deg);
        }


@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}


.spinner-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font: .78rem/1 monospace;
    color: #333;
}


@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}
body .lang-fr {
    word-break: normal !important;
    line-height: 1.4;
}

    body .lang-fr strong,
    body .lang-fr b,
    body .lang-fr label {
        white-space: normal !important; 
        word-wrap: break-word;
        hyphens: auto;
        font-size: 0.95em;
    }

    body .lang-fr .panel-body {
        padding: 12px 15px;
    }

    body .lang-fr .col-md-4,
    body .lang-fr .col-md-6 {
        margin-bottom: 15px;
    }

    body .lang-fr .panel-body p {
        margin-bottom: 8px;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    body .lang-fr .btn {
        white-space: normal !important;
        word-wrap: break-word;
        text-align: center;
        padding: 8px 12px;
        line-height: 1.3;
    }

        body .lang-fr .btn a,
        body .lang-fr .btnAnchor {
            white-space: normal !important;
            word-wrap: break-word;
            display: inline-block;
            text-align: center;
        }

    body .lang-fr .modal-body {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

        body .lang-fr .modal-body label {
            white-space: normal !important;
            margin-bottom: 5px;
        }

    body .lang-fr .breadcrumb {
        white-space: normal;
        word-wrap: break-word;
    }

    body .lang-fr .panel-heading {
        white-space: normal;
        word-wrap: break-word;
        font-size: 0.95em;
        font-weight: bold;
    }

    body .lang-fr .form-group label,
    body .lang-fr .control-label {
        white-space: normal !important;
        word-wrap: break-word;
        margin-bottom: 5px;
        display: block;
    }

@media (max-width: 768px) {
    body .lang-fr .col-md-4,
    body .lang-fr .col-md-6 {
        margin-bottom: 20px;
    }

    body .lang-fr strong,
    body .lang-fr b,
    body .lang-fr label {
        font-size: 0.9em;
    }

    body .lang-fr .btn {
        padding: 6px 10px;
        font-size: 0.9em;
    }
}

body .lang-fr .panel-body .row {
    margin-bottom: 10px;
}

    body .lang-fr .panel-body .row:last-child {
        margin-bottom: 0;
    }

body .lang-fr .col-md-4 p,
body .lang-fr .col-md-6 p {
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

body .lang-fr .form-button-container {
    text-align: center;
    margin-top: 15px;
}

    body .lang-fr .form-button-container .row {
        margin-bottom: 10px;
    }

body .lang-fr .panel-default {
    margin-bottom: 20px;
}

body .lang-fr a {
    word-break: break-all;
    overflow-wrap: break-word;
}

body .lang-fr .breadcrumb li.active {
    white-space: normal;
    word-wrap: break-word;
}

body .lang-fr .modal-content {
    overflow-wrap: break-word;
}

body .lang-fr .modal-footer {
    text-align: center;
    flex-wrap: wrap;
}

    body .lang-fr .modal-footer .btn {
        margin: 5px;
        min-width: 100px;
    }

/* Defect 151894: ensure dollar/currency text is always visible regardless of inherited color */
.panel.card .panel-body p,
.panel.card .panel-body td {
    color: #212121;
}

/* Defect 167558: Bootstrap 3's ".modal-footer .btn + .btn { margin-left: 5px }" gave the footer
   buttons their gap; Bootstrap 4 dropped it and portal.css's ".btn { margin: 0 }" wins instead. */
.modal-footer .btn + .btn {
    margin-left: 5px;
}

/* Defect 151894: prevent portal header title from overflowing/overlapping on mobile viewports */
@media (max-width: 767px) {
    #xrx-navbar-brand-header .app-brand,
    #xrx-navbar-brand-header .app-brand-new {
        font-size: .75rem;
        white-space: normal;
        margin-left: 0;
        word-break: break-word;
    }

    /* Prevent H2 panel headings from causing visual overlap on narrow screens */
    .panel-heading {
        font-size: .625rem;
        word-break: break-word;
    }
}