body {
    min-height: 100vh;
    background-color: #f7f7f7;
}

a.linkRed {color: #D71937 ; text-decoration: underline; font-weight: bold ; }
a.linkYellow {color: #FF9800  ; text-decoration: underline; font-weight: bold ; }

Fieldset {
    border: 0;
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.20)
}

tr .reportCell1 >  td, tr .reportCell2 >  td{
    border-right: 1px solid #ececec;
    border-bottom: 1px solid #ececec;
    height: 30px;
}

.buttonPref {
    background-color: #00AFAF;
    font-weight: 400;
    color: #fff;
    border: 0;
    padding: 0.25rem;
    border-radius: 3px;
}

.buttonPrefDisabled {
    background: #F3F3F3 !important;
    color: #CCCCCC !important;
    font-weight: bold !important;
    border: 0 !important;
    padding: 0.25rem !important;
    border-radius: 3px !important;
}

.reportInTableBorder { border: 0; }

.filterInputRequired {
    background-color: transparent ;
}

.filterInputRequired:disabled{
    background-color: transparent ;
}

.filterInputRequiredDisabled {
    background-color: transparent ;
}

.toolbarBG {
    background-image: none;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
    border: 0 !important;
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.20);
    padding: 8px 0;
}

.toolbarBGT {
    border: 0 !important
}

.toolbarButtonDisabled {
    opacity: 0.5;
    color: rgba(0, 0, 0, 0.5);
}

.reportBorder {
    width: 100%;
    background-color: #E2E2E2;
    border: 0;
}

.queryReportBorder {
    background-color: #FFFFFF;
}

.navBg {
    background-color: #f7f7f7;
}

.homeBorder {
    width: 100%;
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.20);
    border: 0;
    background-color: #FFFFFF;
}

.indexesDataBorder {
    border: 1px solid #ececec;
    background-color: #E2E2E2 ;
    width: 500px;
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.20);
}

.matchingDataBorder {
    border: 1px solid #ececec;
}

.creditLinkInterfaceDataBorder {
    background-color: #f6f6f6;
}

.solutionCreditBorder {
    background-color: #FFFFFF;
}

th.reportHeader {
    font-weight: bold;
    color: #464646;
    margin-left:-3px;
    white-space: nowrap;
    padding-left:5px;
    padding-right:5px;
    text-align: center;
    background-color: #f7f7f7;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid #ececec;
    border-bottom: 1px solid #ececec;
    background-image:none;
    height: 30px;
}

.reportCell2 {
    background-color: #FFFFFF;
}

