/*!
 * NONE
 */
/*
 * Epic Dark ("czarny grafit") theme.
 * Active only while the "style-epic-dark" titled stylesheet is enabled (theme token "epic-dark").
 * Declared after all epic*.css links, so this :root wins over epic.css by document order.
 */

:root {
    /* ============================================================ */
    /* A. DARK RAMP - single tuning block, edit colors only here    */
    /* ============================================================ */

    --dark-bg-page: #0F131A;            /* app/content background (behind panels) */
    --dark-bg-menu: #262C36;            /* left menu background */
    --dark-surface-1: #191D23;          /* grid rows, base panels (exact from Figma) */
    --dark-surface-2: #383F4C;          /* windows, dialogs, form fields (elevated chrome) */
    --dark-surface-3: #3A4456;          /* grid headers, raised surfaces, hover */
    --dark-border-1: #576776;           /* visible borders (windows, fields) */
    --dark-border-2: #2E3644;           /* subtle borders, separators */
    --dark-text-1: #E6E9EF;             /* primary text */
    --dark-text-2: #ABB3C5;             /* secondary text */
    --dark-text-disabled: #5C6374;
    --dark-accent: #4B71DF;             /* readable blue for links/focus on dark */
    --dark-link: #BBD7FF;               /* link text on dark */
    --dark-link-hover: #CBDDFF;               /* link text on dark */
    --dark-accent-bg: #2E327B;          /* selection surfaces (exact from Figma: #1E4ED7 -> #2E327B) */
    --dark-accent-bg-soft: #1B2029;     /* palest surface tint (grid headers, subtle bg) - near-neutral, not navy */
    --dark-accent-bg-soft-2: #232A38;   /* palest surface tint hover */
    --dark-accent-bg-deep: #060824;     /* deepest navy surface (exact from Figma: #F2F6FF -> #060824) */
    --dark-accent-border: #3A4674;      /* muted blue borders */
    --dark-green: #33B074;
    --dark-red: #E5484D;
    --dark-red-bg: #3A1520;
    --dark-yellow: #F5B942;
    --dark-yellow-bg: #3D3117;

    /* ============================================================ */
    /* B. PRIMITIVE REMAP - epic.css tokens re-pointed at the ramp  */
    /* ============================================================ */

    --menu-black: var(--dark-bg-menu);

    --color-black: var(--dark-text-1);
    --color-gray-80: var(--dark-text-1);
    --color-gray-60: var(--dark-text-2);
    --color-gray-40: var(--dark-text-disabled);
    --color-gray-20: var(--dark-border-1);
    --color-gray-10: var(--dark-border-2);
    --color-gray-05: var(--dark-surface-3);
    --color-gray-light: var(--dark-bg-page);
    --color-gray-fields: var(--dark-surface-2);

    --color-blue-light: var(--dark-surface-3);
    --color-blue-light-hover: var(--dark-surface-3);
    --color-blue-light-hover-transparent: #2E327B50;
    --color-blue-light-notification: #ABB1CFBF;
    --color-blue-40: var(--dark-accent-border);
    --color-blue-20: #262E52;
    /* primary hover must stay visible on dark (#141846 would vanish) */
    --color-blue-dark: var(--color-blue-darken-20);
    --color-blue-menu-active: #4B71DF1F;

    --color-red: #E5484D;
    --color-red-light: #FF6655;
    --color-green: #77EE77;
    --color-yellow-40: var(--dark-yellow-bg);
    --color-holiday-day: #2E1A1E;

    --color-surface-soft: var(--dark-surface-2);
    --color-surface-muted: var(--dark-surface-3);
    --color-border-soft: var(--dark-border-2);
    --color-border-mid: var(--dark-border-1);
    --color-text-soft: var(--dark-text-disabled);
    --color-text-neutral: var(--dark-text-2);
    --color-text-firm: var(--dark-text-2);
    --color-text-strong: var(--dark-text-1);

    /* kept from epic.css on purpose: --color-white (text on blue),
       --color-blue accent ramp, --menu-black-hover/-selected */

    /* ============================================================ */
    /* C. SEMANTIC RE-POINT                                          */
    /* ============================================================ */

    /* bg-primary aliases --color-white in epic.css, which stays white */
    --color-bg-primary: var(--dark-surface-1);


    --color-bg-primary-buttons: var(--dark-surface-1);
    --color-bg-primary-buttons-hover: var(--dark-surface-2);
    /* text/border/state semantics resolve through remapped primitives */

    /* ============================================================ */
    /* D. CROSS-FILE BRIDGES                                         */
    /* ============================================================ */

    /* base-layer tokens; light skins never define these,
       so their var() fallbacks keep the original light values */
    --fn-bg-base: var(--dark-surface-1);
    --fn-bg-muted: var(--dark-surface-3);
    --fn-bg-tint: var(--dark-bg-page);
    --fn-bg-select: var(--dark-accent-bg);
    --fn-text-strong: var(--dark-text-1);
    --fn-text-mid: var(--dark-text-2);
    --fn-border-muted: var(--dark-border-2);
    --fn-border-tint: var(--dark-border-1);
    --fn-hairline: var(--dark-border-2);   /* was "white" separators (invisible on light) */
    --fn-icon-color: #ABB3C2;               /* masked (::before) mono icon glyphs - icon+text elements */
    --fn-icon-filter: brightness(0) invert(0.67) sepia(0.24) hue-rotate(181deg) saturate(1.4);  /* recolor of in-place mono icons (filter) - one knob */
    --fn-icon-filter-bright: brightness(0) invert(1);  /* recolor of in-place mono icons (filter) - one knob */

    --uni-create-obj-bg-hover-color: var(--dark-accent-bg-soft-2);

    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
    --shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.45);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.45);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.55);

    --uni-create-obj-bg-color: var(--fn-bg-base);
    --uni-create-obj-floater-font-override: var(--dark-text-1);
    --uni-create-obj-bg-hover-color: var(--color-blue-light);

    --checkboxoff: url(images/checkboxoff-dark.svg);
}

body {
    /* tokens consumed with light fallbacks by stylesheetnew.css */
    --background: var(--dark-bg-page);
    --box-on-bg-1: var(--dark-surface-1);
    --shadows-bright: 0.8;

    background-color: var(--dark-bg-page);
    color: var(--dark-text-1);
}

/* ============================================================ */
/* BASE LAYER DARKENING                                          */
/* Epic never styles the raw ExtJS classes, so their light       */
/* defaults leak through. Selectors mirror the leaking rules;    */
/* !important only where the light rule carries it. PNG gradient */
/* strips are neutralized with background-image: none.           */
/* ============================================================ */

/* --- grid --- */

.x-grid3, .x-grid3-viewport, .x-grid3-scroller {
    background-color: var(--dark-bg-page);
}

.x-grid3-hd-row td {
    color: var(--dark-text-2);
}

td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner,
td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
    background-color: var(--dark-surface-3) !important;
    background-image: none !important;
}

a.x-grid3-hd-btn, a.x-grid3-hd-btn:hover {
    background-color: rgba(100,120,140,0.1) !important;
    filter: brightness(0) invert(1);
}

.x-simple-style.x-split-details.x-epic-style .x-grid3-hd-inner{
    border-radius: 0px;
}

.filterlist-filter-tricheck{
    border-color: transparent !important;
}

.x-grid3-row {
    background-color: var(--dark-surface-1);
    border-color: var(--dark-border-2);
}

.x-grid3-row-alt {
    background-color: var(--dark-bg-page);
}

.x-grid3-row-over {
    background-color: var(--dark-surface-3);
    background-image: none;
}

.x-grid3-row-selected {
    background-color: var(--dark-accent-bg) !important;
    background-image: none;
    border-color: var(--dark-accent-border);
}

.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
    background-image: none;
}

.x-grid3-cell-inner, .x-grid3-row-table {
    color: var(--dark-text-1);
}

.x-grid-with-col-lines .x-grid3-cell {
    border-right-color: var(--dark-border-2);
}

.x-grid-group-hd {
    border-bottom-color: var(--dark-border-1);
}

.x-grid-group-hd div.x-grid-group-title {
    color: var(--dark-text-2);
}

.x-grid3-summary-row {
    background-color: var(--dark-surface-2);
    color: var(--dark-text-1);
}

.x-grid-empty {
    background-color: var(--dark-bg-page);
    color: var(--dark-text-2);
}

/* --- windows, dialogs, progress --- */

.x-window-tl, .x-window-tc, .x-window-tr,
.x-window-ml, .x-window-mr,
.x-window-bl, .x-window-bc, .x-window-br {
    background-color: #242A33;
    background-image: none;
}

.x-window-mc {
    background-color: #242A33;
    color: var(--dark-text-1);
}

.x-window-body {
    background-color: #242A33;
}

.x-window-plain .x-window-mc, .x-window-plain .x-window-body {
    background-color: #242A33;
    border-color: var(--dark-border-1);
}

.x-window-tl .x-window-header, .x-window-header-text {
    color: var(--dark-text-1);
}

.ext-el-mask {
    background-color: #000000;
}

.x-progress-wrap {
    border-color: var(--dark-border-1);
}

.x-progress-inner {
    background-color: var(--dark-surface-2);
    background-image: none;
}

.x-progress-bar {
    background-color: var(--color-blue);
    background-image: none;
    border-color: var(--color-blue-darken-20);
}

.x-progress-text {
    color: var(--color-white);
}

.x-progress-text-back {
    color: var(--dark-text-1);
}

/* --- menus and combo dropdowns --- */

.x-menu {
    background-color: var(--dark-surface-1);
    background-image: none;
    border-color: var(--dark-border-1);
}

.x-menu-plain {
    background-color: var(--dark-surface-1) !important;
}

.x-menu-floating {
    border-color: var(--dark-border-1);
}

a.x-menu-item {
    color: var(--dark-text-1);
}

.x-menu-item-active {
    background-color: var(--dark-surface-3);
    background-image: none;
    border-color: var(--dark-border-1);
}

.x-menu-item-active a.x-menu-item {
    border-color: var(--dark-border-1);
}

.x-menu-sep {
    background-color: var(--dark-border-2);
    border-bottom-color: var(--dark-surface-1);
}

.x-menu .x-menu-scroller-top, .x-menu .x-menu-scroller-bottom {
    background-color: var(--dark-surface-3);
}

.x-dark-menu-style .x-menu-more-button button span{
    color: var(--dark-text-2);
}

.x-combo-list {
    background-color: var(--dark-surface-1) !important;
    border-color: var(--dark-border-1);
}

.x-combo-list-inner {
    background-color: var(--dark-surface-1);
    color: var(--dark-text-1);
}

.x-combo-list-hd {
    background-color: var(--dark-surface-3);
    background-image: none;
    color: var(--dark-text-2);
}

.x-combo-list-item {
    border-color: var(--dark-surface-1);
}

.x-combo-list .x-combo-selected {
    background-color: var(--dark-surface-3);
    border-color: var(--dark-accent-border) !important;
}

.x-resizable-pinned .x-combo-list-inner {
    border-bottom-color: var(--dark-border-1);
}

.x-toolbar #breadcrumb div.statusText,
.x-toolbar #breadcrumb div.statusText:hover,
.white-header-style .breadcrumb-link-active:hover {
    color: var(--link-color);
}
.x-simple-style .breadcrumb-link-active.xx-form-field:hover div.statusText{
    border-bottom: 1px solid var(--link-color);
}

#mainheader .breadcrumb-current-task .x-link-with-buttons .x-btn-text{
    opacity: 0.7;
}
#mainheader .breadcrumb-current-task .x-link-with-buttons .x-btn-text:hover{
    opacity: 1;
}

.x-simple-style .x-trigger-wrap-focus .x-form-trigger,
.x-simple-style .x-grid-editor .x-form-field-wrap .x-form-trigger{
    border-color: transparent;
    transition: none !important;
}

/* --- form fields --- */

.object-create-tab-panel .x-panel-tbar .x-form-trigger,
.object-create-tab-panel .x-panel-tbar .x-form-spinner-trigger,
.x-window .x-form-text,
.x-epic-style .x-abstract-report form .x-form-text,
.x-epic-style #integrations .x-form-text,
.x-details-panel .x-form-text,
.textarea-box-style,
textarea.x-form-field {
    background-color: var(--dark-surface-2) !important;
    background-image: none;
    color: var(--dark-text-1);
    border-color: var(--dark-border-1);
}

.x-form-text.editorGridField {
    background-color: var(--fn-bg-base) !important;
}

.x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-form-field-wrap .x-form-trigger,
#mailCreateWindow .ai-generate-mail-form-item textarea,
.x-epic-style .x-abstract-report form .x-form-field-wrap .x-form-trigger,
.x-epic-style #integrations .x-form-field-wrap .x-form-trigger,
.ext-strict .x-simple-style.x-hs-test .x-chart-configuration-panel .x-form-text:not(.combo-in-fieldset):not(.editorGridField),
.ext-strict .x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-window-bwrap .x-form-text:not(.combo-in-fieldset):not(.editorGridField){
    background-color: var(--dark-surface-2);
}

