{% if link_digitavel is defined %}
  <div class="content-box full-width">

    <h4 class="text-dark-opacity bottom-padding-small">Instruções para boleto</h4>
    <p class="visible-block text-gray text-medium">Utilize o número do código de barras para realizar o pagamento do pedido.</p>

    {% if link_qrcode%}
      <img 
        class="top-padding-small"
        height="200px" 
        width="200px" 
        alt="QrCode"
        src="{{ link_qrcode }}"
      />
    {% endif%}

    <span class="visible-block text-gray text-medium text-bold top-padding-small js-copy-content text-word-wrap">{{ link_digitavel }}</span>

    {% if link_qrcode%}
      <img 
        src="{{ link_barcode }}" 
        class="top-padding-x-small full-width" 
        alt="barCode" 
        height="50px"        
      />
    {% endif%}

    <div class="flex btn-account top-margin-small search-instruction">
      <a 
        class="search-instruction btn-default btn-medium btn-neutral-black btn-account-right-margin" 
        target="_blank" 
        type="button" 
        title="Imprimir boleto"
        href="{{ link_boleto }}" 
      >
        <span>Imprimir boleto</span>
      </a>
      <button 
        class="search-instruction btn-default btn-medium btn-neutral-white js-copy-action" 
        title="Copiar código"
      >
        <span>Cópiar código</span>
      </button>
    </div>

    <span class="visible-block text-gray text-medium top-margin-medium">
      Acesse a segunda via do boleto na tela do 
      <a href="{{ link_order }}" class="text-bold">pedido</a> 
      na sua conta.
    </span>

  </div>
{% endif %}