/**
 * 标题前戳 EMLOG 版 - 前台样式
 * 原插件 main.css 完整移植 + EMLOG 版 jz-* 色板（原 jb-* 为 Zibll 主题配色，EMLOG 无此环境）
 */

.jiaozi_qz_prefix {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    border-radius: 5px;
    padding: 5px 4px;
    margin-right: 3px;
    height: 19px;
    font-size: 12px;
    top: -3px;
    white-space: nowrap;
    color: #fff;
    font-weight: 600;
    clip-path: polygon(7% 0, 99% 0, 93% 100%, 0 100%);
}

.jiaozi_qz_prefix_img_wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 4px;
    margin-right: 3px;
    vertical-align: middle;
    animation: tagBgLight 4s ease-in-out infinite alternate;
    line-height: 0;
}

.jiaozi_qz_prefix_img_wrapper img {
    display: block;
    position: relative;
    z-index: 0;
}

/* 仅文章详情页 标题后方标签 扫光 + 轻微变色 */
.singular-tag-animate {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 4px;
    animation: tagBgLight 4s ease-in-out infinite alternate;
}

/* 扫光效果 */
.singular-tag-animate:before {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-25deg);
    animation: tagSweep 3.5s ease-in-out infinite;
    z-index: 2;
    pointer-events: none;
}

/* 变色效果 - 使用半透明叠加层 */
.singular-tag-animate:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0);
    z-index: 1;
    pointer-events: none;
    animation: tagColorChange 4s ease-in-out infinite alternate;
}

@keyframes tagSweep {
    0% { left: -120%; }
    100% { left: 120%; }
}

@keyframes tagBgLight {
    0% { filter: brightness(1) saturate(1); }
    100% { filter: brightness(1.2) saturate(1.3); }
}

@keyframes tagColorChange {
    0% { background: rgba(255, 255, 255, 0); }
    100% { background: rgba(255, 255, 255, 0.15); }
}

/* ============================================================
 * EMLOG 版色板（原 Zibll jb-* 渐变配色的等价实现）
 * ============================================================ */
.jiaozi_qz_prefix.jz-red    { background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%); }
.jiaozi_qz_prefix.jz-orange { background: linear-gradient(135deg, #ffa502 0%, #ff9f43 100%); }
.jiaozi_qz_prefix.jz-gold   { background: linear-gradient(135deg, #f6b93b 0%, #e5a51f 100%); }
.jiaozi_qz_prefix.jz-green  { background: linear-gradient(135deg, #26de81 0%, #20bf6b 100%); }
.jiaozi_qz_prefix.jz-blue   { background: linear-gradient(135deg, #4a90e2 0%, #3867d6 100%); }
.jiaozi_qz_prefix.jz-purple { background: linear-gradient(135deg, #a29bfe 0%, #8854d0 100%); }
.jiaozi_qz_prefix.jz-cyan   { background: linear-gradient(135deg, #17c0eb 0%, #0fbcf9 100%); }
.jiaozi_qz_prefix.jz-gray   { background: linear-gradient(135deg, #8395a7 0%, #576574 100%); }

/* 详情页文字前缀（46px 大标）细节优化 */
.jiaozi_qz_prefix.singular-tag-animate {
    padding: 10px 14px;
    margin-right: 8px;
    top: -2px;
    line-height: 1;
}

/* 列表标题内前缀与文字对齐 */
.jiaozi_qz_prefix_img {
    display: inline-block;
}

/* 兼容部分主题列表标题字号变化时的基线对齐 */
.post-title-link > .jiaozi_qz_prefix_img,
.post-title > .jiaozi_qz_prefix_img {
    vertical-align: -3px;
}