/*.x-simple-style.x-hs-test .x-chart-configuration-panel .x-form-element .x-form-field-wrap.x-trigger-wrap-focus .x-form-trigger,*/
/*.x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-form-element .x-form-field-wrap.x-trigger-wrap-focus .x-form-trigger,*/
/*.x-epic-dark-style.x-simple-style .x-window:not(.x-filter-window) .x-form-item .x-form-field-trigger-wrap > .x-form-trigger*/

.ext-strict .x-simple-style.x-hs-test .x-chart-configuration-panel  .x-trigger-wrap-focus .x-form-trigger,
.ext-strict .x-simple-style.x-hs-test .x-chart-configuration-panel  .x-trigger-wrap-focus .x-form-text:not(.combo-in-fieldset):not(.editorGridField),
.ext-strict .x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-window-bwrap .x-trigger-wrap-focus .x-form-text:not(.combo-in-fieldset):not(.editorGridField),
.ext-strict .x-simple-style.x-hs-test .x-chart-configuration-panel  .x-form-text:not(.combo-in-fieldset):not(.editorGridField):focus,
.ext-strict .x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-window-bwrap .x-form-text:not(.combo-in-fieldset):not(.editorGridField):focus,
.ext-strict .x-simple-style.x-hs-test .x-window textarea.x-form-field:focus,
.ext-strict .x-simple-style.x-hs-test .x-window textarea.x-form-field:hover{
    border-color: #AACCFFAA !important;
    transition: none !important;
}

.ext-strict .x-epic-dark-style.x-simple-style .x-window:not(.x-filter-window) .x-form-item .x-form-field-wrap.x-trigger-wrap-focus > .x-form-trigger{
    border-color: #AACCFFAA !important;
    filter: none !important;
}

iframe.x-form-text {
    background-color: var(--dark-surface-2) !important;
}

.x-form-field.x-form-focus, .x-form-focus, textarea.x-form-focus {
    border-color: var(--dark-accent);
}

/*.x-form-field-wrap .x-form-trigger {*/
/*    background-color: var(--dark-surface-2) !important;*/
/*    border-color: var(--dark-border-1);*/
/*}*/

.x-form-invalid, textarea.x-form-invalid {
    background-color: var(--dark-surface-2) !important;
    background-image: none !important;
    border-color: var(--dark-red);
}

.x-form-item-label, .x-form-cb-label {
    color: var(--dark-text-2);
}

/* floating field labels sit over the field border - their pill must match
   the field background so the notch reads cleanly (user spec: same as field) */
.x-epic-style .x-window:not(.x-filter-window) .x-form-label-top .x-form-item-label,
.x-epic-style #contentContainer .x-details-panel .x-form-label-top .x-form-item-label,
.x-epic-style .combo-in-fieldlabel-parent .x-form-text span.field-label,
.ext-strict .x-simple-style.x-epic-style .combo-in-fieldlabel-parent .x-form-text span.field-label,
.x-simple-style.x-hs-test .x-window .object-create-formpanel .combo-in-fieldset .x-formfield-value-and-icon,
.x-epic-style .x-window .x-form-label-top .combo-in-fieldlabel-parent .field-label {
    background-color: var(--dark-surface-2);
}

.x-form-empty-field, input.x-form-empty-field, textarea.x-form-empty-field {
    color: var(--dark-text-disabled);
}

.x-item-disabled .x-form-cb-label, .x-item-disabled .x-form-item-label {
    color: var(--dark-text-disabled);
}

.x-fieldset {
    border-color: var(--dark-border-2);
}

.x-fieldset legend {
    color: var(--dark-text-2);
}

/* --- panels, tabs, toolbars --- */

.x-panel-body {
    background-color: var(--dark-bg-page);
    color: var(--dark-text-1);
}

.x-panel-header {
    background-color: var(--dark-surface-1);
    background-image: none;
    color: var(--dark-text-2);
    border-color: var(--dark-border-2);
}

.x-panel-tl, .x-panel-tr, .x-panel-tc,
.x-panel-ml, .x-panel-mr,
.x-panel-bl, .x-panel-br, .x-panel-bc {
    background-color: var(--dark-surface-1);
    background-image: none;
}

.x-panel-mc {
    background-color: var(--dark-surface-1);
}

.x-panel-tl .x-panel-header {
    color: var(--dark-text-2);
}

.x-panel-body-noheader, .x-panel-mc .x-panel-body,
.x-grid-panel .x-panel-mc .x-panel-body {
    border-color: var(--dark-border-1);
}

.fnmenu .x-panel-header .x-panel-header-text{
    color: var(--dark-text-1);
}

.x-toolbar {
    background-color: var(--dark-bg-page);
    background-image: none;
    border-color: var(--dark-border-2);
}

.x-toolbar div.xtb-text {
    color: var(--dark-text-2);
}

.x-toolbar .xtb-sep {
    background-image: none;
}

ul.x-tab-strip-top {
    background-color: var(--dark-surface-1);
    background-image: none;
    border-bottom-color: var(--dark-border-1);
}

.x-tab-panel-header, .x-tab-panel-footer {
    background-color: var(--dark-surface-1);
    border-color: var(--dark-border-1);
}

ul.x-tab-strip li {
    border-color: var(--dark-border-2);
}

.x-tab-strip-top .x-tab-right, .x-tab-strip-top .x-tab-left,
.x-tab-strip-top .x-tab-strip-inner {
    background-image: none;
}


.x-tab-strip span.x-tab-strip-text {
    color: var(--dark-text-2);
}

.x-tab-strip-active span.x-tab-strip-text {
    color: var(--dark-text-1);
}

.x-tab-panel-body {
    background-color: var(--dark-bg-page);
    border-color: var(--dark-border-1);
}

/* --- tooltips --- */

.x-tip .x-tip-tl, .x-tip .x-tip-tc, .x-tip .x-tip-tr,
.x-tip .x-tip-ml, .x-tip .x-tip-mc, .x-tip .x-tip-mr,
.x-tip .x-tip-bl, .x-tip .x-tip-bc, .x-tip .x-tip-br {
    background-color: transparent !important;
    background-image: none !important;
}

.x-tip, .x-showOnHover {
    background-color: var(--dark-surface-3) !important;
}

.x-tip .x-tip-body, .x-tip .x-tip-header-text {
    color: var(--dark-text-1);
}

@-webkit-keyframes color {
    100%, 0% {
        stroke: #DDEEFF;
    }
}

@keyframes color {
    100%, 0% {
        stroke: #DDEEFF;
    }
}

/* --- date picker --- */

.x-date-picker {
    background-color: var(--dark-surface-1);
    border-color: var(--dark-border-1);
}

.x-date-left a, .x-date-right a {
    filter: invert(1);
}

.x-date-middle .x-btn .x-btn-text {
    color: var(--dark-text-1);
}

.x-date-inner th {
    color: var(--dark-text-2);
}

.x-date-inner td {
    border-color: var(--dark-surface-1);
}

.x-date-inner a {
    color: var(--dark-text-1);
}

.x-date-inner a:hover, .x-date-inner .x-date-disabled a:hover {
    background-color: var(--dark-surface-3);
    color: var(--dark-text-1);
}

.x-date-inner .x-date-selected a {
    background-color: var(--color-blue);
    background-image: none;
    color: var(--color-white);
}

.x-date-inner .x-date-today a {
    border-color: var(--dark-accent);
}

.x-date-inner .x-date-prevday a, .x-date-inner .x-date-nextday a {
    color: var(--dark-text-disabled);
}

.x-date-inner .x-date-disabled a {
    background-color: var(--dark-bg-page);
    color: var(--dark-text-disabled);
}

.x-date-mp {
    background-color: var(--dark-surface-1);
}

.x-date-mp td.x-date-mp-month a, .x-date-mp td.x-date-mp-year a {
    color: var(--dark-text-1);
}

td.x-date-mp-month a:hover, td.x-date-mp-year a:hover {
    background-color: var(--dark-surface-3);
    color: var(--dark-text-1);
}

td.x-date-mp-sel a {
    background-color: var(--color-blue);
    background-image: none;
    color: var(--color-white);
}

.x-date-mp-btns {
    background-color: var(--dark-surface-3);
    background-image: none;
}

.x-date-mp-btns td {
    border-top-color: var(--dark-border-1);
}

td.x-date-mp-sep {
    border-right-color: var(--dark-border-1);
}

/* --- scrollbars --- */

::-webkit-scrollbar {
    background: var(--dark-bg-page);
}

::-webkit-scrollbar-button {
    display: none;
}

::-webkit-scrollbar-thumb {
    background: var(--dark-surface-3);
    border: 2px solid var(--dark-bg-page);
    border-radius: 6px;
}

body * {
    scrollbar-color: var(--dark-border-1) transparent;
}

/* --- page shell (light rules that out-rank a plain body selector) --- */

.x-border-layout-ct {
    background-color: var(--dark-bg-page);
}

.x-tab-panel-bwrap,
.dashboard-body,
.fnmenu .fnmenu-body,
.reportpreview,
.filterPanel,
.x-tab-panel .x-panel-mc,
#licences .x-panel-mc,
#calendar .x-panel-mc {
    background: var(--dark-bg-page) !important;
}

.dashboard-body {
    border-color: var(--dark-border-2) !important;
}

.dashboard-body .x-portlet,
.dashboard-body .x-portlet .x-panel-header,
.dashboard-body .x-portlet .x-panel-body {
    background-color: var(--dark-surface-1) !important;
}

/* --- simple-layer !important whites (style-new-simple stays enabled for epic) --- */

.x-simple-style .x-grid3-hd-inner,
.x-simple-style .x-grid3-header,
.x-simple-style .x-grid3-scroller,
.x-simple-style .x-portlet .x-grid3-scroller {
    background-color: var(--dark-bg-page) !important;
}

.x-simple-style .x-grid3-row {
    background-color: var(--dark-surface-1) !important;
}

.x-simple-style .x-grid3-row-alt {
    background-color: var(--dark-bg-page) !important;
}

.x-simple-style .x-grid3-row-over {
    background-color: var(--dark-surface-3) !important;
}

.x-simple-style .x-grid3-row-selected {
    background-color: var(--dark-accent-bg) !important;
}

.x-simple-style .x-tab-panel-header {
    background-color: var(--dark-surface-1) !important;
}

.x-simple-style div.panel-simple-frame > div.x-panel-bwrap {
    background-color: var(--dark-surface-1) !important;
}

.x-simple-style #contentContainer .x-toolbar {
    background-color: var(--dark-bg-page) !important;
}

.x-simple-style #contentContainer .x-comment-panel .x-toolbar {
    background-color: var(--dark-surface-1) !important;
}

/* --- AI summary accent chips --- */

#mailCreateWindow .ai-generate-mail-button,
.customer-ai-summary-row-button,
.customer-ai-summary-row-button.x-item-disabled:hover {
    background: color-mix(
            in srgb,
            var(--color-blue-button) 80%,
            transparent
    ) !important;
    color: var(--color-white);
}

.customer-ai-summary-row-button:hover,
#mailCreateWindow .ai-generate-mail-button:hover{
    background: var(--color-blue-button-hover) !important;
    color: var(--color-white);
    filter: none !important;
}

#mailCreateWindow .ai-shortcuts-container .x-btn:hover,
#mailCreateWindow .ai-shortcuts-container .x-btn:hover button{
    filter: none !important;
    background-color: var(--dark-surface-2) !important;
    color: var(--color-white) !important;
}

#mailCreateWindow .ai-shortcuts-container .x-btn button,
#mailCreateWindow .ai-shortcuts-container .x-btn:hover button,
#mailCreateWindow .ai-undo-button button,
#mailCreateWindow .ai-generate-mail-button button,
.customer-ai-summary-magic-wand-icon{
    filter: brightness(0) invert(1) opacity(0.8) !important;
    background-color: transparent !important;
}

.universal-create-object-button--floater{
    border: 1px solid var(--dark-border-1);
    --uni-create-obj-bg-hover-color: var(--color-blue-light);
}

.universal-create-object-button--floater--button--icon img {
    filter: var(--fn-icon-filter) !important;
}


/* --- links --- */

.x-grid3-cell-selected a,
.link,
.link-force-color .xg3ci,
a, .linkNew, .floatingLinkNew {
    color: var(--dark-link);
}

.attachment-name{
    color: var(--dark-link) !important;
}

.x-grid3-cell-selected a:hover, .link:hover {
    color: var(--dark-link-hover) !important;
}

/* --- changelog / comments --- */

.changelog-transaction, .comment-item,
.x-simple-style .changelog-transaction {
    background-color: var(--dark-surface-1);
}

.changelog-date-line,
.x-simple-style .changelog-transaction.changelog-date-line {
    background-color: var(--dark-bg-page);
}

/* --- portlets and grid add-ons --- */

.x-portlet {
    border-color: var(--dark-border-1);
}

.x-superboxselect ul {
    background-color: var(--dark-surface-2);
    border-color: var(--dark-border-2);
}

