﻿/* лайки в постах Риджа | legume
   Только состояния и всплывашки: сама пилюля счётчика (.post-rating) —
   в стилях форума. Цвета — переменные темы, светлая/тёмная сами. */

/* ---------- состояния счётчика ---------- */
.post-rating a{ cursor:pointer !important; transition:opacity .2s; }
.post-rating p.container::before{ transition:color .2s, transform .15s; }
.post-rating:not(.rated):hover p.container::before{ color:rgb(var(--link)); transform:scale(1.15); }
.post-rating.rated p.container::before{ color:rgb(var(--link)); }   /* уже лайкнул — сердце залито цветом */
.post-rating.rated a{ cursor:default !important; }
.post-rating a.is-loading{ opacity:.45; }
.post-vote.rated{ opacity:.45; pointer-events:none; }

/* ---------- «кто оценил» при наведении ---------- */
.post-rating{ position:relative; }
.post-rating .like-hover{
    position:absolute; right:0; bottom:calc(100% + 10px); z-index:10000;
    min-width:200px; max-width:280px; padding:10px 12px; box-sizing:border-box;
    border-radius:var(--glass-radius-sm, 10px);
    background:rgba(var(--pun-light), .96);
    -webkit-backdrop-filter:blur(var(--glass-blur, 14px)); backdrop-filter:blur(var(--glass-blur, 14px));
    border:1px solid var(--glass-border);
    box-shadow:var(--glass-shadow-outer);
    color:rgb(var(--text)); text-align:left;
    opacity:0; transform:translateY(6px); pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
}
.post-rating .like-hover.is-visible{ opacity:1; transform:none; pointer-events:auto; }
.post-rating .like-hover::after{
    content:""; position:absolute; top:100%; right:22px;
    width:10px; height:6px; background:inherit;
    clip-path:polygon(50% 100%, 0 0, 100% 0);
}
.like-hover-title{
    padding:0 4px 8px; font:400 13px/1 var(--font2); font-style:italic;
    color:rgba(var(--text), .6); text-transform:lowercase;
}
.like-hover-users{ display:flex; flex-direction:column; gap:2px; max-height:220px; overflow-y:auto; }

.punbb .like-user, .like-user{
    display:flex !important; align-items:center; gap:9px;
    width:auto !important; height:auto !important;
    padding:4px 6px; border-radius:8px;
    color:rgb(var(--text)) !important; text-decoration:none !important;
    font:400 12px var(--font) !important; white-space:nowrap;
    transition:background .15s;
}
.like-user:hover{ background:rgba(var(--link), .12); }
.like-user img{ width:26px; height:26px; border-radius:50%; object-fit:cover; flex:none; background:rgba(var(--text), .1); }
.like-user span{ overflow:hidden; text-overflow:ellipsis; }
.like-more{
    margin-top:4px; padding:6px 0; border-radius:8px; cursor:pointer; text-align:center;
    font:600 11px var(--font5); text-transform:lowercase; color:rgb(var(--link));
}
.like-more:hover{ background:rgba(var(--link), .12); }

/* ---------- окно со всеми ---------- */
.voters-overlay{
    position:fixed; inset:0; z-index:100000;
    display:flex; align-items:center; justify-content:center; padding:16px;
    background:rgba(10, 15, 16, .45);
    opacity:0; visibility:hidden; transition:opacity .2s;
}
.voters-overlay.is-active{ opacity:1; visibility:visible; }
.voters-modal{
    display:flex; flex-direction:column; box-sizing:border-box;
    width:100%; max-width:400px; max-height:80vh; padding:18px 20px;
    border-radius:var(--glass-radius-sm, 10px);
    background:rgb(var(--pun-light)); color:rgb(var(--text));
    border:1px solid var(--glass-border); box-shadow:var(--glass-shadow-outer);
    transform:translateY(8px); transition:transform .2s;
}
.voters-overlay.is-active .voters-modal{ transform:none; }
.voters-modal-header{
    display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;
    font:400 18px var(--font2); font-style:italic; text-transform:lowercase;
}
.voters-modal-close{ cursor:pointer; font:300 24px/1 var(--font); color:rgba(var(--text), .5); }
.voters-modal-close:hover{ color:rgb(var(--link)); }
.voters-modal-list{ display:grid; grid-template-columns:1fr 1fr; gap:4px 8px; overflow-y:auto; }

/* встроенная подсказка форума «Оценили / Показать всех» — дублирует нашу */
.tipsy.post-voters-tip{ display:none !important; }

/* у верхнего поста места сверху нет — открываемся вниз */
.post-rating .like-hover.is-below{ bottom:auto; top:calc(100% + 10px); }
.post-rating .like-hover.is-below::after{ top:auto; bottom:100%; clip-path:polygon(50% 0, 0 100%, 100% 100%); }

/* сердечко репутации в профиле поста ведёт на respect.php игрока:
   спрятанную ссылку «Репутация» растягиваем прозрачным слоем на всю пилюлю */
.post-author li.pa-respect{ position:relative; cursor:pointer; }
.post-author li.pa-respect > .fld-name{
    display:block !important; position:absolute; inset:0; z-index:3;
    margin:0 !important; font-size:0; line-height:0;
}
.post-author li.pa-respect > .fld-name a{ position:absolute; inset:0; }

/* «+ с комментарием» (оценка через окно форума): движок отдаёт блок
   с style="display:none" у всех постов — показываем, как на Ноте.
   Своего поста и гостя это не касается: им блок не приходит вовсе. */
.punbb .post .post-vote{ display:block !important; }

/* число новых ЛС в меню: «mess. (1)» — data-count ставит ridge-likes.js */
#navpm a[data-count]::after{
    content:"(" attr(data-count) ")";
    margin-left:4px;
    color:rgb(var(--link));
    font-style:normal;
    font-weight:700;
}
