/* ==================== 在线客服（Teamora 群机器人的 Web 聊天页） ====================
   页面由 Teamora 自己渲染，这里只是把它放进一个 iframe —— 站点侧零依赖、零构建，
   也**不含任何凭据**（地址里只有公开的机器人 id）。iframe 与聊天接口同源，
   所以站点这边不需要 CORS。改机器人 / 换地址：见页面底部的 data-bot / data-base。

   「在线咨询」入口本身是 .fab-rail 里的一个条目，外形由 index.html 里的 .fab-item 负责，
   这里只管聊天面板。 */

/* 宽屏：操作栏竖排在右边缘，面板就贴着它打开 */
.snail-chat-panel {
    position: fixed;
    right: 108px;
    bottom: 24px;
    z-index: 1500;
    width: 380px;
    height: min(620px, calc(100dvh - 48px));
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 20px;
    background: #0b0b0d;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55);
    transform-origin: 100% 100%;
    animation: snailChatPop 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.snail-chat-panel[hidden] {
    display: none;
}

.snail-chat-panel iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    /* 聊天页跟随系统深浅色；先铺白底，避免 iframe 首帧闪一下透明 */
    background: #fff;
}

/* 图标随开合状态互换；样式细节由 .fab-item 提供 */
.snail-chat-launcher .icon-close,
.snail-chat-launcher.is-open .icon-chat {
    display: none;
}

.snail-chat-launcher.is-open .icon-close {
    display: block;
}

.snail-chat-launcher svg {
    width: 21px;
    height: 21px;
}

@keyframes snailChatPop {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: none; }
}

body.snail-chat-open {
    overflow: hidden;
}

/* 操作栏落到右下角横排时，面板改从它上方打开 */
@media (max-width: 1399px) {
    .snail-chat-panel {
        right: 16px;
        bottom: 96px;
        height: min(620px, calc(100dvh - 130px));
    }
}

/* 窄屏：面板铺满宽度，贴着底部的操作栏往上留一点 */
@media (max-width: 640px) {
    .snail-chat-panel {
        left: 10px;
        right: 10px;
        bottom: 96px;
        width: auto;
        height: calc(100dvh - 118px);
        border-radius: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .snail-chat-panel { animation: none; }
}

/* 导航栏的"在线客服"是 <button>（不是链接），补上按钮自己不继承的两条。 */
.nav-actions button.btn-outline {
    font-family: inherit;
    line-height: 1.4;
}
