.sharer {
    position: relative;
}

.sharer .share_btn {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    width: 58px;
    aspect-ratio: 1/1;
    border-radius: 100%;
    box-shadow: 0px 4px 8px -1px rgba(17, 8, 0, 0.04);
    filter: drop-shadow(0px 2px 4px rgba(17, 8, 0, 0.04)) drop-shadow(0px 1px 2px rgba(17, 8, 0, 0.04));
    text-decoration: none;
}

.sharer .main {
    position: relative;
}

.sharer .share_img {
    height: 26px;
    width: 26px;
    object-fit: contain;
}

.sharer .links {
    display: flex;
    gap: 10px;
    align-items: center;
    position: absolute;
    top: 0;
    padding-right: 68px;
    z-index: 1;
    right: 0;
    pointer-events: none;
}

.sharer .links:hover {
    pointer-events: all;
}

.sharer .share_link {
    opacity: 0;
    pointer-events: none;
    transition: 0.2s opacity;
}

.sharer .links:hover .share_link {
    opacity: 1;
    pointer-events: all;
}

.sharer:has(.main:hover) .links {
    opacity: 1;
    pointer-events: all;
}

