/**
 * AI智能客服 - 搜索框旁入口 + 弹窗（样式参考后台经营助手）
 * 入口：PC/手机仅共享颜色与外观，定位样式互不影响
 */

/* ---- 入口：共享颜色与基础外观 ---- */
.plugins-aichat-search-entry {
    --aichat-entry-from: #7c3aed;
    --aichat-entry-to: #a855f7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0.8rem;
    background: linear-gradient(135deg, var(--aichat-entry-from), var(--aichat-entry-to));
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    letter-spacing: 0.02em;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    white-space: nowrap;
    line-height: 1;
    vertical-align: middle;
}

/* ---- PC：搜索框旁绝对定位 ---- */
@media only screen and (min-width: 641px) {
    .search-bar {
        position: relative;
    }
    .plugins-aichat-search-entry:not(.is-mobile) {
        position: absolute;
        left: calc(100% + 1rem);
        top: 50%;
        transform: translateY(-50%);
        z-index: 6;
        height: 4rem;
        padding: 0 1.1rem;
        box-shadow: 0 0.2rem 0.8rem rgba(124, 58, 237, 0.28);
        transition: filter 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
    }
    .plugins-aichat-search-entry:not(.is-mobile):hover {
        filter: brightness(1.06);
        box-shadow: 0 0.3rem 1.2rem rgba(124, 58, 237, 0.36);
    }
    .plugins-aichat-search-entry:not(.is-mobile):active {
        transform: translateY(-50%) scale(0.98);
    }
    .plugins-aichat-search-entry.is-mobile {
        display: none;
    }
}

/* ---- 手机：外观 + 顶栏定位 ---- */
@media only screen and (max-width: 640px) {
    .plugins-aichat-search-entry:not(.is-mobile) {
        display: none;
    }
    .plugins-aichat-search-entry.is-mobile {
        position: absolute;
        top: 1.4rem;
        right: 5.6rem;
        height: 3.1rem;
        padding: 0 0.7rem;
        border-radius: 0.6rem;
        font-size: 1.2rem;
    }
    .shop-navigation .navigation-search {
        width: calc(100% - 9.6rem);
    }
}

/* ---------- 弹窗根节点 ---------- */
.aichat-float-root {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    z-index: 1080;
    font-family: inherit;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 0.8rem;
    pointer-events: none;
}
.aichat-float-root > * {
    pointer-events: auto;
}

/* 右下角 Logo 启动按钮（关闭弹窗时可见） */
.aichat-float-launcher {
    width: 4rem;
    height: 4rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
    background: var(--surface-color, #ffffff);
    box-shadow: 0 0.3rem 1rem rgba(124, 58, 237, 0.26);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.aichat-float-launcher:hover {
    transform: translateY(-0.1rem) scale(1.03);
    box-shadow: 0 0.55rem 1.6rem rgba(124, 58, 237, 0.36);
}
.aichat-float-launcher img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.aichat-float-root.is-open .aichat-float-launcher {
    visibility: hidden;
    pointer-events: none;
}

.aichat-float-panel {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: min(42rem, calc(100vw - 2.4rem));
    height: min(68rem, calc(100vh - 4.4rem));
    border-radius: 1.6rem;
    background: var(--surface-color, #ffffff);
    border: 0.1rem solid #e6e8eb;
    box-shadow: 0 1.2rem 4rem rgba(15, 23, 42, 0.18);
    overflow: hidden;
    transform-origin: right bottom;
    animation: aichat-float-in 0.2s ease;
    transition: width 0.28s ease, height 0.28s ease, left 0.28s ease, top 0.28s ease, right 0.28s ease, bottom 0.28s ease, border-radius 0.28s ease;
}
/* 拖动后改为视口定位 */
.aichat-float-root.is-moved:not(.is-fullscreen) .aichat-float-panel {
    position: fixed;
    right: auto;
    bottom: auto;
    animation: none;
}
.aichat-float-root.is-dragging .aichat-float-panel,
.aichat-float-root.is-no-pos-transition .aichat-float-panel {
    transition: none;
}
/* 宽屏缩放：只过渡宽高，右边/底边钉住 */
.aichat-float-root.is-size-anim .aichat-float-panel {
    transition: width 0.28s ease, height 0.28s ease, border-radius 0.28s ease;
}
.aichat-float-root.is-moved.is-anchor-rb:not(.is-fullscreen) .aichat-float-panel {
    left: auto !important;
    top: auto !important;
}
.aichat-float-root.is-dragging .aichat-float-iframe,
.aichat-float-root.is-dragging .aichat-float-loading {
    pointer-events: none;
}
.aichat-float-panel[hidden] {
    display: none !important;
}
@keyframes aichat-float-in {
    from {
        opacity: 0;
        transform: translateY(1.2rem) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.aichat-float-root.is-large:not(.is-fullscreen) .aichat-float-panel {
    width: min(75.6rem, calc(100vw - 2.4rem));
    height: min(78rem, calc(100vh - 4.4rem));
    animation: none;
}
.aichat-float-root.is-fullscreen .aichat-float-panel {
    position: fixed;
    left: 1.2rem !important;
    top: 1.2rem !important;
    right: auto !important;
    bottom: auto !important;
    width: calc(100vw - 2.4rem) !important;
    height: calc(100vh - 2.4rem) !important;
    border-radius: 1.4rem;
    animation: none;
}

.aichat-float-root.is-large .aichat-float-ico-larger,
.aichat-float-root:not(.is-large) .aichat-float-ico-larger-restore {
    display: none;
}
.aichat-float-root.is-fullscreen #aichat-float-larger {
    display: none;
}
.aichat-float-root.is-fullscreen .aichat-float-ico-expand {
    display: none;
}
.aichat-float-root:not(.is-fullscreen) .aichat-float-ico-restore {
    display: none;
}

.aichat-float-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-shrink: 0;
    height: 4.8rem;
    padding: 0 1rem 0 1.4rem;
    border-bottom: 0.1rem solid #eef0f3;
    background: var(--surface-color, #ffffff);
    cursor: move;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
}
.aichat-float-root.is-fullscreen .aichat-float-hd {
    cursor: default;
}
.aichat-float-hd-title {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2430;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}
.aichat-float-hd-logo {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    background: #f3f4f6;
}
.aichat-float-hd-title > span {
    overflow: hidden;
    text-overflow: ellipsis;
}
.aichat-float-hd-ops {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    flex-shrink: 0;
    cursor: default;
}
.aichat-float-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.2rem;
    border: 0;
    border-radius: 0.8rem;
    background: transparent;
    color: #6b7280;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.aichat-float-btn:hover {
    background: #f3f4f6;
    color: #1f2430;
}

.aichat-float-body {
    position: relative;
    flex: 1;
    min-height: 0;
    background: var(--surface-color, #ffffff);
}
.aichat-float-loading {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8a919f;
    font-size: 1.3rem;
    background: var(--surface-color, #ffffff);
}
.aichat-float-root.is-loaded .aichat-float-loading {
    display: none;
}
.aichat-float-iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--surface-color, #ffffff);
}

@media only screen and (max-width: 640px) {
    .aichat-float-root {
        right: 1.2rem;
        bottom: 1.2rem;
    }
}