/* ============================================
   LightSNS 看看翻译 - 样式表
   与程序原生 UI 风格保持一致
   ============================================ */

/* 翻译按钮 */
.lightsns-kankan-btn {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    color: var(--ls-theme-color, #2563eb);
    cursor: pointer;
    margin-left: 6px;
    opacity: 0.65;
    user-select: none;
    transition: opacity 0.2s ease;
    vertical-align: middle;
}

.lightsns-kankan-btn:hover {
    opacity: 1;
    text-decoration: underline;
}

.lightsns-kankan-btn.lightsns-kankan-loading {
    cursor: wait;
    opacity: 0.5;
}

/* 译文区域 - 融入聊天气泡风格 */
.lightsns-kankan-result {
    margin-top: 8px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.55);
    border-left: 2px solid var(--ls-theme-color, #2563eb);
    border-radius: 0 10px 10px 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--lsc-text, #141B27);
    word-break: break-word;
    backdrop-filter: blur(2px);
}

.lightsns-kankan-result .kankan-lang-tag {
    display: inline-block;
    font-size: 10px;
    color: var(--lsc-text-muted, #72767D);
    margin-right: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    vertical-align: middle;
}

.lightsns-kankan-result .kankan-text {
    vertical-align: middle;
}

/* 原文切换链接 */
.lightsns-kankan-toggle {
    display: inline-block;
    font-size: 11px;
    color: var(--ls-theme-color, #2563eb);
    cursor: pointer;
    margin-left: 8px;
    opacity: 0.7;
    user-select: none;
    vertical-align: middle;
}

.lightsns-kankan-toggle:hover {
    opacity: 1;
    text-decoration: underline;
}

/* 临时提示（Toast） */
.lightsns-kankan-toast {
    display: inline-block;
    font-size: 12px;
    color: #FD3A55;
    margin-left: 6px;
    vertical-align: middle;
    animation: kankan-fade-in 0.2s ease;
}

@keyframes kankan-fade-in {
    from { opacity: 0; transform: translateY(-2px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 移动端适配 */
@media (max-width: 768px) {
    .lightsns-kankan-result {
        font-size: 15px;
        padding: 8px 12px;
        border-radius: 0 8px 8px 0;
    }

    .lightsns-kankan-btn {
        font-size: 12px;
    }

    .lightsns-kankan-toggle {
        font-size: 11px;
    }
}