.x-superboxselect-item {
    background: var(--dark-surface-3);
    border-color: var(--dark-border-1);
    color: var(--dark-text-1);
}

.x-superboxselect-item-focus {
    background: var(--dark-accent-bg);
    border-color: var(--dark-accent-border);
}

/* Monochrome dark icons are lightened by the MONOCHROME ICON RECOLOR block at
   the end of this file: the original svg is reused as a mask on a ::before
   pseudo tinted with --fn-icon-color, so only the glyph is painted and button
   text is never clipped. No duplicate svg files, no filter double-processing. */

/* --- list header toolbar + filter accents (grafit spec colors) --- */

/* "Wszystkie/Wszyscy" filter pill next to the title (epic sets it via a
   very high-specificity selector, so mirror it + .x-epic-dark-style to win) */
.x-htoolbar-filter .x-htoolbar-title-inner,
.x-htoolbar-filter .xtb-text {
    color: #A5B8EF;
}

body.x-epic-dark-style.x-simple-style.x-epic-style #mainContainer #contentContainer .x-htoolbar .x-htoolbar-title-main div.x-htoolbar-title-inner.x-htoolbar-title-main-element,
body.x-epic-dark-style.x-simple-style.x-epic-style #mainContainer #contentContainer .x-grid-panel .x-htoolbar .x-htoolbar-title-main div.x-htoolbar-title-inner.x-htoolbar-title-main-element {
    color: #A5B8EF !important;
    border-color: #7895E7 !important;
}
body.x-epic-dark-style.x-simple-style.x-epic-style #mainContainer #contentContainer .x-htoolbar .x-htoolbar-title-main.x-have-filters div.x-htoolbar-title-inner.x-htoolbar-title-main-element,
body.x-epic-dark-style.x-simple-style.x-epic-style #mainContainer #contentContainer .x-grid-panel .x-htoolbar .x-htoolbar-title-main.x-have-filters div.x-htoolbar-title-inner.x-htoolbar-title-main-element {
    background-image: url(images/dropdown-light.svg) !important;
}

/* view-switch toggle glyphs recolored to #798A99 (icon is a bg-image on a
   blank-src <img> inside .link; mask keeps the box color intact) */
.x-htoolbar-details-tab-inner.link img,
.x-htoolbar-list-tab-inner.link img,
.x-htoolbar-user-privileges-tab-inner.link img,
.x-htoolbar-generic-tab-inner.link img,
.x-htoolbar-tasktree-tab-inner.link img,
.x-htoolbar-kanban-tab-inner.link img,
.x-htoolbar-report-tab-inner.link img,
.x-htoolbar-map-tab-inner.link img,
.x-htoolbar-chart-tab-inner.link img,
.x-htoolbar-invoice-tab-inner.link img {
    background-image: none !important;
    background-color: #798A99 !important;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 20px;
    mask-size: 20px;
    width: 24px !important;
    height: 24px !important;
}

.x-htoolbar-details-tab-inner.link img { -webkit-mask-image: url(images/eye-blue.svg); mask-image: url(images/eye-blue.svg); }
.x-htoolbar-list-tab-inner.link img, .x-htoolbar-tasktree-tab-inner.link img { -webkit-mask-image: url(images/list-blue.svg); mask-image: url(images/list-blue.svg); }
.x-htoolbar-user-privileges-tab-inner.link img { -webkit-mask-image: url(images/privileges.svg); mask-image: url(images/privileges.svg); }
.x-htoolbar-generic-tab-inner.link img, .x-htoolbar-kanban-tab-inner.link img { -webkit-mask-image: url(images/kanban.svg); mask-image: url(images/kanban.svg); }
.x-htoolbar-report-tab-inner.link img { -webkit-mask-image: url(images/report.svg); mask-image: url(images/report.svg); }
.x-htoolbar-map-tab-inner.link img { -webkit-mask-image: url(images/map.svg); mask-image: url(images/map.svg); }
.x-htoolbar-chart-tab-inner.link img { -webkit-mask-image: url(images/chart.svg); mask-image: url(images/chart.svg); }
.x-htoolbar-invoice-tab-inner.link img { -webkit-mask-image: url(images/preview.svg); mask-image: url(images/preview.svg); }

/* filter-row search placeholder */
.x-htoolbar .x-form-empty-field {
    color: #798A99 !important;
}

/* filter-row field borders */
.x-htoolbar .x-form-field-wrap,
.x-htoolbar .x-form-text,
.x-htoolbar .x-form-trigger {
    border-color: #383F4C !important;
}

/* refresh icon (recolored from its dark svg via mask; natural size keeps it from shrinking) */
.x-htoolbar .x-tbar-loading {
    background-image: none !important;
    -webkit-mask: url(images/refresh.svg) no-repeat center;
    mask: url(images/refresh.svg) no-repeat center;
    background-color: #798A99 !important;
}


/* --- contrast fixes: accent chips/buttons whose bg darkened but label stayed dark --- */

.x-header-tscreate {
    color: var(--dark-text-1);
}

.fn-customer-combo-show-all {
    color: var(--dark-link);
}

.ai-tag-topic-inline, .ai-tag-topic-chip,
.ai-tag-status-chip[data-tag-key="fyi"],
.mail-ai-status-tag[data-tag-key="fyi"],
.mail-ai-topic-tag {
    color: var(--dark-link);
}

/* toggle knobs and avatar placeholders must stay light */
.whatsnew-admin-switch:after, .whatsnew-tile-switch:after {
    background-color: #FFFFFF;
}

/* --- grafit fine-tune: header icons, add button, non-alternating grid rows --- */

/* collapse-menu icon (epic sets background:transparent !important, so scope higher;
   natural mask size keeps it from shrinking; collapsed state uses openmenu.svg) */
.x-epic-dark-style #mainheader .menuHideButton {
    background-image: none !important;
    -webkit-mask: url(images/menu/closemenu.svg) no-repeat center;
    mask: url(images/menu/closemenu.svg) no-repeat center;
    background-color: #7895E7 !important;
    opacity: 1;
}

.x-epic-dark-style.x-menu-collapsed #mainheader .menuHideButton {
    -webkit-mask: url(images/menu/openmenu.svg) no-repeat center;
    mask: url(images/menu/openmenu.svg) no-repeat center;
}

/* global "+" create button: dark disc + blue glyph */
.universal-create-object-button .inner {
    background-color: #0D0F11 !important;
}

.universal-create-object-button .icon,
.universal-create-object-button .icon.icon2 {
    background-image: none !important;
    -webkit-mask: url(images/add.svg) no-repeat center / contain;
    mask: url(images/add.svg) no-repeat center / contain;
    background-color: #7895E7 !important;
}

/* grid rows: non-alternating, uniform surface with a subtle line */
.x-simple-style .x-grid3-row,
.x-simple-style .x-grid3-row-alt,
.x-grid3-row, .x-grid3-row-alt {
    background-color: var(--dark-surface-1) !important;
    border-color: #242A33 !important;
}

/* view-switch toggle: active stays brand blue, inactive get a dark disc */
body.x-epic-dark-style.x-simple-style #mainContainer #contentContainer .x-htoolbar.x-toolbar-tabs .x-toolbar-cell.x-htoolbar-tab-selected .xtb-text,
body.x-epic-dark-style.x-simple-style #mainContainer #contentContainer .x-details-panel .x-htoolbar.x-toolbar-tabs .x-toolbar-cell.x-htoolbar-first-tab .xtb-text {
    background-color: #1E4ED7 !important;
}

body.x-epic-dark-style.x-simple-style #mainContainer #contentContainer .x-htoolbar.x-toolbar-tabs .x-toolbar-cell[class*="-tab"]:not(.x-htoolbar-tab-selected):not(.x-tab-hidden) .xtb-text {
    background-color: #242A33 !important;
}

.x-dark-menu-style #mainheader .search-field .x-btn-icon .x-btn-small .x-btn-text {
    filter: invert(1) !important;
}

.x-epic-style #mainheader .search-field input{
    color: #798A99;
}
/* ============================================================ */
/* MONOCHROME ICON RECOLOR (dark-only, pure CSS, no new files).       */
/* filter: recolors mono-dark icons in place (no position shift, no    */
/* duplicate; wins as nothing else sets filter). ::before mask is used */
/* only where an element holds both a bg-icon AND its own text.        */
/* ============================================================ */