.setupBorder { min-width: 950px; border: 1px solid #ececec; width: auto ; background-color: #fff ; box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.20); }

.Matched  {color: #85C914 ; font-weight: 700;}
.Approved {color: #85C914; font-weight: 700;}
.Allocated  {color: green; font-weight: 700;}
.Done {color: #85C914; font-weight: 700;}
.Stale {color: #D71937; font-weight: 700;}
.Expired {color: #85C914; font-weight: 700;}

body .ui-tabs.tabClass {
    background: #f6f6f6 !important;
}

.tabClass {
    background: #f6f6f6 !important;
}

.searchBG { background-color: #FFFFFF }

.internalEmailButton {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_internal_email_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.externalEmailButton {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_external_email_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.saveButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_save_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.deleteButtonBlock, .deleteButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_delete_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}
.editButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_edit_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.resetButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_reset_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.refreshButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_refresh_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.allocateButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_allocated_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.fieldSelection{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_field_selection_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}
.excelButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_excel_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: center;
}

.printButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_print_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.sortButton{
    width: 3%;
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_sort_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.approveButton, .approveNoeButtonEnabled {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_approved_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.holdButton{
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_hold_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.matchingButton,
.mutiplematchButton {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_manual_match_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0");
    background-repeat: no-repeat;
    background-position: 5px;
}

.ui-tabs .ui-tabs-panel{
    background: #f6f6f6 !important;
}

body .ui-tabs.ui-tabs-top > .ui-tabs-nav {
    background: #FFFFFF !important;
    background-image: none !important;
}

.ui-datatable-even { background-color: #FFFFFF; }


.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    background: #00AFAF !important;
}

.ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-hover:not(.ui-state-highlight) {
    background: #DBDBDB !important;
    color: #333333 !important;
    box-shadow: none;
}

.ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-highlight {
    background: #00AFAF !important;
    color: #ffffff !important;
}

.trm-add-edit-af-form .ui-panel-content, .trm-add-edit-af-form .ui-widget-content {
    background-color: #FFFFFF;
}

/** New CSS as part of rebranding.
	This code is added by Apoorva Shukla.
 */

.screenHeading {
    font-size: 1.5rem;
    margin: 0.5rem 0 0 0;
    padding: 0 0.5rem;
}

.mb-16 {
    margin-bottom: 1rem;
}

#FXBody {
    padding: 0.5rem;
}

.reportCell1 a, .reportCell2 a {
    color: #0192d6;
    font-weight: 700;
}

.buttonPref:hover {
}

input[type="button"]:disabled.buttonPref {
    background: #F3F3F3;
    color: rgba(0,0,0,0.5);
}

.option-title {
    text-align: center;
    position: relative;
}

.with-logout a {
    position: absolute;
    right: 0;
    top: 0;
}

.options-wrapper {
    padding: 0 1rem;
    background-color: #fff;
}

.ui-widget-header, .ui-datatable-resizable th.ui-resizable-column {
    background: #f7f7f7 !important;
}

.ui-panel-content input[type="submit"], .ui-panel-content button[type="submit"], .ui-panel input[type="submit"], .ui-panel button.ui-button, input[id$="addParticButton"], .ui-datatable input[type="submit"], .ui-datatable button.ui-button, .ui-datatable-data button.ui-button {
    background-color: #00AFAF;
    font-weight: 400;
    cursor: pointer !important;
    color: #fff !important;
    border: 0 !important;
    padding: 0.25rem !important;
    border-radius: 3px !important;
}
.ui-panel-content input[type="submit"]:hover, .ui-panel-content button[type="submit"]:hover, .ui-panel input[type="submit"]:hover, .ui-panel button.ui-button:hover, input[id$="addParticButton"]:hover, .ui-datatable input[type="submit"]:hover, .ui-datatable button.ui-button:hover, .ui-datatable-data button.ui-button:hover {
    background-color: #008C8C !important;
}

.solutionBillingBorder td[valign="top"] {
    background-color: #FFFFFF !important;
}

.actionItemsContainer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 1.5rem;
    border-bottom: 1px solid #CCCCCC;
    background-color: #fff;
}

.entryTable .toolbarBG {
    background-color: #E6E6E6;
    padding: 0;
}

.reportSepColor img {
    display: none !important;
}

.reportSepColor {
    background-color: rgba(153, 153, 153, 0.5);
    height: 2px;
}

.ui-datatable tbody td {
    height: auto;
}

.navText {
    position: relative;
}

.setupParticWelcomeBorder {
    border: 1px solid #999999;
    box-shadow: inset -1px -1px 1px rgb(153 153 153 / 60%);
}

.groupBG {
    background-color: #FFFFFF;
}

#NoeForm .toolbarButtonDisabled {
    opacity: 0.5;
}

#columnChoosingLeftList,
#columnChoosingRightList,
select[id$="columnChoosingLeftList"],
select[id$="columnChoosingRightList"] {
    width: 200px !important;
    height: 200px !important;
    box-sizing: border-box !important;
}

.noUnderlineLink,
a.noUnderlineLink,
a.noUnderlineLink:hover,
a.noUnderlineLink:focus,
a.noUnderlineLink:active {
    text-decoration: none !important;
}

.dynamicEmailText{
    display:block;
    width:20px;
}

.dynamicMailWidth{
    width: 0px;
}

body .ui-button.deleteButton,
body .ui-button.deleteButton.ui-state-disabled,
body .ui-button.deleteButtonDisabled,
.deleteButtonBlock, .deleteButton, .deleteButtonDisabled {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_delete_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") !important;
    background-repeat: no-repeat !important;
    background-position: 5px center !important;
}

body .ui-button.deleteButtonDisabled,
.deleteButtonDisabled {
    opacity: 0.5 !important;
}

body .ui-button.deleteButtonDisabled .ui-button-text,
body .ui-button.bustAndModifyButtonDisabled .ui-button-text,
.deleteButtonDisabled .ui-button-text,
.bustAndModifyButtonDisabled .ui-button-text {
    padding-left: 26px !important;
}

body .ui-button.bustAndModifyButton,
body .ui-button.bustAndModifyButton.ui-state-disabled,
.bustAndModifyButton {
    background-image: url("/archcommon/jakarta.faces.resource/images/icon_delete_rebranded.svg.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") !important;
    background-repeat: no-repeat !important;
    background-position: 5px center !important;
}

/* =========================================================
   PRIMEFACES 14: Restore "New Participant" Button Styling
   ========================================================= */

/* 1. Change 'input' to 'button' and override the PrimeFaces theme */
button[id$="addParticButton"].ui-button {
    background-color: #00AFAF !important;
    font-weight: 400 !important;
    cursor: pointer !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 3px !important;
    padding: 0.25rem !important;
}

/* 2. Strip the default PrimeFaces padding from the inner text span
      so your 0.25rem button padding above dictates the exact size */
button[id$="addParticButton"].ui-button .ui-button-text {
    padding: 0 !important;
}

/* 3. Add the Hover State (targeting both native hover and PF state classes) */
button[id$="addParticButton"].ui-button:hover,
button[id$="addParticButton"].ui-button.ui-state-hover {
    background-color: #008C8C !important;
}

body .ui-button.internalEmailButton .ui-button-text,
body .ui-button.internalEmailButtonDisabled .ui-button-text {
    padding: 0 0 0 26px !important;
    background: transparent !important;
}

body .ui-button.externalEmailButton .ui-button-text,
body .ui-button.externalEmailButtonDisabled .ui-button-text {
    padding: 0 0 0 26px !important;
    background: transparent !important;
}

/* =========================================================
   PRIMEFACES 14: State-Aware Datatable Sort Icons
   ========================================================= */
body .ui-datatable .ui-sortable-column-icon::before {
    font-family: 'primeicons' !important;
    color: #006699 !important;
    font-size: 0.7rem !important;
    display: block !important;
}

body .ui-datatable .ui-sortable-column-icon.ui-icon-carat-2-n-s::before {
    content: "\e915" !important; /* PrimeIcons 'pi-sort' (The classic double arrow) */
}

body .ui-datatable .ui-sortable-column-icon.ui-icon-triangle-1-n::before {
    content: "\e914" !important; /* PrimeIcons 'pi-sort-up' (Arrow pointing up) */
}

body .ui-datatable .ui-sortable-column-icon.ui-icon-triangle-1-s::before {
    content: "\e913" !important; /* PrimeIcons 'pi-sort-down' (Arrow pointing down) */
}

/* =========================================================
   PRIMEFACES 14: Clean Flat Autocomplete Dropdowns
   ========================================================= */
body .ui-autocomplete-dropdown {
    background-color: #f4f4f4 !important;
    background-image: linear-gradient(to bottom, #ffffff, #e0e0e0) !important;
    border: 1px solid #cccccc !important;
    border-left: none !important;
    border-radius: 0 3px 3px 0 !important;
    box-shadow: none !important;
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    vertical-align: middle !important;
    position: relative !important;
}

body .ui-autocomplete-dropdown:focus,
body .ui-autocomplete-dropdown.ui-state-focus,
body .ui-autocomplete-dropdown:hover,
body .ui-autocomplete-dropdown.ui-state-hover {
    background-color: #e0e0e0 !important;
    background-image: linear-gradient(to bottom, #ffffff, #cccccc) !important;
    box-shadow: none !important;
}

body .ui-autocomplete-dropdown .ui-icon-triangle-1-s {
    display: block !important;
    text-indent: 0 !important;
    background: none !important;
    font-size: 10px !important;
    color: #444444 !important;
    width: 100% !important;
    height: 100% !important;
    line-height: 20px !important;
    text-align: center !important;
    position: static !important;
}

body .ui-autocomplete-dropdown .ui-icon-triangle-1-s::before {
    content: "\25BC" !important; /* ▼ */
    font-family: sans-serif !important;
    display: inline-block !important;
}


body .ui-datatable.borderless-table,
body .ui-datatable.borderless-table .ui-datatable-table,
body .ui-datatable.borderless-table .ui-datatable-data,
body .ui-datatable.borderless-table .ui-datatable-data > tr,
body .ui-datatable.borderless-table .ui-datatable-data > tr > td,
body .ui-datatable.borderless-table thead th,
body .ui-datatable.borderless-table th,
body .ui-datatable.borderless-table td,
body .ui-datatable.borderless-table tr {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* ========================================================
   RESTORE CLASSIC ARISTO LOOK TO THE ALLOCATIONS DATATABLE
   ======================================================== */
body .ui-datatable .allocationsStyle {
    min-width: 740px !important;
}

body .ui-datatable .allocationsStyle thead th,
body .ui-datatable .allocationsStyle tbody td,
body .ui-datatable .allocationsStyle tfoot td,
body .ui-datatable .allocationsStyle tfoot th,
body .ui-datatable .allocationsStyle .ui-state-default {
    padding: 4px 10px !important;
    overflow: hidden !important;
    border: 1px solid #a8a8a8 !important;
    text-align: center !important;
}

body .ui-datatable .allocationsStyle thead th,
body .ui-datatable .allocationsStyle tfoot td,
body .ui-datatable .allocationsStyle .ui-state-default {
    background: #c4c4c4 linear-gradient(to bottom, rgba(255,255,255,0.8), rgba(255,255,255,0)) !important;
    background: #c4c4c4 -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.8)), to(rgba(255, 255, 255, 0))) !important;
    background: #c4c4c4 -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0)) !important;
    font-weight: bold !important;
    color: #4f4f4f !important;
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.7) !important;
    box-shadow: inset 0px 1px 0px #fff !important;
}

body .ui-datatable .allocationsStyle tbody tr td {
    background-color: #ffffff !important;
    color: #000000 !important;
}

body .ui-datatable .allocationsStyle .ui-inputfield {
    color: #000000 !important;
}

/* 2. Apply a color-matched underline directly to the "Done" text */
a.ui-commandlink span.Done {
    text-decoration: underline !important;
    text-decoration-color: currentColor !important; /* Forces the line to perfectly match the green text */
    text-underline-offset: 2px; /* Adds a tiny bit of breathing room between the text and the line */
}

a.ui-commandlink:has(span.Done) {
    text-decoration: none;
}

body .ui-autocomplete-panel .ui-autocomplete-items .ui-autocomplete-item.ui-state-hover {
    background: #00AFAF !important;
    background-color: #00AFAF !important;
    color: #ffffff !important;
    border-color: #00AFAF !important;
    background-image: none !important; /* Kills the legacy yellow gradient */
    text-shadow: none !important;      /* Cleans up legacy text shadows */
}

body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-hover:not(.ui-state-highlight) {
    background: #DBDBDB !important;
    background-color: #DBDBDB !important;
    color: #333333 !important;
    border-color: transparent !important;
    background-image: none !important; /* Kills the legacy yellow gradient */
    text-shadow: none !important;      /* Cleans up legacy text shadows */
}

body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight {
    background: #00AFAF !important;
    background-color: #00AFAF !important;
    color: #ffffff !important;
    border-color: #00AFAF !important;
    background-image: none !important; /* Kills the legacy yellow gradient */
    text-shadow: none !important;      /* Cleans up legacy text shadows */
}

/* Add a highlighted teal background when hovering over autocomplete dropdown items */
body .ui-autocomplete-panel .ui-autocomplete-items .ui-autocomplete-item.ui-state-hover,
body .ui-autocomplete-panel .ui-autocomplete-items .ui-autocomplete-item:hover,
ul.ui-autocomplete li.ui-menu-item:hover,
ul.ui-autocomplete li.ui-menu-item .ui-state-focus,
ul.ui-autocomplete li.ui-menu-item .ui-state-active {
    background-color: #00AFAF !important; /* Teal highlight color */
    background-image: none !important;    /* Keeps the ugly gradients away */
    border-color: #00AFAF !important;      /* Highlight border */
    color: #ffffff !important;            /* Pure white text */
    cursor: pointer !important;
}

[id*="ccyPairTable"] [id$="ccyPairs_button"],
[id*="ccyPairTable"] [id$="ccyPairs_button"] .ui-icon-triangle-1-s {
    line-height: 8px !important;
}

/* Specific override for Roles PickList to match QA environment (solid white and borderless list items) */
.trm-roles-picklist .ui-picklist-list-wrapper li:nth-child(even) {
    background: #ffffff !important;
    border-top: none !important;
    border-bottom: none !important;
}

.trm-roles-picklist .ui-picklist-list-wrapper li {
    border: none !important;
}

body .trm-roles-picklist .ui-picklist-caption {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #000000 !important;
    font-weight: normal !important;
    text-align: center !important;
    padding: 5px 0 !important;
}

.trm-groups-roles-tabview .ui-tabs-nav {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid #c5c5c5 !important;
}

.trm-roles-picklist .ui-picklist-list-wrapper li:not(.ui-state-highlight):hover {
    background: transparent !important;
    background-color: transparent !important;
    color: #000000 !important;
}

/* Ensure the datatable column header text color is dark grey (#464646), matching the design system standard */
body .ui-datatable th .ui-column-title {
    color: #464646 !important;
}

/* Ensure the paginator background is the correct light grey (#f7f7f7) with no border, matching the QA design */
body .ui-paginator {
    background: #f7f7f7 !important;
    border: none !important;
}

/* Ensure the Rows per Page paginator dropdown matches the QA design (grey background, black text, and border) */
body .ui-paginator .ui-paginator-rpp-options {
    background: #C4C4C4 !important;
    background-color: #C4C4C4 !important;
    border: 1px solid #A8A8A8 !important;
    color: #000000 !important;
    border-radius: 3px !important;
    font-weight: bold !important;
    padding: 1px !important;
    outline: none !important;
}

/* Baton Rebranded: Active (teal #00AFAF) and Inactive (grey #CECECE) selection highlights for Roles PickList */
.trm-roles-picklist .ui-picklist-source:focus-within li.ui-state-highlight {
    background: #00AFAF !important;
    background-color: #00AFAF !important;
    color: #ffffff !important;
    border: none !important;
}

.trm-roles-picklist .ui-picklist-target:focus-within li.ui-state-highlight {
    background: #00AFAF !important;
    background-color: #00AFAF !important;
    color: #ffffff !important;
    border: none !important;
}

.trm-roles-picklist .ui-picklist-source:not(:focus-within) li.ui-state-highlight {
    background: #CECECE !important;
    background-color: #CECECE !important;
    color: #000000 !important;
    border: none !important;
}

.trm-roles-picklist .ui-picklist-target:not(:focus-within) li.ui-state-highlight {
    background: #CECECE !important;
    background-color: #CECECE !important;
    color: #000000 !important;
    border: none !important;
}

/* =========================================================
   Baton Rebranded: Specific overrides for Roles PickList Buttons
   ========================================================= */

/* Hide double right and double left arrow buttons */
.ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add-all,
.ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove-all {
    display: none !important;
}

/* Base styling for single add/remove buttons, including all interactive and disabled states */
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-default,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-disabled,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-disabled:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-disabled:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button.ui-state-disabled:active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button:active {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    width: 14px !important;
    height: 14px !important;
    opacity: 1.0 !important;
    pointer-events: auto !important;
}

/* Set dynamic, non-hardcoded JSF background resource for Single Right button */
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-default,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-disabled,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-disabled:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-disabled:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add.ui-state-disabled:active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add:active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-add:hover:not(.ui-state-disabled) {
    background: url("/archcommon/jakarta.faces.resource/images/toRight.gif.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") no-repeat !important;
    background-image: url("/archcommon/jakarta.faces.resource/images/toRight.gif.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") !important;
}

/* Set dynamic, non-hardcoded JSF background resource for Single Left button */
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-default,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-disabled,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-disabled:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-disabled:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove.ui-state-disabled:active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove:hover,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove:focus,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove:active,
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-picklist-button-remove:hover:not(.ui-state-disabled) {
    background: url("/archcommon/jakarta.faces.resource/images/toLeft.gif.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") no-repeat !important;
    background-image: url("/archcommon/jakarta.faces.resource/images/toLeft.gif.faces;jsessionid=KdnJz80-7B2E_8fjjpgCqyfGs4ioz7N5Aoke7f4t.ue1ul-scbtrm-asg-0") !important;
}

/* Hide the default PrimeFaces 14 text/unicode icon inside the buttons */
body .ui-picklist.trm-roles-picklist .ui-picklist-buttons .ui-button .ui-icon {
    display: none !important;
}

/* =========================================================
   Baton Rebranded: Tab Styling Overrides
   ========================================================= */

/* 1. Target the ACTIVE tab background and borders */
body .ui-tabs .ui-tabs-nav .ui-tabs-header.ui-state-active {
    background: #e2e2e2 !important;
    background-image: none !important;
    border: 1px solid #a8a8a8 !important;
    border-bottom: 1px solid #e2e2e2 !important; /* Matches background to blend into the panel */
    border-radius: 3px 3px 0 0 !important;
}

/* 2. Target the text inside the ACTIVE tab */
body .ui-tabs .ui-tabs-nav .ui-tabs-header.ui-state-active a {
    color: #2f556a !important; /* Teal-blue */
    font-weight: bold !important;
    outline: none !important;
}

/* 3. Target the INACTIVE tabs */
body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active) {
    background: #c4c4c4 !important;
    background-image: none !important;
    border: 1px solid #a8a8a8 !important;
}

/* 4. Target the text inside INACTIVE tabs */
body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active) a {
    color: #4f4f4f !important;
    font-weight: bold;
}

/* 5. Target the HOVER state of INACTIVE tabs */
body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active):hover,
body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active).ui-state-hover {
    background: #85b2cb !important;
    border: 1px solid #a8a8a8 !important;
}

body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active):hover a,
body .ui-tabs .ui-tabs-nav .ui-tabs-header:not(.ui-state-active).ui-state-hover a {
    color: #2f556a !important;
}

/* =========================================================
   PRIMEFACES 14: Use Java Bean State for Tree Highlighting
   ========================================================= */

/* Ensure every single setup menu link inside the tree ALWAYS has the exact same font size and font family, under all states! */
body .ui-tree .setup-menu-tree,
body .ui-tree .ui-treenode-content .setup-menu-tree,
body .ui-tree .ui-treenode-content.ui-state-highlight .setup-menu-tree,
body .ui-tree .ui-treenode-content.ui-state-highlight .setup-menu-node,
body .ui-tree .ui-treenode-content.ui-state-highlight .setup-menu-tree:not(.selected-menu-node),
body .ui-tree .selected-menu-node,
body .ui-tree .setup-menu-tree.selected-menu-node,
body .ui-tree span.setup-menu-tree,
body .ui-tree .ui-state-disabled span {
    font-size: 12px !important;
    font-family: Arial, Verdana, sans-serif !important;
}

/* Specific high-specificity override to defeat JBoss cached inherit-size rules on load */
body .ui-tree .ui-tree-container .ui-treenode-content.ui-state-highlight .setup-menu-tree:not(.selected-menu-node),
body .ui-tree .ui-tree-container .ui-treenode-content.ui-state-highlight .setup-menu-node {
    font-size: 12px !important;
    font-family: Arial, Verdana, sans-serif !important;
}

/* 1. Highlight the native PrimeFaces selected node with a beautiful subtle gray box and make text BOLD on selection */
body .ui-tree .ui-treenode-content.ui-state-highlight {
    background-color: #f0f0f0 !important;
    border: 1px solid #dddddd !important;
    border-radius: 2px !important;
    padding: 0px 6px !important; /* Keeps the tight vertical spacing */
}

body .ui-tree .ui-treenode-content.ui-state-highlight .setup-menu-tree {
    font-weight: bold !important;
    color: #444444 !important;
}

/* If another node is explicitly selected by Java (has .selected-menu-node), 
   then turn off the native highlight box and bolding for any node that is NOT selected by Java! */
body .ui-tree:has(.selected-menu-node) .ui-treenode-content.ui-state-highlight:not(:has(.selected-menu-node)) {
    background-color: transparent !important;
    border-color: transparent !important;
}

body .ui-tree:has(.selected-menu-node) .ui-treenode-content.ui-state-highlight:not(:has(.selected-menu-node)) .setup-menu-tree {
    font-weight: normal !important;
    color: #000000 !important;
}

/* Selected highlighted node in a disabled tree (e.g. before choosing a participant) */
body .ui-tree .ui-treenode-content.ui-state-highlight:has(span.setup-menu-tree) {
    background-color: transparent !important;
    border: 1px solid #cccccc !important;
    border-radius: 2px !important;
    padding: 0px 6px !important;
}

body .ui-tree .ui-treenode-content.ui-state-highlight:has(span.setup-menu-tree) span {
    color: #999999 !important;
    font-weight: normal !important;
}

/* Turn off PrimeFaces' native hover styling completely—no borders, backgrounds, outlines, or shadows on hover/focus */
body .ui-tree .setup-menu-tree:hover,
body .ui-tree .setup-menu-tree:focus,
body .ui-tree .setup-menu-tree:active {
    background-color: transparent !important;
    background-image: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Prevent PrimeFaces hover from overriding highlighted state and prevent border layout jumps */
body .ui-tree .ui-treenode-content:not(.ui-state-highlight):hover,
body .ui-tree .ui-treenode-content.ui-state-hover:not(.ui-state-highlight),
body .ui-tree:has(.selected-menu-node.other-menu-node) .ui-treenode-content.ui-state-highlight:hover,
body .ui-tree:has(.selected-menu-node.other-menu-node) .ui-treenode-content.ui-state-highlight.ui-state-hover {
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
}

/* Maintain highlighted state appearance when hovered (only if it is truly the active node, i.e., there is no other selected node) */
body .ui-tree:not(:has(.selected-menu-node.other-menu-node)) .ui-treenode-content.ui-state-highlight:hover,
body .ui-tree:not(:has(.selected-menu-node.other-menu-node)) .ui-treenode-content.ui-state-highlight.ui-state-hover {
    background-color: #f0f0f0 !important;
    border: 1px solid #dddddd !important;
    box-shadow: none !important;
}

/* 2. Apply the beautiful subtle gray box highlight and bolding only to client-synced selected-menu-node */
body .ui-tree .selected-menu-node {
    background-color: #f0f0f0 !important;
    border: 1px solid #dddddd !important;
    border-radius: 2px !important;
    padding: 0px 6px !important; /* Keeps the tight vertical spacing */
    color: #444444 !important;
    font-weight: bold !important;
    display: inline-block !important;
    text-decoration: none !important;
}

body .ui-tree .setup-menu-tree {
    text-decoration: none !important;
    color: #000000 !important;
    font-weight: normal !important;
    outline: none !important;
}

body .ui-tree .setup-menu-tree:focus,
body .ui-tree .setup-menu-tree:active {
    outline: none !important;
}

body .ui-tree .setup-menu-tree:hover {
    text-decoration: none !important;
    color: #000000 !important;
}

/* If the tree has another active selected node, turn off the highlight box for General Details' parent content container! */
body .ui-tree:has(.selected-menu-node.other-menu-node) .ui-treenode-content.ui-state-highlight:has(.general-details-node) {
    background-color: transparent !important;
    border: 1px solid transparent !important;
}

/* If the tree has another active selected node, turn off the bolding and color for General Details' link! */
body .ui-tree:has(.selected-menu-node.other-menu-node) .ui-treenode-content.ui-state-highlight .general-details-node,
body .ui-tree:has(.selected-menu-node.other-menu-node) .selected-menu-node.general-details-node {
    font-weight: normal !important;
    color: #000000 !important;
    background-color: transparent !important;
    border: 1px solid transparent !important;
}

/* Disable styles for inactive/disabled tree nodes */
body .ui-tree .setup-menu-tree[disabled],
body .ui-tree .ui-state-disabled,
body .ui-tree span.setup-menu-tree {
    color: gray !important;
    cursor: default !important;
}

/* =========================================================
   PRIMEFACES 14: TabView Border Alignment to Match QA
   ========================================================= */
body .ui-tabs.tabClass {
    border: 1px solid #a8a8a8 !important;
}

body .ui-tabs.tabClass .ui-tabs-panel {
    border: none !important;
    padding: 0em !important;
}

/* 36. Picklist Item Hover and State Parity with Legacy
   Prevents flickering and layout shifts when hovering over picklist items by ensuring
   alternating borders and item heights remain stable during hover and active states. */
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li.ui-state-hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:hover {
    box-shadow: none !important;
    background: rgb(133, 178, 203) !important;
    border-left: none !important;
    border-right: none !important;
}

html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"])),
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"])).ui-state-hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"])):hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n),
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n).ui-state-hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:nth-child(2n):hover {
    border-top: 1px solid rgb(204, 204, 204) !important;
    border-bottom: 1px solid rgb(204, 204, 204) !important;
    border-left: none !important;
    border-right: none !important;
}

html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:not(:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"]))),
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:not(:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"]))).ui-state-hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li:not(:nth-child(2n of :not(.ui-helper-hidden):not([style*="display: none"]):not([style*="display:none"]))):hover {
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
}

html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li.ui-state-highlight:hover,
html body .ui-picklist:not(.trm-roles-picklist) .ui-picklist-list-wrapper li.ui-state-highlight.ui-state-hover {
    background: rgba(0, 120, 208, 0.67) !important;
    color: #FFFFFF !important;
}