/* Avatar frame styles — member list + settings preview only */

.chat_pane__user_item__avatar.yc-af-wrap {
    position: relative;
    float: left;
    margin: 0;
    line-height: 0;
}

.chat_pane__user_item__avatar.yc-af-wrap .u-avatar {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    display: block;
}

#chat__body__settings_pane__container__user-avatar-backgrounds .yc-af-preview-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 0.15rem;
    cursor: pointer;
    flex-shrink: 0;
    line-height: 0;
}

#chat__body__settings_pane__container__user-avatar-backgrounds .yc-af-preview-item .yc-af-demo-placeholder {
    width: 2rem;
    height: 2rem;
    display: block;
    padding: 0;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.yc-af-admin-preview {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    line-height: 0;
}

.yc-af-admin-preview .yc-af-demo-placeholder {
    width: 3.25rem;
    height: 3.25rem;
    display: block;
    padding: 0;
    border: none !important;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.gifts-and-faces-page .img-container .yc-af-admin-item .yc-af-admin-preview {
    width: 4rem !important;
    height: 4rem !important;
}

.gifts-and-faces-page .img-container .yc-af-admin-item .yc-af-demo-placeholder {
    width: 3.25rem !important;
    height: 3.25rem !important;
}

.yc-af-empty-hint {
    padding: 12px;
    margin: 0;
}

.yc-af-circle-thin .u-avatar,
.yc-af-circle-thin .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 1px solid #bdbdbd !important;
}

.yc-af-circle-white .u-avatar,
.yc-af-circle-white .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.yc-af-circle-gold .u-avatar,
.yc-af-circle-gold .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #d4af37 !important;
}

.yc-af-circle-silver .u-avatar,
.yc-af-circle-silver .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #b8b8b8 !important;
    box-shadow: inset 0 0 0 1px #e8e8e8;
}

.yc-af-circle-black .u-avatar,
.yc-af-circle-black .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #2c2c2c !important;
}

.yc-af-rounded-sm .u-avatar,
.yc-af-rounded-sm .yc-af-demo-placeholder {
    border-radius: 10px !important;
    border: 2px solid #9e9e9e !important;
}

.yc-af-rounded-lg .u-avatar,
.yc-af-rounded-lg .yc-af-demo-placeholder {
    border-radius: 16px !important;
    border: 2px solid #757575 !important;
}

.yc-af-square .u-avatar,
.yc-af-square .yc-af-demo-placeholder {
    border-radius: 4px !important;
    border: 2px solid #616161 !important;
}

.yc-af-neon-blue .u-avatar,
.yc-af-neon-blue .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #00bcd4 !important;
    box-shadow: 0 0 8px rgba(0, 188, 212, 0.85), 0 0 16px rgba(0, 188, 212, 0.45);
}

.yc-af-neon-pink .u-avatar,
.yc-af-neon-pink .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #ff4081 !important;
    box-shadow: 0 0 8px rgba(255, 64, 129, 0.85), 0 0 16px rgba(255, 64, 129, 0.45);
}

.yc-af-neon-green .u-avatar,
.yc-af-neon-green .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #69f0ae !important;
    box-shadow: 0 0 8px rgba(105, 240, 174, 0.85), 0 0 16px rgba(105, 240, 174, 0.45);
}

.yc-af-double-ring .u-avatar,
.yc-af-double-ring .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 0 3px #d4af37, 0 0 0 5px rgba(212, 175, 55, 0.35);
}

.yc-af-dashed .u-avatar,
.yc-af-dashed .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px dashed #607d8b !important;
}

.yc-af-dotted .u-avatar,
.yc-af-dotted .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px dotted #8d6e63 !important;
}

.yc-af-shadow-soft .u-avatar,
.yc-af-shadow-soft .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
}

.yc-af-shadow-deep .u-avatar,
.yc-af-shadow-deep .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.25);
}

.yc-af-gradient-sunset {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff6b6b, #feca57, #ff9ff3);
}

.yc-af-gradient-sunset .u-avatar,
.yc-af-gradient-sunset .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.yc-af-gradient-ocean {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2196f3, #00bcd4, #4dd0e1);
}

.yc-af-gradient-ocean .u-avatar,
.yc-af-gradient-ocean .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.yc-af-gradient-purple {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #7c4dff, #e040fb, #ea80fc);
}

.yc-af-gradient-purple .u-avatar,
.yc-af-gradient-purple .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.yc-af-gradient-rainbow {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f44336, #ff9800, #ffeb3b, #4caf50, #2196f3, #9c27b0);
}

.yc-af-gradient-rainbow .u-avatar,
.yc-af-gradient-rainbow .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: none !important;
    background: linear-gradient(145deg, #b0bec5, #78909c);
}

