/* LA_BLOG_CM RT0910: стили комментариев статьи блога. Подключается из themes/sunshine/layout/blog/read-blog.phtml всегда,
   поэтому работает и без la_feed.css (?oldfeed=1, откат LA_FX_LIVE=false). Раньше эти блоки лежали в la_feed.css. */
/* BLOGCOM0810: комментарии блога: аккуратные карточки, подписи действий, цитата в рамке, вложенные ответы */
.blog-comlist-container .la-cm{padding:14px 0;border-bottom:1px solid var(--border)}
.la-cm .la-cm-row{display:flex;gap:12px;align-items:flex-start}
.la-cm .la-cm-ava img{width:38px;height:38px;border-radius:50%;object-fit:cover;display:block}
.la-cm .la-cm-main{flex:1;min-width:0;width:auto!important;float:none!important;padding:0!important}
.la-cm .la-cm-main h5{margin:0 0 4px;font-size:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.la-cm .la-cm-main h5 .time{color:var(--muted);font-size:12px;font-weight:400}
.la-cm .la-cm-del{margin-left:auto;color:var(--muted);opacity:.6}.la-cm .la-cm-del:hover{opacity:1;color:#c0392b}
.la-cm .la-cm-t{margin:0 0 6px;font-size:15px;line-height:1.55;color:var(--text);word-break:break-word}
.la-cm .la-q{margin:0 0 8px;padding:7px 12px;border-left:3px solid var(--brand);background:var(--bg);border-radius:0 8px 8px 0;font-size:13.5px;color:var(--muted);line-height:1.45}
.la-cm .la-q b{display:block;color:var(--text);font-size:12.5px;margin-bottom:2px}
.la-cm .la-cm-act{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.la-cm .la-cm-b{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:var(--muted);font-size:13px;padding:5px 9px;border-radius:999px;cursor:pointer;line-height:1}
.la-cm .la-cm-b:hover{background:rgba(198,77,83,.09);color:var(--brand)}
.la-cm .la-cm-b span{font-variant-numeric:tabular-nums;min-width:0}
.la-cm .blog-comment-reply-cont{margin:6px 0 0 50px;padding-left:12px;border-left:2px solid var(--border)}
.la-cm .blog-comment-reply-cont .la-cm{border-bottom:0;padding:9px 0}
.la-cm .blog-comment-reply-cont .la-cm-ava img{width:30px;height:30px}
.la-cm .la-cm-box{margin:8px 0 0 50px;display:flex;gap:8px;align-items:flex-end;float:none!important;width:auto!important}
.la-cm .la-cm-box.hidden{display:none}
.la-cm .la-cm-box textarea{flex:1;border-radius:12px;border:1px solid var(--border);padding:9px 12px;font-size:14px;resize:vertical;min-height:44px;background:var(--card);color:var(--text)}
.la-cm .la-cm-send{flex:none;border:0;border-radius:999px;background:var(--brand);color:#fff;font-weight:600;font-size:13px;padding:10px 16px;cursor:pointer}
@media(max-width:600px){.la-cm .blog-comment-reply-cont,.la-cm .la-cm-box{margin-left:14px}.la-cm .la-cm-main h5{font-size:13.5px}}
.la-cm .la-q,.la-cm .la-q b{font-style:normal!important;font-family:inherit}
.la-cm .la-cm-box{flex-wrap:wrap}.la-cm .la-cm-box textarea{min-width:200px}.la-cm .la-cm-box .lb-emoji-bar{order:3;flex-basis:100%}
/* RT0910: комментарии блога как в мессенджере: поле во всю ширину и панель под ним (эмодзи во всплывашке, «Отправить» справа), плашка цитаты или «Ответ для Имя» над полем, подсветка новых комментариев без перезагрузки */
#respond .blog-com-box.la-rt-compose{overflow:visible!important;margin:0 0 8px;padding:0;float:none;width:auto}
#respond .la-rt-compose form{margin:0;padding:0}
#respond .la-rt-main{display:flex;align-items:flex-start;gap:12px;width:100%}
#respond .la-rt-main img.la-rt-ava{display:block!important;flex:none;width:38px!important;height:38px!important;margin:3px 0 0!important;border-radius:50%;object-fit:cover;float:none!important;position:static!important}
#respond .la-rt-field{position:relative;flex:1 1 auto;min-width:0;display:flex;flex-direction:column;background:var(--card,#fff);border:1px solid var(--border,#e6e1db);border-radius:14px;transition:border-color .15s ease,box-shadow .15s ease}
#respond .la-rt-field:focus-within{border-color:var(--brand,#c64d53);box-shadow:0 0 0 3px rgba(198,77,83,.14)}
#respond .la-rt-field textarea.la-rt-ta{display:block;flex:none!important;float:none!important;width:100%!important;max-width:100%;min-width:0!important;height:auto!important;min-height:44px;margin:0!important;padding:11px 14px 2px!important;border:0!important;border-radius:14px 14px 0 0!important;background:transparent!important;box-shadow:none!important;outline:0!important;resize:none!important;font-size:15px!important;line-height:1.5!important;color:var(--text,#2a2420)!important;overflow-y:hidden}
#respond .la-rt-compose .la-rt-field textarea.la-rt-ta{min-height:56px}
#respond .la-rt-field textarea.la-rt-ta::placeholder{color:var(--muted,#8b8178);opacity:1}
#respond .la-rt-bar{position:relative;display:flex;align-items:center;gap:6px;padding:2px 6px 6px}
#respond .la-rt-emo-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted,#8b8178);cursor:pointer;transition:background .15s ease,color .15s ease}
#respond .la-rt-emo-btn:hover,#respond .la-rt-emo-btn[aria-expanded="true"]{background:rgba(198,77,83,.10);color:var(--brand,#c64d53)}
#respond .la-rt-emo-btn:focus-visible,#respond .la-rt-bar .la-rt-send:focus-visible,#respond .la-rt-chip-x:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(198,77,83,.35)}
#respond .la-rt-msg{flex:1 1 auto;min-width:0;font-size:12.5px;line-height:1.3;color:#c0392b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .2s ease}
#respond .la-rt-msg.on{opacity:1}
#respond .la-rt-bar .la-rt-send{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;width:auto!important;min-width:0;height:34px;margin:0 0 0 auto!important;padding:0 15px 0 12px!important;border:0!important;border-radius:999px!important;background:var(--brand,#c64d53)!important;color:#fff!important;font-size:13.5px!important;font-weight:600;line-height:1!important;cursor:pointer;box-shadow:none;position:static!important;float:none!important;transition:opacity .15s ease,background .15s ease}
#respond .la-rt-bar .la-rt-send:hover{background:var(--la-brand-press,#b3434a)!important}
#respond .la-rt-bar .la-rt-send svg{flex:none}
#respond .la-rt-field.is-empty .la-rt-send{opacity:.55}
#respond .la-rt-bar .la-rt-send:disabled,#respond .la-rt-box.is-busy .la-rt-send{opacity:.5;cursor:default;pointer-events:none}
#respond .la-rt-pop{position:absolute;left:4px;bottom:calc(100% + 4px);z-index:60;display:grid;grid-template-columns:repeat(6,38px);gap:2px;padding:6px;background:var(--card,#fff);border:1px solid var(--border,#e6e1db);border-radius:14px;box-shadow:0 12px 32px rgba(40,25,20,.18);animation:laRtPop .14s ease-out}
#respond .la-rt-pop .la-rt-emo{width:38px;height:38px;margin:0;padding:0;border:0;border-radius:10px;background:transparent;font-size:21px;line-height:1;cursor:pointer;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;transition:background .12s ease,transform .12s ease}
#respond .la-rt-pop .la-rt-emo:hover,#respond .la-rt-pop .la-rt-emo:focus-visible{background:var(--bg,#f3f0ec);outline:0;transform:scale(1.08)}
#respond .la-rt-ctx{padding:8px 8px 0}
#respond .la-rt-ctx:empty{display:none}
#respond .la-rt-chip{display:flex;align-items:flex-start;gap:8px;min-width:0;animation:laRtPop .14s ease-out}
#respond .la-rt-chip.is-q{padding:6px 4px 6px 10px;border-left:3px solid var(--brand,#c64d53);border-radius:4px 10px 10px 4px;background:var(--bg,#f3f0ec)}
#respond .la-rt-chip-b{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.4;color:var(--muted,#766c66)}
#respond .la-rt-chip.is-q .la-rt-chip-b b{display:block;margin:0 0 1px;font-size:12.5px;font-weight:700;color:var(--brand,#c64d53);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#respond .la-rt-chip.is-q .la-rt-chip-b span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-word;color:var(--text,#2a2420)}
#respond .la-rt-chip.is-r{align-items:center;padding:0 0 0 4px}
#respond .la-rt-chip.is-r .la-rt-chip-b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#respond .la-rt-chip.is-r .la-rt-chip-b b{font-weight:700;color:var(--text,#2a2420)}
#respond .la-rt-chip-ic{display:inline-block;vertical-align:-3px;margin-right:6px;color:var(--brand,#c64d53)}
#respond .la-rt-chip-x{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted,#766c66);cursor:pointer}
#respond .la-rt-chip-x:hover{background:rgba(0,0,0,.06);color:var(--text,#2a2420)}
.la-cm .la-cm-box.la-rt-box{display:block;margin:8px 0 4px 50px;float:none!important;width:auto!important}
.la-cm .la-cm-box.la-rt-box.hidden{display:none!important}
.la-cm div.la-cm-t{white-space:pre-wrap;overflow-wrap:anywhere}
.la-cm .la-q .la-q-t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.la-cm .la-q{cursor:pointer}
.la-cm .la-q.is-open .la-q-t{display:block;-webkit-line-clamp:unset;overflow:visible}
@media (max-width:600px){.la-cm .la-cm-act{gap:0}.la-cm .la-cm-b{padding:5px 7px}}
@keyframes laRtPop{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes laRtIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes laRtGlow{0%,30%{background-color:rgba(198,77,83,.10);box-shadow:0 0 0 8px rgba(198,77,83,.10)}100%{background-color:rgba(198,77,83,0);box-shadow:0 0 0 8px rgba(198,77,83,0)}}
@keyframes laRtGlowD{0%,30%{background-color:rgba(240,137,142,.13);box-shadow:0 0 0 8px rgba(240,137,142,.13)}100%{background-color:rgba(240,137,142,0);box-shadow:0 0 0 8px rgba(240,137,142,0)}}
@keyframes laRtBump{0%{transform:scale(1)}40%{transform:scale(1.25)}100%{transform:scale(1)}}
.blog-comlist-container .la-cm.la-rt-new{border-radius:10px;animation:laRtIn .35s ease-out,laRtGlow 2.6s ease-out}
.la-cm .la-cm-b.la-rt-bump span{display:inline-block;animation:laRtBump .45s ease-out}
html[data-theme="dark"] .blog-comlist-container .la-cm.la-rt-new{animation:laRtIn .35s ease-out,laRtGlowD 2.6s ease-out}
html[data-theme="dark"] #respond .la-rt-field:focus-within{border-color:var(--la-brand-ink,#f0898e);box-shadow:0 0 0 3px rgba(240,137,142,.22)}
html[data-theme="dark"] #respond .la-rt-emo-btn:hover,html[data-theme="dark"] #respond .la-rt-emo-btn[aria-expanded="true"]{background:rgba(240,137,142,.14);color:var(--la-brand-ink,#f0898e)}
html[data-theme="dark"] #respond .la-rt-pop{box-shadow:0 14px 36px rgba(0,0,0,.55)}
html[data-theme="dark"] #respond .la-rt-pop .la-rt-emo:hover,html[data-theme="dark"] #respond .la-rt-pop .la-rt-emo:focus-visible{background:rgba(255,255,255,.07)}
html[data-theme="dark"] #respond .la-rt-chip.is-q{background:rgba(255,255,255,.05);border-left-color:var(--la-brand-ink,#f0898e)}
html[data-theme="dark"] #respond .la-rt-chip.is-q .la-rt-chip-b b,html[data-theme="dark"] #respond .la-rt-chip-ic{color:var(--la-brand-ink,#f0898e)}
html[data-theme="dark"] #respond .la-rt-chip-x:hover{background:rgba(255,255,255,.08)}
html[data-theme="dark"] #respond .la-rt-msg{color:#f0898e}
@media (max-width:600px){#respond .la-rt-main img.la-rt-ava{display:none!important}.la-cm .la-cm-box.la-rt-box{margin-left:0}#respond .la-rt-field textarea.la-rt-ta{font-size:16px!important}#respond .la-rt-pop{grid-template-columns:repeat(6,40px)}#respond .la-rt-pop .la-rt-emo{width:40px;height:40px}}
@media (max-width:420px){#respond .la-rt-bar .la-rt-send{width:38px!important;height:38px;padding:0!important}#respond .la-rt-bar .la-rt-send span{display:none}}
@media (prefers-reduced-motion:reduce){.blog-comlist-container .la-cm.la-rt-new,html[data-theme="dark"] .blog-comlist-container .la-cm.la-rt-new{animation:none;background-color:rgba(198,77,83,.08)}#respond .la-rt-pop,#respond .la-rt-chip,.la-cm .la-cm-b.la-rt-bump span{animation:none}}
/* OVF0910: ветка ответов сдвинута вправо, но ширина оставалась 100% и конец текста обрезался */
.la-cm .blog-comment-reply-cont{width:auto!important;max-width:none!important;box-sizing:border-box}
.la-cm .la-cm-main,.la-cm .la-cm-t{min-width:0;overflow-wrap:anywhere}
.la-cm .la-cm-box{width:auto!important;box-sizing:border-box}
