@charset "utf-8";
/* ----------------------------------------------
CUSTOME.CSS
* writer : uxcamp
* version : 1.0.0
* last update : 2025.06.20
* purpose : 테마 커스텀 스타일
* license : © 2025 uxcamp. All rights reserved.
------------------------------------------------*/

/* 진보, 보수, 중도 등 닉네임 옆 아이콘 */
.political-dot {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
    box-shadow:
        inset 0 2px 4px rgba(255, 255, 255, 0.4),   /* 내부 반사 */
        inset 0 -2px 6px rgba(0, 0, 0, 0.4),        /* 내부 음영 */
        0 2px 6px rgba(0, 0, 0, 0.35),              /* 외곽 그림자 */
        0 0 6px rgba(255, 255, 255, 0.15);          /* 빛 번짐 */
    background: radial-gradient(circle at 30% 30%, var(--badge-glow), var(--badge-base));
    position: relative;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* 반사광 하이라이트 효과 */
.political-dot::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 70%;
    height: 35%;
    background: radial-gradient(circle at top left, rgba(255,255,255,0.8), transparent 60%);
    border-radius: 50%;
    filter: blur(1px);
    pointer-events: none;
}

/* hover 시 반짝임 */
.political-dot:hover {
    transform: scale(1.08);
    box-shadow:
        inset 0 2px 6px rgba(255, 255, 255, 0.5),
        0 3px 8px rgba(0, 0, 0, 0.5),
        0 0 10px var(--badge-glow);
}

/* 색상 테마 */
.dot-보수 { --badge-base: #1a237e; --badge-glow: #5c6bc0; }
.dot-중도 { --badge-base: #616161; --badge-glow: #bdbdbd; }
.dot-진보 { --badge-base: #b71c1c; --badge-glow: #ef5350; }
.dot-자유주의 { --badge-base: #1b5e20; --badge-glow: #81c784; }
.dot-사회주의 { --badge-base: #880e4f; --badge-glow: #f48fb1; }

/* 닉네임 영역 */
.col.col-name.sv_use {
    display: flex;
    align-items: center;
    gap: 7px;
}
/* 여기까지 */