.search::before{
  content:"";
  position:absolute;
  left:14px;
  top:50%;
  width:20px;
  height:20px;
  transform:translateY(-50%);
  pointer-events:none;
  background:center/20px 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='6.5' fill='none' stroke='%237F8790' stroke-width='2'/%3E%3Cpath d='M16 16l4.2 4.2' fill='none' stroke='%237F8790' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.share{
  appearance:none;
  width:30px;
  height:30px;
  padding:0;
  border:0;
  border-radius:0;
  display:inline-grid;
  place-items:center;
  vertical-align:middle;
  background:transparent;
  color:#59636C;
  font-size:0;
  line-height:0;
  box-shadow:none;
}
.share::before{
  content:"";
  width:20px;
  height:20px;
  display:block;
  background:center/20px 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 2 15 22 11 13 2 9 22 2Z' fill='none' stroke='%2359636C' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M22 2 11 13' fill='none' stroke='%2359636C' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}
.share:hover::before,
.share:focus-visible::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 2 15 22 11 13 2 9 22 2Z' fill='none' stroke='%230081FB' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M22 2 11 13' fill='none' stroke='%230081FB' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}
.share:hover,
.share:focus-visible{
  background:transparent;
  outline:none;
}
.share:focus-visible{
  border-radius:8px;
  box-shadow:0 0 0 3px rgba(0,129,251,.16);
}

.post-caption{
  position:relative;
  padding-right:52px;
}
.post-caption .share{
  position:absolute;
  right:14px;
  bottom:12px;
  margin:0;
}
.modal-body>.share{
  display:grid;
  margin:8px 0 14px auto;
  width:34px;
  height:34px;
}

@media(max-width:620px){
  .search::before{
    left:13px;
    top:50%;
    transform:translateY(-50%);
  }
  .post-caption{
    padding-right:48px;
  }
  .post-caption .share{
    right:12px;
    bottom:11px;
    width:28px;
    height:28px;
  }
  .share::before{
    width:19px;
    height:19px;
    background-size:19px 19px;
  }
}