.zibtf-ai-comment-btn,
.zibtf-ai-polish-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.tk-ai-comment-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    line-height: 1;
    flex: 0 0 auto;
}

.tk-ai-comment-icon svg {
    display: block;
    width: 1em;
    height: 1em;
    fill: currentColor;
}
	
	
	
.zibtf-ai-comment-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    vertical-align: middle;
    margin-right: 6px;
     margin-left: -4px;
}

.zibtf-ai-comment-btn,
.zibtf-ai-polish-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    user-select: none;
}

.zibtf-ai-comment-btn *,
.zibtf-ai-polish-btn * {
    user-select: none;
}

.zibtf-ai-comment-btn.is-loading,
.zibtf-ai-polish-btn.is-loading {
    opacity: .75;
    cursor: wait;
    pointer-events: none;
}

.zibtf-ai-comment-btn[disabled],
.zibtf-ai-polish-btn[disabled] {
    cursor: wait;
}

/* 评论框AI加载动画 */
.hao-comment-form-textarea {
    position: relative;
    --ai-radius: 4px;
    --ai-pass-duration: 2.2s;
    border-radius: var(--ai-radius);
    overflow: hidden;
    isolation: isolate;
    box-shadow: none !important;
}

.hao-comment-form-textarea > textarea,
.hao-comment-form-textarea > #comment {
    position: relative;
    z-index: 3;
    background-clip: padding-box;
    box-shadow: none !important;
}

.hao-comment-form-textarea > textarea.zibtf-ai-comment-lock,
.hao-comment-form-textarea > #comment.zibtf-ai-comment-lock {
    caret-color: transparent;
    cursor: wait;
}

.hao-comment-form-textarea:before,
.hao-comment-form-textarea:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s ease;
    will-change: transform, opacity;
}

.hao-comment-form-textarea:before {
    inset: 2px;
    background:
        linear-gradient(118deg, rgba(226,220,246,.46) 0%, rgba(205,231,248,.43) 38%, rgba(190,232,224,.4) 70%, rgba(223,220,246,.42) 100%),
        radial-gradient(62% 108% at 14% 82%, rgba(166,238,214,.3), rgba(166,238,214,0) 72%),
        radial-gradient(56% 96% at 84% 16%, rgba(153,204,255,.26), rgba(153,204,255,0) 72%);
    filter: saturate(1.22) brightness(1.04);
    z-index: 2;
}

.hao-comment-form-textarea:after {
    inset: -12% -34%;
    background: linear-gradient(116deg, rgba(255,255,255,0) 34%, rgba(223,255,240,.18) 42%, rgba(157,226,255,.6) 50%, rgba(255,232,181,.42) 58%, rgba(255,255,255,0) 68%);
    filter: saturate(1.18) brightness(1.08);
    transform: translate3d(-64%,16%,0) rotate(-10deg);
    transform-origin: 50% 50%;
    z-index: 4;
}

.hao-comment-form-textarea.ai-glow-active:before,
.hao-comment-form-textarea.ai-glow-active:after {
    opacity: 1;
}

.hao-comment-form-textarea.ai-glow-active:before {
    opacity: .88;
    animation: 2.1s ease-in-out infinite ai-gradient-breathe;
}

.hao-comment-form-textarea.ai-glow-active:after {
    opacity: .98;
    animation: var(--ai-pass-duration) linear infinite ai-diagonal-sweep;
}

.hao-comment-form-textarea.ai-glow-active > textarea,
.hao-comment-form-textarea.ai-glow-active > #comment {
    background-color: transparent !important;
    background-image: none !important;
}

@keyframes ai-diagonal-sweep {
    0% {
        opacity: 0;
        transform: translate3d(-64%,16%,0) rotate(-10deg);
    }

    10% {
        opacity: .96;
    }

    100% {
        opacity: 0;
        transform: translate3d(64%,-16%,0) rotate(-10deg);
    }
}

@keyframes ai-gradient-breathe {
    0% {
        filter: saturate(1.14) brightness(1);
    }

    100% {
        filter: saturate(1.24) brightness(1.05);
    }
}

@media (max-width: 768px) {
    .zibtf-ai-comment-wrap {
        gap: 4px;
        margin-right: 4px;
    }
}