/* --- filter recolor (icon-only / icon-with-sibling-text) --- */
.show-deleted-switch, .object-create-secondary-fieldset .x-fieldset-header-text, .import-help-fieldset .x-fieldset-header-text { filter: var(--fn-icon-filter) !important; }
.edit-button, #mainheader .x-link-with-buttons .button-pause-current-activity, #mainheader .x-link-with-buttons .button-finish-current-activity, #mainheader .x-link-with-buttons .button-resume-current-activity, #mainheader .x-link-with-buttons .button-change-task, #mainheader .x-link-with-buttons .button-change-task:hover, #mainheader .button-edit-current-description, #mainheader .button-edit-current-description:hover, #mainheader .breadcrumb-empty .xx-form-field-editor, #mainheader .currentDescriptionHover { filter: var(--fn-icon-filter) !important; }
.gridseditfield-trigger-icon { filter: var(--fn-icon-filter) !important; }
#mainheader .x-link-with-buttons .button-pause-current-activity { filter: var(--fn-icon-filter) !important; }
#mainheader .x-link-with-buttons .button-finish-current-activity { filter: var(--fn-icon-filter) !important; }
#mainheader .x-link-with-buttons .button-resume-current-activity { filter: var(--fn-icon-filter) !important; }
.icon-user { filter: var(--fn-icon-filter) !important; }
.x-tool-minimize { filter: var(--fn-icon-filter) !important; }
.x-tool-maximize { filter: var(--fn-icon-filter) !important; }
.x-tool-close { filter: var(--fn-icon-filter) !important; }
.x-tool-refresh { filter: var(--fn-icon-filter) !important; }
.x-panel-collapsed .x-tool-minimize, .x-tool-restore { filter: var(--fn-icon-filter) !important; }
.x-tool-help { filter: var(--fn-icon-filter) !important; }
#maillistwithhelp .x-layout-collapsed-south .x-tool { filter: var(--fn-icon-filter) !important; }
#maillistwithhelp .x-mail-list-view .x-tool-toggle { filter: var(--fn-icon-filter) !important; }
.x-tool-editChart { filter: var(--fn-icon-filter) !important; }
.x-tool-toggle { filter: var(--fn-icon-filter) !important; }
.x-panel-collapsed .x-tool-toggle, .x-portlet.x-panel-collapsed .x-tool-toggle { filter: var(--fn-icon-filter) !important; }
.x-tool-gear, .org-settings-icon { filter: var(--fn-icon-filter) !important; }
.icon-user-password, .x-menu-item-icon.icon-user-password, .x-epic-style .x-btn-text-icon .x-btn-icon-small-left .icon-user-password { filter: var(--fn-icon-filter) !important; }
.icon-login-as-user, .x-menu-item-icon.icon-login-as-user, .x-epic-style .x-btn-text-icon .x-btn-icon-small-left .icon-login-as-user { filter: var(--fn-icon-filter) !important; }
.x-menu-item-icon.gdpr-icon, .x-epic-style .x-btn-text-icon .x-btn-icon-small-left .gdpr-icon { filter: var(--fn-icon-filter) !important; }
.chart-configuration-panel-header .x-tool-toggle { filter: var(--fn-icon-filter) !important; }
.x-panel-collapsed .chart-configuration-panel-header .x-tool-toggle { filter: var(--fn-icon-filter) !important; }
.x-btn-create .x-menu-item-icon { filter: var(--fn-icon-filter) !important; }
.x-calendar-today-icon { filter: var(--fn-icon-filter) !important; }
.x-menu-old-icons .x-menu-item-icon.org-company-icon, .org-company-icon { filter: var(--fn-icon-filter) !important; }
.org-licences-icon { filter: var(--fn-icon-filter) !important; }
.org-partner-program-icon { filter: var(--fn-icon-filter) !important; }
.org-integrations-icon { filter: var(--fn-icon-filter) !important; }
.org-import-icon { filter: var(--fn-icon-filter) !important; }
.org-privileges-icon { filter: var(--fn-icon-filter) !important; }
.logout-icon { filter: var(--fn-icon-filter) !important; }
.mainheader-help-skype-phone { filter: var(--fn-icon-filter) !important; }
.mainheader-help-skype-email { filter: var(--fn-icon-filter) !important; }
.mainheader-help-skype-manual { filter: var(--fn-icon-filter) !important; }
.x-tool-suggester { filter: var(--fn-icon-filter) !important; }
.mainheader-help-joinme-icon { filter: var(--fn-icon-filter) !important; }
.mainheader-help-support-chat { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-add { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-add-list { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-edit { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-rename { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-menu .x-menu-check-item .x-menu-item-icon { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-delete { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-copy-columns { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-save-default { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-copy-to-other-users { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-hide { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-unhide { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-pin { filter: var(--fn-icon-filter) !important; }
.fnmenu-menu-options-unpin { filter: var(--fn-icon-filter) !important; }
#menu-settings.x-tool { filter: var(--fn-icon-filter) !important; }
.x-menu-item-arrow { filter: var(--fn-icon-filter) !important; }
.fieldLabelInfo { filter: var(--fn-icon-filter) !important; }
.x-date-mp-ybtn a, .x-date-left a { filter: var(--fn-icon-filter) !important; }
.x-date-mp-ybtn a.x-date-mp-next, .x-date-right a { filter: var(--fn-icon-filter) !important; }
.x-toolbar-more-icon, .x-btn-icon .x-btn-small .x-btn-text.x-toolbar-more-icon { filter: var(--fn-icon-filter) !important; }
.x-superboxselect-btn-clear, .x-superboxselect-item-close { filter: var(--fn-icon-filter) !important; }
.x-more-button-filter button { filter: var(--fn-icon-filter) !important; }
.x-more-button-filter.x-less-button button { filter: var(--fn-icon-filter) !important; }
.ext-strict .x-simple-style.x-epic-style .x-window.x-filter-window .x-form-element .x-form-field-wrap .x-form-trigger.x-form-button-date-prev { filter: var(--fn-icon-filter) !important; }
.ext-strict .x-simple-style.x-epic-style .x-window.x-filter-window .x-form-element .x-form-field-wrap .x-form-trigger.x-form-button-date-next { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-privileges-tab div img, .x-htoolbar .x-htoolbar-user-privileges-tab div img, .x-htoolbar .x-htoolbar-userlist-privileges-tab div img, .x-htoolbar .x-htoolbar-privileges-tab-de div img, .x-htoolbar .x-htoolbar-user-privileges-tab-de div img, .x-htoolbar .x-htoolbar-userlist-privileges-tab-de div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-import-tab div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-integrations-tab div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-licences-tab div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-organization-tab div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-workflow-tab div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-dashboard-tab .x-dashboard-tab-inner img { filter: var(--fn-icon-filter) !important; }
.x-edit-variablesButton-reminderAssignedUsers-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-reminderMessage-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-salesOpportunityLabel-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-taskName-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-taskParent-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-taskDescription-container .x-btn-icon .x-edit-variablesButton, .x-edit-variablesButton-smsMessage-container .x-btn-icon .x-edit-variablesButton, .x-form-field-trigger-wrap .x-form-action-variable-menu.x-edit-variablesButton, .x-edit-variablesButton-smsTemplateMessage-container .x-btn-icon .x-edit-variablesButton { filter: var(--fn-icon-filter) !important; }
.quickAddIcon, .icon-add-small, .x-simple-style .icon-add, .x-simple-style .icon-dashboard-add { filter: var(--fn-icon-filter) !important; }
.x-btn-icon .x-btn-text.icon-sort-asc { filter: var(--fn-icon-filter) !important; }
.x-btn-icon .x-btn-text.icon-sort-desc { filter: var(--fn-icon-filter) !important; }
.x-hide-comment-icon { filter: var(--fn-icon-filter) !important; }
.x-show-deleted-eye-icon, .x-btn-icon .x-btn-small .x-btn-text.x-show-deleted-eye-icon { filter: var(--fn-icon-filter) !important; }
.edited-comment { filter: var(--fn-icon-filter) !important; }
.grid-edit-icon { filter: var(--fn-icon-filter) !important; }
.icon-dashboard-reset { filter: var(--fn-icon-filter) !important; }
#contentContainer .x-panel-tbar .x-split-button:not(.x-main-button) .x-btn-mc em.x-btn-split, .x-form-field-wrap .x-form-trigger, .x-btn-mc em.x-btn-arrow { filter: var(--fn-icon-filter) !important; }
.x-form-field-wrap .x-form-trigger.x-form-show-password-trigger, #newPasswordWindow .x-form-show-password-trigger { filter: var(--fn-icon-filter) !important; }
.x-form-field-wrap:has(input[type="text"]) .x-form-trigger.x-form-show-password-trigger, #newPasswordWindow .x-form-field-wrap:has(input[type="text"]) .x-form-show-password-trigger { filter: var(--fn-icon-filter) !important; }
.x-spinner-trigger-in-renderer, .x-form-field-wrap .x-form-spinner-trigger { filter: var(--fn-icon-filter) !important; }
.comment-item .xx-form-field-replybutton:before { filter: var(--fn-icon-filter) !important; }
.icon-report-download, .pin-icon { filter: var(--fn-icon-filter) !important; }
.icon-download-all, .attachment-download-grid-icon, .icon-report-download, .icon-pdf, .icon-download-pdf { filter: var(--fn-icon-filter) !important; }
.icon-report-upload { filter: var(--fn-icon-filter) !important; }
.icon-copy { filter: var(--fn-icon-filter) !important; }
.icon-move-to-folder { filter: var(--fn-icon-filter) !important; }
.icon-package-plus { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-show-directions div img { filter: var(--fn-icon-filter) !important; }
.x-htoolbar .x-htoolbar-show-names div img { filter: var(--fn-icon-filter) !important; }
.comment-item:hover .xx-form-field-windowdelete, .icon-delete { filter: var(--fn-icon-filter) !important; }
.comment-item:hover .xx-form-field-windowrestore { filter: var(--fn-icon-filter) !important; }
.mails-icon, .x-avant .timeline-mail, .x-btn-text-icon .x-btn-icon-small-left .mails-icon { filter: var(--fn-icon-filter) !important; }
.mail-done-column-header-icon { filter: var(--fn-icon-filter) !important; }
.phone-calls-icon { filter: var(--fn-icon-filter) !important; }
.timeline-phonecall.timeline-box { filter: var(--fn-icon-filter) !important; }
.timeline-phonecall.timeline-inbox { filter: var(--fn-icon-filter) !important; }
.icon-mail-spam { filter: var(--fn-icon-filter) !important; }
.icon-mail-import { filter: var(--fn-icon-filter) !important; }
.labelInfoInline, .info-icon { filter: var(--fn-icon-filter) !important; }
.details-panel-icon { filter: var(--fn-icon-filter) !important; }
.icon-undelete { filter: var(--fn-icon-filter) !important; }
.icon-message-comment, .icon-mail-reply { filter: var(--fn-icon-filter) !important; }
.icon-mail-send { filter: var(--fn-icon-filter) !important; }
.icon-mail-reply-all { filter: var(--fn-icon-filter) !important; }
.icon-mail-fwd { filter: var(--fn-icon-filter) !important; }
.icon-mail-set-unread { filter: var(--fn-icon-filter) !important; }
.icon-mail-set-read { filter: var(--fn-icon-filter) !important; }
.ksef-status-banner-refresh-button .icon, .x-btn-icon .x-btn-small .x-btn-text.icon-mail-import { filter: var(--fn-icon-filter) !important; }
.ksef-status-banner-refresh-button .icon { filter: var(--fn-icon-filter) !important; }
.icon-whitelist-checks-history, .x-btn-icon .x-btn-small .x-btn-text.icon-whitelist-checks-history { filter: var(--fn-icon-filter) !important; }
.invoice-conversion-icon { filter: var(--fn-icon-filter) !important; }
.invoice-correction-icon, .storagedoc-correction-icon, .x-btn-icon .x-btn-small .invoice-correction-icon, .x-btn-icon .x-btn-small .storagedoc-correction-icon { filter: var(--fn-icon-filter) !important; }
.invoice-cancellation-icon, .x-btn-icon .x-btn-small .invoice-cancellation-icon { filter: var(--fn-icon-filter) !important; }
.printer-fiscal-invoice, .x-btn-icon .x-btn-small .printer-fiscal-invoice, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text.printer-fiscal-invoice { filter: var(--fn-icon-filter) !important; }
.x-epic-style .timeline-salesnote, .salesnote-small-icon, .salesnote-icon, .add-salesnote-icon { filter: var(--fn-icon-filter) !important; }
.icon-user-edit { filter: var(--fn-icon-filter) !important; }
.cashdoc-icon, .add-cashdoc-icon { filter: var(--fn-icon-filter) !important; }
.searchall-small-icon { filter: var(--fn-icon-filter) !important; }
.user-small-icon, .user-icon { filter: var(--fn-icon-filter) !important; }
.invoice-send, .mail-small-icon { filter: var(--fn-icon-filter) !important; }
.mailtemplate-small-icon, .mailtemplate-icon { filter: var(--fn-icon-filter) !important; }
.tasktemplate-small-icon { filter: var(--fn-icon-filter) !important; }
.customer-icon, .x-epic-style .timeline-customer, .add-customer-icon, .add-customer-icon-16, .customer-small-icon { filter: var(--fn-icon-filter) !important; }
.surveytemplate-small-icon { filter: var(--fn-icon-filter) !important; }
.scheduling-icon { filter: var(--fn-icon-filter) !important; }
.icon-other { filter: var(--fn-icon-filter) !important; }
.letter-small-icon { filter: var(--fn-icon-filter) !important; }
.localization-small-icon, .localization-icon { filter: var(--fn-icon-filter) !important; }
.contract-small-icon, .contract-icon { filter: var(--fn-icon-filter) !important; }
.paymentlist-small-icon, .paymentlist-icon { filter: var(--fn-icon-filter) !important; }
.mailaccount-small-icon, .mailaccount-icon { filter: var(--fn-icon-filter) !important; }
.transactionentry-small-icon { filter: var(--fn-icon-filter) !important; }
.contact-icon, .x-epic-style .timeline-contact, .add-contact-icon, .add-contact-icon-16, .contact-small-icon { filter: var(--fn-icon-filter) !important; }
.x-epic-style .timeline-salesopportunity, .salesopportunity-icon, .add-salesopportunity-icon, .salesopportunity-small-icon { filter: var(--fn-icon-filter) !important; }
.offer-icon, .add-offer-icon, .x-epic-style .timeline-offer, .offer-small-icon { filter: var(--fn-icon-filter) !important; }
.order-icon, .add-order-icon, .x-epic-style .timeline-order, .order-small-icon { filter: var(--fn-icon-filter) !important; }
.transaction-icon, .accountingoperation-icon, .add-transaction-icon, .x-epic-style .timeline-transaction, .transaction-small-icon { filter: var(--fn-icon-filter) !important; }
.product-icon, .products-icon, .x-epic-style .timeline-product, .product-small-icon { filter: var(--fn-icon-filter) !important; }
.storagedoc-icon, .x-epic-style .timeline-storagedoc, .add-storagedoc-icon, .storagedoc-small-icon { filter: var(--fn-icon-filter) !important; }
.agreement-icon, .add-agreement-icon, .x-epic-style .timeline-agreement, .agreement-small-icon { filter: var(--fn-icon-filter) !important; }
.task-icon, .x-epic-style .timeline-task, .add-task-icon, .add-task-icon-16, .task-small-icon { filter: var(--fn-icon-filter) !important; }
.customergroup-small-icon, .customergroup-icon { filter: var(--fn-icon-filter) !important; }
.project-icon, .x-epic-style .timeline-project, .project-small-icon { filter: var(--fn-icon-filter) !important; }
.resources-icon, .resourceclass-icon, .resource-small-icon { filter: var(--fn-icon-filter) !important; }
.employee-icon { filter: var(--fn-icon-filter) !important; }
.position-icon { filter: var(--fn-icon-filter) !important; }
.leave-icon { filter: var(--fn-icon-filter) !important; }
.reminders-icon, .reminders-small-icon { filter: var(--fn-icon-filter) !important; }
.documents-icon, .documents-icon.header-icon-style { filter: var(--fn-icon-filter) !important; }
.add-sms-icon-16 { filter: var(--fn-icon-filter) !important; }
.jpk-us-icon-16, .gus-icon-16 { filter: var(--fn-icon-filter) !important; }
.jpk-us-icon-green-16 { filter: var(--fn-icon-filter) !important; }
.x-btn-text-icon .x-btn-icon-small-left .x-btn-text.workflow-icon, .workflow-icon { filter: var(--fn-icon-filter) !important; }
.msgTextWrapper .msgTextContainer .x-btn-text.upload-file-button-icon, .x-epic-style .timeline-document { filter: var(--fn-icon-filter) !important; }
.emoticon-button { filter: var(--fn-icon-filter) !important; }
.chat-small-icon { filter: var(--fn-icon-filter) !important; }
.icon-zoom-in { filter: var(--fn-icon-filter) !important; }
.icon-zoom-out { filter: var(--fn-icon-filter) !important; }
.calendar-weekend, .x-menu-item-icon.calendar-weekend { filter: var(--fn-icon-filter) !important; }
.icon-printer-16 { filter: var(--fn-icon-filter) !important; }
.icon-info { filter: var(--fn-icon-filter) !important; }
.export-report-icon-type, .export-report-icon, .icon-generate-payment { filter: var(--fn-icon-filter) !important; }
.icon-quote { filter: var(--fn-icon-filter) !important; }
.icon-copy-serial-chat { filter: var(--fn-icon-filter) !important; }
.grid-edit-icon-chat { filter: var(--fn-icon-filter) !important; }
.change-visible-fields-icon { filter: var(--fn-icon-filter) !important; }
.x-row-summary-hide .icon-summary { filter: var(--fn-icon-filter) !important; }
.x-row-summary-show .icon-summary { filter: var(--fn-icon-filter) !important; }
.change-mailview-icon { filter: var(--fn-icon-filter) !important; }
.list-icon { filter: var(--fn-icon-filter) !important; }
img.x-menu-item-icon.icon-maximize { filter: var(--fn-icon-filter) !important; }
.hide-column-icon { filter: var(--fn-icon-filter) !important; }
.upload-icon, .mail-attachment-icon { filter: var(--fn-icon-filter) !important; }
.x-tab-scroller-left { filter: var(--fn-icon-filter) !important; }
.x-tab-scroller-right { filter: var(--fn-icon-filter) !important; }
.icon-layout-1 { filter: var(--fn-icon-filter) !important; }
.icon-layout-2-eq { filter: var(--fn-icon-filter) !important; }
.icon-layout-3 { filter: var(--fn-icon-filter) !important; }
.icon-layout-2-left { filter: var(--fn-icon-filter) !important; }
.icon-layout-2-right { filter: var(--fn-icon-filter) !important; }
.x-calendar-next-btn-icon, .x-calendar-back-btn-icon, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text.x-calendar-next-btn-icon, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text.x-calendar-back-btn-icon, .x-btn-icon .x-btn-small .x-btn-text.x-calendar-next-btn-icon, .x-btn-icon .x-btn-small .x-btn-text.x-calendar-back-btn-icon { filter: var(--fn-icon-filter) !important; }
.x-calendar-next-btn-icon, .x-btn-text-icon .x-btn-icon-small-left .x-btn-text.x-calendar-next-btn-icon, .x-btn-icon .x-btn-small .x-btn-text.x-calendar-next-btn-icon { filter: var(--fn-icon-filter) !important; }
.icon-calendar-dayview { filter: var(--fn-icon-filter) !important; }
.icon-calendar-weekview { filter: var(--fn-icon-filter) !important; }
.icon-calendar-monthview { filter: var(--fn-icon-filter) !important; }
.icon-filter-apply.x-btn-text::before, .icon-filter-apply::before { filter: var(--fn-icon-filter-bright) !important; }
.icon-save::before { filter: var(--fn-icon-filter-bright) !important; }
.icon-filter-clear::before { filter: var(--fn-icon-filter-bright) !important; }
/* match the description editor's floating toggle, which shows a bold "B" in epic instead of the "A" glyph */ .comment-toolbar-toggle { filter: var(--fn-icon-filter) !important; }
.message-menu-button.x-chat-reaction-trigger-button { filter: var(--fn-icon-filter) !important; }
.message-edited { filter: var(--fn-icon-filter) !important; }
.message-read-info { filter: var(--fn-icon-filter) !important; }
.x-formfield-value-and-icon.x-formfield-readonly .x-formfield-icon { filter: var(--fn-icon-filter) !important; }
.after-create-tip-button.icon-download-pdf::after { filter: var(--fn-icon-filter) !important; }
.after-create-tip-button.icon-invoice::after { filter: var(--fn-icon-filter) !important; }
.xx-form-field .xx-form-field-editor.combo-icon-editor-class, .x-tip-with-editor .xx-form-field-editor.combo-icon-editor-class, .ext-ie6 .xx-form-field .xx-form-field-editor.combo-icon-editor-class { filter: var(--fn-icon-filter) !important; }
.autoStatusButton { filter: var(--fn-icon-filter) !important; }
#contentContainer label.css-label.star-empty, .star-empty { filter: var(--fn-icon-filter) !important; }
.xx-form-field:hover .xx-form-field-noeditor { filter: var(--fn-icon-filter) !important; }
.x-btn-icon .x-btn-small .x-btn-text.gus-icon-16, .x-btn-icon .x-btn-small .x-btn-text.copyToInvoiceButton { filter: var(--fn-icon-filter) !important; }
.x-btn-icon .x-btn-small .x-btn-text.copyToInvoiceButton { filter: var(--fn-icon-filter) !important; }
.x-btn-icon .x-btn-small .x-btn-text.gus-icon-16 { filter: var(--fn-icon-filter) !important; }
.x-timeline-filter img.quickAddIcon { filter: var(--fn-icon-filter) !important; }
.show-edit-in-window, .xx-form-field:hover .xx-form-field-windoweditor, .xx-form-field .xx-form-field-windoweditor:hover, .comment-item:hover .xx-form-field-windoweditor, .comment-item .xx-form-field-windoweditor:hover { filter: var(--fn-icon-filter) !important; }
.x-formfield-editing .required-field-button, .x-formfield-editing .x-formfield-hide-button { filter: var(--fn-icon-filter) !important; }
.x-formfield-editing .x-formfield-hidden .x-formfield-hide-button { filter: var(--fn-icon-filter) !important; }
.x-formfield-editing .required-field-button { filter: var(--fn-icon-filter) !important; }
#apInvitationWindow .x-more-button button { filter: var(--fn-icon-filter) !important; }
.x-tool.x-tool-unpin { filter: var(--fn-icon-filter) !important; }
.xx-form-field.showPencilIcon .xx-form-field-editor { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-bold { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-italic { filter: var(--fn-icon-filter) !important; }
.x-html-editor-wrap .x-html-editor-tb .x-toolbar .x-edit-underline { filter: var(--fn-icon-filter) !important; }
.x-html-editor-wrap .x-html-editor-tb .x-toolbar .x-edit-increasefontsize { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-decreasefontsize { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-forecolor { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-backcolor { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-justifyright { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-justifyleft { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-justifycenter { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-createlink { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-insertImage { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-insertorderedlist { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-insertunorderedlist { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-sourceedit { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-formatingButton { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-variablesButton { filter: var(--fn-icon-filter) !important; }
.x-html-editor-tb .x-edit-textFragmentButton { filter: var(--fn-icon-filter) !important; }
#invoicePatternPanel__addNewInvoice, #offerPatternPanel__addNewInvoice, #orderPatternPanel__addNewInvoice, #agreementPatternPanel__addNewInvoice, #salesOpportunityPatternPanel__addNewInvoice, #storageDocPatternPanel__addNewInvoice { filter: var(--fn-icon-filter) !important; }
.x-new-style #contentContainer .x-left-filter-tigger { filter: var(--fn-icon-filter) !important; }
.kanban-item-salesopportunity .kanban-bottom-text .current-task button { filter: var(--fn-icon-filter) !important; }
.kanban-footer-header .kanban-header-span .change-process-icon { filter: var(--fn-icon-filter) !important; }
.x-split-details-ct #salesopportunity .x-panel-body .xx-form-field .xx-form-field-editor.calendar-icon-editor-class { filter: var(--fn-icon-filter) !important; }
div.x-automatic .xx-form-field-noeditor, .xg3c:hover div.x-automatic .xg3cnb { filter: var(--fn-icon-filter) !important; }
.warehouse-store-icon { filter: var(--fn-icon-filter) !important; }
.serialnumber-icon { filter: var(--fn-icon-filter) !important; }
.productImage .productImageAdd { filter: var(--fn-icon-filter) !important; }
.x-html-editor-wrap .toogleToolbarButton { filter: var(--fn-icon-filter) !important; }
.chatconversationpanel .x-tool-expand, .chat-conversation-window .x-tool-expand, .chatconversationpanel .close-livechat-conversation-icon, .chat-conversation-window .close-livechat-conversation-icon { filter: var(--fn-icon-filter) !important; }
.chatconversationpanel .x-tool-expand, .chat-conversation-window .x-tool-expand { filter: var(--fn-icon-filter) !important; }
.credit-card-edit { filter: var(--fn-icon-filter) !important; }
.x-window .x-btn.x-btn-attachment-delete,
.comment-editor .x-btn.x-btn-attachment-delete { filter: var(--fn-icon-filter) !important; }
.x-dashboard-empty-button div.icon-add, .x-grid-empty-button div.icon-add { filter: var(--fn-icon-filter) !important; }
#contentContainer .x-top-filters-container .icon-all-filters { filter: var(--fn-icon-filter) !important; }
.x-item-disabled .x-tbar-page-first, .x-tbar-page-first { filter: var(--fn-icon-filter) !important; }
.x-item-disabled .x-tbar-page-last, .x-tbar-page-last { filter: var(--fn-icon-filter) !important; }


.edit-icon, .ext-ie6 .x-grid3-cell-selected .xg3ceb, .x-grid3-cell-selected .xg3ceb, .xg3c:hover .xg3ceb, .xg3c .xg3ceb:hover, .xx-form-field:hover .xx-form-field-editor, .x-tip-with-editor:hover .xx-form-field-editor, .xx-form-field .xx-form-field-editor:hover, .x-tip-with-editor .xx-form-field-editor:hover, .ext-ie6 .xx-form-field .xx-form-field-editor, .ie6-fix .button-edit-current-description, .button-edit-current-description, .currentDescriptionHover, .button-edit-current-description:hover, .breadcrumb-empty .xx-form-field-editor { filter: var(--fn-icon-filter) !important; }
.xg3c:hover .xg3cnb, .xg3c .xg3cnb:hover, .x-grid3-cell-selected .xg3cnb { filter: var(--fn-icon-filter) !important; }
.xg3c:hover .xg3ceb.combo-icon-editor-class, .xg3c .xg3ceb.combo-icon-editor-class:hover, .xx-form-field:hover .xx-form-field-editor.combo-icon-editor-class, .x-tip-with-editor:hover .xx-form-field-editor.combo-icon-editor-class, .xx-form-field .xx-form-field-editor.combo-icon-editor-class:hover, .x-tip-with-editor .xx-form-field-editor.combo-icon-editor-class:hover, .ext-ie6 .xx-form-field .xx-form-field-editor.combo-icon-editor-class { filter: var(--fn-icon-filter) !important; }
.xg3c:hover .xg3ceb.spinner-icon-editor-class, .xg3c .xg3ceb.spinner-icon-editor-class:hover, .xx-form-field:hover .xx-form-field-editor.spinner-icon-editor-class, .x-tip-with-editor:hover .xx-form-field-editor.spinner-icon-editor-class, .xx-form-field .xx-form-field-editor.spinner-icon-editor-class:hover, .x-tip-with-editor .xx-form-field-editor.spinner-icon-editor-class:hover, .ext-ie6 .xx-form-field .xx-form-field-editor.spinner-icon-editor-class { filter: var(--fn-icon-filter) !important; }
.x-form-item:hover .x-form-field-wrap .x-form-date-trigger, .x-form-field-wrap .x-form-date-trigger, .calendar-icon, .xg3c:hover .xg3ceb.calendar-icon-editor-class, .xg3c .xg3ceb.calendar-icon-editor-class:hover, .xx-form-field:hover .xx-form-field-editor.calendar-icon-editor-class, .x-tip-with-editor:hover .xx-form-field-editor.calendar-icon-editor-class, .xx-form-field .xx-form-field-editor.calendar-icon-editor-class:hover, .x-tip-with-editor .xx-form-field-editor.calendar-icon-editor-class:hover, .ext-ie6 .xx-form-field .xx-form-field-editor.calendar-icon-editor-class { filter: var(--fn-icon-filter) !important; }
.x-grid3-remove-xcol { filter: var(--fn-icon-filter) !important; }
.forwardedMailIcon, .repliedMailIcon { filter: var(--fn-icon-filter) !important; }
.forwardedMailIcon:after, .repliedMailIcon::after { filter: var(--fn-icon-filter) !important; }
.forwardedMailIcon:after { filter: var(--fn-icon-filter) !important; }
#rightPanel .x-tool-close { filter: var(--fn-icon-filter) !important; }
.x-rightpanel-chat-header .chat-search-btn { filter: var(--fn-icon-filter) !important; }

.information-board-panel .comment-item .xx-form-field-windoweditor,
.information-board-panel .comment-item .xx-form-field-windowdelete{
    filter: var(--fn-icon-filter-bright) !important;
    opacity: 0.5;
}
.information-board-panel .comment-item .xx-form-field-windoweditor:hover,
.information-board-panel .comment-item .xx-form-field-windowdelete:hover{
    opacity: 1;
}

.x-epic-dark-style.x-simple-style #organization-settings-panel .x-accountancy-settings  .x-form-field-trigger-wrap.x-trigger-wrap-focus{
    border-color: #AACCFFAA !important;
}

.x-epic-dark-style.x-simple-style #organization-settings-panel .x-accountancy-settings  .x-form-field-trigger-wrap{
    float: left !important;
    border-radius: 8px;
    background-color: var(--dark-surface-2) ;
    border: 1px solid var(--dark-surface-2) ;
}
.x-epic-dark-style.x-simple-style #organization-settings-panel .x-accountancy-settings  .x-form-field-trigger-wrap input{
    margin-left: 0px !important;
}
.x-epic-dark-style.x-simple-style #organization-settings-panel .x-accountancy-settings  .x-form-field-trigger-wrap.x-trigger-wrap-focus input{
    border-color: transparent !important;
    margin-left: 0px !important;
}

.x-epic-dark-style.x-simple-style #organization-settings-panel .x-accountancy-settings  .x-form-field-trigger-wrap > .x-form-trigger{
    background-color: transparent !important;
    filter: var(--fn-icon-filter) !important;
}

#organization-settings-panel .x-form-item-label,
#organization-settings-panel .x-form-cb-label {
    color: var(--dark-text-1);
}

.x-formfield-editing .required-field-button, .x-formfield-editing .x-formfield-hide-button{
    background-color: transparent;
}

#rightPanel.right-panel-top .x-right-header .x-tool{
    background-color: transparent !important;
}

.x-tab-more-button {
    filter: brightness(0) invert(1)  !important;
    background-color: transparent !important;
    opacity: 0.6;
}
.x-epic-style .x-tab-more-button:hover,
.x-tab-more-button:hover {
    opacity: 1;
}

.x-btn-click .x-btn-text,
.x-btn-menu-active .x-btn-text,
.x-btn-pressed .x-btn-text,
.x-grid3-cell-selected .x-grid3-cell-text{
    color: var(--color-white) !important;
}

.x-btn.active,
.x-btn-pressed{
    background-color: rgba(49, 122, 226, .1) !important;
    border-color: var(--dark-link) !important;
    color: var(--dark-link) !important;
}

.disjunction-field-search-button.x-btn-pressed.x-btn {
    background-color: rgba(49, 122, 226, 0.6) !important;
}

.x-btn-pressed .x-btn-text span,
.x-btn.active .x-btn-text span{
    color: var(--dark-link) !important;
}

.category-btn .x-btn-text{
    filter: none;
}

.messageUser, .messageUser a, .user-label-link{
    color: var(--color-red-light) !important;
}
.messageLoggedUser, .messageLoggedUser a {
    color: var(--color-green) !important;
}

.x-rightpanel-holder .message{
    color: var(--color-white) !important;
}

.x-rightpanel-holder .title a {
    color: var(--dark-link) !important;
}
.x-rightpanel-holder .date, .x-rightpanel-holder .controls {
    color: var(--color-gray-60) !important;
}

iframe.x-form-text, .x-simple-style iframe.x-form-text {
    background-color: #eeeeee !important;
}

.ext-strict .x-simple-style.x-hs-test .x-window.x-filter-window .x-combo-list-inner {
    background-color: transparent !important;
}

.whatsnew-footer-chevron,
.whatsnew-btn-icon,
.whatsnew-icon{
    color: var(--dark-accent);
}

.whatsnew-dot{
    background-color: var(--dark-link);
}

.whatsnew-tag.tag-info {
    background-color: #f3f3f344;
    color: #ffffff;
}
.whatsnew-tag.tag-improvement {
    background-color: #267f03;
    color: #ffffff;
}

.whatsnew-tag.tag-new {
    background-color: var(--dark-accent);
    color:  #ffffff;
}

#breadcrumbTask div{
    color: var(--dark-link) !important;
}

#breadcrumb #breadcrumbTask div{
    filter: none !important;
}

#mainHeaderFill a{
    color: #FFFFFF !important;
}

.x-window .x-window-bbar .x-btn-split,
.x-window .x-panel-btns .x-btn-split,
.x-btn-mc em.x-btn-split {
    background-image: url(../resources-skins/images/default/button/s-arrow-noline-dark.png) !important;
}

.x-menu-old-icons.x-menu div.x-form-display-field{
    color: var(--color-text-strong) !important;
}

#contentContainer .x-panel-tbar .x-split-button.x-main-create-button .x-btn-mc em.x-btn-split,
.x-simple-style .x-main-create-button .icon-add,
.x-unitPriceTypeCombo-ct .x-form-field-wrap .x-form-trigger,
.x-unitPriceTypeCombo-ct .x-form-field-wrap .x-form-spinner-trigger,
.x-spinner-trigger-in-renderer,
.x-form-field-wrap .x-form-spinner-trigger,
#floatingFilterMenu .x-menu-item-arrow{
    filter: none !important;
}

.x-epic-dark-style.x-simple-style #integrations .x-form-field-wrap .x-form-trigger,
.x-epic-dark-style.x-simple-style #organization-settings-panel .x-form-item .x-form-field-trigger-wrap > .x-form-twin-triggers .x-form-trigger,
.x-form-field-wrap .x-form-trigger.x-form-arrow-trigger{
    background-image: url(images/dropdown-white.svg) !important;
}

.x-spinner-trigger-in-renderer, .x-form-field-wrap .x-form-spinner-trigger {
    background-image: url(images/spinner-white.svg) !important;
}

.x-window .x-window-bbar table.x-btn button.icon-attachment,
.x-window .x-window-bl table.x-btn button.icon-attachment {
    background-image: url(images/attachment-white.svg) !important;
}

.x-epic-style .x-window:not(.x-filter-window) .x-form-item-label {
    background-color: transparent;
}

#maillistwithhelp .x-mail-list-view .x-tool-toggle,
#maillistwithhelp .x-mail-list-view .x-tool-maximize,
#maillistwithhelp .x-layout-collapsed-south .x-tool {
    border: 1px solid rgba(120,130,140,0.3);
    background-color: transparent;
}

.x-filter-title {
    color: var(--color-text-secondary);
}

/* --- ::before mask (icon + own text in one element) --- */
.x-simple-top-toolbar-title:not(.x-abstract-report) .x-htoolbar .x-htoolbar-title-cell div.x-htoolbar-title-inner.x-htoolbar-title-main-element::after { filter: none !important; position: relative; background-image: none !important; }
.x-simple-top-toolbar-title:not(.x-abstract-report) .x-htoolbar .x-htoolbar-title-cell div.x-htoolbar-title-inner.x-htoolbar-title-main-element::after::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/pencil.svg); mask-image: url(images/pencil.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: auto; mask-size: auto;
}
.salesnote-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.salesnote-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/salesnote.svg); mask-image: url(images/salesnote.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.searchall-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.searchall-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/search.svg); mask-image: url(images/search.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.user-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.user-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/circle-user.svg); mask-image: url(images/circle-user.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.mail-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.mail-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/mail.svg); mask-image: url(images/mail.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.mailtemplate-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.mailtemplate-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/file-stack.svg); mask-image: url(images/file-stack.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.tasktemplate-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.tasktemplate-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/tasktemplate.svg); mask-image: url(images/tasktemplate.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.customer-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.customer-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/customer.svg); mask-image: url(images/customer.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.surveytemplate-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.surveytemplate-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/survey.svg); mask-image: url(images/survey.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.letter-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.letter-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/letter.svg); mask-image: url(images/letter.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.localization-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.localization-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/localization.svg); mask-image: url(images/localization.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.contract-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.contract-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/contract.svg); mask-image: url(images/contract.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.paymentlist-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.paymentlist-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/paymentlist.svg); mask-image: url(images/paymentlist.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.mailaccount-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.mailaccount-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/mailaccount.svg); mask-image: url(images/mailaccount.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.transactionentry-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.transactionentry-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/list.svg); mask-image: url(images/list.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.contact-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.contact-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/contact.svg); mask-image: url(images/contact.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.salesopportunity-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.salesopportunity-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/salesopportunity.svg); mask-image: url(images/salesopportunity.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.offer-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.offer-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/offer.svg); mask-image: url(images/offer.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.order-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.order-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/order.svg); mask-image: url(images/order.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.transaction-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.transaction-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/invoice.svg); mask-image: url(images/invoice.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.product-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.product-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/product.svg); mask-image: url(images/product.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.storagedoc-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.storagedoc-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/storagedoc.svg); mask-image: url(images/storagedoc.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.agreement-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.agreement-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/agreement.svg); mask-image: url(images/agreement.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.task-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.task-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/task.svg); mask-image: url(images/task.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.customergroup-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.customergroup-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/customergroup.svg); mask-image: url(images/customergroup.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.project-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.project-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/project.svg); mask-image: url(images/project.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.resource-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.resource-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/resource.svg); mask-image: url(images/resource.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.reminders-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.reminders-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/reminder.svg); mask-image: url(images/reminder.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.chat-small-icon.x-searchresult-icon { filter: none !important; position: relative; background-image: none !important; }
.chat-small-icon.x-searchresult-icon::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/chat.svg); mask-image: url(images/chat.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: 16px; mask-size: 16px;
}
.timeline-type-title.timeline-planned div { filter: none !important; position: relative; background-image: none !important; }
.timeline-type-title.timeline-planned div::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/planned.svg); mask-image: url(images/planned.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: auto; mask-size: auto;
}
.timeline-type-title.timeline-done div { filter: none !important; position: relative; background-image: none !important; }
.timeline-type-title.timeline-done div::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/done.svg); mask-image: url(images/done.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: auto; mask-size: auto;
}
.xx-grid3-page-prev .x-tbar-page-prev, .x-item-disabled .x-tbar-page-prev, .x-tbar-page-prev { filter: none !important; position: relative; background-image: none !important; }
.xx-grid3-page-prev .x-tbar-page-prev::before, .x-item-disabled .x-tbar-page-prev::before, .x-tbar-page-prev::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/back.svg); mask-image: url(images/back.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 0% 50%; mask-position: 0% 50%;
  -webkit-mask-size: auto; mask-size: auto;
}
.xx-grid3-page-next .x-tbar-page-next, .x-item-disabled .x-tbar-page-next, .x-tbar-page-next { filter: none !important; position: relative; background-image: none !important; }
.xx-grid3-page-next .x-tbar-page-next::before, .x-item-disabled .x-tbar-page-next::before, .x-tbar-page-next::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-color: var(--fn-icon-color, #ABB3C2);
  -webkit-mask-image: url(images/forward.svg); mask-image: url(images/forward.svg);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: 100% 50%; mask-position: 100% 50%;
  -webkit-mask-size: auto; mask-size: auto;
}

/* ============================================================ */
/* VIEW-SELECT CONTROLS + REFRESH: fixed #798A99 glyph (grafit spec). */
/* ============================================================ */

/* view-switch toggle icons already carry a mask + #798A99 background-color;
   drop the colored background-image so the masked glyph renders in #798A99.
   Same mechanism for the list-toolbar refresh button. */
.x-simple-style.x-epic-style #mainContainer #contentContainer .x-htoolbar.x-toolbar-tabs [class*="-tab-inner"]:not([class*="fnmenu"]) img,
.x-simple-style.x-epic-style #mainContainer #contentContainer .x-htoolbar .x-btn-text.x-tbar-loading {
  background-image: none !important;
  background-color: #798A99 !important;
}

/* the refresh TOOL is a mono svg (recolored by the icon filter) - pin it to #798A99 */
.x-tool-refresh {
  filter: brightness(0) invert(0.5) sepia(0.2) hue-rotate(176deg) saturate(3.2) !important;
}

/* details "back" button: keep the original button, just swap the dark chevron for
   a light one and lighten the frame. The light svg is inlined as a data-URI so it
   works in live-dev too (a separate new .svg file 404s - the watcher doesn't copy
   new images). Same "<" path as back-details.svg, stroke #ABB3C2. */
.x-simple-style.x-epic-style #mainContainer #contentContainer .x-htoolbar .x-toolbar-cell.x-htoolbar-details-icon .xtb-text {
  background-image: url("data:image/svg+xml,%3Csvg%20width='6'%20height='10'%20viewBox='0%200%206%2010'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M4.6001%208.6001L0.600098%204.6001L4.6001%200.600098'%20stroke='%23ABB3C2'%20stroke-width='1.2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: auto 12px !important;
  border-color: #576776 !important;
}

/* --- windows (create-contractor etc.): bg #242A33, visible #576776 frame --- */
/* object-create windows paint the body/frame via --fn-bg-base at higher
   specificity, so pin the surfaces + add a visible frame border. */
.x-window,
.x-epic-dark-style .x-window .x-window-mc,
.x-epic-dark-style .x-window .x-window-body,
.x-epic-dark-style .x-window-tl, .x-epic-dark-style .x-window-tc, .x-epic-dark-style .x-window-tr,
.x-epic-dark-style .x-window-ml, .x-epic-dark-style .x-window-mr,
.x-epic-dark-style .x-window-bl, .x-epic-dark-style .x-window-bc, .x-epic-dark-style .x-window-br,
.x-epic-dark-style .object-create-window .x-window-body,
.x-simple-style .x-filter-window .x-window-tl .x-window-tc,
.x-simple-style .x-filter-window .x-window-tl .x-window-header,
.x-window.x-filter-window,
.x-simple-style .filterPanel,
.x-epic-dark-style .x-window-tl .x-window-tc,
.x-epic-dark-style .x-window-tl .x-window-header,
.x-epic-dark-style .x-window div.panel-simple-frame > div.x-panel-bwrap{
  background-color: #242A33 !important;
}

.x-window-dlg .x-window-bc .x-toolbar-layout-ct .x-btn span {
    color: #FFF !important;
}
.x-window-dlg .x-window-bc .x-toolbar-layout-ct .x-btn:hover {
    background-color: var(--color-blue) !important;
    border: 1px solid var(--color-blue) !important;
}

.x-epic-dark-style .x-window {
  border: 1px solid #576776 !important;
  border-radius: 8px;
}

.notification-tip-title {
    color: #FFF !important;
}

.x-form-module-check-innerwrap.x-form-module-checked,
.x-form-module-check-innerwrap.x-form-module-checked .x-form-module-check-icon {
    border-color: #377aff;
}

.x-epic-style .x-form-module-check-innerwrap:hover,
.x-epic-style .x-form-module-check-innerwrap:hover .x-form-module-check-icon,
.x-epic-style .x-form-module-check-innerwrap:hover .x-form-module-check-checkbox {
    border-color: #377aff80;
}

.x-form-module-check-innerwrap.x-form-module-checked .x-form-module-check-checkbox,
.x-epic-style .x-form-module-check-crmIcon,
.x-epic-style .x-form-module-check-taskIcon,
.x-epic-style .x-form-module-check-erpIcon,
.x-epic-style .x-form-module-check-assetsIcon{
    filter: brightness(1.6) !important;
}

#userSettingsWindow.x-window-left-checkbox input[type=checkbox].css-checkbox:checked + label.css-label:not(.x-no-field-label),
.x-menu-item-checked .x-menu-item-icon,
.xx-menu-tricheck-checked-true .xx-menu-tricheck-item .x-menu-item-icon,
.ux-lovcombo-icon-checked,
.x-checkbox-panel-header-icon.x-checkbox-panel-header-icon-checked,
#contentContainer #organizationadmin input[type=checkbox].css-checkbox:checked + label.css-label,
#whitelist-checks-window input[type=checkbox].css-checkbox:checked + label.css-label,
input[type=checkbox].css-checkbox:checked + label.css-label,
.x-checkbox-checked.x-form-check-wrap .x-form-tscheckbox,
.x-xsuperboxselect-icon-checked,
input[type=checkbox].css-checkbox:checked + label.css-label{
    filter: brightness(1.4) !important;
}

.ext-strict .x-simple-style .x-window.x-filter-window .x-form-element .x-form-field-wrap img {
    background-color: transparent !important;
}

.x-epic-dark-style .x-grid3-hd-over .xg3si,
.x-epic-dark-style .x-grid-panel .sort-asc .xg3si,
.x-epic-dark-style .x-grid-panel .sort-desc .xg3si{
    filter: brightness(0) invert(1) !important;
}

/* --- create/edit window form fields: text + combo/date/spinner triggers --- */
/* Field text was --color-blue-dark (dark navy, unreadable on the dark field);
   base sets it at ".x-window .x-form-field" (0,4,0), so match + outrank -> light. */
.x-epic-dark-style.x-simple-style.x-hs-test .x-window .x-form-field,
.x-epic-dark-style.x-simple-style.x-hs-test .x-window .x-form-text {
    color: var(--dark-text-1);
}
/* The icon-recolor filter tints the whole <img> trigger, washing its
   --dark-surface-2 box to light grey. Put the surface on the wrap and make the
   trigger transparent, so the filter recolors only the arrow glyph. */
.x-epic-dark-style .x-window:not(#organization-settings-panel):not(.x-filter-window) .x-form-item .x-form-field-trigger-wrap {
    background-color: var(--dark-surface-2) !important;
    border-radius: 8px;
}

.salesopportunity-salesdate-overdue,
.task-plannedenddate-overdue,
.transaction-paymentdate-overdue,
.x-grid-row-offerlist-overdue .xg3ci .time-part,
.x-grid-row-orderlist-overdue .xg3ci .time-part,
.x-grid-row-salesopportunitylist-overdue .xg3ci .time-part,
.x-grid-row-transactionlist-not-paid .xg3ci .time-part,
.x-grid-row-transactionlist-not-paid a,
.x-grid-row-tasklist-after-deadline .xg3ci .time-part,
.x-grid-row-tasklist-after-deadline a,
.userSettings2FAWindow .login-form-index-wrapper div.invalid-field-label-blur,
#loginWindow2FA .login-form-index-wrapper div.invalid-field-label-blur,
.invalid-field-label-blur,
.required-text-red{
    color: var(--color-red-light) !important;
}

.x-simple-style.x-hs-test .x-chart-configuration-panel .x-form-element .x-form-field-wrap.x-trigger-wrap-focus .x-form-trigger,
.x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-form-element .x-form-field-wrap.x-trigger-wrap-focus .x-form-trigger,
.x-epic-dark-style.x-simple-style .x-window:not(.x-filter-window) .x-form-item .x-form-field-trigger-wrap > .x-form-trigger {
    background-color: transparent !important;
    border-color: rgba(120, 140, 180, 0.2) !important;
}

.x-epic-style .x-abstract-report form .x-form-field-wrap .x-form-trigger,
.x-epic-style #integrations .x-form-field-wrap .x-form-trigger,
.x-simple-style.x-hs-test .x-chart-configuration-panel .x-form-invalid-owner .x-form-field-wrap .x-form-trigger,
.x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-form-invalid-owner .x-form-field-wrap .x-form-trigger {
    border-color: var(--color-red) !important;
    filter: none !important;
}

.x-epic-style .x-abstract-report form .x-form-field-wrap .x-form-trigger,
.x-epic-style #integrations .x-form-field-wrap .x-form-trigger,
.x-epic-dark-style.x-simple-style #organization-settings-panel .x-form-field-trigger-wrap > .x-form-trigger,
.x-epic-dark-style.x-simple-style #organization-settings-panel .x-form-field-trigger-wrap > .x-form-twin-triggers .x-form-trigger {
    background-color: var(--dark-surface-2) !important;
    filter: none !important;
    border-color: rgba(120, 140, 180, 0.4) !important;
}

.x-epic-style .x-abstract-report .x-form-field-wrap .x-form-trigger.x-form-date-trigger{
    background-image: url(images/calendar-white.svg) !important;
    opacity: 1;
}

.x-epic-style .x-abstract-report form .x-form-field-wrap .x-form-trigger,
.x-epic-style #integrations .x-form-field-wrap .x-form-trigger{
    border-left-width: 0px;
}

.ext-strict .x-simple-style.x-hs-test .x-window.x-filter-window .x-form-element .x-form-field-wrap.x-form-field-trigger-wrap,
.ext-strict .x-simple-style.x-hs-test .x-window.x-filter-window .x-form-element:not(.x-left-filter-field) .x-form-text:not(.editorGridField):not(.combo-in-fieldset){
    border-color: rgba(120, 140, 180, 0.5) !important;
}

/* Top filters (dark): accent-blue value text is unreadable on the dark chip -> light text; clear "X" light instead of blue */
#contentContainer .x-top-filters-container .x-form-item input.x-form-text,
#contentContainer .x-top-filters-container .x-form-item .x-has-value-container input.x-form-text,
.x-top-filters-container.x-has-filters .x-btn-text-icon .x-btn-icon-small-left .x-btn-text.icon-all-filters,
#contentContainer .x-top-filters-container .x-has-value-container .date-filter-btn span {
  color: var(--dark-text-1) !important;
}
.x-top-filters-container .x-top-filter-clear .x-btn-small .x-btn-text.filter-clear-icon,
#contentContainer .x-top-filters-container .date-filter.x-has-value-container .filter-clear-icon,
.x-top-filters-container .x-form-item .x-form-element.x-has-value-container .filter-clear-icon {
  background-color: var(--dark-text-1) !important;
}
/* Date-range chip: its clear "X" is a different element (x-form-button-date-clear) -> light, like the other chips */
.x-top-filters-container .x-form-button-date-clear {
  background-color: var(--dark-text-1) !important;
}

#contentContainer .x-top-filters-container .date-filter .filter-clear-icon,
.x-filter-window-fields-filter .filter-clear-icon,
.x-top-filters-container .x-form-item .x-form-element .filter-clear-icon{
    background-color: var(--color-gray-80) !important;
}

.x-epic-style .x-all-top-filters:hover,
.x-epic-style .x-all-top-filters:focus-within,
.date-range-menu:not(.is-odd-select) .dateToField:hover,
.date-range-menu:not(.is-odd-select) .dateToField:focus-within,
.date-range-menu.is-odd-select .dateFromField:hover,
.date-range-menu.is-odd-select .dateFromField:focus-within,
.x-oneValue-filter-field .x-form-field:hover,
.x-oneValue-filter-field .x-form-field:focus-within,
#contentContainer .x-top-filters-container .x-form-item input.x-form-text:hover,
#contentContainer .x-top-filters-container .x-form-item input.x-form-text:focus-within,
#contentContainer .x-top-filters-container .date-filter-btn:hover,
#contentContainer .x-top-filters-container .date-filter-btn:focus-within {
    border: 1px solid #AACCFFAA !important;
}

.x-epic-style .x-top-filter-clear,
.x-epic-style .x-has-filters .x-all-top-filters,
.x-has-value-container .date-range-menu:not(.is-odd-select) .dateToField,
.x-has-value-container .date-range-menu.is-odd-select .dateFromField,
.x-has-value-container.x-oneValue-filter-field .x-form-field,
#contentContainer .x-top-filters-container .x-form-item .x-has-value-container input.x-form-text,
#contentContainer .x-top-filters-container .x-has-value-container .date-filter-btn {
    border: 1px solid #AACCFF66 !important;
    background-color: var(--color-blue-light) !important;
}

.x-epic-style .x-has-filters .x-all-top-filters {
    border-right: 0px !important;
}

/* Empty/inactive top-filter fields: lift placeholder text from near-invisible disabled grey to legible secondary */
#contentContainer .x-top-filters-container input::placeholder,
#contentContainer .x-top-filters-container .date-filter-btn span {
  color: var(--dark-text-2) !important;
}

.x-epic-dark-style #contentContainer #dashboard .x-toolbar-right .dashboardFilterUserCt .x-form-field-wrap,
.x-epic-dark-style #contentContainer #dashboard .x-toolbar-right .dashboardFilterUserCt .x-form-text {
  filter: none !important;
  border-color: var(--dark-surface-2, #383F4C) !important;
  color: var(--dark-text-2, #E6E9EF) !important;
}

/* change-history object icons (.changelog-icon) carry the menu-icon-* class too,
   so the recolor generator skipped them (menu is left untouched). They are dark
   svgs with no text - lighten them like the other mono icons. */
.x-epic-dark-style .changelog-icon {
  filter: var(--fn-icon-filter) !important;
}


/* ============================================================ */
/* CALENDAR (ext-cal addon + calendar_ext skin).                 */
/* Mirrors the light rules from calendar.css / calendar_ext.css; */
/* event chips keep their user-picked pastel colors and black    */
/* text (readable on pastel), so only the canvas darkens.        */
/* ============================================================ */

/* --- shared canvas --- */

.x-panel-tbar .ext-cal-toolbar .x-btn button {
    color: var(--dark-text-1);
}

.ext-cal-ct {
    border-bottom-color: var(--dark-border-2);
}

.ext-cal-inner-ct {
    background: var(--dark-bg-page);
}

/* day-names strip (month view header) */
.ext-cal-hd-days-tbl {
    background: var(--dark-accent-bg-soft);
    color: var(--dark-text-2);
}

.ext-cal-month-hd .ext-cal-hd-days-tbl {
    border-top-color: var(--dark-border-2);
}

.ext-cal-month-hd .ext-cal-hd-day {
    border-left-color: var(--dark-border-2);
}

.ext-cal-hd-ct {
    border-bottom-color: var(--dark-border-2);
}

.x-calendar-nonav .ext-cal-hd-ct {
    border-top-color: var(--dark-border-2);
}

/* --- month view --- */

.ext-cal-monthview .ext-cal-body-ct {
    background: var(--dark-surface-1);
}

.ext-cal-monthview .ext-cal-week-link,
.ext-cal-monthview .ext-cal-week-link-hd {
    background: var(--dark-accent-bg-soft);
    border-top-color: var(--dark-border-2);
    border-right-color: var(--dark-border-2);
    color: var(--dark-text-2);
}

.ext-cal-monthview .ext-week-link-over {
    background: var(--dark-accent-bg-soft-2);
}

.ext-cal-day {
    border-left-color: var(--dark-border-2);
}

.ext-day-over {
    background: var(--dark-accent-bg-soft-2) !important;
}

td.ext-cal-dtitle {
    border-top-color: var(--dark-border-2);
    color: var(--dark-text-2);
}

td.ext-cal-dtitle-first {
    border-top-color: var(--dark-border-2);
}

td.ext-cal-dtitle-today div {
    color: var(--dark-yellow);
}

.ext-cal-dtitle-prev div,
.ext-cal-dtitle-next div {
    color: var(--dark-text-disabled);
}

.ext-cal-day-prev,
.ext-cal-day-next {
    background: var(--dark-bg-page);
}

.ext-cal-ev-more a,
.ext-cal-ev-more a:visited {
    color: var(--dark-text-2);
}

/* --- day/week view --- */

.ext-cal-hd-ad {
    background-color: var(--dark-surface-1);
    border-color: var(--dark-border-2);
}

.ext-cal-dayview .ext-cal-bg-tbl {
    background-color: var(--dark-surface-1);
    border-right-color: var(--dark-border-2);
}

.ext-cal-day-times {
    color: var(--dark-text-2);
}

.ext-cal-day-col {
    border-left-color: var(--dark-border-2);
}

#calendar .ext-cal-dayview .ext-cal-day-first {
    border-left-color: var(--dark-border-2);
}

/* day/week header day-name + number (light theme: navy #093D93) */
.x-day-title-element .day-title-and-number-wrapper p {
    color: var(--dark-text-1);
}

#object-create-window-calendar .x-day-title-element .day-title-and-number-wrapper p {
    color: var(--dark-text-2);
}

/* weekend/holiday tint (light theme: translucent salmon) */
.holiday-header {
    background-color: rgba(229, 72, 77, 0.18);
}

.holiday-body {
    background-color: rgba(229, 72, 77, 0.10);
}

.calendar-details-panel-day-view .x-panel-body {
    border-color: var(--dark-border-2);
}

.customer-project-draggable-projectlist tr.x-grid3-row:hover {
    background-color: var(--dark-surface-3) !important;
}

/* --- drag & drop --- */

.ext-cal-dd-sel {
    background-color: var(--dark-accent-bg);
}

.ext-dd-shim {
    background: var(--dark-accent-bg);
}

.ext-dd-ghost-ct {
    color: var(--dark-text-1);
    border-color: var(--dark-border-1);
    background-color: var(--dark-surface-2);
}

/* --- event edit form + misc --- */

.ext-evt-edit-form .x-panel-bbar .x-toolbar {
    border-bottom-color: var(--dark-border-2);
}

.ext-evt-edit-form .x-panel-header {
    background: var(--dark-surface-2);
    border-bottom-color: var(--dark-accent-border);
}

.ext-evt-edit-form .x-panel-fbar {
    background: var(--dark-surface-2);
    border-color: var(--dark-border-2);
}

.ext-cal-event-win a:link,
.ext-cal-event-win a:visited {
    color: var(--dark-link);
}

/* drop-type menu (task/event type picker on calendar drop) */
.select-te-menu {
    background: var(--dark-surface-2) !important;
}

.x-calendar-filter-supercombo {
    border-color: var(--dark-accent-border) !important;
}

.show-deleted-calendar-switch {
    color: var(--dark-text-2);
}

/* filter panel: unchecked category rows (light theme: #111 on white) */
.x-calendar-event-header-text {
    color: var(--dark-text-1) !important;
}

/* filter panel: checked calendar/user chips keep pastel bg -> dark text */
.x-calendar-telist[class*="x-cal-color-"]:not(.x-cal-color-none) {
    color: #111111;
}

/* --- window tool buttons (close/max/min/gear/...): white svg instead of the
   icon filter - crisp white glyph, button bg/border untouched. data-URIs
   (new files 404 in live-dev). Scoped to .x-window. --- */
.x-epic-dark-style .x-window .x-tool-minimize { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='2.6' y1='14.0001' x2='13.4' y2='14.0001' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-maximize { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.4444 2H2.55556C1.69645 2 1 2.59695 1 3.33333V12.6667C1 13.403 1.69645 14 2.55556 14H13.4444C14.3036 14 15 13.403 15 12.6667V3.33333C15 2.59695 14.3036 2 13.4444 2Z' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cline x1='1.6' y1='4.4' x2='14.4' y2='4.4' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-close { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 4L12 12' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-refresh { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-rotate-ccw-icon lucide-rotate-ccw'%3E%3Cpath d='M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-restore { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' width='24' height='24' fill='%23FFFFFF' style='opacity:1;'%3E%3Cpath  d='M432 48H208c-17.7 0-32 14.3-32 32v16h-48V80c0-44.2 35.8-80 80-80h224c44.2 0 80 35.8 80 80v224c0 44.2-35.8 80-80 80h-16v-48h16c17.7 0 32-14.3 32-32V80c0-17.7-14.3-32-32-32M48 448c0 8.8 7.2 16 16 16h256c8.8 0 16-7.2 16-16V256H48zm16-320h256c35.3 0 64 28.7 64 64v256c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-help { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-circle-question-mark-icon lucide-circle-question-mark'%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-edit { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-square-pen-icon lucide-square-pen'%3E%3Cpath d='M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-gear { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.14667 1.33325H7.85333C7.49971 1.33325 7.16057 1.47373 6.91053 1.72378C6.66048 1.97382 6.52 2.31296 6.52 2.66659V2.78659C6.51976 3.0204 6.45804 3.25005 6.34103 3.45248C6.22401 3.65491 6.05583 3.82301 5.85333 3.93992L5.56667 4.10659C5.36398 4.22361 5.13405 4.28522 4.9 4.28522C4.66595 4.28522 4.43603 4.22361 4.23333 4.10659L4.13333 4.05325C3.82738 3.87676 3.46389 3.82888 3.12267 3.92012C2.78145 4.01137 2.49037 4.23428 2.31333 4.53992L2.16667 4.79325C1.99018 5.09921 1.9423 5.46269 2.03354 5.80392C2.12478 6.14514 2.34769 6.43622 2.65333 6.61325L2.75333 6.67992C2.95485 6.79626 3.12241 6.96331 3.23937 7.16447C3.35632 7.36563 3.4186 7.5939 3.42 7.82658V8.16658C3.42093 8.40153 3.35977 8.63255 3.2427 8.83626C3.12563 9.03996 2.95681 9.20911 2.75333 9.32658L2.65333 9.38658C2.34769 9.56362 2.12478 9.8547 2.03354 10.1959C1.9423 10.5371 1.99018 10.9006 2.16667 11.2066L2.31333 11.4599C2.49037 11.7656 2.78145 11.9885 3.12267 12.0797C3.46389 12.171 3.82738 12.1231 4.13333 11.9466L4.23333 11.8933C4.43603 11.7762 4.66595 11.7146 4.9 11.7146C5.13405 11.7146 5.36398 11.7762 5.56667 11.8933L5.85333 12.0599C6.05583 12.1768 6.22401 12.3449 6.34103 12.5474C6.45804 12.7498 6.51976 12.9794 6.52 13.2133V13.3333C6.52 13.6869 6.66048 14.026 6.91053 14.2761C7.16057 14.5261 7.49971 14.6666 7.85333 14.6666H8.14667C8.50029 14.6666 8.83943 14.5261 9.08948 14.2761C9.33953 14.026 9.48 13.6869 9.48 13.3333V13.2133C9.48024 12.9794 9.54196 12.7498 9.65898 12.5474C9.77599 12.3449 9.94418 12.1768 10.1467 12.0599L10.4333 11.8933C10.636 11.7762 10.866 11.7146 11.1 11.7146C11.3341 11.7146 11.564 11.7762 11.7667 11.8933L11.8667 11.9466C12.1726 12.1231 12.5361 12.171 12.8773 12.0797C13.2186 11.9885 13.5096 11.7656 13.6867 11.4599L13.8333 11.1999C14.0098 10.894 14.0577 10.5305 13.9665 10.1893C13.8752 9.84803 13.6523 9.55695 13.3467 9.37992L13.2467 9.32658C13.0432 9.20911 12.8744 9.03996 12.7573 8.83626C12.6402 8.63255 12.5791 8.40153 12.58 8.16658V7.83325C12.5791 7.5983 12.6402 7.36728 12.7573 7.16358C12.8744 6.95988 13.0432 6.79072 13.2467 6.67325L13.3467 6.61325C13.6523 6.43622 13.8752 6.14514 13.9665 5.80392C14.0577 5.46269 14.0098 5.09921 13.8333 4.79325L13.6867 4.53992C13.5096 4.23428 13.2186 4.01137 12.8773 3.92012C12.5361 3.82888 12.1726 3.87676 11.8667 4.05325L11.7667 4.10659C11.564 4.22361 11.3341 4.28522 11.1 4.28522C10.866 4.28522 10.636 4.22361 10.4333 4.10659L10.1467 3.93992C9.94418 3.82301 9.77599 3.65491 9.65898 3.45248C9.54196 3.25005 9.48024 3.0204 9.48 2.78659V2.66659C9.48 2.31296 9.33953 1.97382 9.08948 1.72378C8.83943 1.47373 8.50029 1.33325 8.14667 1.33325Z' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8 9.99992C9.10457 9.99992 10 9.10449 10 7.99992C10 6.89535 9.10457 5.99992 8 5.99992C6.89543 5.99992 6 6.89535 6 7.99992C6 9.10449 6.89543 9.99992 8 9.99992Z' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-suggester { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 9.33325C10.1333 8.66658 10.4667 8.19992 11 7.66658C11.6667 7.06658 12 6.19992 12 5.33325C12 4.27239 11.5786 3.25497 10.8284 2.50482C10.0783 1.75468 9.06087 1.33325 8 1.33325C6.93913 1.33325 5.92172 1.75468 5.17157 2.50482C4.42143 3.25497 4 4.27239 4 5.33325C4 5.99992 4.13333 6.79992 5 7.66658C5.46667 8.13325 5.86667 8.66658 6 9.33325M6 11.9999H10M6.66667 14.6666H9.33333' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-unpin { background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 4L12 12' stroke='%23FFFFFF' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; filter: none !important; }
.x-epic-dark-style .x-window .x-tool-expand { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-circle-check-icon lucide-circle-check'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") !important; filter: none !important; }

.x-epic-dark-style .x-window .transaction-create-grid-panel.x-tool-unpin{
    background-image: none !important;
}

.x-btn-icon .x-btn-small .x-btn-text.x-pin {
    filter: brightness(0) invert(100%);
}

.x-toolbar-cell .link:hover {
    color: var(--dark-link) !important;
}

.ext-strict .x-details-panel .x-panel-body #user\.timeentriesgrid .x-form-field-wrap,
.x-simple-style #contentContainer #dashboard .x-timeline-history-panel .x-form-field-wrap,
.ext-strict .x-details-panel .x-timeline-filter .x-form-field-trigger-wrap,
div.x-comment-attachments-container:hover,
div.x-mail-attachments-tooltip,
div.x-mail-attachment,
div.x-mail-attachment:hover,
div.x-comment-attachments-container{
    background-color: var(--dark-surface-2);
}

.x-epic-style.x-dark-content-style .attachment-icon:not(.folder-name)::before {
    background-color: var(--color-white);
}

.x-miniadmin input{
    color: white;
    background-color: var(--dark-surface-2) !important;
}

.x-menu-item-icon.not-available{
    filter: brightness(0.8);
}

/* Dim only the status icon: a mask clips a 20%-black overlay to the icon's shape (20% black over the icon = brightness(0.8)), leaving the dropdown arrow untouched. */
#chatStatusButton:not(.available):not(.invisible):not(.busy)::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 7px;
    width: 12px;
    height: 12px;
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-mask: url(images/rightpanel/not-available.svg) no-repeat center / 12px;
    mask: url(images/rightpanel/not-available.svg) no-repeat center / 12px;
    pointer-events: none;
}

.x-simple-style.x-hs-test .x-window:not(.x-filter-window) .x-html-editor-wrap .x-toolbar select {
    background-color: var(--dark-surface-2);
    color: white;
}

.x-tool {
    opacity: 0.5;
}


.x-epic-style #apInvitationWindow.x-window:not(.x-filter-window) #permissionChecks .x-form-label-top .x-form-item-label,
.x-epic-style #apInvitationWindow.x-window:not(.x-filter-window) #additionalCopyInfo .x-form-label-top .x-form-item-label{
    background-color: transparent !important;
}

.x-simple-style #contentContainer .x-report-combo input {
    color: white;
}

.x-green-background {
    background-color: #AAFF9988;
}

.ext-strict #contentContainer .x-details-panel .x-panel-body .x-grid-editor,
.ext-strict #contentContainer .x-details-panel .x-panel-body .x-grid-editor:has(.x-trigger-wrap-focus),
.ext-strict #contentContainer .x-details-panel .x-panel-body .x-form-field-editing .x-form-text,
.comment-editor.comment-editor-expanded .content-editable-comment-editor{
    border-color: #AACCFFAA !important;
}

.x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-form-item .x-form-element .x-html-editor-wrap iframe,
#mailCreateWindow .x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-form-item .x-form-element .x-html-editor-wrap iframe,
#mailTemplateCreateWindow .x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-form-item .x-form-element .x-html-editor-wrap iframe,
#createcommentwindow .x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-html-editor-wrap iframe,
#taskCreateWindow .x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-html-editor-wrap iframe,
#editDescriptionWindow_task .x-panel-bwrap .x-panel-body.x-panel-body-noheader.x-form .x-html-editor-wrap iframe {
    background-color: #eeeeee;
}