/* Floating messengers */
.ms-float-messengers {
    position: fixed;
    left: 20px;
    bottom: 80px;
    z-index: 9999;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 12px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px);
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
}

.ms-float-messengers.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.ms-float-toggle,
.ms-float-messenger {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    border: 0;
    outline: 0;
    text-decoration: none;
    cursor: pointer;
    background: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
    -webkit-tap-highlight-color: transparent;
}

.ms-float-toggle {
    position: relative;
    background: linear-gradient(180deg, #4d95fc 0%, #276bd9 100%);
    color: #fff;
}

.ms-float-toggle-icon {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: currentColor;
    transition: opacity .18s ease, transform .18s ease;
}

.ms-float-toggle-icon-close {
    opacity: 0;
    transform: scale(.82) rotate(-18deg);
}

.ms-float-messengers.is-open .ms-float-toggle-icon-open {
    opacity: 0;
    transform: scale(.82) rotate(18deg);
}

.ms-float-messengers.is-open .ms-float-toggle-icon-close {
    opacity: 1;
    transform: scale(1) rotate(0);
}

.ms-float-messengers-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.ms-float-messengers.is-open .ms-float-messengers-list {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.ms-float-toggle:hover,
.ms-float-toggle:focus-visible,
.ms-float-messenger:hover,
.ms-float-messenger:focus-visible {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .22);
}

.ms-float-toggle:focus-visible,
.ms-float-messenger:focus-visible {
    box-shadow: 0 0 0 4px rgba(0, 136, 204, .18), 0 12px 30px rgba(0, 0, 0, .22);
}

.ms-float-imo { background: #0066cc; }
.ms-float-whatsapp { background: #25d366; }

.ms-float-toggle-icon svg,
.ms-float-imo svg,
.ms-float-whatsapp svg {
    display: block;
    width: 32px;
    height: 32px;
    color: #fff;
}

@media only screen and (max-width: 1021px) {
    .ms-float-toggle-icon svg, .ms-float-imo svg, .ms-float-whatsapp svg {
        display: block;
        width: 22px;
        height: 22px;
        color: #fff;
    }		
    }

.ms-float-telegram svg {
    width: 100%;
    height: 100%;
}

.ms-float-max img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.ms-messenger-hint {
    position: absolute;
    left: 80px;
    top: 50%;
    transform: translateY(-50%);
    text-transform: none;
    letter-spacing: normal;
    white-space: nowrap;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: 500;
    color: #1c1c1c;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}

.ms-float-messenger:hover .ms-messenger-hint,
.ms-float-messenger:focus-visible .ms-messenger-hint,
.ms-float-toggle-hint {
    opacity: 1;
}

.ms-messenger-hint::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    border: 6px solid transparent;
    border-right-color: #fff;
}

@media (max-width: 480px) {
    .ms-float-messengers { left: 14px; bottom: 25px; gap: 10px; }
    .ms-float-toggle,
    .ms-float-messenger { width: 48px; height: 48px; }
    .ms-messenger-hint { left: 60px; font-size: 12px; padding: 4px 8px; }
}

@media (prefers-reduced-motion: reduce) {
    .ms-float-messengers,
    .ms-float-messengers-list,
    .ms-float-toggle,
    .ms-float-toggle-icon,
    .ms-float-messenger,
    .ms-messenger-hint { transition: none; }
}