{% set colorText = channel.ecomColorForText %}
{% set colorBg = channel.ecomColorBackground %}
{% set colorBoxes = channel.ecomColorBoxes %}
{% set footerBg = channel.ecomFooterBackgroundColor %}

<style>
    body, h1, h2, h3, h4, h5, h6 {
        {% if channel.ecomFontFamily is not empty %}
        font-family: '{{ channel.ecomFontFamily }}', sans-serif;
        {% endif %}
    }

    body {
        {% if colorBg is not empty %}
        background-color: {{ colorBg }};
        {% endif %}
    }

    .scroll-down-button {
        {% if colorText is not empty %}
        background-color: {{ colorText }};
        color: {{ channel.contrastColor(colorText) }};
        {% endif %}
    }

    .header {
        {% if colorText is not empty %}
        background-color: {{ colorText }};
        {% endif %}
    }

    .footer {
        {% if footerBg is not empty %}
        background-color: {{ footerBg }};
        {% elseif colorText is not empty %}
        background-color: {{ colorText }};
        {% endif %}
        {% if colorBoxes is not empty %}
        border-color: {{ colorBoxes }};
        {% endif %}
    }

    .filter-block,
    .category-page__products-item,
    .niclas.ecom_index .latest-products .category-page__products-item {
        {% if colorBoxes is not empty %}
        background-color: {{ colorBoxes }};
        {% endif %}
    }

    .ecom .btn-more-menu .dropdown-menu {
        {% if colorBoxes is not empty %}
        background-color: {{ colorBoxes }};
        border-color: {{ colorBoxes }};
        {% endif %}
    }

    .niclas .ecom__homepage-top-text {
        {% if colorBoxes is not empty %}
        border-color: {{ colorBoxes }};
        {% endif %}
    }
</style>