/* Tenant theme applied AFTER legacy CSS, across login, main app, explorer & dialogs. */
:root{--brand-primary:#b81734;--brand-accent:#df304c;--brand-side:#101013;--brand-on-primary:#fff;--brand-soft:#fbebef;--app-bg:#f6f5f5;--app-ink:#201b20}
body,body.projectStandalone,.content,main{color:var(--app-ink)}
body,body.projectStandalone{background:var(--app-bg)!important}
.side,.sidebar{background:var(--brand-side)!important}
.side .nav.active,.side .nav:hover,.nav.active{border-left-color:var(--brand-accent)!important}
button.primary,.primary,button[data-save-phase],.poTinySave,.nav.active .icon{background:var(--brand-primary)!important;color:var(--brand-on-primary)!important;border-color:var(--brand-primary)!important}
button.primary:hover,button[data-save-phase]:hover,.poTinySave:hover{filter:brightness(.91)}
.tab.current,.linklike,.detailBack,.smallActions button,.subCount,a:not(.nav-link){color:var(--brand-primary)}
.tab.current{border-color:var(--brand-accent)!important}
.progressTrack>div,.bar>span,.metric .meter>span,.refreshProgressBar,.progressBar>div{background:var(--brand-primary)!important}
input[type=checkbox],input[type=radio]{accent-color:var(--brand-primary)!important}
input:focus,select:focus,textarea:focus{border-color:var(--brand-accent)!important;outline-color:var(--brand-accent)}
.capsule,.eyebrow,.pill:not(.warn){color:var(--brand-primary)}
.alert:not(.error),.operationProgress,.brandingPreview,.reportIcon,.notice-item{background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand-primary) 22%,white)}
.soft:hover,.smallActions button:hover{border-color:var(--brand-accent);background:var(--brand-soft)}
.detailBrand,.brand strong,.brandingPreview strong{color:var(--app-ink)}
@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}
/* Additional legacy visual components use fixed teal colours: bring them under the same theme. */
.nav i,.side .nav i,.eyebrow,.breadcrumbs strong,.metric .topLabel i,.subCount,.metric .valueAccent{color:var(--brand-accent)!important}
.nav.active{background:color-mix(in srgb,var(--brand-accent) 16%,var(--brand-side))!important}
.capsule,.reportIcon,.pill:not(.warn){color:var(--brand-primary)!important;background:var(--brand-soft)!important;border-color:color-mix(in srgb,var(--brand-primary) 17%,white)!important}
.barsArea .bar>span,.bar>span,.progressTrack>div{background:var(--brand-accent)!important}
.siteOps button.primary,.detailShell button.primary,.reportTiles .smallActions button:last-child{background:var(--brand-primary)!important;color:var(--brand-on-primary)!important}
.settings input[type=checkbox],.portfolioChecks input,.siteCheck input{accent-color:var(--brand-primary)!important}
.projectCard:hover,.reportTile:hover{border-color:color-mix(in srgb,var(--brand-primary) 28%,#dce5e6)}

/* v0.9.5 - readable, tenant-configurable identity on the dark navigation */
:root{--brand-title-text:#f7f7f7}
.side .brand #brandTitle{color:var(--brand-title-text,#f7f7f7)!important;line-height:1.2;overflow-wrap:anywhere;font-weight:800}
.brandingPreview{background:var(--brand-side,#121316)!important;border:1px solid color-mix(in srgb,var(--brand-title-text) 35%,transparent)!important}
.brandingPreview #brandingPreviewName{color:var(--brand-title-text,#f7f7f7)!important}
.brandingPreview small{color:#e2e2e2!important}
#companyProfileForm h3{margin-top:22px;margin-bottom:13px;border-bottom:1px solid #e1e8ea;padding-bottom:8px}
#companyProfileForm .cols2{margin-bottom:14px}
#companyProfileForm label small{display:block;font-weight:400;color:#71818d;margin-top:5px}
@media(max-width:600px){.side .brand #brandTitle{font-size:17px!important}}


/* v0.9.10.1 targeted contrast fix: form-only selectors avoid recolouring the main workspace.
   The common theme sets main color to dark. Login/register/MFA are dark cards. */
body:has(form[action="/mfa"]) main,
body:has(form[action="/register"]) main,
body:has(form[action="/account"]) main,
body:has(form[action="/mfa"]) main h1,
body:has(form[action="/register"]) main h1,
body:has(form[action="/account"]) main h1,
body:has(form[action="/mfa"]) main h2,
body:has(form[action="/register"]) main h2,
body:has(form[action="/account"]) main h2 { color: #ffffff !important; }
body:has(form[action="/mfa"]) main label,
body:has(form[action="/register"]) main label,
body:has(form[action="/account"]) main label,
body:has(form[action="/mfa"]) main p,
body:has(form[action="/register"]) main p,
body:has(form[action="/account"]) main p { color: #f3e9ec !important; }
body:has(form[action="/mfa"]) main .hint,
body:has(form[action="/register"]) main small { color: #d9c9cf !important; }
body:has(form[action="/mfa"]) main .secret {
  color:#ffffff !important; background:#1a1d24 !important; border:2px solid #f7bdca !important;
  font-weight:700; line-height:1.6; user-select:text; overflow-wrap:anywhere;
}
body:has(form[action="/mfa"]) main input:not([type="hidden"]),
body:has(form[action="/register"]) main input:not([type="hidden"]),
body:has(form[action="/account"]) main input:not([type="hidden"]) {
  color:#ffffff !important; background-color:#1c2028 !important; border:1px solid #d6bfc6 !important;
  -webkit-text-fill-color:#ffffff; caret-color:#ffffff;
}
body:has(form[action="/mfa"]) main input:focus,
body:has(form[action="/register"]) main input:focus,
body:has(form[action="/account"]) main input:focus { outline:2px solid #ffbdcb !important; outline-offset:2px; }
body:has(form[action="/mfa"]) main a,
body:has(form[action="/register"]) main a,
body:has(form[action="/account"]) main a { color:#ffb9c8 !important; text-decoration:underline; }
body:has(form[action="/mfa"]) main button,
body:has(form[action="/register"]) main button,
body:has(form[action="/account"]) main button { color:var(--brand-on-primary,#ffffff) !important; }
body:has(a[href="/register"]):not(:has(form)) main h1 { color:#ffffff !important; }