/*! RTL build of share.css — generated by .claude/rtl-flip.php */
@media (min-width: 992px) {
    .share-drop {
        display:block!important
    }
}

@media (max-width: 991px) {
    html.sl .share-btn,html:not(.sl) .share-drop {
        display:block!important
    }
}

.share-drop {
    position: relative
}

.share-drop .share-btn {
    margin-bottom: 0
}

.share-dropbox {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 99;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
    background-color: rgba(var(--share-drop-bg),.9);
    padding: 16px;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 28px;
    box-shadow: var(--share-drop-shadow);
    transition: transform .2s ease,opacity .2s ease
}

.share-dropbox::before {
    content: attr(title);
    display: block;
    text-align: center;
    margin-bottom: 8px;
    font-size: var(--text-sm-size);
    text-transform: uppercase;
    font-weight: 700;
    opacity: .5
}

.share-drop .trigger-action:checked~.share-dropbox {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all
}

.share-drop .trigger-action:checked~.share-btn {
    color: var(--color-primary)
}

.share-list {
    display: flex
}

.share-item {
    padding: 12px;
    width: 48px;
    height: 48px;
    position: relative;
    z-index: 1;
    border-radius: 50%;
    transition: box-shadow .2s ease
}

.share-tg {
    --share-color: var(--color-blue)
}

.share-fb {
    --share-color: #0766FF
}

.share-wa {
    --share-color: var(--color-primary)
}

.share-x {
    --share-color: var(--color-text)
}

.share-pinterest {
    --share-color: var(--color-red)
}

.share-item::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: inherit;
    height: inherit;
    border-radius: inherit;
    z-index: -1;
    box-shadow: inset 0 0 0 1px var(--share-color);
    transform: scale(1.1);
    opacity: 0;
    transition: opacity .2s ease,transform .2s ease
}

.share-item:hover::after {
    transform: scale(1);
    opacity: .3
}

.share-item:active::after {
    transform: scale(.95);
    opacity: .5
}

.share-item+.share-item {
    margin-right: 4px
}

.share-icon {
    display: block;
    width: 24px;
    padding-top: 24px;
    height: 0;
    overflow: hidden;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    background-color: var(--share-color)
}

.share-tg .share-icon {
    mask-image: url(../images/share-tg.svg);
    -webkit-mask-image: url(../images/share-tg.svg)
}

.share-fb .share-icon {
    mask-image: url(../images/share-fb.svg);
    -webkit-mask-image: url(../images/share-fb.svg)
}

.share-wa .share-icon {
    mask-image: url(../images/share-wa.svg);
    -webkit-mask-image: url(../images/share-wa.svg)
}

.share-x .share-icon {
    mask-image: url(../images/share-x.svg);
    -webkit-mask-image: url(../images/share-x.svg)
}

.share-pinterest .share-icon {
    mask-image: url(../images/share-pin.svg);
    -webkit-mask-image: url(../images/share-pin.svg)
}
