#sw-widget {
    position: fixed;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    width: max-content;
    max-width: calc(100vw - 24px);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
#sw-widget[data-position="left"] { align-items: flex-start; }

.sw-launcher {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
    width: max-content;
    max-width: 100%;
    flex-wrap: nowrap;
}
#sw-widget[data-position="left"] .sw-launcher {
    flex-direction: row-reverse;
    justify-content: flex-start;
}

/* Toggle button */
.sw-toggle {
    position: relative;
    width: 60px; height: 60px;
    border-radius: 16px; border: none;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0,0,0,.18);
    cursor: pointer;
    padding: 0;
    box-sizing: border-box;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
    flex-shrink: 0;
}
.sw-toggle:hover  { transform: scale(1.06); box-shadow: 0 6px 24px rgba(0,0,0,.22); }
.sw-toggle:active { transform: scale(0.97); }

/* Carousel */
.sw-carousel {
    position: relative;
    width: 46px; height: 46px; display: block;
}
.sw-slide {
    position: absolute; top:50%; left:50%;
    width: 46px; height: 46px;
    display: flex; align-items: center; justify-content: center;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: opacity .4s ease;
    pointer-events: none;
}
.sw-slide.active { opacity: 1; }
.sw-slide img { width: 46px; height: 46px; display: block; object-fit: contain; }

/* Slide anim variant */
.sw-anim-slide .sw-slide { transform: translate(-50%, calc(-50% + 8px)); transition: opacity .35s ease, transform .35s ease; }
.sw-anim-slide .sw-slide.active { opacity:1; transform: translate(-50%, -50%); }

/* Close icon */
.sw-close-icon {
    position: absolute; top:0; left:0; width:100%; height:100%;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; color: #555;
    opacity: 0; transition: opacity .25s ease; pointer-events: none;
}
.sw-toggle.is-open .sw-carousel   { opacity:0; pointer-events:none; }
.sw-toggle.is-open .sw-close-icon { opacity:1; }

/* Messenger list */
.sw-list {
    display: flex; flex-direction: column; gap: 8px;
    pointer-events: none;
    align-items: flex-end;
}
#sw-widget[data-position="left"] .sw-list { align-items: flex-start; }

.sw-item {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,.15);
    padding: 8px 14px 8px 8px;
    text-decoration: none; color: #222;
    font-size: 13px; font-weight: 500; white-space: nowrap;
    opacity: 0;
    transform: translateY(10px) scale(.95);
    transition: opacity .22s ease var(--sw-delay,0ms),
                transform .22s ease var(--sw-delay,0ms),
                box-shadow .15s ease;
    pointer-events: none;
}
.sw-item:hover { box-shadow:0 4px 18px rgba(0,0,0,.2); }
.sw-no-labels .sw-item {
    width: 60px;
    height: 60px;
    padding: 7px;
    box-sizing: border-box;
    border-radius: 16px;
    align-items: center;
    justify-content: center;
}

.sw-item-icon { width:32px; height:32px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.sw-item-icon img { width:32px; height:32px; display:block; object-fit:contain; }
.sw-no-labels .sw-item-icon,
.sw-no-labels .sw-item-icon img {
    width: 46px;
    height: 46px;
}

.sw-list.is-open               { pointer-events:auto; }
.sw-list.is-open .sw-item      { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }

/* Bubble */
.sw-bubble {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border-radius: 18px 18px 0 18px;
    box-shadow: 0 3px 16px rgba(0,0,0,.16);
    padding: 10px 18px;
    font-size: var(--sw-bubble-font-size, 15px); color: #333; max-width: min(420px, calc(100vw - 104px)); line-height: 1.3;
    white-space: nowrap;
    flex-shrink: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 20px;
    animation: sw-bubble-in .35s cubic-bezier(.34,1.56,.64,1) both;
}
#sw-widget[data-position="left"] .sw-bubble {
    border-radius: 18px 18px 18px 0;
    margin-right: 0;
}

@keyframes sw-bubble-in {
    from { opacity:0; transform:scale(.85) translateY(6px); }
    to   { opacity:1; transform:scale(1)   translateY(0); }
}

@media (max-width:600px) {
    .sw-toggle { width:60px; height:60px; }
    .sw-carousel,
    .sw-slide { width:46px; height:46px; }
    .sw-slide img { width:46px; height:46px; }
    .sw-bubble {
        max-width: calc(100vw - 92px);
        padding: 9px 14px;
    }
    .sw-item   { padding:7px 12px 7px 7px; }
    .sw-no-labels .sw-item { padding:7px; }
}