/*
前台css样式 - zibll主题优化插件
*/

/* zibll主题优化插件 - 前台样式 */

/* ============================================
   标签文字标红色样式
   ============================================ */

/* 文章内容中的标签链接标红色（不应用背景色） */
.entry-content .zibll-tag-link,
.post-content .zibll-tag-link,
.article-content .zibll-tag-link,
.entry-content a[href*="/tag/"],
.post-content a[href*="/tag/"],
.article-content a[href*="/tag/"],
.entry-content a[href*="?tag="],
.post-content a[href*="?tag="],
.article-content a[href*="?tag="] {
    color: #ff0000 !important;
    background-color: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.entry-content .zibll-tag-link:hover,
.post-content .zibll-tag-link:hover,
.article-content .zibll-tag-link:hover,
.entry-content a[href*="/tag/"]:hover,
.post-content a[href*="/tag/"]:hover,
.article-content a[href*="/tag/"]:hover,
.entry-content a[href*="?tag="]:hover,
.post-content a[href*="?tag="]:hover,
.article-content a[href*="?tag="]:hover {
    color: #cc0000 !important;
    text-decoration: underline;
}

/* ============================================
   标签随机颜色样式
   ============================================ */
/* 注意：标签随机颜色功能已改为CSS实现（在 inc/functions.php 的 zibll_snow_effect_colorful_tag_css 函数中） */
/* 从 zibll_Add_ons 的 colorfultag.php 复制而来，使用 nth-child 选择器实现 */

/* ============================================
   UID 流光字效果
   ============================================ */
.zibll-uid-display {
    display: inline-block !important;
    position: relative;
    white-space: nowrap !important; /* 防止换行 */
    flex-shrink: 0 !important; /* 防止被压缩 */
}

/* 单色UID数字（带10%朦胧光晕） */
.zibll-uid-display.zibll-uid-glow {
    background: none !important;
    background-color: transparent !important;
    -webkit-text-fill-color: inherit !important;
    animation: none !important;
    filter: blur(0.3px) !important; /* 轻微朦胧效果 */
}

/* 备用方案：如果渐变不生效，使用彩色文字 */
@supports not (-webkit-background-clip: text) {
    .zibll-uid-display.zibll-uid-glow {
        background: none !important;
        background-color: transparent !important;
        -webkit-text-fill-color: #4ecdc4 !important;
        color: #4ecdc4 !important;
        animation: none !important;
        text-shadow: none !important;
    }
}

/* 确保在 text-ellipsis 容器中，UID 也能显示 */
span.display-name,
a.display-name {
    overflow: visible !important;
}

/* 如果父元素有 text-ellipsis，确保 UID 不被截断 */
.text-ellipsis .zibll-uid-display,
[class*="text-ellipsis"] .zibll-uid-display,
span.display-name .zibll-uid-display,
a.display-name .zibll-uid-display {
    display: inline-block !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    overflow: visible !important;
    min-width: fit-content !important;
}

/* 确保包含 UID 的容器不会截断 UID */
span.display-name:has(.zibll-uid-display),
a.display-name:has(.zibll-uid-display) {
    overflow: visible !important;
    text-overflow: clip !important;
}

/* 兼容不支持 :has() 的浏览器 */
span.display-name .zibll-uid-display,
a.display-name .zibll-uid-display {
    position: relative;
    z-index: 1;
}

.zibll-uid-glow {
    animation: zibll-uid-shine 3s linear infinite;
}

@keyframes zibll-uid-shine {
    0% {
        background-position: 0% center;
    }
    100% {
        background-position: 200% center;
    }
}

/* 单个数字闪烁效果 */
.zibll-uid-digit {
    display: inline-block;
    animation: zibll-uid-digit-sparkle 1.2s ease-in-out infinite;
}



/* 兼容性：如果浏览器不支持 background-clip，使用金色 */
@supports not (-webkit-background-clip: text) {
    .zibll-uid-display {
        -webkit-text-fill-color: #ffd700 !important;
        background: none !important;
        color: #ffd700 !important;
        animation: none !important;
    }
}

