<style>
  {# MENU, FILTERS #}
  .gogo-load-css .subcategorie-option-item:hover { background-color: {{ menuOptionHover }}; }
  .gogo-load-css #main-option-all.show-one-pane-per-main-option .gogo-icon-name-wrapper:hover:after { color: {{ primary }}; background-color: {{ menuOptionHover }} }
  .gogo-load-css .main-categories #active-main-option-background { background-color: {{ textDarkSoft }} !important; }

  .gogo-load-css .subcategorie-option-item .elements-by-category-count { background-color: {{ menuOptionHover }}; color: {{ textSoft }}; }
  .gogo-load-css .subcategorie-option-item:hover .elements-by-category-count { color: {{ primary }}; }
  .gogo-load-css .subcategorie-option-item.disabled .elements-by-category-count { background-color: transparent; color: {{ disabled }}; }

  .gogo-load-css .gogocarto-container .subcategory-item.top-separator { border-color: {{ lineBorder }}; }

  .gogo-load-css .subcategorie-option-item:hover          .subcategorie-option-checkbox + label:before { color: {{ primary }}; border-color: {{ primary }} }
  .gogo-load-css .subcategorie-option-item:not(.expanded) .option-name       .arrow-after { border-color: {{ textSoft }} transparent transparent transparent; opacity: 0.6; }
  .gogo-load-css .subcategorie-option-item:not(.expanded) .option-name:hover .arrow-after { border-color: {{ primary }} transparent transparent transparent !important; opacity: 1; }
  .gogo-load-css .subcategorie-option-item.expanded       .option-name       .arrow-after { border-color:  transparent transparent {{ neutral }} transparent; opacity: 0.6; }
  .gogo-load-css .subcategorie-option-item.expanded       .option-name:hover .arrow-after { border-color:  transparent transparent {{ primary }} transparent !important; opacity: 1; }

  .gogo-load-css .subcategorie-option-item.disabled:not(:hover) { color: {{ disabled }}; }
  .gogo-load-css .subcategorie-option-item.disabled:not(:hover) img.icon.svg { {{ disabled | to_css }}; }
  .gogo-load-css .subcategorie-option-item.disabled .subcategorie-option-checkbox + label:before { border-color: {{ disabled }}; }

  .gogo-load-css .subcategorie-option-item.disabled:not(:hover) .icon { color: {{ disabled }}; opacity: .7;}
  .gogo-load-css .subcategorie-option-item.disabled:not(:hover) .arrow-after { border-color: {{ disabled }} transparent transparent transparent !important;}

  .gogo-load-css .subcategorie-option-item.expanded.disabled .option-name .arrow-after { border-color:  transparent transparent {{ disabled }} transparent !important; }
  .gogo-load-css .subcategorie-option-item.expanded.disabled .option-name:hover .arrow-after { border-color:  transparent transparent {{ primary }} transparent !important; }

  .gogo-load-css .subcategory-item                .name-wrapper:hover { color: {{ primary }}; }
  .gogo-load-css .subcategory-item:not(.expanded) .name-wrapper       .arrow-after { border-color: {{ textSoft }} transparent transparent  transparent; opacity: 0.6; }
  .gogo-load-css .subcategory-item:not(.expanded) .name-wrapper:hover .arrow-after { border-color: {{ primary }} transparent transparent  transparent !important; opacity: 1; }
  .gogo-load-css .subcategory-item.expanded       .name-wrapper       .arrow-after { border-color:  transparent transparent {{ textSoft }} transparent; opacity: 0.6;}
  .gogo-load-css .subcategory-item.expanded       .name-wrapper:hover .arrow-after { border-color:  transparent transparent {{ primary }} transparent !important; opacity: 1; }

  .gogo-load-css .subcategory-item.disabled { color: {{ disabled }}; }
  .gogo-load-css .subcategory-item.disabled .subcategorie-checkbox + label:after { border-color: {{ disabled }} !important; }
  .gogo-load-css .subcategory-item.disabled .icon { color: {{ disabled }}; }
  .gogo-load-css .subcategory-item.disabled img.icon.svg { {{ disabled | to_css }}; }
  .gogo-load-css .subcategory-item.disabled .name-wrapper .arrow-after { border-color: {{ disabled }} transparent transparent transparent !important; }
  .gogo-load-css .subcategory-item.disabled.expanded .name-wrapper .arrow-after { border-color:  transparent transparent {{ disabled }} transparent !important;}

  .gogo-load-css .subcategory-item .checkbox-wrapper .checkbox-container .subcategorie-checkbox + label:after { color: {{ textSoft }}; background-color: {{ textSoft }} }
  .gogo-load-css .subcategorie-option-item .subcategorie-option-checkbox + label:before { border-color: {{ textSoft }}; }
  .gogo-load-css .subcategorie-option-item.disabled .subcategorie-option-checkbox + label:before { border-color: {{ disabled }}; }
  .gogo-load-css .subcategory-item .checkbox-wrapper .checkbox-container .subcategorie-checkbox:checked + label:before { border-color: {{ contentBgd }}; }

  .gogo-load-css .subcategorie-option-item .checkbox-wrapper {
    background: -moz-linear-gradient(left, {{ contentBgd.setAlpha(0.3) }} 0%, {{ contentBgd.setAlpha(0.8) }} 25%, {{ contentBgd.setAlpha(1) }} 80%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, {{ contentBgd.setAlpha(0.3) }} 0%,{{ contentBgd.setAlpha(0.8) }} 25%,{{ contentBgd.setAlpha(1) }} 80%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, {{ contentBgd.setAlpha(0.3) }} 0%,{{ contentBgd.setAlpha(0.8) }} 25%,{{ contentBgd.setAlpha(1) }} 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{{ contentBgd.setAlpha(0.3) }}', endColorstr='{{ contentBgd.setAlpha(1) }}',GradientType=1 ); /* IE6-9 */
  }

  .gogo-load-css #filter-pending { color: {{ pending }}; }
  .gogo-load-css #filter-pending .pending-checkbox + label:before { color: {{ pending }}; }
  .gogo-load-css #filter-pending .pending-checkbox:not(:checked) + label:before
  {
    background-color: transparent;
    border-color:{{ pending }};
  }

  {# AREA AND VALUE FILTER #}
  .gogo-load-css .filter-area-input-container .filter-area-input,
  .gogo-load-css .filter-value-input-container .filter-value-input {
    border: 1px solid {{ textSoft }};
  }
  .gogo-load-css .area-filter-results-container .area-filter-results-meta,
  .gogo-load-css .value-filter-results-container .area-filter-results-meta {
    color: {{ textSoft }};
  }

  {# DATE FILTER #}
  .datepicker .selected, .datepicker .selected:hover {
    background-color: {{ text }} !important;
    {% set textColor = tinycolor.mostReadable(text, [textDark, textLight]) %}
    color: {{ textColor }} !important;
    text-shadow: none !important;
  }

  {% set primaryBgTextColor = tinycolor.mostReadable(primary, [textDark, textLight]) %}
  .datepicker table tr .active, .datepicker table tr .active:hover {
    background-color: {{ primary }} !important;
    color: {{ primaryBgTextColor }} !important;
    text-shadow: none !important;
  }
  .datepicker table tr td.range { color: inherit; }

  .gogo-load-css .gogo-date-filter .view-filter[data-name=month] tbody.active .day:not(.new):not(.old),
  .gogo-load-css .gogo-date-filter .view-filter[data-name=week] tbody tr.selected-week {
    background-color: {{ primary }};
    color: {{ primaryBgTextColor }};
    text-shadow: none;
  }



</style>