:global(.uui-theme-loveship_dark) {
    $white: #FFFFFF;
    $blue: #008ACE;
    $green: #669900;
    $amber: #D67B0B;
    $red: #CC482D;
    $cyan: #14CCCC;
    $orange: #E67E17;
    $purple: #AD14CC;
    $violet: #5214CC;

    $gray5: #FAFAFC;
    $gray10: #E1E3EB;
    $gray20: #ACAFBF;
    $gray30: #6C6F80;
    $gray40: #585B69;
    $gray50: #474A59;
    $gray60: #383B4A;
    $gray70: #303240;
    $gray80: #272833;
    $gray90: #1D1E26;

    --font-regular: 'Sans Regular', Arial, sans-serif;
    --font-semibold: 'Sans Semibold', Arial, sans-serif;
    --font-italic: 'Sans Italic', Arial, sans-serif;
    --font-primary: 'Museo Sans', 'Sans Semibold', Arial, sans-serif;
    --font-promo: 'Museo Slab', 'Roboto Slab', Arial, sans-serif;
    --font-mono: 'Roboto Mono', Arial, sans-serif;
    --font-redacted: 'Redacted';

    --accent-color: #{$green};
    --accent-light-color: #89C219;
    --accent-lightest-color: #A6D151;
    --accent-dark-color: #3E4A39;
    --accent-darkest-color: #38403B;
    --primary-color: #{$blue};
    --primary-light-color: #4BA5D1;
    --primary-lightest-color: #75B3D1;
    --primary-dark-color: #364E63;
    --primary-darkest-color: #334052;
    --secondary-color: #{$gray50};
    --secondary-light-color: #{$gray30};
    --secondary-lightest-color: #{$gray20};
    --secondary-dark-color: #{$gray60};
    --secondary-darkest-color: #{$gray70};
    --negative-color: #{$red};
    --negative-light-color: #E6674E;
    --negative-lightest-color: #F78C77;
    --negative-dark-color: #694548;
    --negative-darkest-color: #473943;

    --contrast-color: #{$white};
    --visited-color: #A171B0;
    --info-color: #{$blue};
    --info-hover-color: #{darken($blue, 5%)};
    --info-active-color: #{darken($blue, 10%)};
    --success-color: #{$green};
    --success-hover-color: #{darken($green, 5%)};
    --success-active-color: #{darken($green, 10%)};
    --warning-color: #{$amber};
    --warning-hover-color: #{darken($amber, 5%)};
    --warning-active-color: #{darken($amber, 10%)};
    --error-color: #{$red};
    --error-hover-color: #{darken($red, 5%)};
    --error-active-color: #{darken($red, 10%)};
    --icon-color: #{$gray10};
    --icon-hover-color: #{$white};
    --icon-active-color: #{$gray10};
    --secondary-hover-color: #{$gray60}; // ?
    --secondary-active-color: #{$gray70}; // ?
    --secondary-disabled-color: #{$gray40}; // ?
    --button-disabled-color: #{$gray30};
    --disabled-color: #{$gray50};
    --icon-disabled-color: #{$gray30};
    --surface-color: #{$gray80};
    --surface-hover-color: #{$gray50};
    --surface-dark-color: #{$gray90};
    --surface-light-color: #{$white};
    --divider-color: #{$gray50};
    --tag-color: #{$gray40};
    --tag-hover-color: #{$gray30};

    --text-brand-color: #{$white};
    --text-primary-color: #{$gray5};
    --text-secondary-color: #{$gray20};
    --text-disabled-color: #{$gray30};
    --text-contrast-color: #{$gray70};

    --button-bg-halftone-color: #{$gray70};
    --button-caption-disabled-color: #{$gray50};

    --input-bg-color: #{$gray70};
    --input-switch-bg-color: #{$gray30};
    --input-bg-checked-color: var(--primary-color);
    --input-bg-checked-hover-color: var(--primary-light-color);
    --input-bg-checked-disabled-color: var(--primary-dark-color);
    --input-bg-hover-color: #{$gray20};
    --input-bg-disabled-color: #{$gray60};
    --input-bg-readonly-color: #{$gray60};
    --input-border-color: #{$gray30};
    --input-border-checked-color: var(--primary-color);
    --input-border-checked-hover-color: var(--primary-light-color);
    --input-border-checked-disabled-color: var(--primary-dark-color);
    --input-border-hover-color: var(--primary-light-color);
    --input-switch-border-hover-color: #{$gray20};
    --input-textinput-border-hover-color: #{$gray20};
    --input-border-disabled-color: var(--disabled-color);
    --input-border-readonly-color: var(--disabled-color);
    --input-rest-color: var(--primary-color);
    --input-hover-color: var(--primary-light-color);
    --input-active-color: var(--primary-lightest-color);

    --input-label-color: #{$gray5};
    --input-label-disabled-color: #{$gray30};

    --input-placeholder-color: #{$gray20};
    --input-placeholder-disabled-color: #{$gray30};
    --input-text-color: #{$gray5};
    --input-text-disabled-color: #{$gray30};

    --input-icon-color: #{$gray30};
    --input-icon-disabled-color: #{$gray30};
    --input-checkbox-icon-color: #{$white};

    --skeleton-color: #{$gray40};
    --skeleton-gradient: linear-gradient(to right, #{$gray40} 0%, #{$gray10} 50%, #{$gray40} 100%) repeat;

    --overlay-color: rgba(29, 30, 38, 0.8); // ?

    --shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 4px 22px 3px rgba(0, 0, 0, 0.26);;

    // ----------------------------

    --border-radius: 3px;

    :global(.button-color-primary) {
        --button-bg-color-hover: var(--primary-light-color);
        --button-bg-color-active: var(--primary-lightest-color);
        --button-bg-color-halftone-hover: var(--primary-darkest-color);
        --button-bg-color-halftone-active: var(--primary-dark-color);
        --button-border-color: var(--primary-light-color);
        --button-border-color-hover: var(--primary-light-color);
        --button-border-color-active: var(--primary-lightest-color);
        --button-caption-halftone-color: var(--primary-light-color);
    }

    :global(.button-color-accent) {
        --button-bg-color-hover: var(--accent-light-color);
        --button-bg-color-active: var(--accent-lightest-color);
        --button-bg-color-halftone-hover: var(--accent-darkest-color);
        --button-bg-color-halftone-active: var(--accent-dark-color);
        --button-border-color: var(--accent-light-color);
        --button-border-color-hover: var(--accent-light-color);
        --button-border-color-active: var(--accent-lightest-color);
        --button-caption-halftone-color: var(--accent-light-color);
    }

    :global(.button-color-negative) {
        --button-bg-color-hover: var(--negative-light-color);
        --button-bg-color-active: var(--negative-lightest-color);
        --button-bg-color-halftone-hover: var(--negative-darkest-color);
        --button-bg-color-halftone-active: var(--negative-dark-color);
        --button-border-color: var(--negative-light-color);
        --button-border-color-hover: var(--negative-light-color);
        --button-border-color-active: var(--negative-lightest-color);
        --button-caption-halftone-color: var(--negative-light-color);
    }

    :global(.button-color-secondary) {
        --button-bg-color-hover: var(--secondary-light-color);
        --button-bg-color-active: var(--secondary-lightest-color);
        --button-bg-color-halftone-hover: var(--secondary-color);
        --button-bg-color-halftone-active: #{$gray40};
        --button-border-color: var(--secondary-lightest-color);
        --button-border-color-hover: var(--secondary-lightest-color);
        --button-border-color-active: var(--secondary-lightest-color);
        --button-caption-halftone-color: var(--secondary-lightest-color);
    }

    :global(.text-input-vars) {
        --border-color-active: var(--primary-light-color);
    }

    :global(.notification-card-color-warning) {
        --notification-card-bg-color: #{$gray70};
    }

    :global(.notification-card-color-success) {
        --notification-card-bg-color: #{$gray70};
    }

    :global(.notification-card-color-info) {
        --notification-card-bg-color: #{$gray70};
    }

    :global(.notification-card-color-error) {
        --notification-card-bg-color: #{$gray70};
    }

    :global(.notification-card-vars) {
        --notification-card-border-width: 6px 0 0;
    }

    :global(.panel-vars) {
        --panel-border-radius: 0;
    }

    :global(.modals-vars) {
        --modals-border-radius: 0;
        --modals-overlay-color: var(--overlay-color);
        --modals-shadow: 0 3px 25px 0 #0000008F, 0 1px 2px 0 #00000033;
    }

    :global(.scroll-bars-vars) {
        --scroll-bars-bg-color: #{$gray30};
        --scroll-bars-bg-color-active: #{$gray20};
    }
}
