/* Anı emoji tepki kontrolü — tetikleyici + açılır emoji çubuğu (paylaşımlı) */
.react { position: relative; flex: 0 0 auto; }

.react-trigger {
    display: inline-flex; align-items: center; gap: .3rem;
    border: 1px solid var(--line); background: transparent;
    color: var(--text-dim); cursor: pointer;
    padding: .3rem .55rem; border-radius: 999px;
    font-size: .85rem; font-weight: 600; line-height: 1;
    transition: transform .12s, background .15s, border-color .15s;
}
.react-trigger:hover { background: var(--primary-soft, rgba(22,163,74,.1)); }
.react-trigger:active { transform: scale(.92); }
.react-trigger.reacted { border-color: var(--primary); background: var(--primary-soft, rgba(22,163,74,.12)); }
.react-stack { display: inline-flex; }
.react-stack span { font-size: 1.05rem; margin-left: -5px; }
.react-stack span:first-child { margin-left: 0; }
.react-empty { opacity: .6; }
.react-count { color: var(--text-dim); }

.react-bar {
    position: absolute; bottom: calc(100% + 8px); right: 0; z-index: 30;
    display: flex; gap: .15rem; padding: .3rem;
    background: var(--surface, #fff); border: 1px solid var(--line);
    border-radius: 999px; box-shadow: 0 8px 26px rgba(0,0,0,.18);
    animation: react-pop .14s ease;
}
.react-bar[hidden] { display: none; }
@keyframes react-pop { from { opacity: 0; transform: translateY(6px) scale(.92); } to { opacity: 1; transform: none; } }

.react-emoji {
    border: none; background: transparent; cursor: pointer;
    font-size: 1.35rem; line-height: 1;
    width: 38px; height: 38px; border-radius: 50%;
    display: grid; place-items: center;
    transition: transform .12s, background .15s;
}
.react-emoji:hover { transform: scale(1.25); background: var(--bg-2); }
.react-emoji.on { background: var(--primary-soft, rgba(22,163,74,.15)); }

/* Koyu zeminli izleyicide (dikey reels) uygun */
.vv-overlay .react-trigger { color: #fff; border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.08); }
.vv-overlay .react-trigger:hover { background: rgba(255,255,255,.16); }
.vv-overlay .react-count { color: rgba(255,255,255,.9); }
.vv-overlay .react-bar { bottom: calc(100% + 8px); left: 0; right: auto; }