/* Shared inbox navigation, independent of the private-chat composer. */
/* Public conversation workspace. */
.comment-automation-banner {padding:16px;border-bottom:1px solid var(--chat-border);font-size:.8rem;}
.comment-automation-banner p {margin:9px 0;}
.comment-connection-warning {background:#382c22;color:#f7c597;border:1px solid #69503a;border-radius:10px;padding:14px;font-size:.84rem;line-height:1.6;}
.comment-mode button:not(:disabled) {cursor:pointer;opacity:1;}
.comment-empty { display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:65vh;padding:32px; }
.comment-empty h2 {font-size:1.4rem;margin:16px 0 8px;}
.comment-empty p {max-width:400px;color:var(--muted);line-height:1.7;}
#inbox-comment-list .inbox-comment-item {display:flex;gap:12px;padding:20px 16px;border-left:3px solid transparent;}
#inbox-comment-list .inbox-comment-item.selected {border-left-color:var(--primary);background:var(--chat-selected);}
.comment-avatar {position:relative;width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:#303746;display:flex;align-items:center;justify-content:center;color:#dce5f5;font-size:13px;overflow:visible!important;}
.comment-avatar.instagram {background:#433042;color:#f6d3ef;}
#inbox-comment-list .comment-avatar {display:flex;}
.comment-avatar.facebook {background:#293e58;color:#c6e1ff;}
.comment-avatar img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;}
.comment-network {position:absolute;bottom:-3px;right:-3px;background:var(--chat-panel);border:2px solid var(--chat-panel);border-radius:50%;font-size:13px;font-style:normal;width:19px;height:19px;display:flex;align-items:center;justify-content:center;color:#f28cce;z-index:1;}
.facebook .comment-network {color:#83b8ff;}
.comment-item-body {min-width:0;flex:1;}
.comment-item-heading {display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.comment-item-heading strong {font-size:.86rem;overflow-wrap:anywhere;}
.comment-item-heading time {color:var(--muted);font-size:.68rem;white-space:nowrap;flex:none;}
#inbox-comment-list .comment-badge {display:inline-block;font-size:.64rem;padding:4px 8px;border-radius:20px;background:#372c22;color:#f8b67d;}
#inbox-comment-list .comment-badge.replied {color:#9ed5b9;background:#24352e;}
.comment-detail-header {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 28px;border-bottom:1px solid var(--chat-border);}
.comment-detail-header h2 {font-size:1rem;margin:0;}
.comment-mode {display:flex;align-items:center;border:1px solid var(--chat-border);border-radius:10px;font-size:.72rem;overflow:hidden;}
.comment-mode span,.comment-mode button {padding:9px 12px;white-space:nowrap;}
.comment-mode .active {background:var(--chat-selected);color:var(--primary);}
.comment-mode button {border:0;background:none;color:var(--muted);font:inherit;opacity:.65;}
.comment-workspace {display:flex;flex-direction:column;gap:26px;max-width:1100px;margin:auto;padding:28px;min-height:calc(100% - 80px);box-sizing:border-box;}
.comment-post {display:flex;align-items:center;gap:22px;padding-bottom:26px;border-bottom:1px solid var(--chat-border);}
.comment-post-image,.comment-post-placeholder {width:190px;height:138px;object-fit:cover;border-radius:12px;flex-shrink:0;}
.comment-post-placeholder {display:grid;place-items:center;background:var(--chat-panel);border:1px solid var(--chat-border);color:var(--muted);font-size:32px;}
.comment-post-copy {min-width:0;}
.comment-post h3 {font-size:1rem;margin:9px 0;}
.comment-post p {font-size:.85rem;line-height:1.65;color:var(--muted);white-space:pre-wrap;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
.comment-post a {color:var(--primary);font-size:.82rem;text-decoration:none;display:inline-block;margin-top:9px;}
.comment-thread {flex:1;}
.comment-thread h3 {font-size:1rem;margin:0 0 8px;}
.comment-helper {font-size:.76rem;color:var(--muted);line-height:1.6;}
.comment-message {display:flex;gap:14px;margin:26px 0;}
.comment-message-body {min-width:0;max-width:85%;}
.comment-bubble {background:var(--chat-panel);border:1px solid var(--chat-border);border-radius:0 14px 14px 14px;padding:16px 18px;font-size:.9rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;margin:10px 0 0;}
.comment-message.own .comment-bubble {border-color:#584032;background:var(--chat-selected);}
.comment-composer {border:1px solid var(--chat-border);border-radius:14px;padding:20px;background:var(--chat-panel);margin-top:20px;}
.comment-composer label {display:block;font-size:.88rem;font-weight:600;margin-bottom:16px;}
.comment-composer textarea {box-sizing:border-box;width:100%;resize:vertical;min-height:95px;max-height:300px;border:1px solid var(--chat-border);border-radius:9px;background:var(--chat-bg);color:var(--text);font:inherit;font-size:.88rem;padding:14px;line-height:1.6;}
.comment-composer textarea:focus {outline:2px solid var(--primary);outline-offset:1px;}
.comment-composer-footer {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;}
.comment-counter {color:var(--muted);font-size:.68rem;margin-left:auto;}
.comment-send {border:0;border-radius:9px;background:var(--primary);color:#171719;padding:12px 18px;font:inherit;font-size:.84rem;font-weight:700;cursor:pointer;}
.comment-send:disabled {opacity:.5;cursor:wait;}
.comment-send-status {font-size:.8rem;color:#9ed5b9;margin:10px 0 0;line-height:1.5;}
.comment-send-status:empty {display:none;}
.comment-send-status.error {color:#ffaaa2;}
.comment-back {display:none;}
@media(max-width:760px){
  #chats-layout.inbox-view-comments.comment-open .chat-list-pane {display:none!important;}
  #chats-layout.inbox-view-comments:not(.comment-open) .inbox-comments-detail {display:none!important;}
  .comment-back {display:block;background:none;border:0;color:var(--primary);padding:0;font:inherit;font-size:.8rem;}
  .comment-detail-header {padding:16px;flex-wrap:wrap;}
  .comment-mode {margin-left:auto;}
  .comment-workspace {padding:18px;gap:20px;}
  .comment-post {gap:14px;align-items:flex-start;}
  .comment-post-image,.comment-post-placeholder {width:100px;height:100px;}
  .comment-post p {-webkit-line-clamp:3;}
  .comment-composer {padding:14px;}
  .comment-composer-footer .comment-helper {flex-basis:100%;}
  .comment-message-body {max-width:calc(100% - 56px);}
}
#chats-layout [hidden] { display: none !important; }
#chats-layout .chat-list-pane { display: flex; flex-direction: column; }
#chats-layout .inbox-search { padding-top: 10px; }
#chats-layout .inbox-search input { width: 100%; min-width: 0; }
#chats-layout.inbox-view-comments { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); }
#chats-layout .chat-list-header { flex-wrap: wrap; gap: 12px; }
.inbox-tabs { display: flex; gap: 4px; align-items: center; }
.inbox-tab { border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); font: inherit; font-size: 1.05rem; font-weight: 700; padding: 8px 4px; cursor: pointer; }
.inbox-tab.active { color: var(--text); border-bottom-color: var(--primary); }
.inbox-tab:focus-visible, .inbox-channel:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.inbox-channels { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px; border-bottom: 1px solid var(--chat-border); }
.inbox-channel { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--chat-border); border-radius: 9px; padding: 7px 9px; background: transparent; color: var(--muted); font: inherit; font-size: .73rem; cursor: pointer; }
.inbox-channel.active { color: var(--text); background: var(--chat-selected); border-color: var(--primary); }
.inbox-channel:not(:disabled):hover { background: var(--chat-hover); }
.inbox-channel:disabled { opacity: .5; cursor: not-allowed; }
.inbox-channel small { font-size: .58rem; }
.inbox-channel-symbol { font-size: 1rem; font-weight: 800; width: 17px; text-align: center; }
.inbox-channel[data-channel="facebook"] .inbox-channel-symbol { color: #73aaff; }
.inbox-channel[data-channel="instagram"] .inbox-channel-symbol { color: #e793d7; }
.inbox-channel[data-channel="whatsapp"] .inbox-channel-symbol { color: #55bd91; }
#inbox-chats-panel { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
#inbox-chats-panel .chat-list { flex: 1; min-height: 0; overflow-y: auto; }
#inbox-comments-panel { flex: 1; overflow-y: auto; min-height: 0; }
.inbox-comment-filters { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px; }
.inbox-connection-empty { padding: 28px 18px; }
.inbox-connection-empty h3 { font-size: 1rem; margin: 16px 0 10px; }
.inbox-connection-empty p, .inbox-comments-insight p { color: var(--muted); font-size: .85rem; line-height: 1.65; }
.inbox-status { display: inline-block; font-size: .67rem; padding: 5px 8px; border: 1px solid var(--chat-border); border-radius: 20px; color: var(--muted); }
.inbox-result-count { padding: 0 14px; }
.inbox-comment-item { display: block; width: 100%; text-align: left; padding: 18px 14px; background: transparent; color: var(--text); border: 0; border-bottom: 1px solid var(--chat-border); font: inherit; cursor: pointer; }
.inbox-comment-item:hover, .inbox-comment-item.selected { background: var(--chat-selected); }
.inbox-comment-item > * { display: block; overflow-wrap: anywhere; }
.inbox-comment-item span { margin: 8px 0; font-size: .86rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.inbox-comment-item small { color: var(--muted); font-size: .7rem; }
.inbox-comment-content { white-space: pre-wrap; overflow-wrap: anywhere; }
.inbox-comments-detail { grid-column: 2; grid-row: 1; min-width: 0; overflow-y: auto; background: var(--chat-bg); }
.inbox-comments-insight { grid-column: 3; grid-row: 1; padding: 26px 18px; background: var(--chat-panel); border-left: 1px solid var(--chat-border); overflow-y: auto; }
.inbox-public-notice { padding: 18px 22px; border-bottom: 1px solid var(--chat-border); color: var(--muted); font-size: .78rem; line-height: 1.5; }
.inbox-comment-welcome { max-width: 580px; margin: auto; padding: 52px 28px; }
.inbox-comment-symbol { color: var(--primary); font-size: 3rem; }
.inbox-comment-welcome h2 { font-size: 1.65rem; line-height: 1.25; margin: 14px 0; }
.inbox-comment-welcome p { color: var(--muted); line-height: 1.7; font-size: .9rem; }
.inbox-readiness { margin-top: 32px; display: grid; gap: 12px; }
.inbox-readiness > div { padding: 18px; border: 1px solid var(--chat-border); border-radius: 12px; }
.inbox-readiness strong, .inbox-readiness span { display: block; }
.inbox-readiness span { margin-top: 8px; color: var(--muted); font-size: .78rem; line-height: 1.55; }
.inbox-eyebrow { color: var(--muted); font-size: .65rem; letter-spacing: .16em; }
.inbox-comments-insight h3 { margin: 14px 0; }
.inbox-comments-insight label { display: block; margin: 24px 0 10px; font-size: .78rem; }
.inbox-comments-insight select { width: 100%; }
.inbox-safety-note { border-top: 1px solid var(--chat-border); padding-top: 20px; margin-top: 24px; color: var(--muted); font-size: .78rem; line-height: 1.65; }
#chats-layout.inbox-view-comments #chat-detail, #chats-layout.inbox-view-comments #chat-insight,
#chats-layout.inbox-view-comments #chat-delete-mode, #chats-layout.inbox-view-comments #chat-more-filters { display: none !important; }
@media (max-width: 1100px) {
  #chats-layout.inbox-view-comments { grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); }
  .inbox-comments-insight { display: none; }
}
@media (max-width: 760px) {
  #chats-layout.inbox-view-comments { display: flex; flex-direction: column; overflow-y: auto; }
  #chats-layout.inbox-view-comments .chat-list-pane { display: flex !important; flex: none; width: 100%; min-height: 320px; }
  .inbox-comment-welcome { padding: 24px 20px; }
  .inbox-comments-detail { overflow: visible; flex: none; }
  .inbox-comments-insight { display: block; overflow: visible; border-left: 0; }
}