<img class="offer-item__header-img" src={{offer.detail.locationUrl}}>
<h4>{{trusted-unsafe-attribute offer.offerTitle}}</h4>
<p>{{offer.applicableGame}} {{offer.categories}}</p>
<p>{{offer.publisherName}}</p>
<div class="offer-item__instructions">
  {{#liquid-if (and hasPrime (xor hasCode hasClaimedOffer)) use='fade'}}
    {{#if hasCode}}
      {{copyable-item
        text=code
        isCopied=isCopied
        success=(action 'success')
        error=(action 'error')}}
    {{else}}
      <h5 class="full-width align-center">
        {{svg-icon path='svg/check' class='offer-item__instructions--check'}}
        {{i18n 'Added to your Twitch Account'}}
      </h5>
    {{/if}}

    <div class="offer-item__ci pd-b-2" data-test-offer-claim-instruction>
      <p>{{trusted-unsafe-attribute contentClaimInstruction}}</p>
    </div>
  {{else if hasPrime}}
    {{#if (not isClaimingOffer)}}
      <button class="button primary button-block" type="button" {{action 'claimOffer'}}>{{buttonText}}</button>
    {{else}}
      <div class="align-center">
        <img src={{spinnerImage}} class="loading js-spinner">
      </div>
    {{/if}}

    <div class="offer-item__ci pd-b-2">
      <p>{{trusted-unsafe-attribute offer.offerDescription}}</p>
    </div>
  {{/liquid-if}}

  {{#if (eq hasPrime false)}}
    <div class='offer-item__upsell-header'>
      <h4>{{i18n 'Claim with Twitch Prime'}}</h4>
    </div>
    <div class='offer-item__upsell-body'>
      <p>{{i18n 'Get free game loot like this every month plus surprises, ad-free viewing, free monthly channel subscription, and loads more, all included with Amazon Prime.'}}</p>
      <div class='align-center mg-t-1'>
        <a class='button primary' href={{landingHref}}  target='_blank' rel="noopener noreferrer">
          {{i18n 'Start 30-day Free Trial'}}
        </a>
      </div>
      <p>{{i18n 'Already an Amazon Prime member? You get Twitch Prime at no additional cost, just'}}</p>
      <p><a href={{linkingHref}} target='_blank' rel="noopener noreferrer">{{i18n 'connect your Twitch account'}}</a></p>
    </div>
  {{/if}}
</div>
