.pfc-wrap,
.pfc-wrap * {
    box-sizing: border-box;
}

.pfc-wrap {
    --pfc-main: #e60000;
    --pfc-icon: #fff;
    --pfc-panel: #fff;
    --pfc-text: #1f2937;
    --pfc-bottom: 28px;
    --pfc-side: 24px;
    --pfc-z: 99999;
    position: fixed;
    isolation: isolate;
    bottom: calc(var(--pfc-bottom) + env(safe-area-inset-bottom, 0px));
    z-index: var(--pfc-z);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    font-family: inherit;
    direction: rtl;
}

.pfc-position-right { right: calc(var(--pfc-side) + env(safe-area-inset-right, 0px)); }
.pfc-position-left { left: calc(var(--pfc-side) + env(safe-area-inset-left, 0px)); }

.pfc-size-small { --pfc-button-size: 48px; --pfc-icon-size: 21px; --pfc-item-icon: 38px; --pfc-font-size: 12px; }
.pfc-size-medium { --pfc-button-size: 58px; --pfc-icon-size: 25px; --pfc-item-icon: 42px; --pfc-font-size: 13px; }
.pfc-size-large { --pfc-button-size: 68px; --pfc-icon-size: 29px; --pfc-item-icon: 48px; --pfc-font-size: 14px; }
.pfc-size-xlarge { --pfc-button-size: 80px; --pfc-icon-size: 34px; --pfc-item-icon: 54px; --pfc-font-size: 15px; }

.pfc-wrap .pfc-main-button {
    -webkit-appearance: none;
    appearance: none;
    width: var(--pfc-button-size) !important;
    height: var(--pfc-button-size) !important;
    min-width: var(--pfc-button-size) !important;
    min-height: var(--pfc-button-size) !important;
    max-width: var(--pfc-button-size) !important;
    max-height: var(--pfc-button-size) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    line-height: 0 !important;
    font-size: 0 !important;
    text-indent: 0 !important;
    text-decoration: none !important;
    color: var(--pfc-icon) !important;
    background-color: var(--pfc-main) !important;
    background-image: none !important;
    box-shadow: 0 10px 25px color-mix(in srgb, var(--pfc-main), transparent 62%) !important;
    cursor: pointer;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    flex: 0 0 auto;
    transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
    -webkit-tap-highlight-color: transparent;
}

.pfc-wrap .pfc-main-button * {
    pointer-events: none;
}

.pfc-wrap .pfc-main-button::after {
    content: none !important;
}

@supports not (color: color-mix(in srgb, red, transparent)) {
    .pfc-main-button { box-shadow: 0 10px 25px rgba(0, 0, 0, .22); }
}

.pfc-wrap .pfc-main-button::before {
    content: "";
    position: absolute;
    inset: -6px;
    border: 1px solid color-mix(in srgb, var(--pfc-main), white 32%);
    border-radius: inherit;
    opacity: .55;
    z-index: -1;
}

.pfc-wrap .pfc-main-button:hover { transform: translateY(-2px) scale(1.03); filter: brightness(1.04); }
.pfc-wrap .pfc-main-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--pfc-main), white 60%); outline-offset: 4px; }
.pfc-wrap.is-open .pfc-main-button { transform: rotate(90deg); }

.pfc-wrap .pfc-main-icon {
    position: absolute;
    inset: 0;
    margin: auto;
    width: var(--pfc-icon-size);
    height: var(--pfc-icon-size);
    display: grid;
    place-items: center;
    color: inherit;
    transition: opacity .18s ease, transform .24s ease;
}
.pfc-wrap .pfc-main-icon svg,
.pfc-wrap .pfc-channel-icon svg { width: 100%; height: 100%; display: block; flex: 0 0 auto; }
.pfc-icon-close { opacity: 0; transform: scale(.5) rotate(-90deg); }
.pfc-wrap.is-open .pfc-icon-chat { opacity: 0; transform: scale(.5) rotate(90deg); }
.pfc-wrap.is-open .pfc-icon-close { opacity: 1; transform: scale(1) rotate(-90deg); }

.pfc-tooltip {
    position: absolute;
    bottom: calc(var(--pfc-button-size) + 13px);
    max-width: 220px;
    padding: 9px 13px;
    border-radius: 10px;
    color: var(--pfc-text);
    background: var(--pfc-panel);
    box-shadow: 0 8px 26px rgba(15, 23, 42, .15);
    white-space: nowrap;
    font-size: var(--pfc-font-size);
    font-weight: 700;
    opacity: 0;
    visibility: hidden;
    transform: translateY(7px) scale(.96);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
    pointer-events: none;
}