.yc-af-vip-gold .u-avatar,
.yc-af-vip-gold .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 3px solid #ffd700 !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.65), inset 0 0 6px rgba(255, 215, 0, 0.25);
}

.yc-af-rose-gold .u-avatar,
.yc-af-rose-gold .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #b76e79 !important;
    box-shadow: 0 0 8px rgba(183, 110, 121, 0.55);
}

.yc-af-emerald .u-avatar,
.yc-af-emerald .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #2e7d32 !important;
    box-shadow: 0 0 8px rgba(46, 125, 50, 0.45);
}

@keyframes yc-af-pulse-glow {
    0%, 100% { box-shadow: 0 0 6px rgba(63, 81, 181, 0.5); }
    50% { box-shadow: 0 0 14px rgba(63, 81, 181, 0.95), 0 0 22px rgba(63, 81, 181, 0.45); }
}

.yc-af-pulse .u-avatar,
.yc-af-pulse .yc-af-demo-placeholder {
    border-radius: 50% !important;
    border: 2px solid #3f51b5 !important;
    animation: yc-af-pulse-glow 2s ease-in-out infinite;
}

.yc-af-hexagon .u-avatar,
.yc-af-hexagon .yc-af-demo-placeholder {
    clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
    border: 2px solid #5c6bc0 !important;
    border-radius: 0 !important;
}

.chat_pane__user_item__avatar.has-avatar-frame img.avatar_bg {
    display: none !important;
}

/* Member list: override app.css square avatar (border-radius:3px !important) */
.chat_pane__user_item__avatar.has-avatar-frame {
    line-height: normal;
    overflow: visible !important;
}

.chat_pane__user_item__avatar.has-avatar-frame .status {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 0.167rem !important;
    height: 100% !important;
    z-index: 4 !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    animation: none !important;
    background-color: inherit;
}

.chat_pane__user_item__avatar.has-avatar-frame .status.state_active {
    background-color: #58c827 !important;
}

.chat_pane__user_item__avatar.has-avatar-frame .status.state_no_private {
    background-color: red !important;
}

.chat_pane__user_item__avatar.has-avatar-frame .status.state_idle {
    background-color: orange !important;
}

.chat_pane__user_item__avatar.has-avatar-frame .status.state_out {
    background-color: #9c9999 !important;
}

.chat_pane__user_item__avatar.has-avatar-frame img.u-avatar {
    width: 70px !important;
    height: 75px !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    position: relative;
    z-index: 1;
    padding: 0 !important;
}

