
:root {
    /**********
    **** Local variables
    *****/

    --_demica-blue: #483494;
    --_demica-light-blue: #6e50ff;
    --_demica-dark-blue: #140d48;

    --_demica-black: #000;

    --_demica-white: #fff;
    --_demica-pearl: #f7f7f7;
    --_demica-light-gray: #f6f7fa;
    --_demica-gray: #f1f1f1;
    --_demica-mid-gray: #d9d9d9;
    --_demica-dark-gray: #9b9b9b;
    --_demica-purple: #9d00ff;
    --_demica-red: #d0021b;
    --_demica-orange: #ff8100;
    --_demica-mint: #60c3ad;
    --_demica-steel-blue: #2f71b2;
    --_demica-light-green: #5ee487;
    --_demica-green: green;
    --_demica-graphite: #4a4a4a;
    /*******************************/

    /* Data visualisation */
    --visualisation-color-1: #6e50ff;
    --visualisation-color-2: #3071b3;
    --visualisation-color-3: #6071b3;
    --visualisation-color-4: #9b9b9b;
    --visualisation-color-5: #322830;
    --visualisation-color-6: #004e64;
    --visualisation-color-7: #e08cad;
    --visualisation-color-8: #575266;
    --visualisation-color-9: #00a6d0;
    --visualisation-color-10: #6a7fdc;
    --visualisation-color-11: #7ba8ae;
    --visualisation-color-12: #6f7dac;
    --visualisation-color-13: #54f29d;
    --visualisation-color-14: #57e2e5;
    --visualisation-color-15: #bee277;

    /**********
    **** Fonts
    *****/
    --trf-font-family-regular: 'SourceSansProRegular', 'sans-serif';
    --trf-font-family-semi-bold: 'SourceSansProSemiBold', 'sans-serif';
    --trf-font-family-bold: 'SourceSansProBold', 'sans-serif';

    /*********
    headings: 45px, 36px, 29px, 23px, 19px
    caption: 13px, 12px, 10px
    ***********/
    --trf-font-size-base: 14px;

    --trf-font-size-h1: 1.57rem;
    --trf-font-size-h2: 1.43rem;
    --trf-font-size-h3: 1.29rem;
    --trf-font-size-h4: 1.14rem;
    --trf-font-size-h5: 1.07rem;
    --trf-font-size-body: 1rem;
    --trf-font-size-sm: .87rem;
    --trf-font-size-xs: .8rem;
    --trf-font-size-xxs: .67rem;
    /*******************************/

    --trf-color-primary: var(--_demica-blue);
    --trf-color-light-primary: var(--_demica-light-blue);
    --trf-color-dark-primary: var(--_demica-dark-blue);
    --trf-color-hover-primary: var(--_demica-blue);
    --trf-color-active-primary: var(--_demica-dark-blue);

    --trf-color-white: var(--_demica-white);
    --trf-color-black: var(--_demica-black);

    --trf-background-color: var(--_demica-pearl);
    --trf-font-color: var(--_demica-graphite);

    /* Timelines */
    --trf-timeline-sidebar-space: 100px;
    --trf-timeline-sidebar-space-outer: -100px;
    --trf-timeline-vertical-line-display: inline-block;
    --trf-timeline-vertical-line-bg: var(--_demica-gray);

    --trf-timeline-date-bg: var(--_demica-mint);
    --trf-timeline-date-color: var(--_demica-white);
    --trf-timeline-date-border: 5px solid var(--_demica-white);
    --trf-timeline-date-border-radius: 8px;
    --trf-timeline-date-margin: 0 0 20px 0;

    --trf-timeline-event-shift: -25px;
    --trf-timeline-event-icon-position: absolute;
    --trf-timeline-event-icon-left: -37px;
    --trf-timeline-event-icon-bg: var(--_demica-white);
    --trf-timeline-event-icon-bg-money: var(--_demica-mint);
    --trf-timeline-event-icon-bg-file: var(--_demica-light-blue);
    --trf-timeline-event-icon-color: var(--_demica-white);
    --trf-timeline-event-title-font: var(--trf-font-family-bold);
    --trf-timeline-event-title-color: var(--_demica-graphite);
    --trf-timeline-event-table-width: 100%;
    --trf-timeline-event-table-padding-top: 0;
    --trf-timeline-event-table-border: 1px solid var(--_demica-gray);

    --trf-timeline-system-status-outstanding: var(--_demica-mint);
    --trf-timeline-system-status-delinquent: var(--_demica-orange);
    --trf-timeline-system-status-defaulted: var(--_demica-red);
    --trf-timeline-system-status-written-off: var(--_demica-light-blue);
    --trf-timeline-system-status-matured: var(--_demica-steel-blue);
    --trf-timeline-system-status-closed: #6e7dab;

    --trf-control-border: #ddd;

    /* Sections */
    --trf-section-bg: var(--_demica-white);
    --trf-section-margin: 10px;
    --trf-section-padding: 10px;
    --trf-section-nested-padding: 10px;
    --trf-section-border: 1px solid var(--_demica-gray);

    --trf-section-header-color: var(--_demica-light-blue);
    --trf-section-header-border: var(--trf-section-border);
    --trf-section-header-font: var(--trf-font-family-regular);
    --trf-section-header-font-size: var(--trf-font-size-base);

    --trf-section-buttons-border: var(--trf-section-border);

    /* Header */
    --trf-header-logo-width: 152px;
    --trf-header-logo-height: 70px;
    --trf-header-logo-align: center;
    --trf-header-icon-width: 30px;
    --trf-header-icon-height: 30px;

    --trf-header-background-color: var(--_demica-white);
    --trf-header-font-color: var(--_demica-graphite);
    --trf-header-dropdown-header-font-color: var(--_demica-dark-gray);
    --trf-header-dropdown-header-color: var(--_demica-dark-gray);
    --trf-header-dropdown-box-shadow-color: var(--_demica-dark-gray);
    --trf-header-toggle-button-color: var(--_demica-light-blue);
    --trf-header-chevron-icon-color: var(--_demica-light-blue);
    --trf-header-dropdown-border-color: var(--_demica-light-gray);
    --trf-header-signout-icon-color: var(--_demica-light-blue);
    --trf-header-dropdown-header-text-transform: none;
    --trf-header-dropdown-active-element-color: var(--_demica-light-blue);
    --trf-header-dropdown-active-element-border-color: transparent;
    --trf-header-dropdown-active-element-border-width: 0;
    --trf-header-profile-dropdown-text-transform: none;
    --trf-header-profile-dropdown-username-font-weight: 700;

    /* Header Alerts */
    --trf-header-alert-status-performing: var(--_demica-mint);
    --trf-header-alert-status-watch-list: var(--_demica-orange);
    --trf-header-alert-status-at-risk: var(--_demica-red);
    --trf-header-alert-missing-files: var(--_demica-light-blue);

    /* Menu Aside */
    --trf-sidebar-width: 245px;
    --trf-sidebar-collapse-width: 75px;
    --trf-menu-aside-padding: 90px;
    --trf-menu-aside-bg: var(--_demica-white);
    --trf-menu-aside-border: 2px solid var(--_demica-gray);
    --trf-menu-aside-section-title-color: var(--_demica-graphite);
    --trf-menu-aside-section-title-font: var(--trf-font-family-regular);
    --trf-menu-aside-section-title-size: .8rem;
    --trf-menu-aside-section-title-spacing: 2px;
    --trf-menu-aside-section-title-transform: uppercase;
    --trf-menu-aside-section-border: 1px solid var(--_demica-gray);
    --trf-menu-aside-item-color: var(--_demica-graphite);
    --trf-menu-aside-item-font: var(--trf-font-family-bold);
    --trf-menu-aside-item-icon-size: 1.2rem;
    --trf-menu-aside-item-border-width: 4px;
    --trf-menu-aside-item-active-color: var(--_demica-light-blue);
    --trf-menu-aside-item-active-border: var(--trf-menu-aside-item-border-width) solid var(--_demica-light-blue);

    /* Buttons */
    --trf-btn-color: var(--_demica-black);
    --trf-btn-bg: var(--_demica-mid-gray);
    --trf-btn-border-color: transparent;
    --trf-btn-hover-bg: var(--_demica-dark-gray);
    --trf-btn-active-bg: var(--_demica-graphite);
    --trf-btn-focus-bg: var(--_demica-light-blue);

    --trf-btn-primary-color: var(--_demica-white);
    --trf-btn-primary-bg: var(--_demica-light-blue);
    --trf-btn-primary-border-color: transparent;
    --trf-btn-primary-hover-bg: var(--_demica-blue);
    --trf-btn-primary-active-bg: var(--_demica-dark-blue);

    --trf-btn-secondary-color: var(--_demica-light-blue);
    --trf-btn-secondary-bg: var(--_demica-white);
    --trf-btn-secondary-border-color: var(--_demica-light-blue);;
    --trf-btn-secondary-hover-bg: var(--_demica-gray);
    --trf-btn-secondary-active-bg: var(--_demica-gray);

    --trf-btn-tertiary-color: var(--_demica-light-blue);
    --trf-btn-tertiary-bg: var(--_demica-white);
    --trf-btn-tertiary-border-color: var(--_demica-light-blue);;
    --trf-btn-tertiary-hover-bg: var(--_demica-gray);
    --trf-btn-tertiary-active-bg: var(--_demica-gray);

    --trf-btn-inactive-color: var(--_demica-dark-gray);
    --trf-btn-inactive-bg: var(--_demica-light-gray);
    --trf-btn-inactive-border-color: transparent;

    --trf-btn-border-radius: 2px;

    --trf-btn-text-transform: none;

    /* Uploads */
    --trf-upload-success-color: var(--_demica-green);
    --trf-upload-warning-color: var(--_demica-orange);
    --trf-upload-error-color: var(--_demica-red);

    /* Table List (Clients / Transactions / Funders) */
    --trf-table-list-text-color: var(--_demica-graphite);

    --trf-table-list-header-bg: var(--_demica-white);
    --trf-table-list-header-color: var(--_demica-graphite);
    --trf-table-list-header-border-x: 1px solid var(--_demica-gray);
    --trf-table-list-header-border-y: none;
    --trf-table-list-order-icon-color: var(--_demica-light-blue);

    --trf-table-list-action-icon-color: var(--_demica-graphite);
    --trf-table-list-action-icon-size: 1.5em;
    --trf-table-list-collapse-icon-color: var(--_demica-light-blue);

    --trf-table-list-font-size: .87rem;

    --trf-table-list-first-row-bg: var(--_demica-white);
    --trf-table-list-first-row-hover-bg: var(--trf-table-hover-bg);

    --trf-table-list-second-row-bg: var(--_demica-gray);
    --trf-table-list-second-row-hover-bg: var(--trf-table-hover-bg);

    --trf-table-list-third-row-bg: #f9f9f9;
    --trf-table-list-third-row-hover-bg: var(--trf-table-hover-bg);
    --trf-table-list-third-row-hover-border: none;

    --trf-table-list-cell-border-x: 1px solid #ddd;
    --trf-table-list-cell-border-y: 1px solid transparent;
    --trf-table-list-border-hover-x: var(--trf-table-list-cell-border-x);
    --trf-table-list-border-hover-y: var(--trf-table-list-cell-border-y);

    --trf-table-list-nested-row-gap-bg: var(--trf-table-list-first-row-bg);
    --trf-table-list-nested-row-gap-border-x: none;
    --trf-table-list-nested-row-gap-border-y: none;

    --trf-table-list-link-color: var(--_demica-light-blue);
    --trf-table-list-link-font: var(--trf-font-family-bold);
    --trf-table-list-contact-prefix-color: var(--_demica-light-blue);

    /* Modal */
    --trf-modal-backdrop-color: var(--_demica-white);
    --trf-modal-backdrop-opacity: .75;
    --trf-modal-bg: var(--_demica-white);
    --trf-modal-border-radius: 0;
    --trf-modal-border: rgba(0, 0, 0, .2);
    --trf-modal-close-icon-color: var(--_demica-dark-gray);
    --trf-modal-close-icon-font-size: .9rem;
    --trf-modal-control-divider: var(--_demica-gray);
    --trf-modal-header-color: var(--_demica-light-blue);
    --trf-modal-header-font-size: 1rem;
    --trf-modal-icon-color: #21298A;
    --trf-modal-section-bg: var(--_demica-white);
    --trf-modal-section-border: var(--_demica-gray);
    --trf-modal-shadow-blur: 15px;
    --trf-modal-shadow-color: rgba(0, 0, 0, 0.15);
    --trf-modal-shadow-y-offset: 4px;
    --trf-modal-body-padding: 0;

    /* Slide-in  */
    --trf-slidein-action-item-bg: var(--_demica-white);
    --trf-slidein-action-item-border: none;
    --trf-slidein-action-item-color: var(--_demica-dark-gray);
    --trf-slidein-action-item-font-size: 1.5rem;
    --trf-slidein-action-item-hoover-bg: var(--_demica-light-blue);
    --trf-slidein-action-item-hoover-color: var(--_demica-white);
    --trf-slidein-action-item-inner-border-color: transparent;
    --trf-slidein-action-item-size: 40px;
    --trf-slidein-bg: var(--_demica-white);
    --trf-slidein-border-color: transparent;
    --trf-slidein-border-width: 0;
    --trf-slidein-border: none;
    --trf-slidein-child-shift: 0;
    --trf-slidein-glass-applier-bg: rgba(155, 155, 155, 0.3);
    --trf-slidein-header-border-color: var(--_demica-gray);
    --trf-slidein-header-color: var(--_demica-light-blue);
    --trf-slidein-header-font-size: 1rem;
    --trf-slidein-header-padding: 10px;
    --trf-slidein-content-padding: 0;
    --trf-slidein-footer-border: 1px solid var(--_demica-gray);

    /* Wizard */
    --trf-wizard-bg: var(--_demica-light-gray);
    --trf-wizard-step: var(--_demica-blue);
    --trf-wizard-step-current: var(--_demica-light-blue);

    /* Inline alert */
    --trf-alert-success: #3c763d;
    --trf-alert-success-border: var(--_demica-green);
    --trf-alert-success-bg: #dff0d8;

    --trf-alert-info: #8a6d3b;
    --trf-alert-info-border: var(--_demica-orange);
    --trf-alert-info-bg: #fff8f1;

    --trf-alert-warning: var(--_demica-graphite);
    --trf-alert-warning-border: var(--_demica-orange);
    --trf-alert-warning-bg: #fff8f1;

    --trf-alert-error: var(--_demica-graphite);
    --trf-alert-error-border: var(--_demica-red);
    --trf-alert-error-bg: #ffeff1;

    /* Statuses */
    --trf-status-waiting-for-approval: #d2691e;
    --trf-status-rejected: #a94442;
    --trf-status-queued: #8a6d3b;
    --trf-status-processing: #31708f;
    --trf-status-failed: #a94442;
    --trf-status-complete: #3c763d;
    --trf-status-new: #0ff;
    --trf-status-rolled-back: #a94442;

    /* Panels */
    --panel-section-divider-margin: 30px;
    --panel-margin: 10px;
    --panel-padding: 10px;
    --panel-side-margin: 10px;

    /* Transition global options */
    --trf-transition-speed: .3s;
    --transition-fn: ease-in-out;

    /* Context */
    --trf-context-notification-font-size: 1rem;
    --trf-context-notification-border-radius: 0;
    --trf-context-notification-padding: 5px;
    --trf-context-notification-border: 1px solid;
    --trf-context-notification-icon-display: flex;
    --trf-context-notification-icon-size: 18px;
    --trf-context-notification-margin: 0 10px;

    --trf-context-notification-warning-bg: #fff8f1;
    --trf-context-notification-warning-border-color: var(--_demica-orange);
    --trf-context-notification-warning-icon-color: var(--_demica-orange);
    --trf-context-notification-warning-font-color: var(--_demica-graphite);

    --trf-context-notification-error-bg: #ffeff1;
    --trf-context-notification-error-border-color: var(--_demica-red);
    --trf-context-notification-error-icon-color: var(--_demica-red);
    --trf-context-notification-error-font-color: var(--_demica-graphite);

    --trf-context-notification-info-bg: #ebfbff;
    --trf-context-notification-info-border-color: var(--_demica-steel-blue);
    --trf-context-notification-info-icon-color: var(--_demica-steel-blue);
    --trf-context-notification-info-font-color: var(--_demica-graphite);

    /* Inline notification */
    --trf-inline-notification-msg-icon-display: none;
    --trf-inline-notification-msg-icon-error-color: inherit;
    --trf-inline-notification-msg-icon-warning-color: inherit;
    --trf-inline-notification-msg-color: #a94442;
    --trf-inline-notification-font-size: .9rem;
    --trf-inline-notification-error-icon: exclamation-triangle;
    --trf-inline-notification-warning-icon: exclamation-circle;
    /* Forms */

    --trf-form-validation-msg-height: 1.2rem;
    --trf-form-label-asterisk: var(--_demica-light-blue);
    --trf-form-label-offset: 0;
    --trf-form-label-top-margin: 0;
    --trf-form-label-bottom-margin: 0;
    --trf-form-label-font-size: .8rem;
    --trf-form-label-disabled-color: var(--_demica-graphite);
    --trf-form-inline-button-top-margin: 1.5rem;

    --trf-input-font-size: .9rem;
    --trf-input-border: 1px solid var(--_demica-dark-blue);
    --trf-input-border-radius: 2px;
    --trf-input-placeholder-color: var(--_demica-dark-gray);

    --trf-input-invalid-border: 1px solid #a94442;
    --trf-input-invalid-border-focus: 1px solid #843534;
    --trf-input-invalid-border-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    --trf-input-invalid-border-focus-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483;
    --trf-input-invalid-border-bg: transparent;

    --trf-input-disabled-border-color: var(--_demica-dark-gray);
    --trf-input-disabled-bg-color: var(--_demica-gray);
    --trf-input-disabled-border: 1px solid var(--_demica-dark-gray);
    --trf-input-disabled-bg: var(--_demica-gray);
    --trf-input-disabled-color: var(--_demica-dark-gray);
    --trf-input-disabled-placeholder-color: var(--_demica-dark-gray);

    --trf-input-warning-border: 1px solid #c0a16b;
    --trf-input-warning-border-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    --trf-input-warning-border-focus: 1px solid #ad8a4b;
    --trf-input-warning-border-focus-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ad8a4b;

    --trf-input-group-color: #495057;
    --trf-input-group-bg: #e9ecef;
    --trf-input-group-border-color: #ced4da;
    --trf-input-group-invalid-bg: #e9ecef;
    --trf-input-group-invalid-border-color: #ced4da;
    --trf-input-group-disabled-border-color: #e9ecef;
    --trf-input-group-disabled-bg: #e9ecef;

    --trf-date-picker-icon-color: var(--_demica-light-blue);
    --trf-date-picker-icon-bg: transparent;
    --trf-date-picker-icon-border-color: var(--_demica-dark-blue);
    --trf-date-piceker-icon-invalid-bg: transparent;
    --trf-date-picker-icon-border-invalid-color: #a94442;
    --trf-date-picker-inner-border-color: transparent;

    --trf-input-group-form-telephone-row-content-offset: 0;
    --trf-input-group-form-telephone-row-height: 80%;
    --trf-input-group-form-telephone-row-top: 10%;
    --trf-input-group-form-telephone-color: var(--_demica-dark-gray);

    --form-row-bottom-margin: 2px;

    /* Date picker calendar widget */

    --trf-date-picker-font-color: var(--trf-font-color);
    --trf-date-picker-hoover-bg: var(--_demica-mid-gray);
    --trf-date-picker-active-bg: var(--_demica-light-gray);
    --trf-date-picker-selected-bg: var(--_demica-light-blue);
    --trf-date-picker-border-radius: 2px;
    --trf-date-picker-select-border: solid 1px var(--_demica-mid-gray);
    --trf-date-picker-select-bg: var(--_demica-white);
    --trf-date-picker-header-bg: var(--_demica-light-gray);
    --trf-date-picker-chevron-color: var(--_demica-light-blue);
    --trf-date-picker-header-bottom-border: none;
    --trf-date-picker-row-item-bottom-border: transparent;
    --trf-date-picker-weekday-color: var(--_demica-light-blue);
    --trf-date-picker-weekdays-bg: var(--trf-background-color);
    --trf-date-picker-cell-width: 2rem;
    --trf-date-picker-cell-height: 2rem;
    --trf-date-picker-cell-font-size: 1rem;
    --trf-date-picker-calendar-padding: .5rem;
    --trf-date-picker-border-color: var(--_demica-light-gray);
    --trf-date-picker-navigation-margin: 0;

    /* Tables */
    --trf-table-header-padding: 10px 10px;
    --trf-table-header-dark-color: var(--_demica-graphite);
    --trf-table-header-bg-color: var(--_demica-gray);
    --trf-table-header-divider: none;
    --trf-table-header-border-bottom: 1px solid var(--_demica-mid-gray);
    --trf-table-header-cell-direction: initial;
    --trf-table-header-cell-justify: initial;
    --trf-table-sort-indicator-color: var(--trf-color-light-primary);
    --trf-table-inactive-sort-indicator-color: var(--_demica-pearl);

    --trf-table-row-divider: 1px solid var(--_demica-mid-gray);
    --trf-table-row-bg: #fafafa;
    --trf-table-hover-bg: #eaeaea;
    --trf-table-border-hover-x: transparent;
    --trf-table-border-hover-y: transparent;

    --trf-table-cell-divider: none;
    --trf-table-cell-padding: 15px 10px;
    --trf-table-cell-actions-alignment: center;
    --trf-table-cell-actions-alignment-rtl: center;

    --trf-table-row-reference-currency-bg: var(--_demica-gray);

    /* Action icons */
    --trf-action-icon-color: #333;
    --trf-action-icon-disabled-color: var(--_demica-dark-gray);
    --trf-action-icon-hover-color: var(--trf-color-primary);
    --trf-action-icon-processed-color: var(--_demica-mint);

    /* Images */
    --trf-logo-width: 100px;
    --trf-logo-height: 70px;
    --trf-client-edit-logo-width: 90px;
    --trf-client-edit-logo-height: 70px;
    --trf-client-edit-logo-height-bigger: 90px;
    --trf-client-edit-logo-height-smaller: 50px;

    /* Tabs */
    --trf-tabs-hover-transition: width .3s ease-in-out, background-color .3s ease-in-out;
    --trf-tabs-inactive-invalid-bg: #a94442;

    --trf-tabs-primary-border-bottom: 1px solid var(--_demica-light-blue);
    --trf-tab-primary-container-padding: 10px;
    --trf-tab-primary-font: var(--trf-font-family-regular);
    --trf-tab-primary-bg: var(--_demica-white);
    --trf-tab-primary-color: var(--_demica-dark-gray);
    --trf-tab-primary-border: 1px solid var(--_demica-dark-gray);
    --trf-tab-primary-border-radius: 0;
    --trf-tab-primary-text-transform: none;
    --trf-tab-primary-active-bg: var(--_demica-white);
    --trf-tab-primary-active-color: var(--_demica-light-blue);
    --trf-tab-primary-active-border: 1px solid var(--_demica-light-blue);
    --trf-tab-primary-active-before-content: none;
    --trf-tab-primary-active-before-top: auto;
    --trf-tab-primary-active-before-right: auto;
    --trf-tab-primary-active-before-bottom: auto;
    --trf-tab-primary-active-before-left: auto;
    --trf-tab-primary-active-before-height: 0;
    --trf-tab-primary-active-before-color: transparent;
    --trf-tab-primary-stripe-hover: var(--_demica-blue);

    --trf-tabs-secondary-border-bottom: 1px solid var(--_demica-light-blue);
    --trf-tab-secondary-container-padding: 10px;
    --trf-tab-secondary-font: var(--trf-font-family-regular);
    --trf-tab-secondary-bg: var(--_demica-white);
    --trf-tab-secondary-color: var(--_demica-dark-gray);
    --trf-tab-secondary-border: 1px solid var(--_demica-dark-gray);
    --trf-tab-secondary-border-radius: 0;
    --trf-tab-secondary-text-transform: none;
    --trf-tab-secondary-active-bg: var(--_demica-white);
    --trf-tab-secondary-active-color: var(--_demica-light-blue);
    --trf-tab-secondary-active-border: 1px solid var(--_demica-light-blue);
    --trf-tab-secondary-active-before-content: none;
    --trf-tab-secondary-active-before-top: auto;
    --trf-tab-secondary-active-before-right: auto;
    --trf-tab-secondary-active-before-bottom: auto;
    --trf-tab-secondary-active-before-left: auto;
    --trf-tab-secondary-active-before-height: 0;
    --trf-tab-secondary-active-before-color: transparent;
    --trf-tab-secondary-stripe-hover: var(--_demica-blue);

    --trf-tab-pills-btn-bg: transparent;
    --trf-tab-pills-btn-padding: 2px 7px;
    --trf-tab-pills-btn-color: var(--_demica-dark-gray);
    --trf-tab-pills-btn-border: 1px solid var(--_demica-dark-gray);
    --trf-tab-pills-btn-hover-bg: var(--_demica-white);
    --trf-tab-pills-btn-hover-color: var(--_demica-black);
    --trf-tab-pills-btn-hover-border: 1px solid var(--_demica-dark-gray);
    --trf-tab-pills-btn-pressed-bg: var(--_demica-white);
    --trf-tab-pills-btn-pressed-color: var(--_demica-black);
    --trf-tab-pills-btn-pressed-border: 1px solid var(--_demica-dark-gray);
    --trf-tab-pills-active-btn-bg: var(--_demica-light-blue);
    --trf-tab-pills-active-btn-color: var(--_demica-white);
    --trf-tab-pills-active-btn-border: 1px solid var(--_demica-light-blue);

    /* Tooltip */
    --trf-tooltip-bg: var(--_demica-dark-gray);
    --trf-tooltip-color: var(--_demica-white);
    --trf-tooltip-text-color: var(--_demica-graphite);
    --trf-tooltip-text-bg: var(--_demica-white);
    --trf-tooltip-border: 1px solid var(--_demica-dark-gray);
    --trf-tooltip-radius: 3px;
    --trf-tooltip-padding: 3px 5px;
    --trf-tooltip-margin: 8px;
    --trf-tooltip-arrow-bordered-display: inline-block;
    /* use as display css properties: 'none' to show solid arrow, or 'inline-block' to show only arrow border */

    /* Notifications */
    --trf-notification-toast-width: 300px;
    --trf-notification-toast-max-width: 350px;
    --trf-notification-content-max-width: 270px;
    --trf-notigication-border-radius: .25rem;
    --trf-notification-icon-size: 1.5rem;
    --trf-notification-toast-padding: 10px;

    --trf-notification-content-display: block;
    --trf-notification-content-align-items: center;
    --trf-notification-content-padding-side: 0;

    --trf-notification-title-font-size: inherit;
    --trf-notification-title-line-height: inherit;
    --trf-notification-title-margin-side: 0;
    --trf-notification-title-font-display: block;

    --trf-notification-title-inline: none; /* Toggle with display above, to set where you want to place toaster title */

    --trf-notification-message-line-height: 1rem;
    --trf-notification-message-font-size: .9rem;

    --trf-notification-close-btn-spacing: 0;
    --trf-notification-close-btn-font-size: inherit;

    /* Icons unicodes can be found here: https://fontawesome.com/cheatsheet */
    --trf-notification-display: none;
    --trf-notification-success: var(--_demica-white);
    --trf-notification-success-icon-color: transparent;
    --trf-notification-success-bg: #3c763d;
    --trf-notification-success-hover-bg: #4d984e;

    --trf-notification-warning: var(--_demica-white);
    --trf-notification-warning-icon-color: transparent;
    --trf-notification-warning-bg: #c0a16b;
    --trf-notification-warning-hover-bg: #cfb88f;

    --trf-notification-error: var(--_demica-white);
    --trf-notification-error-icon-color: transparent;
    --trf-notification-error-bg: #a94442;
    --trf-notification-error-hover-bg: #c0605e;

    /* Alert */
    --faulty-border-color: #843534;
    --faulty-background-color: #ce8483;
    --faulty-font-color: var(--_demica-black);
    --faulty-icon-color: #843534;

    --faultless-border-color: var(--_demica-mid-gray);
    --faultless-background-color: var(--_demica-white);
    --faultless-font-color: var(--_demica-mid-gray);
    --faultless-icon-color: var(--_demica-light-gray);

    /* Logo */
    --trf-client-icon-max-width: 100px;
    --trf-client-icon-max-height: 70px;

    /* Icons */
    --trf-check-icon-green-color: #3c763d;
    --trf-times-icon-red-color: #a94442;
    --trf-info-icon-blue-color: #288acb;
    --trf-sort-indicator-color: var(--_demica-light-blue);
    --trf-table-icon-size: 1.2rem;

    /* Accordion */
    --trf-accordion-header-btn-bg: var(--_demica-white);
    --trf-accordion-title-padding: 7px;
    --trf-accordion-title-height: 49px;
    --trf-accordion-panel-bg: var(--trf-table-row-bg);

    /* Helper */
    --trf-helper-background: var(--_demica-white);
    --trf-helper-border: var(--_demica-dark-gray);
    --trf-helper-arrow: var(--_demica-dark-gray);

    /* Funding */
    --trf-funding-structure-graph-hover-color: var(--_demica-dark-blue);
    --trf-funding-structure-border-radius: 5px;
    --trf-funding-structure-instrument-empty-color: var(--_demica-mint);
    --trf-funding-structure-instrument-alpha-level: 0.3;
    --trf-funding-structure-funder-box-shadow: 1px 1px 2px 0 var(--_demica-dark-gray);
    --trf-funding-structure-funder-border: 0;
    --trf-funding-structure-icon-size: 1rem;

    /* Dashboard search forms */
    --trf-search-form-border: 1px solid var(--_demica-gray);
    --trf-search-form-grid-gutter-width: 5px;

    /* sections-wrapper vertical row divider */
    --trf-sections-wrapper-row-non-divided-max-width: 1200px;
    --trf-sections-wrapper-row-divided-min-width: 1200px;

    /* Chart axis colors */
    --trf-chart-axis-gray: #858585;

    /* ng-select */
    --trf-multiselect-label-padding: 2px 0;
    --trf-multiselect-label-border: var(--_demica-light-blue);
    --trf-multiselect-label-separator: var(--_demica-light-blue);
    --trf-multiselect-label-background: #f2efff;
    --trf-multiselect-label-color: var(--_demica-light-blue);

    /* ng-select filters */
    --trf-filter-tag-border-radius: 2px;
    --trf-filter-button-padding: .2em;
    --trf-filter-button-font: var(--trf-font-family-bold);

    /* Logos */
    /*noinspection CssUnknownTarget*/

    --trf-brand-logo: "/assets/{clientAssets}/images/theme-logo.0b0196f60a684a3fce0396d3f8249bdf.svg";
    /*noinspection CssUnknownTarget*/

    --trf-brand-icon: "/assets/{clientAssets}/images/theme-icon.6cb574c3430966210f5a950e4c507f31.svg";

    /* SVG sprite */

    /*noinspection CssUnknownTarget*/
    --trf-sprite-file: "/assets/{clientAssets}/images/theme-icon-sprite.d1f6899eb6ba8c6edb3607c286a2199d.svg";

    /* Checkbox */
    --trf-checkbox-frame-color: var(--_demica-light-blue);
    --trf-checkbox-frame-thickness: 3px;
    --trf-checkbox-frame-size: 22px;
    --trf-checkbox-frame-radius: 2px;

    --trf-checkbox-tick-color: transparent;

    --trf-checkbox-square-color: var(--_demica-light-blue);

    --trf-checkbox-indeterminate-color: var(--_demica-light-blue);
    --trf-checkbox-indeterminate-thickness: 4px;
    --trf-checkbox-indeterminate-top: 6px;
    --trf-checkbox-indeterminate-width: 12px;

    /* Radio */
    --trf-radio-size: 1.4em;
    --trf-radio-frame-border-scale: .7;
    --trf-radio-check-border-size: 3px;

    --trf-radio-bg: var(--_demica-gray);
    --trf-radio-frame-border-color: var(--_demica-light-blue);
    --trf-radio-check-color: var(--_demica-light-blue);

    --trf-radio-disabled-bg: var(--_demica-dark-gray);
    --trf-radio-disabled-frame-border-color: var(--_demica-dark-gray);
    --trf-radio-disabled-check-color: var(--_demica-dark-gray);

    /* Programme modelling */
    --trf-pm-configured-color: var(--_demica-light-green);
    --trf-pm-configured-text-color: var(--_demica-blue);
    --trf-pm-action-color: var(--_demica-blue);

    --trf-pm-file-format-border-radius: 30;
    --trf-pm-file-format-border-color: var(--_demica-light-blue);
    --trf-pm-file-format-border-width: 1.5;
    --trf-pm-file-format-text-color: var(--_demica-blue);

    --trf-pm-filter-border-color: var(--_demica-light-blue);
    --trf-pm-filter-border-width: 1.5;
    --trf-pm-filter-hoover-bg-color: var(--_demica-light-blue);
    --trf-pm-filter-hoover-text-color: var(--_demica-white);
    --trf-pm-filter-set-text-color: var(--_demica-blue);
    --trf-pm-filter-set-bg-color: var(--_demica-gray);
    --trf-pm-filter-set-border-color: var(--_demica-black);
    --trf-pm-filter-set-border-width: 0;
    --trf-pm-filter-set-size-reduction: 6;
    --trf-pm-filter-set-gap: 4;
    --trf-pm-filter-divider: none;

    --trf-pm-programme-text-color: var(--_demica-dark-blue);
    --trf-pm-programme-configured-border-color: var(--_demica-mid-gray);
    --trf-pm-programme-partially-configured-color: var(--_demica-gray);
    --trf-pm-programme-partially-configured-border-color: var(--_demica-mid-gray);
    --trf-pm-programme-partially-configured-border-width: 1.5;
    --trf-pm-programme-unconfigured-border-dash: 5, 5;
    --trf-pm-programme-unconfigured-text-color: var(--_demica-dark-gray);
    --trf-pm-programme-unconfigured-text-style: italic;
    --trf-pm-programme-icon-bg: var(--_demica-white);
    --trf-pm-programme-icon-black: var(--_demica-black);
    --trf-pm-programme-icon-blue: var(--_demica-light-blue);
    --trf-pm-programme-icon-red: var(--_demica-red);
    --trf-pm-programme-icon-purple: var(--_demica-purple);
    --trf-pm-programme-icon-green: var(--_demica-green);

    --trf-pm-selection: #1499d3;
    --trf-pm-highlight: #83aa30;

    /* States */
    --trf-focus-outline: 2px solid var(--_demica-black);
    --trf-radio-buttons-focus-box-shadow: 0 0 0 2px var(--_demica-black);

    /* Funding waterfall */
    --trf-waterfall-asset-base-bg: var(--_demica-light-blue);
    --trf-waterfall-asset-base-border-color: var(--_demica-light-blue);
    --trf-waterfall-asset-base-border-width: 1.5;
    --trf-waterfall-asset-base-text-size: 20px;

    --trf-waterfall-spv-bg: var(--_demica-light-blue);
    --trf-waterfall-spv-border-color: var(--_demica-light-blue);
    --trf-waterfall-spv-border-width: 1.5;
    --trf-waterfall-spv-text-weight: 900;
    --trf-waterfall-spv-text-size: 22px;

    --trf-waterfall-expense-bg: var(--_demica-white);
    --trf-waterfall-expense-border-color: var(--_demica-light-blue);
    --trf-waterfall-expense-border-width: 1.5;
    --trf-waterfall-expense-text-size: 14px;

    --trf-waterfall-residual-bg: var(--_demica-gray);
    --trf-waterfall-residual-border-color: var(--_demica-light-blue);
    --trf-waterfall-residual-border-width: 1.5;
    --trf-waterfall-residual-text-size: 14px;

    --trf-waterfall-arrow-style: default;
    --trf-waterfall-arrow-color: #000;

    /* Dropdown */
    --trf-dropdown-arrow-color: var(--_demica-dark-gray);
    --trf-dropdown-border-color: var(--_demica-graphite);
    --trf-dropdown-border-radius: 2px;
    --trf-dropdown-border: 1px solid var(--_demica-graphite);
    --trf-dropdown-color: var(--_demica-graphite);
    --trf-dropdown-font-family: var(--trf-font-family-regular);
    --trf-dropdown-highlight-item-bg: rgba(110, 80, 255, 0.3);
    --trf-dropdown-highlight-item-color: var(--_demica-graphite);
    --trf-dropdown-placholder-color: var(--_demica-dark-gray);
    --trf-dropdown-selected-item-border: none;
    --trf-dropdown-selected-item-bg: rgba(110, 80, 255, 0.3);
    --trf-dropdown-selected-item-color: var(--_demica-graphite);
    --trf-dropdown-selected-item-font: var(--trf-font-family-bold);
    --trf-dropdown-disabled-color: var(--_demica-dark-gray);
    --trf-dropdown-disabled-label-color: var(--_demica-dark-gray);
    --trf-dropdown-disabled-border-color: var(--_demica-dark-gray);
    --trf-dropdown-disabled-bg: var(--_demica-gray);
    --trf-dropdown-disabled-placeholder-color: var(--trf-input-disabled-placeholder-color);

    /* Pagination*/
    --trf-pagination-bg-color: var(--_demica-gray);
    --trf-pagination-border-radius: 2px;
    --trf-pagination-border: none;
    --trf-pagination-btn-padding: 1px 6px;
    --trf-pagination-chevron-color: var(--_demica-light-blue);
    --trf-pagination-chevron-font-size: .6rem;
    --trf-pagination-chevron-margin: 5px;
    --trf-pagination-color: var(--_demica-black);
    --trf-pagination-font-size: .8rem;
    --trf-pagination-inactive-bg: var(--_demica-light-blue);
    --trf-pagination-inactive-color: var(--_demica-white);
    --trf-pagination-inactive-weight: 400;

    /* Export */
    --trf-export-alignment: center;
    --trf-button-margin: 0 1px;

    /* File status */
    --trf-file-status-green: var(--_demica-mint);
    /* Charts - line chart */
    --trf-chart-axis-display: auto;
    --trf-chart-axis-text-color: var(--_demica-dark-gray);
    --trf-chart-grid-lines-color: var(--_demica-gray);
    --trf-chart-grid-text-color: var(--_demica-dark-gray);
    --trf-chart-legend-item-font-size: .8rem;
    --trf-chart-legend-item-icon-stroke-linecap: round;
    --trf-chart-legend-item-size: 10;
    --trf-chart-legend-item-text-rotate: rotate(65deg);
    --trf-chart-pie-legend-align-content: middle;
    --trf-chart-pie-legend-bg: var(--_demica-white);
    --trf-chart-pie-legend-entry-top-margin: 10;
    --trf-chart-pie-legend-icon-radius: 10;
    --trf-chart-tick-axis-color: var(--_demica-dark-gray);
    --trf-chart-tick-axis-font-size: .7rem;
    --trf-chart-tooltip-color: var(--_demica-graphite);
    --trf-chart-tooltip-font-size: .9rem;
    --trf-chart-tooltip-header-bg: var(--_demica-dark-gray);
    --trf-chart-tooltip-header-color: var(--_demica-white);
    --trf-chart-tooltip-header-font-weight: 400;
    --trf-pie-chart-legend-text-margin-left: 15;

    /* chart-last-value-component */
    --trf-chart-last-value-component-consolidate-amount-font-family: var(--trf-font-family-regular);
    --trf-chart-last-value-component-consolidate-amount-font-size: 1.7rem;
    --trf-chart-last-value-component-consolidate-amount-value-margin: 5px 0 10px;
    --trf-chart-last-value-component-original-currency-color: var(--_demica-light-blue);
    --trf-chart-last-value-component-original-currency-font-size: .8rem;
    --trf-chart-last-value-component-user-currency-color: var(--trf-font-color);
    --trf-chart-last-value-component-user-currency-font-size: .9rem;

    /* top-debtors-component */
    --trf-top-debtors-component-border-light: none;
    --trf-top-debtors-component-border-regular: 1px solid var(--_demica-gray);
    --trf-top-debtors-component-color: var(--_demica-light-blue);
    --trf-top-debtors-component-font-size: 1rem;
    --trf-top-debtors-component-head-font-family: var(--trf-font-family-regular);
    --trf-top-debtors-component-header-padding: 0 0 10px;

    /* Modal loader */
    --trf-modal-loader-outer-bg: rgba(0, 0, 0, .5);
    --trf-modal-loader-inner-bg: var(--_demica-blue);
    --trf-modal-loader-color: var(--_demica-white);
    --trf-modal-loader-border: none;

    /* Inline loader */
    --trf-inline-loader-with-status-color: var(--_demica-light-blue);
    --trf-inline-loader-with-status-success-color: var(--_demica-mint);
    --trf-inline-loader-with-status-sub-text: var(--_demica-dark-gray);
}
