/* בלי ריבוע סביב לחצן בנגיעה. במקלדת הלחצן עדיין מסומן. */
.cs a, .cs button, .cs-share a, .cs-share button, .cs-roll-btns a { -webkit-tap-highlight-color: transparent; }
.cs a:focus, .cs a:active, .cs-share a:focus, .cs-share button:focus, .cs-roll-btns a:focus { outline: 0; }
.cs-btn a:focus-visible .cs-ic, .cs-call:focus-visible, .cs-share a:focus-visible, .cs-share button:focus-visible { box-shadow: 0 0 0 3px rgba(255, 255, 255, .7); }

/* לחצן השיתוף של הכרטיס: מסילה שנפתחת כלפי מטה */
.cs-share { position: fixed; top: calc(14px + env(safe-area-inset-top, 0px)); left: 12px; z-index: 7; width: 38px; direction: ltr; }
.cs-share-toggle { display: block; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .6); box-shadow: 0 0 0 4px rgba(0, 0, 0, .15); color: #fff; font-size: 15px; line-height: 38px; text-align: center; cursor: pointer; transition: transform .35s ease-in-out; }
.cs-share-toggle:hover, .cs-share.is-open .cs-share-toggle { transform: scale(1.25); transition-duration: .15s; }
.cs-share-rail { position: absolute; top: 52px; left: 0; width: 38px; display: grid; gap: 7px; }
.cs-share-rail a, .cs-share-rail button { position: relative; display: block; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .6); color: #fff; font-size: 17px; line-height: 38px; text-align: center; text-decoration: none; cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .3s, visibility 0s linear .3s; }
.cs-share-rail > :nth-child(2) { transition-delay: .075s, .375s; animation-delay: .075s; }
.cs-share-rail > :nth-child(3) { transition-delay: .15s, .45s; animation-delay: .15s; }
.cs-share-rail > :nth-child(4) { transition-delay: .225s, .525s; animation-delay: .225s; }
.cs-share-rail > :nth-child(5) { transition-delay: .3s, .6s; animation-delay: .3s; }
.cs-share.is-open .cs-share-rail a, .cs-share.is-open .cs-share-rail button { visibility: visible; animation-name: cs-share-in; animation-duration: .4s; animation-timing-function: ease-out; animation-fill-mode: both; transform: none; opacity: 1; }
@keyframes cs-share-in {
    0% { opacity: 0; transform: translateY(10px); }
    60% { opacity: 1; transform: translateY(-12px); }
    100% { opacity: 1; transform: translateY(0); }
}
.cs-share-wa:hover { background: #25d366; }
.cs-share-fb:hover { background: #3b5998; }
.cs-share-tw:hover { background: #00aced; }
.cs-share-in:hover { background: #0077b5; }
.cs-share-copy:hover, .cs-share-copy.is-done { background: #25d366; }
@media (prefers-reduced-motion: reduce) {
    .cs-share-toggle, .cs-share-rail a, .cs-share-rail button { transition: none; animation: none !important; }
}