.chat_pane__user_item__avatar.yc-af-circle-thin img.u-avatar,
.chat_pane__user_item__avatar.yc-af-circle-white img.u-avatar,
.chat_pane__user_item__avatar.yc-af-circle-gold img.u-avatar,
.chat_pane__user_item__avatar.yc-af-circle-silver img.u-avatar,
.chat_pane__user_item__avatar.yc-af-circle-black img.u-avatar,
.chat_pane__user_item__avatar.yc-af-neon-blue img.u-avatar,
.chat_pane__user_item__avatar.yc-af-neon-pink img.u-avatar,
.chat_pane__user_item__avatar.yc-af-neon-green img.u-avatar,
.chat_pane__user_item__avatar.yc-af-double-ring img.u-avatar,
.chat_pane__user_item__avatar.yc-af-dashed img.u-avatar,
.chat_pane__user_item__avatar.yc-af-dotted img.u-avatar,
.chat_pane__user_item__avatar.yc-af-shadow-soft img.u-avatar,
.chat_pane__user_item__avatar.yc-af-shadow-deep img.u-avatar,
.chat_pane__user_item__avatar.yc-af-vip-gold img.u-avatar,
.chat_pane__user_item__avatar.yc-af-rose-gold img.u-avatar,
.chat_pane__user_item__avatar.yc-af-emerald img.u-avatar,
.chat_pane__user_item__avatar.yc-af-pulse img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-sunset img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-ocean img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-purple img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-rainbow img.u-avatar {
    border-radius: 50% !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.chat_pane__user_item__avatar.yc-af-rounded-sm img.u-avatar {
    border-radius: 10px !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.chat_pane__user_item__avatar.yc-af-rounded-lg img.u-avatar {
    border-radius: 16px !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.chat_pane__user_item__avatar.yc-af-square img.u-avatar {
    border-radius: 4px !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
}

.chat_pane__user_item__avatar.yc-af-hexagon img.u-avatar {
    border-radius: 0 !important;
    clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%) !important;
    -webkit-clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%) !important;
}

/* Member list frame borders/glow on avatar image */
.chat_pane__user_item__avatar.yc-af-circle-thin img.u-avatar { border: 1px solid #bdbdbd !important; }
.chat_pane__user_item__avatar.yc-af-circle-white img.u-avatar { border: 2px solid #ffffff !important; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12) !important; }
.chat_pane__user_item__avatar.yc-af-circle-gold img.u-avatar { border: 2px solid #d4af37 !important; }
.chat_pane__user_item__avatar.yc-af-circle-silver img.u-avatar { border: 2px solid #b8b8b8 !important; }
.chat_pane__user_item__avatar.yc-af-circle-black img.u-avatar { border: 2px solid #2c2c2c !important; }
.chat_pane__user_item__avatar.yc-af-rounded-sm img.u-avatar { border: 2px solid #9e9e9e !important; }
.chat_pane__user_item__avatar.yc-af-rounded-lg img.u-avatar { border: 2px solid #757575 !important; }
.chat_pane__user_item__avatar.yc-af-square img.u-avatar { border: 2px solid #616161 !important; }
.chat_pane__user_item__avatar.yc-af-neon-blue img.u-avatar { border: 2px solid #00bcd4 !important; box-shadow: 0 0 8px rgba(0, 188, 212, 0.85), 0 0 16px rgba(0, 188, 212, 0.45) !important; }
.chat_pane__user_item__avatar.yc-af-neon-pink img.u-avatar { border: 2px solid #ff4081 !important; box-shadow: 0 0 8px rgba(255, 64, 129, 0.85), 0 0 16px rgba(255, 64, 129, 0.45) !important; }
.chat_pane__user_item__avatar.yc-af-neon-green img.u-avatar { border: 2px solid #69f0ae !important; box-shadow: 0 0 8px rgba(105, 240, 174, 0.85), 0 0 16px rgba(105, 240, 174, 0.45) !important; }
.chat_pane__user_item__avatar.yc-af-double-ring img.u-avatar { border: 2px solid #ffffff !important; box-shadow: 0 0 0 3px #d4af37, 0 0 0 5px rgba(212, 175, 55, 0.35) !important; }
.chat_pane__user_item__avatar.yc-af-dashed img.u-avatar { border: 2px dashed #607d8b !important; }
.chat_pane__user_item__avatar.yc-af-dotted img.u-avatar { border: 2px dotted #8d6e63 !important; }
.chat_pane__user_item__avatar.yc-af-shadow-soft img.u-avatar { border: none !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28) !important; }
.chat_pane__user_item__avatar.yc-af-shadow-deep img.u-avatar { border: none !important; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.25) !important; }
.chat_pane__user_item__avatar.yc-af-vip-gold img.u-avatar { border: 3px solid #ffd700 !important; box-shadow: 0 0 10px rgba(255, 215, 0, 0.65), inset 0 0 6px rgba(255, 215, 0, 0.25) !important; }
.chat_pane__user_item__avatar.yc-af-rose-gold img.u-avatar { border: 2px solid #b76e79 !important; box-shadow: 0 0 8px rgba(183, 110, 121, 0.55) !important; }
.chat_pane__user_item__avatar.yc-af-emerald img.u-avatar { border: 2px solid #2e7d32 !important; box-shadow: 0 0 8px rgba(46, 125, 50, 0.45) !important; }
.chat_pane__user_item__avatar.yc-af-pulse img.u-avatar { border: 2px solid #3f51b5 !important; animation: yc-af-pulse-glow 2s ease-in-out infinite !important; }
.chat_pane__user_item__avatar.yc-af-hexagon img.u-avatar { border: 2px solid #5c6bc0 !important; }

.chat_pane__user_item__avatar.yc-af-gradient-sunset {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff6b6b, #feca57, #ff9ff3);
    display: inline-block;
}

.chat_pane__user_item__avatar.yc-af-gradient-ocean {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2196f3, #00bcd4, #4dd0e1);
    display: inline-block;
}

.chat_pane__user_item__avatar.yc-af-gradient-purple {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #7c4dff, #e040fb, #ea80fc);
    display: inline-block;
}

.chat_pane__user_item__avatar.yc-af-gradient-rainbow {
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f44336, #ff9800, #ffeb3b, #4caf50, #2196f3, #9c27b0);
    display: inline-block;
}

.chat_pane__user_item__avatar.yc-af-gradient-sunset img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-ocean img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-purple img.u-avatar,
.chat_pane__user_item__avatar.yc-af-gradient-rainbow img.u-avatar {
    border: none !important;
}

#chat__body__settings_pane__container__user-avatar-backgrounds .user-background-item.yc-af-preview-item {
    border: none !important;
    height: auto !important;
}