/* COLORJET ERP v3.3 final dark contrast layer. Loaded after the canonical live theme. */ :root[data-cj-resolved-mode="dark"]{--cj-ink:#f1f5f9;--cj-muted:#bdc9d8;--cj-border:#405269;--cj-surface:#172437;--cj-canvas:#0c1624;--cj-primary-soft:#1b3a55;--cj-dark-control:#111e30;--cj-dark-raised:#1d2d43;color-scheme:dark} :root[data-cj-resolved-mode="dark"] :where(html,body,#root,main.content,.page-modal-body,.page-modal-window,.spinner-container){color:var(--cj-ink)!important;background:var(--cj-canvas)!important} :root[data-cj-resolved-mode="dark"] :where(h1,h2,h3,h4,h5,h6,p,span,strong,small,label,legend,dt,dd,li,.MuiTypography-root,.MuiFormLabel-root,.MuiInputLabel-root,.MuiFormHelperText-root,.MuiTableCell-root,.MuiListItemText-primary,.MuiListItemText-secondary,.MuiSvgIcon-root){color:inherit} :root[data-cj-resolved-mode="dark"] :where(.MuiPaper-root,.MuiCard-root,.MuiDialog-paper,.MuiPopover-paper,.MuiMenu-paper,.MuiDrawer-paper,.MuiAccordion-root,.MuiTableContainer-root,.cj-panel,.cj-page-section,.cj-theme-card,.mega-dropdown,.cj-theme-menu,.cj-quick-menu,.swal2-popup){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiInputBase-root,.MuiOutlinedInput-root,.MuiFilledInput-root,input,select,textarea){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-dark-control)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(input,textarea)::placeholder{color:#93a5bb!important;opacity:1} :root[data-cj-resolved-mode="dark"] .MuiOutlinedInput-notchedOutline{border-color:var(--cj-border)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiInputLabel-root,.MuiFormLabel-root,.MuiFormHelperText-root,.MuiTypography-colorTextSecondary,.MuiTablePagination-root){color:var(--cj-muted)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiTableHead-root,.MuiTableCell-head,.cj-data-table thead th,.cj-data-table thead td,thead th){color:#eef5ff!important;border-color:var(--cj-border)!important;background:#203149!important} :root[data-cj-resolved-mode="dark"] :where(.MuiTableBody-root .MuiTableRow-root:nth-of-type(even),.cj-data-table tbody tr:nth-child(even)){background:#142135!important} :root[data-cj-resolved-mode="dark"] :where(.MuiTableBody-root .MuiTableRow-root:hover,.cj-data-table tbody tr:hover){background:#203a52!important} :root[data-cj-resolved-mode="dark"] :where(.MuiTableCell-root,.cj-data-table td,.cj-data-table th,td,th){color:var(--cj-ink)!important;border-color:var(--cj-border)!important} :root[data-cj-resolved-mode="dark"] :where(.top-header,.header-search-btn,.header-logout-btn,.mobile-toggle,.menu-scroll-btn,.cj-theme-trigger,.cj-quick-trigger,.MuiButton-outlined,.MuiButton-text){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-dark-raised)!important} :root[data-cj-resolved-mode="dark"] :where(.top-menu-tile,.mega-link,.cj-theme-choice,.cj-quick-link){color:#dce7f4!important} :root[data-cj-resolved-mode="dark"] :where(.top-menu-tile:hover,.top-menu-tile:focus-visible,.mega-link:hover,.cj-theme-choice:hover,.cj-quick-link:hover){color:#fff!important;background:#24435d!important} :root[data-cj-resolved-mode="dark"] :where(.cj-kpi,.kpi,.cj-panel,.integration-status,.mapping-flow>div){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.cj-kpi__label,.kpi-label,.cj-kpi small,.cj-panel small,.empty,.muted){color:var(--cj-muted)!important} :root[data-cj-resolved-mode="dark"] :where(.swal2-title,.swal2-html-container,.MuiDialogTitle-root,.MuiDialogContent-root){color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] .page-modal-overlay{background:rgba(4,10,18,.92)!important} :root[data-cj-resolved-mode="dark"] .cj-pdf-live-progress>div{color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] .cj-pdf-live-progress p{color:var(--cj-muted)!important} :root[data-cj-resolved-mode="dark"] #cj-portal-launcher a{color:#fff!important;-webkit-text-fill-color:#fff!important;background:#075ea8!important;border-color:#91c8f4!important} :root[data-cj-resolved-mode="dark"] #cj-portal-launcher a:last-child{color:#fff!important;-webkit-text-fill-color:#fff!important;background:#0b2944!important;border-color:#7890a8!important} :root[data-cj-resolved-mode="dark"] :where(.cj-dashboard-hero,.cj-dashboard-date,.cj-dashboard-actions a){color:#eef5fb!important;-webkit-text-fill-color:#eef5fb!important} /* MUI overlays render outside page containers, so their text needs an explicit dark palette. */ :root[data-cj-resolved-mode="dark"] :where(.MuiPickersPopper-root,.MuiPickersLayout-root,.MuiDateCalendar-root,.MuiDayCalendar-root,.MuiYearCalendar-root,.MuiMonthCalendar-root,.MuiAutocomplete-paper,.MuiAutocomplete-listbox,.MuiSelect-select,.MuiMenu-list,.MuiList-root,.MuiTooltip-tooltip){color:var(--cj-ink)!important;background:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiPickersCalendarHeader-label,.MuiDayCalendar-weekDayLabel,.MuiPickersDay-root,.MuiPickersYear-yearButton,.MuiPickersMonth-monthButton,.MuiClockNumber-root,.MuiListItem-root,.MuiListItemButton-root,.MuiMenuItem-root,.MuiAutocomplete-option){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiPickersDay-root:hover,.MuiPickersYear-yearButton:hover,.MuiPickersMonth-monthButton:hover,.MuiMenuItem-root:hover,.MuiAutocomplete-option:hover,.MuiAutocomplete-option[aria-selected="true"],.MuiListItemButton-root:hover){color:#fff!important;background:#294761!important} :root[data-cj-resolved-mode="dark"] :where(.MuiPickersDay-root.Mui-selected,.MuiPickersYear-yearButton.Mui-selected,.MuiPickersMonth-monthButton.Mui-selected){color:#fff!important;-webkit-text-fill-color:#fff!important;background:#087ac1!important} :root[data-cj-resolved-mode="dark"] :where(.MuiPickersDay-root.Mui-disabled,.MuiPickersDay-root.MuiPickersDay-dayOutsideMonth,.MuiMenuItem-root.Mui-disabled,.MuiAutocomplete-option[aria-disabled="true"]){color:#8999ad!important;-webkit-text-fill-color:#8999ad!important;opacity:1!important} /* Interactive labels and icons must remain visible without flattening contained action colours. */ :root[data-cj-resolved-mode="dark"] :where(.MuiIconButton-root,.MuiTab-root,.MuiChip-root,.MuiChip-label,.MuiCheckbox-root,.MuiRadio-root,.MuiSwitch-root,.MuiPaginationItem-root,.MuiBreadcrumbs-root,.MuiBreadcrumbs-separator){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiButton-contained,.MuiFab-root,.MuiPickersDay-root.Mui-selected) :where(span,.MuiSvgIcon-root){color:inherit!important;-webkit-text-fill-color:currentColor!important} :root[data-cj-resolved-mode="dark"] :where(button,a,[role="button"]):focus-visible{outline:3px solid #71c7ff!important;outline-offset:2px!important} :root[data-cj-resolved-mode="dark"] :where(.Mui-disabled,[aria-disabled="true"],button:disabled,input:disabled,select:disabled,textarea:disabled){border-color:#4b5c70!important;opacity:1!important} :root[data-cj-resolved-mode="dark"] :where(input:disabled,select:disabled,textarea:disabled,.MuiInputBase-root.Mui-disabled){color:#9dabbc!important;-webkit-text-fill-color:#9dabbc!important;background:#162235!important} /* Native and common third-party controls used by older ERP modules. */ :root[data-cj-resolved-mode="dark"] :where(option,optgroup,.react-datepicker,.react-datepicker__header,.react-datepicker__month-container,.flatpickr-calendar,.flatpickr-months,.flatpickr-weekdays,.flatpickr-days){color:var(--cj-ink)!important;background:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.react-datepicker__day,.react-datepicker__day-name,.react-datepicker__current-month,.flatpickr-day,.flatpickr-weekday,.cur-month,.numInput){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(.react-datepicker__day--selected,.flatpickr-day.selected){color:#fff!important;-webkit-text-fill-color:#fff!important;background:#087ac1!important} /* Full-build audit: remap the legacy form tokens defined by the compiled bundle. */ :root[data-cj-resolved-mode="dark"]{--erp-input-border:#52677f;--erp-input-border-hover:#7890aa;--erp-input-border-focus:#71c7ff;--erp-input-focus-ring:rgba(113,199,255,.25);--erp-input-text:#f1f5f9;--erp-input-placeholder:#aebccd;--erp-input-bg:#111e30;--erp-input-disabled-bg:#162235;--erp-input-error:#ff8b8b} :root[data-cj-resolved-mode="dark"] :where(.MuiInputLabel-root.MuiInputLabel-shrink,.Mui-disabled.MuiInputLabel-root.MuiInputLabel-shrink){color:var(--cj-muted)!important;background:var(--cj-dark-control)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiInputAdornment-root,.MuiFormControlLabel-label,.MuiSelect-icon,.MuiAutocomplete-popupIndicator,.MuiAutocomplete-clearIndicator){color:var(--cj-muted)!important;-webkit-text-fill-color:var(--cj-muted)!important} /* Remaining MUI families found across entry, record, report and settings modules. */ :root[data-cj-resolved-mode="dark"] :where(.MuiAppBar-root,.MuiToolbar-root,.MuiBottomNavigation-root,.MuiAccordionSummary-root,.MuiAccordionDetails-root,.MuiStep-root,.MuiStepLabel-root,.MuiStepper-root,.MuiTabs-root,.MuiTabScrollButton-root,.MuiSnackbarContent-root,.MuiSpeedDialAction-fab,.MuiToggleButton-root,.MuiPagination-root){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background-color:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiAlert-standardInfo,.MuiAlert-outlinedInfo){color:#c7e7ff!important;background:#17334b!important}:root[data-cj-resolved-mode="dark"] :where(.MuiAlert-standardSuccess,.MuiAlert-outlinedSuccess){color:#c9f7da!important;background:#163729!important} :root[data-cj-resolved-mode="dark"] :where(.MuiAlert-standardWarning,.MuiAlert-outlinedWarning){color:#ffe1a8!important;background:#3b2d18!important} :root[data-cj-resolved-mode="dark"] :where(.MuiAlert-standardError,.MuiAlert-outlinedError){color:#ffd0d0!important;background:#462326!important} :root[data-cj-resolved-mode="dark"] :where(.MuiDivider-root,hr){border-color:var(--cj-border)!important} :root[data-cj-resolved-mode="dark"] :where(.MuiSlider-markLabel,.MuiStepLabel-label,.MuiBottomNavigationAction-label,.MuiRating-iconEmpty){color:var(--cj-muted)!important} /* Compiled modules contain inline black action icons/text; constrain the override to screen dark mode. */ @media screen{ :root[data-cj-resolved-mode="dark"] :where([style*="color: rgb(0, 0, 0)"],[style*="color: rgb(17, 17, 17)"],[style*="color: rgb(34, 34, 34)"],[style*="color: #000"],[style*="color:#000"],[style*="color: black"],[style*="color:black"]){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(.bg-white,.bg-gray-50,.bg-gray-100,.bg-gray-200,.text-field .MuiFilledInput-root,.auto-complete .MuiFilledInput-root,.typography-style,.building-section,.floor,.seat,.styled-table-container,.google-visualization-table-table,.google-visualization-table-th-fullwidth,.google-visualization-table-tr-even,.google-visualization-table-tr-odd,.report-dom:not(.print-source),.report-dom:not(.print-source) tr,.report-dom:not(.print-source) td,.report-dom:not(.print-source) th){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background-color:var(--cj-surface)!important} :root[data-cj-resolved-mode="dark"] :where(.text-gray-500,.text-gray-600,.text-gray-700,.text-gray-800,.text-gray-900,.date-text,.styled-table-container h2,.plus-link,.room,.seat){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(.hover\:bg-white:hover,.hover\:bg-gray-50:hover,.hover\:bg-gray-200:hover,.text-field:hover .MuiFilledInput-root,.auto-complete:hover .MuiFilledInput-root,.google-visualization-table-tr-over:hover){color:#fff!important;background-color:#294761!important} /* Legacy dashboard widgets use inline light surfaces and black/gray copy. Keep them inside the same dark semantic palette instead of allowing white-on-white or black-on-navy combinations. Screen-only so printed business documents are untouched. */ :root[data-cj-resolved-mode="dark"] :where( [style*="background: rgb(255, 255, 255)"], [style*="background-color: rgb(255, 255, 255)"], [style*="background: #fff"], [style*="background-color: #fff"], [style*="background: white"], [style*="background-color: white"] ){color:var(--cj-ink)!important;border-color:var(--cj-border)!important;background:var(--cj-dark-raised)!important} :root[data-cj-resolved-mode="dark"] :where( [style*="background: rgb(232, 245, 233)"], [style*="background-color: rgb(232, 245, 233)"], [style*="background: rgb(237, 247, 232)"], [style*="background-color: rgb(237, 247, 232)"] ){color:#d9fbe5!important;border-color:#397256!important;background:#163729!important} :root[data-cj-resolved-mode="dark"] :where( [style*="color: rgba(0, 0, 0, 0.87)"], [style*="color: rgba(0, 0, 0, 0.6)"], [style*="color: rgba(0, 0, 0, 0.54)"], [style*="color: rgb(51, 51, 51)"], [style*="color: rgb(33, 33, 33)"], [style*="color: #333"], [style*="color:#333"] ){color:var(--cj-ink)!important;-webkit-text-fill-color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where( [style*="color: rgb(117, 117, 117)"], [style*="color: rgb(102, 102, 102)"], [style*="color: #666"], [style*="color:#666"] ){color:var(--cj-muted)!important;-webkit-text-fill-color:var(--cj-muted)!important} /* Module landing pages ship a hard-coded light palette inside their cards. Scope the correction to the page identified by its menu search control so forms, documents and ordinary MUI panels keep their own semantic colours. */ :root[data-cj-resolved-mode="dark"] body:has(input[placeholder="Search menu items..."]) .MuiPaper-root > .MuiBox-root:last-child { color:var(--cj-ink)!important; background:var(--cj-surface)!important; } :root[data-cj-resolved-mode="dark"] body:has(input[placeholder="Search menu items..."]) .MuiPaper-root > .MuiBox-root:last-child .MuiBox-root { color:var(--cj-ink)!important; border-color:var(--cj-border)!important; background:var(--cj-dark-control)!important; } :root[data-cj-resolved-mode="dark"] body:has(input[placeholder="Search menu items..."]) .MuiPaper-root > .MuiBox-root:last-child :where(.MuiTypography-root,.menu-label,.menu-arrow) { color:var(--cj-ink)!important; -webkit-text-fill-color:var(--cj-ink)!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-stock-card="true"] { color:var(--cj-ink)!important; border:1px solid var(--cj-border)!important; background:var(--cj-dark-raised)!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-stock-card="true"] :where(.MuiTypography-root,.MuiBox-root) { color:var(--cj-ink)!important; -webkit-text-fill-color:var(--cj-ink)!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-panel="true"] [data-cj-low-contrast="true"] { color:var(--cj-ink)!important; -webkit-text-fill-color:var(--cj-ink)!important; } :root[data-cj-resolved-mode="dark"][data-cj-page="modules"] [data-cj-module-light-surface="true"] { color:var(--cj-ink)!important; border-color:var(--cj-border)!important; background:var(--cj-surface)!important; } :root[data-cj-resolved-mode="dark"][data-cj-page="modules"] [data-cj-low-contrast="true"] { color:var(--cj-ink)!important; -webkit-text-fill-color:var(--cj-ink)!important; } } /* SVG chart and status text is otherwise unaffected by inherited HTML colour. */ :root[data-cj-resolved-mode="dark"] :where(svg text,svg tspan,.MuiChartsAxis-tickLabel,.MuiChartsLegend-label){fill:var(--cj-ink)!important;color:var(--cj-ink)!important} :root[data-cj-resolved-mode="dark"] :where(a:not(.MuiButton-contained):not([class*="status"])){color:#8fd0ff} :root[data-cj-resolved-mode="dark"] :where(code,pre,kbd){color:#e6edf7!important;border-color:var(--cj-border)!important;background:#101b2a!important} :root[data-cj-resolved-mode="dark"] ::selection{color:#fff;background:#075ea8} /* Dashboard acceptance: neutral corporate KPI surfaces and readable semantic copy. Full-card traffic-light colours are intentionally removed; blue/orange remain as restrained COLORJET accents. These selectors are marker-based so other modules and printable documents are not recoloured. */ [data-cj-dashboard-corporate-kpi]{ position:relative!important; overflow:hidden!important; color:#17324d!important; border:1px solid #d8e2ec!important; background:#f8fafc!important; box-shadow:0 3px 12px rgba(15,45,70,.07)!important; } [data-cj-dashboard-corporate-kpi]::before{ content:"";position:absolute;inset:0 auto 0 0;width:4px; background:#3589a1; } [data-cj-dashboard-corporate-kpi="receivable"]::before, [data-cj-dashboard-corporate-kpi="delivery"]::before{background:#f47a20} [data-cj-dashboard-corporate-kpi="product"]::before{background:#16856b} [data-cj-dashboard-corporate-kpi] [data-cj-dashboard-kpi-copy="true"]{ color:#17324d!important;-webkit-text-fill-color:#17324d!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-corporate-kpi]{ color:#f4f8fc!important; border-color:#405269!important; background:#1d2d43!important; box-shadow:0 4px 14px rgba(0,0,0,.2)!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-corporate-kpi] [data-cj-dashboard-kpi-copy="true"]{ color:#f4f8fc!important;-webkit-text-fill-color:#f4f8fc!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-panel="true"]{ color:#f4f8fc!important;border-color:#405269!important;background:#172437!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-panel="true"] :where(.MuiTypography-root,.MuiBox-root,span,strong,small){ color:#e8f0f8!important;-webkit-text-fill-color:#e8f0f8!important; } :root[data-cj-resolved-mode="dark"] [data-cj-dashboard-panel="true"] :where([data-cj-low-contrast="true"],.MuiTypography-colorTextSecondary){ color:#bdc9d8!important;-webkit-text-fill-color:#bdc9d8!important; } /* Preserve the original artwork and its proportions in the compact application header. The supplied wide letterhead remains a document asset, not navigation. */ .cj-header-logo,.cj-header-brand img,.top-header img[alt*="COLORJET" i]{ width:auto!important;height:auto!important;max-width:116px!important;max-height:34px!important; object-fit:contain!important;object-position:left center!important; }