/* Smart Social Contact frontend */
.ssc-floating-contact {
    position: fixed !important;
    bottom: calc(var(--ssc-desktop-bottom, var(--ssc-bottom, 30px)) + env(safe-area-inset-bottom, 0px)) !important;
    z-index: var(--ssc-z-index, 99999) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    font-family: inherit;
    isolation: isolate;
    pointer-events: none; /* Keep the floating wrapper from blocking the page; controls opt back in. */
}
.ssc-floating-contact.ssc-position-right { right: calc(var(--ssc-desktop-side, var(--ssc-side, 30px)) + env(safe-area-inset-right, 0px)) !important; left: auto !important; }
.ssc-floating-contact.ssc-position-left { left: calc(var(--ssc-desktop-side, var(--ssc-side, 30px)) + env(safe-area-inset-left, 0px)) !important; right: auto !important; }

.ssc-floating-contact .ssc-main-button {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 3 !important;
    pointer-events: auto !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    -webkit-user-select: none;
    width: var(--ssc-button-size, 60px) !important;
    height: var(--ssc-button-size, 60px) !important;
    min-width: var(--ssc-button-size, 60px) !important;
    min-height: var(--ssc-button-size, 60px) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    outline-offset: 4px;
    background: var(--ssc-button-color, #25D366) !important;
    color: var(--ssc-icon-color, #fff) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: var(--ssc-button-icon-size, 26px) !important;
    line-height: 1 !important;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(0,0,0,.22);
    transition: transform var(--ssc-speed, 300ms) ease, background-color var(--ssc-speed, 300ms) ease;
    appearance: none;
    -webkit-appearance: none;
}
.ssc-floating-contact .ssc-main-button > *,
.ssc-floating-contact .ssc-main-button::before,
.ssc-floating-contact .ssc-main-button::after { pointer-events: none !important; }
.ssc-floating-contact .ssc-main-button i { color: inherit !important; font-size: inherit !important; line-height: 1 !important; pointer-events: none !important; }
.ssc-floating-contact .ssc-main-button:hover { transform: scale(1.06); }
.ssc-floating-contact .ssc-main-button:focus-visible,
.ssc-floating-contact .ssc-contact-item:focus-visible { outline: 3px solid #2271b1; outline-offset: 3px; }

.ssc-floating-contact .ssc-contact-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--ssc-contact-gap, 12px);
    margin: 0;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(14px);
    transition: opacity var(--ssc-speed, 300ms) ease, transform var(--ssc-speed, 300ms) ease, visibility var(--ssc-speed, 300ms) ease;
}
.ssc-floating-contact.ssc-open .ssc-contact-list {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
.ssc-floating-contact .ssc-contact-item {
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    pointer-events: auto;
    touch-action: manipulation;
    /* Background grows with the configured social icon size. */
    width: var(--ssc-contact-size, 48px);
    height: var(--ssc-contact-size, 48px);
    min-width: var(--ssc-contact-size, 48px);
    min-height: var(--ssc-contact-size, 48px);
    flex: 0 0 var(--ssc-contact-size, 48px);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ssc-contact-color, #333) !important;
    color: var(--ssc-contact-icon-color, var(--ssc-icon-color, #fff)) !important;
    text-decoration: none !important;
    font-size: var(--ssc-icon-size, 24px);
    line-height: 1;
    box-shadow: 0 3px 12px rgba(0,0,0,.20);
    transition: width var(--ssc-speed, 300ms) ease, height var(--ssc-speed, 300ms) ease, transform var(--ssc-speed, 300ms) ease, background-color var(--ssc-speed, 300ms) ease, color var(--ssc-speed, 300ms) ease;
}
.ssc-floating-contact .ssc-contact-item i { color: inherit !important; font-size: inherit !important; line-height: 1 !important; }
.ssc-floating-contact .ssc-contact-item:hover {
    background: var(--ssc-contact-hover-color, #222) !important;
    color: var(--ssc-contact-hover-icon-color, #fff) !important;
    transform: scale(1.1);
}
.ssc-floating-contact.ssc-animation-fade .ssc-contact-list { transform: none; }
.ssc-floating-contact.ssc-animation-none .ssc-contact-list { transition: none; }
.ssc-floating-contact.ssc-hide-mobile { }
.ssc-floating-contact.ssc-hide-desktop { }
@media (max-width: 767px) {
    .ssc-floating-contact { bottom: calc(var(--ssc-mobile-bottom, var(--ssc-bottom, 28px)) + env(safe-area-inset-bottom, 0px)) !important; }
    .ssc-floating-contact.ssc-position-right { right: calc(var(--ssc-mobile-side, var(--ssc-side, 22px)) + env(safe-area-inset-right, 0px)) !important; }
    .ssc-floating-contact.ssc-position-left { left: calc(var(--ssc-mobile-side, var(--ssc-side, 22px)) + env(safe-area-inset-left, 0px)) !important; }
    .ssc-floating-contact.ssc-hide-mobile { display: none !important; }
}
@media (min-width: 768px) { .ssc-floating-contact.ssc-hide-desktop { display: none !important; } }
@media (prefers-reduced-motion: reduce) {
    .ssc-floating-contact *, .ssc-floating-contact *::before, .ssc-floating-contact *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}