.nw-docshare-button {
  border: 0;
  padding: 10px;
  font-size: $favnshare-relmainicon-fontsize;
  color: $favnshare-docshareicon-color;

  &.is-relative {
    padding: 15px 10px;
  }

  &.is-absolute {
    box-shadow: 5px 2px 8px 1.2px rgba(0, 0, 0, 0.2);
    width: 100%;
    background: $favnshare-absmainbutton-bg;
    font-size: $favnshare-absmainicon-fontsize;
  }
}

.nw-docshare-list {
  display: none;

  &.has-shadow {
    box-shadow: 5px 2px 8px 1.2px rgba(0, 0, 0, 0.2);
  }

  &.is-relative {
    position: fixed;
    z-index: 1;
  }

  &.is-absolute {
    flex-direction: column;
  }

  &.is-active {
    display: flex;
  }
}

.nw-docshare-listitem {
  @extend %nwc-centeralign-items;
  padding: 15px;
  background: $favnshare-absmainbutton-bg;

  &.is-absolute {
    width: 100%;
    padding: 10px;

  }
}


.nw-favnshare-fbshare {
  border: 0;
  color: $favnshare-fblogo-color;
}

.nw-favnshare-twittershare {
  color: $favnshare-twitterlogo-color;
}

.nw-favnshare-pinterestshare {
  color: $favnshare-pinterestlogo-color;
}

.nw-favnshare-whatsappshare {
  color: $favnshare-whatsapplogo-color;
}

.nw-favnshare-sharemobile {
  .nwc-modal {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 300px;
    height: 300px;
    contain: layout;
  }

  .nwc-modal-children {
    padding: 0;
  }
}

.nw-favnshare-sharemobile-enclose {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  display: flex;
}

.nw-favnshare-sharemobileitem {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  border: 0;
  border-bottom: 1px solid darken($concrete, 3);
  border-right: 1px solid darken($concrete, 3);
  width: 50%;
  height: 150px;
  padding: 0;
  text-decoration: none;

  &.disabled {
    opacity: 0.4 !important;
    border: 0 !important;
    border-bottom: 1px solid darken($concrete, 3) !important;
    border-right: 1px solid darken($concrete, 3) !important;
    pointer-events: none;
  }
}

.nw-favnshare-sharemobilelogo {
  font-size: $pdp-mobile-share-icon-size;

  &.fb {
    color: $favnshare-fblogo-color;
  }

  &.twitter {
    color: $favnshare-twitterlogo-color;
  }

  &.pinterest {
    color: $favnshare-pinterestlogo-color;
  }

  &.copy {
    color: $favnshare-copylogo-color;
  }

  &.whatsapp {
    color: $favnshare-whatsapplogo-color;
  }
}

.nw-favnshare-fbsharemobiletext {
  padding-top: 20px;
  font-size: $font-size-xxs;
  font-weight: 600;
  color: $default-color;
}