/* Refresh the existing xm:controlbar and xm:modulebar markup. Keep its IDs, links,
   menus and update APIs intact; these rules apply only within the xm-4 shell. */
.xm4 .controlBar.row, .xm4 .moduleBar.row {--bs-gutter-x:0; margin:0 0 16px; padding:0; border:0; background:transparent; overflow:visible; min-width:0;}
.xm4 .controlBar > .col-xs-12, .xm4 .moduleBar > .col-xs-12 {width:100%; padding:0; min-width:0; float:none;}
.xm4 .controlBar > .col-xs-12 > .reports-block {display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin:0; padding:18px 20px; border:1px solid var(--xm4-line); border-radius:16px; background:var(--xm4-surface); box-shadow:0 1px 2px rgb(15 23 42 / 3%);}
.xm4 .controlBar.xmStickyTop {z-index:1010; border-radius:16px;}
/* A bar with neither a title nor actions (the grid emits one and fills it later through addControlBarItem) renders nothing
   until it has content; :has() is live, so items added at runtime bring it back. */
.xm4 .controlBar.row:not(:has(.frame_container)):not(:has(.OGTitle:not(:empty))) {display:none; margin:0;} /* :has() cannot nest, so both conditions sit on the bar */
.xm4 .controlBar .reports-block > .head {flex:1 1 220px; min-width:0; padding:0; margin:0; border:0; background:transparent;}
.xm4 .controlBar .head .OGTitle {margin:0; padding:0; color:var(--xm4-text); font:650 1.375rem/1.3 var(--bs-body-font-family); letter-spacing:-.025em; text-transform:none; overflow-wrap:anywhere;}
.xm4 .controlBar .head .cbSubTitle {display:block; margin:5px 0 0; font:400 .8125rem/1.45 var(--bs-body-font-family); color:var(--xm4-muted);}
.xm4 .controlBar .head:has(.xm-avatars) {padding-right:100px;}
.xm4 .controlBar .reports-block > .frame_container {flex:0 1 auto; min-width:0; padding:0; margin:0; border:0; background:transparent; white-space:normal;}
.xm4 .controlBar .reports-block > .frame_container > ul {position:static; display:flex; flex-flow:row wrap; align-items:center; gap:6px; padding:0; margin:0; overflow:visible; list-style:none; font:500 .8125rem/1.4 var(--bs-body-font-family);}
.xm4 .controlBar .reports-block > .frame_container > ul > li {flex:none; display:block; padding:0; margin:0; border:0!important; background:transparent;}
.xm4 .controlBar .reports-block > .frame_container > ul > li::after {display:none;}
.xm4 .controlBar .reports-block > .frame_container > ul > li > a {display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:8px 11px; border:1px solid transparent; border-radius:9px; color:var(--xm4-ink-2); font:inherit; text-decoration:none; transition:background .15s,color .15s;}
.xm4 .controlBar .reports-block > .frame_container > ul > li > a > span {display:inline-flex; align-items:center; gap:7px;}
.xm4 .controlBar .reports-block > .frame_container > ul > li > a i {color:var(--xm4-muted); font-size:.875rem;}
.xm4 .controlBar .reports-block > .frame_container > ul > li > a:hover {background:var(--xm4-soft); color:var(--xm4-accent);}
.xm4 .controlBar .reports-block > .frame_container > ul > li > a:hover i {color:inherit;}
.xm4 .controlBar .reports-block > .frame_container > ul > li.xm4-action-primary > a {background:var(--xm4-accent); color:#fff; border-color:var(--xm4-accent);}
.xm4 .controlBar .reports-block > .frame_container > ul > li.xm4-action-primary > a i {color:inherit;}
.xm4 .controlBar .reports-block > .frame_container > ul > li.xm4-action-primary > a:hover {background:var(--xm4-accent-dark);}
.xm4 .controlBar .reports-block > .frame_container > ul > li.cb-active-tab:not(.xm4-action-primary) > a {background:var(--xm4-tint); color:var(--xm4-accent);}
.xm4 .controlBar .reports-block > .frame_container > .mobileOnly {display:none!important;}
.xm4 .controlBar .reports-block > .controlBarFooter {flex:1 0 100%; padding-top:12px!important; border-top:1px solid var(--xm4-line)!important; border-bottom:0!important; background:transparent!important;}
.xm4 .xm4-actions-toggle {display:none; align-items:center; gap:7px; padding:8px 11px; border:1px solid var(--xm4-line); border-radius:9px; min-height:40px; background:var(--xm4-surface); color:var(--xm4-ink-2); font:500 .8125rem/1.4 var(--bs-body-font-family);}
.xm4 .xm4-actions-toggle:hover {background:var(--xm4-soft); color:var(--xm4-accent);}

/* Summary values retain their table cells so addModuleBarItem and direct field
   updates keep working. record-bars.js pairs each label with its value in the grid. */
.xm4 .moduleBar .reports-block {margin:0; border:1px solid var(--xm4-line); border-radius:16px; background:var(--xm4-surface); overflow:hidden;}
.xm4 .moduleBar .account_info {margin:0; width:100%; color:var(--xm4-text);}
.xm4 .moduleBar .account_info.xm4-summary-grid {display:grid; grid-template-columns:repeat(var(--xm4-fact-columns,4),minmax(0,1fr)); border:0; border-collapse:separate;}
.xm4 .moduleBar .xm4-summary-grid > :is(thead,tbody), .xm4 .moduleBar .xm4-summary-grid > :is(thead,tbody) > tr {display:contents;}
.xm4 .moduleBar .account_info :is(th,td) {min-width:0; margin:0; text-align:left; vertical-align:top; border:0; border-inline-start:1px solid var(--xm4-line); background:transparent; color:var(--xm4-text); overflow-wrap:anywhere;}
.xm4 .moduleBar .account_info th {padding:16px 18px 5px; font:500 .75rem/1.4 var(--bs-body-font-family); color:var(--xm4-muted);}
.xm4 .moduleBar .account_info td {padding:0 18px 17px; font:550 .875rem/1.5 var(--bs-body-font-family);}
.xm4 .moduleBar .account_info th.xm4-fact-next-row {border-top:1px solid var(--xm4-line);}
.xm4 .moduleBar .account_info .xm4-fact-first {border-inline-start:0;}
.xm4 .moduleBar .account_info th a {text-decoration:none; color:inherit;}
.xm4 .moduleBar .account_info th:has(a):hover, .xm4 .moduleBar .account_info th[onclick]:hover {color:var(--xm4-accent); background:var(--xm4-soft);}
.xm4 .moduleBar .account_info th i {font-size:.7rem; margin-inline-end:4px;}
.xm4 .moduleBar .account_info td > span {display:block;}
.xm4 .moduleBar .account_info td > span > i.fa-circle {font-size:6px; margin-inline-end:6px; vertical-align:middle;}
.xm4 .moduleBar .account_info td :is(.label,.badge,.btn) {font-size:.75rem; line-height:1.25; padding:4px 8px; border-radius:6px; vertical-align:middle; box-shadow:none;}
.xm4 .moduleBar .account_info td :is(.label-success,.bg-success,.btn-success) {background:color-mix(in srgb,var(--xm4-success) 12%,var(--xm4-surface))!important; color:color-mix(in srgb,var(--xm4-success) 65%,var(--xm4-text))!important; border-color:transparent;}
.xm4 .moduleBar .account_info td :is(.label-default,.badge-default,.btn-default) {background:var(--xm4-soft); color:var(--xm4-muted);}
@media(max-width:767px) {
    .xm4 .controlBar > .col-xs-12 > .reports-block {gap:12px; padding:14px; border-radius:12px;}
    .xm4 .controlBar .reports-block > .head {flex-basis:100%;}
    .xm4 .controlBar .head .OGTitle {font-size:1.125rem;}
    .xm4 .controlBar .reports-block > .frame_container {flex:1 1 100%; display:flex; align-items:flex-start; gap:6px;}
    .xm4 .controlBar .reports-block > .frame_container > ul {flex:1; min-width:0; gap:4px;}
    .xm4 .controlBar .reports-block > .frame_container > ul > li > a {min-height:40px; padding:8px 9px;}
    .xm4 .controlBar .reports-block > .frame_container > ul.xm4-actions-collapsed.xm4-has-action-overflow > li.xm4-action-overflow {display:none;}
    .xm4 .controlBar .reports-block > .frame_container > .xm4-actions-toggle:not([hidden]) {display:inline-flex; flex:none;}
    .xm4 .moduleBar .account_info th {padding:12px 14px 4px;}
    .xm4 .moduleBar .account_info td {padding:0 14px 13px; font-size:.8125rem;}
}
@media print {
    .xm4 .controlBar {position:static!important;}
    .xm4 .controlBar .reports-block > .frame_container {display:none;}
}
@media(max-width:374px) {
    .xm4 .xm4-actions-toggle {width:40px; padding:0; justify-content:center;}
    .xm4 .xm4-actions-toggle > span {display:none;}
}

[data-bs-theme="dark"] .xm4 .controlBar .reports-block > .frame_container > ul > li.xm4-action-primary > a {color:var(--xm4-bg);}
