/**
 * UID 徽章：普通号 / 靓号一体双段胶囊
 */

/* ===== 靓号炫彩胶囊 ===== */
.bt-user-uid-scope {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    line-height: 1;
    overflow: visible !important;
}

.bt-user-uid-scope .bt-uid-pill {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    height: var(--bt-uid-height, 20px);
    border-radius: 999px;
    overflow: hidden;
    vertical-align: middle;
    box-sizing: border-box;
    padding: 0;
    gap: 0;
    background: var(--bt-uid-pill-bg, #1d1b4f) !important;
    border: 1px solid var(--bt-uid-pill-border, #473984);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -8px 16px rgba(255, 255, 255, .04), 0 6px 16px rgba(36, 28, 91, .22);
}

/* 整体柔光 */
.bt-user-uid-scope .bt-uid-pill::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(120% 120% at 14% 10%, rgba(255, 255, 255, .34), rgba(255, 255, 255, .08) 38%, rgba(255, 255, 255, 0) 74%);
    pointer-events: none;
    z-index: 3;
    display: var(--bt-uid-glow-display, block);
    animation: btUidRainbowGlow 2.2s ease-in-out infinite;
}

@keyframes btUidRainbowGlow {
    0%, 100% { opacity: .88; }
    50% { opacity: .56; }
}

.bt-user-uid-scope .bt-uid-pill__tag {
    position: relative;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    padding: 0 13px 0 9px;
    margin-right: 0;
    font-size: var(--bt-uid-tag-size, 12px);
    font-weight: 800;
    font-style: italic;
    line-height: 1;
    overflow: hidden;
    flex-shrink: 0;
    font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    letter-spacing: .02em;
    background: var(--bt-uid-tag-bg, linear-gradient(135deg, #0f0d3b 0%, #100c2f 55%, #171043 100%)) !important;
    clip-path: polygon(0 0, 100% 0, calc(100% - var(--bt-uid-clip, 7px)) 100%, 0 100%);
}

/* 靓字：斜向七彩循环渐变（非扫光位移） */
.bt-user-uid-scope .bt-uid-pill__tag-text {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding-right: 2px;
    font: inherit;
    letter-spacing: inherit;
    background-image: var(--bt-uid-tag-text, linear-gradient(125deg, #ff6b8a 0%, #ffb84d 14%, #ffe86b 28%, #63f2a0 42%, #63f2ff 56%, #7ec8ff 70%, #d98bff 86%, #ff6b8a 100%));
    background-size: var(--bt-uid-tag-flow-size, 320% 320%);
    background-position: 0% 0%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    animation: btUidTagGradientLoop var(--bt-uid-tag-flow-duration, 6s) linear infinite;
    animation-play-state: var(--bt-uid-tag-flow-state, running);
}

@keyframes btUidTagGradientLoop {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 100%; }
}

/* 靓字扫光：参考 frontRainbowBadgeShine，无缝循环 */
.bt-user-uid-scope .bt-uid-pill__tag::after {
    content: "";
    position: absolute;
    top: -55%;
    left: 0;
    width: 40%;
    height: 220%;
    transform: translateX(-220%) rotate(22deg);
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, .72), transparent);
    pointer-events: none;
    display: var(--bt-uid-shine-display, block);
    animation: btUidTagShine var(--bt-uid-shine-duration, 2s) linear infinite;
}

@keyframes btUidTagShine {
    0% { transform: translateX(-220%) rotate(22deg); }
    100% { transform: translateX(420%) rotate(22deg); }
}

.bt-user-uid-scope .bt-uid-pill__num {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    margin-left: -5px;
    padding: 0 10px 0 14px;
    font-size: var(--bt-uid-num-size, 13px);
    font-weight: var(--bt-uid-num-weight, 600);
    line-height: 1;
    letter-spacing: .05em;
    white-space: nowrap;
    font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    -webkit-font-smoothing: antialiased;
    background: transparent !important;
    color: transparent !important;
}

/* 炫彩渐变 UID 数字（front-rainbow-pill__text） */
.bt-user-uid-scope .bt-uid-pill__num::before {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    display: inline-flex;
    align-items: center;
    padding: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    font-family: inherit;
    background-image: var(--bt-uid-num-text, linear-gradient(90deg, #ffe86b 0%, #ffb84d 18%, #63f2ff 38%, #7ec8ff 56%, #d98bff 76%, #ff8fd1 100%));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
}

.bt-user-uid-scope .bt-uid-pill--rainbow {
    --bt-uid-pill-bg: #1d1b4f;
    --bt-uid-pill-border: #473984;
    --bt-uid-tag-bg: linear-gradient(135deg, #0f0d3b 0%, #171043 100%);
    --bt-uid-tag-text: linear-gradient(125deg, #ff6b8a 0%, #ffb84d 14%, #ffe86b 28%, #63f2a0 42%, #63f2ff 56%, #7ec8ff 70%, #d98bff 86%, #ff6b8a 100%);
    --bt-uid-num-text: linear-gradient(90deg, #ffe86b 0%, #ffb84d 18%, #63f2ff 38%, #7ec8ff 56%, #d98bff 76%, #ff8fd1 100%);
    --bt-uid-shine-display: block;
    --bt-uid-glow-display: block;
    --bt-uid-tag-flow-size: 320% 320%;
    --bt-uid-tag-flow-state: running;
}

.bt-user-uid-scope .bt-uid-pill--heijin {
    --bt-uid-pill-bg: #3a3a3a;
    --bt-uid-pill-border: #1a1a1a;
    --bt-uid-tag-bg: linear-gradient(135deg, #0a0a0a 0%, #151515 100%);
    --bt-uid-tag-text: linear-gradient(125deg, #9333ea 0%, #a855f7 16%, #fde047 42%, #fffbeb 68%, #ffffff 86%, #9333ea 100%);
    --bt-uid-num-text: linear-gradient(90deg, #ffedaa 0%, #ffe86b 50%, #ffb84d 100%);
    --bt-uid-shine-display: block;
    --bt-uid-glow-display: none;
    --bt-uid-tag-flow-size: 320% 320%;
    --bt-uid-tag-flow-state: running;
    box-shadow: inset 0 1px 0 rgba(255, 237, 170, .18), 0 6px 16px rgba(0, 0, 0, .35);
}

.bt-user-uid-scope .bt-uid-pill--liang {
    --bt-uid-pill-bg: #ffe9a8;
    --bt-uid-pill-border: #ff7f41;
    --bt-uid-tag-bg: linear-gradient(135deg, #ff7f41 0%, #ff5907 100%);
    --bt-uid-tag-text: linear-gradient(125deg, #ffffff, #ffffff);
    --bt-uid-num-text: linear-gradient(90deg, #e04e12, #e04e12);
    --bt-uid-shine-display: block;
    --bt-uid-glow-display: none;
    --bt-uid-tag-flow-size: 100% 100%;
    --bt-uid-tag-flow-state: paused;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 6px 16px rgba(255, 127, 65, .22);
}

.bt-user-uid-scope--lg .bt-uid-pill {
    height: calc(var(--bt-uid-height, 20px) + 4px);
}

.bt-user-uid-scope--lg .bt-uid-pill__tag {
    min-width: 36px;
    padding: 0 15px 0 11px;
    font-size: 14px;
    clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
}

.bt-user-uid-scope--lg .bt-uid-pill__num {
    font-size: 15px;
    margin-left: -6px;
    padding: 0 12px 0 16px;
}

/* 复制容器：不用子比 .but，避免样式污染 */
.bt-user-uid-clip {
    display: inline-flex;
    align-items: center;
    align-self: center;
    cursor: pointer;
    vertical-align: middle;
    line-height: 1;
    margin: 0 8px 0 0;
    flex-shrink: 0;
    overflow: visible;
    text-decoration: none;
    color: inherit;
    background: none;
    border: none;
    padding: 0;
    box-shadow: none;
}

.user-identity .bt-user-uid-clip,
.desc.user-identity .bt-user-uid-scope,
.author-header .bt-user-uid-scope {
    overflow: visible !important;
}

.user-identity.flex.ac .bt-user-uid-clip {
    margin-top: 0;
    margin-bottom: 0;
}

/* ===== 普通号：与靓号同结构的一体胶囊 ===== */
.bt-user-uid-scope .bt-uid-pill--pu {
    --bt-uid-pill-bg: linear-gradient(90deg, #8ac5ff 0%, #5cacfc 52%, #4aa3fb 100%);
    --bt-uid-pill-border: #6bb4fb;
    --bt-uid-tag-bg: linear-gradient(135deg, #3d94f2 0%, #2f86e8 100%);
    --bt-uid-tag-text: linear-gradient(125deg, #ffffff, #ffffff);
    --bt-uid-num-text: linear-gradient(90deg, #ffffff, #ffffff);
    --bt-uid-shine-display: none;
    --bt-uid-glow-display: none;
    --bt-uid-tag-flow-size: 100% 100%;
    --bt-uid-tag-flow-state: paused;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38), 0 2px 8px rgba(76, 163, 251, .22);
}

/* ===== 账号设置页 ===== */
.bt-user-uid-panel {
    margin-top: 8px;
}

.bt-user-uid-panel .muted-box {
    padding: 16px 18px;
    overflow: visible;
}

.bt-user-uid-panel .flex.ac.jsb {
    align-items: flex-start;
    gap: 12px;
}

.bt-user-uid-panel__label {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
}

.bt-user-uid-panel__hint {
    color: var(--muted-2-color, #999);
    font-size: 12px;
    line-height: 1.6;
    white-space: normal;
    margin-bottom: 10px;
}

.bt-user-uid-panel__display {
    margin-top: 6px;
    overflow: visible;
}

.bt-user-uid-panel__copy {
    flex-shrink: 0;
    margin-left: 12px;
}

@media (max-width: 768px) {
    .bt-user-uid-scope .bt-uid-pill__num {
        font-size: 12px;
    }

    .user-identity .bt-user-uid-clip {
        margin-right: 6px;
    }
}