.pfc-tooltip::after {
    content: "";
    position: absolute;
    bottom: -6px;
    width: 12px;
    height: 12px;
    background: inherit;
    transform: rotate(45deg);
}
.pfc-position-right .pfc-tooltip { right: 0; }
.pfc-position-right .pfc-tooltip::after { right: calc(var(--pfc-button-size) / 2 - 6px); }
.pfc-position-left .pfc-tooltip { left: 0; }
.pfc-position-left .pfc-tooltip::after { left: calc(var(--pfc-button-size) / 2 - 6px); }
.pfc-tooltip.is-visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.pfc-wrap.is-open .pfc-tooltip { opacity: 0 !important; visibility: hidden !important; }

.pfc-tooltip-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-inline-end: 6px;
    border-radius: 50%;
    background: var(--pfc-main);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--pfc-main), transparent 82%);
}

.pfc-menu {
    position: absolute;
    bottom: calc(var(--pfc-button-size) + 12px);
    min-width: 190px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 10px;
    border-radius: 17px;
    background: color-mix(in srgb, var(--pfc-panel), transparent 3%);
    box-shadow: 0 18px 50px rgba(15, 23, 42, .18);
    border: 1px solid rgba(148, 163, 184, .22);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    opacity: 0;
    transform: translateY(10px) scale(.96);
    transform-origin: bottom center;
    transition: opacity .2s ease, transform .22s ease;
}
.pfc-position-right .pfc-menu { right: 0; }
.pfc-position-left .pfc-menu { left: 0; }
.pfc-wrap.is-open .pfc-menu { opacity: 1; transform: translateY(0) scale(1); }

.pfc-channel {
    display: grid;
    grid-template-columns: var(--pfc-item-icon) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: calc(var(--pfc-item-icon) + 4px);
    padding: 4px 5px;
    border-radius: 12px;
    color: var(--pfc-text) !important;
    background: transparent;
    text-decoration: none !important;
    font-size: var(--pfc-font-size);
    font-weight: 700;
    opacity: 0;
    transform: translateY(8px);
    transition: background .18s ease, transform .25s ease, opacity .25s ease;
    transition-delay: calc(var(--pfc-order) * 35ms);
}
.pfc-wrap.is-open .pfc-channel { opacity: 1; transform: translateY(0); }
.pfc-channel:hover { background: rgba(148, 163, 184, .13); }
.pfc-channel:focus-visible { outline: 2px solid var(--pfc-channel-color); outline-offset: 2px; }

.pfc-channel-icon {
    width: var(--pfc-item-icon);
    height: var(--pfc-item-icon);
    padding: calc(var(--pfc-item-icon) * .24);
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--pfc-channel-color);
    box-shadow: 0 6px 14px color-mix(in srgb, var(--pfc-channel-color), transparent 68%);
}
.pfc-channel-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.pfc-do-animate.pfc-anim-shake .pfc-main-button { animation: pfc-shake .7s ease both; }
.pfc-do-animate.pfc-anim-pulse .pfc-main-button { animation: pfc-pulse 1.1s ease both; }
.pfc-do-animate.pfc-anim-bounce .pfc-main-button { animation: pfc-bounce .8s ease both; }

@keyframes pfc-shake {
    0%, 100% { transform: rotate(0); }
    20% { transform: rotate(-8deg); }
    40% { transform: rotate(8deg); }
    60% { transform: rotate(-5deg); }
    80% { transform: rotate(5deg); }
}
@keyframes pfc-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 10px 25px rgba(0,0,0,.2); }
    45% { transform: scale(1.1); box-shadow: 0 0 0 13px color-mix(in srgb, var(--pfc-main), transparent 84%); }
}
@keyframes pfc-bounce {
    0%, 100% { transform: translateY(0); }
    35% { transform: translateY(-12px); }
    60% { transform: translateY(0); }
    78% { transform: translateY(-5px); }
}

@media (max-width: 767px) {
    .pfc-device-desktop { display: none !important; }
    .pfc-menu { min-width: min(220px, calc(100vw - 32px)); }
}
@media (min-width: 768px) {
    .pfc-device-mobile { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .pfc-wrap *,
    .pfc-wrap *::before,
    .pfc-wrap *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}


.pfc-wrap .pfc-menu[hidden] { display: none !important; }

.pfc-wrap .pfc-channel,
.pfc-wrap .pfc-channel:hover,
.pfc-wrap .pfc-channel:focus,
.pfc-wrap .pfc-channel:active {
    text-decoration: none !important;
}

.pfc-wrap .pfc-main-button,
.pfc-wrap .pfc-main-button:hover,
.pfc-wrap .pfc-main-button:focus,
.pfc-wrap .pfc-main-button:active {
    text-decoration: none !important;
}
