{% set placeholder_logo = img_path ~ '/circle-gray-20.svg' %}

<div class="usa-identifier">
  <section
    class="usa-identifier__section usa-identifier__section--masthead"
    aria-label="{{ masthead.aria_label }}">
    <div class="usa-identifier__container">
      {%- if masthead.parent.logo or masthead.agency.logo -%}
        <div class="usa-identifier__logos">
          <a href="{{ masthead.parent.url }}" class="usa-identifier__logo">
            <img
              class="usa-identifier__logo-img"
              src="{{ masthead.parent.logo|default(placeholder_logo) }}"
              alt="{{ masthead.parent.name |e }} logo"
              role="img">
          </a>
          {%- if masthead.agency.logo %}
            <a href="javascript:void(0);" class="usa-identifier__logo">
              <img
                class="usa-identifier__logo-img"
                {% if masthead.agency.logo %}
                src="{{ masthead.agency.logo|default(placeholder_logo) }}"
                {% endif %}
                alt="{{ masthead.agency.name |e }} logo"
                role="img">
            </a>
          {%- endif -%}
        </div>
      {%- endif -%}
      <section class="usa-identifier__identity" aria-label="{{ masthead.description }}">
        <p class="usa-identifier__identity-domain">{{ domain }}</p>
        <p class="usa-identifier__identity-disclaimer">
        {% if masthead.content_prefix %}
            <span aria-hidden="true">
              {{ masthead.content_prefix }}
            </span>
          {% endif %}
          {{ masthead.content }}
          <a href="{{ placeholder_link }}">{{ masthead.parent.name |e }}</a>
          {% if masthead.agency.url %}
            {{ (lang == "es") ? "y" : "and" }}
          {% endif %}
          {% if masthead.agency.name or masthead.agency.shortname %}
            {{ (lang == "en") ? "the" : ""}}
          {%- endif %}
          {% if mashead.agency.name or masthead.agency.shortname %}
            <a href="{{ masthead.agency.url | default(placeholder_link) }}">
              {% if masthead.agency.name -%}
                {{ masthead.agency.name |e }}
              {% else %}
                {{ masthead.agency.shortname |e }}
              {%- endif -%}
            </a>
          {% endif %}
          {% if masthead.taxpayer_disclaimer.display %}
          . {{ masthead.taxpayer_disclaimer.content }}
          {%- endif -%}
        </p>
      </section>
    </div>
  </section>
  <nav class="usa-identifier__section usa-identifier__section--required-links" aria-label="{{ required_links.aria_label }}">
    <div class="usa-identifier__container">
      <ul class="usa-identifier__required-links-list">
        {% for link in required_links.links %}
          <li class="usa-identifier__required-links-item">
            <a href="{{ link.url }}" class="usa-identifier__required-link usa-link">
              {{ link.label }} {{ link.include_shortname ? masthead.parent.shortname |e }}
            </a>
          </li>
        {% endfor %}
      </ul>
    </div>
  </nav>
  {% if usagov.display %}
  <section class="usa-identifier__section usa-identifier__section--usagov" aria-label="{{ usagov.aria_label }}">
    <div class="usa-identifier__container">
      <div class="usa-identifier__usagov-description">{{ usagov.description }}</div>
      <a href="{{ usagov.link.url }}" class="usa-link">{{ usagov.link.label }}</a>
    </div>
  </section>
  {% endif -%}
</div>
