<turbo-stream action="update" target="remote_modal"><template>
  <turbo-frame id="remote_modal">
  <div class="modal fade" data-controller="modal"
       data-action="turbo:submit-end->modal#submitEnd keyup@window->modal#closeWithKeyboard click@window->modal#closeBackground">
    <div class="modal-dialog modal-lg">
      <div class="modal-content rounded-0 border shadow-sm position-relative" style="border-width: 10px !important; border-color: #C0C0C0 !important;">
        <button type="button" class="btn-close btn-sm position-absolute top-0 end-0 m-2" data-bs-dismiss="modal" aria-label="Close" style="z-index: 1050;"></button>
        <div class="modal-body remote_modal_body " id="remote_modal_body">
          
    <div class="p-2">
  <p class="mb-4">
    Share this beautiful piece with someone special. They'll receive an email with a link to view this item.
  </p>

  <form action="/share?id=45345" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="LFN4eaW1Df19_k29HvkTWwVNdzTVCGI8zDSKaSBmkiNtXmiPGIZRzctzxg9Ow8pqqPLhgGS0L4WPzKLBq3Ff8g" autocomplete="off" />

    <div class="mb-3">
      <label class="form-label" for="tell_friend_address">
        <span class="text-danger">*</span> Recipient Email(s)
        <small class="text-muted">(up to 10 email addresses separated by commas)</small>
</label>      <input class="form-control" placeholder="friend@example.com, another@example.com" required="required" type="text" name="tell_friend[address]" id="tell_friend_address" />
      <div class="invalid-feedback">
        Please provide at least one valid email address.
      </div>
    </div>

    <div class="mb-3">
      <label class="form-label" for="tell_friend_name">
        <span class="text-danger">*</span> Your Name
</label>      <input class="form-control" placeholder="Your name" required="required" type="text" value="" name="tell_friend[name]" id="tell_friend_name" />
      <div class="invalid-feedback">
        Please provide your name.
      </div>
    </div>

    <div class="mb-3">
      <label class="form-label" for="tell_friend_email">
        <span class="text-danger">*</span> Your Email Address
</label>      <input class="form-control" placeholder="your@example.com" required="required" type="email" value="" name="tell_friend[email]" id="tell_friend_email" />
      <div class="invalid-feedback">
        Please provide a valid email address.
      </div>
    </div>

    <div class="mb-3">
      <label class="form-label" for="tell_friend_message">
        Your Message <small class="text-muted">(optional)</small>
</label>      <textarea class="form-control" rows="4" placeholder="Add a personal message..." name="tell_friend[message]" id="tell_friend_message">
</textarea>
    </div>

    <div class="d-flex gap-3 justify-content-center">
      <input type="submit" name="commit" value="SEND" class="btn btn-secondary px-4" data-disable-with="SEND" />
      <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
    </div>
</form>
  <div class="mt-3 small text-muted">
    <span class="text-danger">*</span> = required field
    <br>
    The email addresses provided above will not be collected or used for any other purpose.
    Please see our privacy policy.
  </div>
</div>



        </div>
      </div>
    </div>
  </div>
</turbo-frame></template></turbo-stream>