<style>
  {# ELEMENT INFO #}
  .gogo-load-css .gogocarto-container #element-info-bar.display-aside { background-color: {{ contentBackgroundElementBody }}; }

  @media (max-width: 700px) {
    .gogo-load-css .collapsible-header .expand-label { color: {{ primary }}; }
  }
  .gogo-load-css .collapsible-header .expand-label { color: {{ text }}; }
  .gogo-load-css .collapsible-header:hover .expand-label { color: {{ primary }}; }

  .gogo-load-css .interactive-section { background-color: {{ interactiveColor }}; }

  {% if config.colors.infoBarMenu %}
    .gogo-load-css .gogocarto-container .element-item .menu-element { background-color: {{ config.colors.infoBarMenu }}; }
    .gogo-load-css .gogocarto-container #element-info-bar .element-item.active .expand-label.transform-big { background-color: {{ config.colors.infoBarMenu }}; }
  {% endif %}
  {% if config.colors.infoBarHeader %}
    {% set textColor = tinycolor.mostReadable(config.colors.infoBarHeader, [textDark, textLight]) %}
    .gogo-load-css .gogocarto-container #element-info-bar.display-aside .element-item .collapsible-header { background-color: {{ config.colors.infoBarHeader }}; color: {{ textColor }} }
  {% endif %}

  .gogo-load-css .gogocarto-container #directory-content-list .element-item .collapsible-header,
  .gogo-load-css #element-info-bar.display-bottom .collapsible-header {
    background-color: {{ contentBgd }};
    border-color: {{ lineBorder }};
    color: {{ text }};
  }

  .gogo-load-css .field-taxonomy .option-value .gogo-icon-external-link { color: {{ text }}; opacity: .5; }
  .gogo-load-css .field-taxonomy .option-value:hover .gogo-icon-external-link { color: inherit; opacity: 1 !important; }

  {# ELEMENT INFO BAR #}
  .gogo-load-css #element-info-bar.display-bottom .element-item .collapsible-header { border-color: {{ lineBorder }} }
  .gogo-load-css .gogocarto-container .element-item .info-bar-divider { background-color: {{ lineBorder }}; }
  .gogo-load-css .gogocarto-container .element-item .collapsible-body { background-color: {{ contentBackgroundElementBody }}; }
  .gogo-load-css .gogocarto-container .element-item .collapsible-body-main-content { background-color: {{ contentBackgroundElementBody }}; }


  .gogo-load-css .tabs.info-bar-tabs {
    background-color: {{ textDark }};
  }
  .gogo-load-css .tabs.info-bar-tabs .indicator {
    bottom: 0;
    top: initial;
    background-color: {{ textSoft }};
  }
  .gogo-load-css .glossary {
    border-bottom: 1px dashed {{ textSoft }};
  }
</style>