/* rubika-fab.css — دکمه‌ی شناور موبایل: یک دکمه که با لمس، دو دکمه‌ی کشویی (ربات روبیکا / حساب کاربری) باز می‌کنه */
.rb-fab, .rb-fab__backdrop { display: none; }

@media (max-width: 768px) {
    .rb-fab {
        --p: 1;                       /* 0 = کامل دیده می‌شه، 1 = کامل مخفیه (با اسکرول تنظیم می‌شه) */
        position: fixed;
        right: 14px;
        bottom: calc(86px + env(safe-area-inset-bottom));
        z-index: 140;
        display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
        transform: translateY(calc(var(--p) * 150%)) scale(calc(1 - var(--p) * .2));
        transform-origin: 100% 100%;
        opacity: calc(1 - var(--p));
        transition: transform .22s ease-out, opacity .22s ease-out;
        -webkit-tap-highlight-color: transparent;
    }
    .rb-fab.pop { transition: transform .6s cubic-bezier(.34, 1.56, .64, 1), opacity .3s ease; }   /* ورود فنری */
    .rb-fab.gone { visibility: hidden; pointer-events: none; transition: transform .22s ease-out, opacity .22s ease-out, visibility 0s linear .22s; }

    /* دکمه‌ی اصلی */
    .rb-fab__main {
        position: relative;
        width: 56px; height: 56px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
        display: grid; place-items: center; color: #fff; font-size: 22px;
        background: linear-gradient(135deg, #5cc9ff 0%, #2f6bff 55%, #8b5cf6 100%);
        box-shadow: 0 10px 26px rgba(47, 107, 255, .45), 0 2px 8px rgba(0, 0, 0, .28);
        transition: transform .25s ease, box-shadow .25s ease;
    }
    .rb-fab__main:active { transform: scale(.92); }
    .rb-fab__main::after {   /* حلقه‌ی ضربان */
        content: ''; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
        animation: rbFabPulse 2.6s ease-out 1.2s infinite;
    }
    .rb-fab.open .rb-fab__main::after { animation: none; }
    .rb-fab__main i { grid-area: 1 / 1; transition: transform .35s cubic-bezier(.4, 1.4, .5, 1), opacity .2s ease; }
    .rb-fab__main .i-close { opacity: 0; transform: rotate(-90deg) scale(.5); }
    .rb-fab.open .rb-fab__main .i-bot { opacity: 0; transform: rotate(90deg) scale(.5); }
    .rb-fab.open .rb-fab__main .i-close { opacity: 1; transform: rotate(0) scale(1); }

    /* منوی کشویی */
    .rb-fab__menu { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; pointer-events: none; }
    .rb-fab.open .rb-fab__menu { pointer-events: auto; }
    .rb-fab__item {
        display: flex; align-items: center; height: 48px; max-width: 48px; overflow: hidden;
        border-radius: 999px; text-decoration: none; color: #fff; font-weight: 700; font-size: 13.5px; white-space: nowrap;
        background: linear-gradient(135deg, #1b2a52 0%, #16213f 100%);
        border: 1px solid rgba(120, 160, 255, .35);
        box-shadow: 0 8px 22px rgba(0, 0, 0, .35);
        opacity: 0; transform: translateY(26px) scale(.8);
        transition: max-width .5s cubic-bezier(.2, .9, .3, 1), opacity .25s ease, transform .45s cubic-bezier(.34, 1.4, .64, 1);
    }
    .rb-fab__item--bot { background: linear-gradient(135deg, #2f6bff 0%, #8b5cf6 100%); border-color: rgba(255, 255, 255, .25); }
    .rb-fab.open .rb-fab__item { opacity: 1; transform: none; max-width: 210px; }
    .rb-fab.open .rb-fab__item:nth-child(2) { transition-delay: 0s; }            /* نزدیک‌ترین به دکمه‌ی اصلی */
    .rb-fab.open .rb-fab__item:nth-child(1) { transition-delay: .07s; }
    .rb-fab:not(.open) .rb-fab__item:nth-child(1) { transition-delay: 0s; }
    .rb-fab:not(.open) .rb-fab__item:nth-child(2) { transition-delay: .05s; }
    .rb-fab__ico { flex: 0 0 48px; width: 48px; height: 46px; display: grid; place-items: center; font-size: 18px; }
    .rb-fab__label { padding: 0 4px 0 16px; }
    .rb-fab__item:active { filter: brightness(1.15); }

    /* پس‌زمینه‌ی تیره‌ی ملایم موقع باز بودن منو */
    .rb-fab__backdrop {
        display: block; position: fixed; inset: 0; z-index: 139;
        background: rgba(5, 8, 18, .5);
        -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
        opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility 0s linear .25s;
    }
    .rb-fab__backdrop.on { opacity: 1; visibility: visible; transition: opacity .25s ease; }

    @keyframes rbFabPulse { 0% { box-shadow: 0 0 0 0 rgba(92, 201, 255, .55); } 70%, 100% { box-shadow: 0 0 0 16px rgba(92, 201, 255, 0); } }
}
@media (prefers-reduced-motion: reduce) {
    .rb-fab, .rb-fab.pop, .rb-fab__item, .rb-fab__main i { transition-duration: .01s !important; }
    .rb-fab__main::after { animation: none; }
}
