/* Keep the list/thread ownership hooks intact; channels are a separate pane. */
html:root[data-theme] #page-conversas .conv-layout { grid-template-columns: 220px minmax(240px,320px) minmax(0,1fr) !important; height: calc(100dvh - 160px) !important; min-height: 420px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-1) !important; }
html:root[data-theme] #conv-boxes { background: var(--surface-1) !important; border-color: var(--line) !important; min-width: 0; }
html:root[data-theme] #conv-list, html:root[data-theme] #conv-thread { min-width: 0; background: var(--surface-1) !important; }
html:root[data-theme] #conv-list > .conv-item { border-color: var(--line) !important; }
html:root[data-theme] #conv-list > .conv-item.active { background: var(--surface-3) !important; box-shadow: none !important; }
html:root[data-theme] .conv-bubble { background: var(--surface-2) !important; color: var(--ink-1) !important; border: 1px solid var(--line) !important; box-shadow: none !important; }
html:root[data-theme] .conv-bubble.outbound { background: var(--surface-3) !important; }
html:root[data-theme] .fg-channel-item { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 42px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--ink-2); padding: 9px 10px; text-align: left; font: 500 13px var(--font-ui); cursor: pointer; }
html:root[data-theme] .fg-channel-item:hover { background: var(--surface-2); color: var(--ink-1); }
html:root[data-theme] .fg-channel-item.active { border-color: var(--accent-line); background: var(--accent-soft); color: var(--ink-1); }
html:root[data-theme] .fg-channel-name { min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.35; }
html:root[data-theme] .fg-channel-name small { display: block; color: var(--ink-3); font-size: 11px; margin-top: 3px; }
html:root[data-theme] .fg-channel-chevron { width: 15px; flex: 0 0 15px; margin-left: auto; }
html:root[data-theme] [aria-expanded="true"] > .fg-channel-chevron { transform: rotate(180deg); }
html:root[data-theme] .fg-channel-children { margin: 2px 0 10px 12px; padding-left: 8px; border-left: 1px solid var(--line); }
html:root[data-theme] .fg-channel-children[hidden] { display: none; }
html:root[data-theme] .fg-channel-state { font-size: 12px; color: var(--ink-3); padding: 8px 10px; line-height: 1.45; }
html:root[data-theme] .conv-template-body, html:root[data-theme] .conv-template-header, html:root[data-theme] .conv-template-footer { white-space: pre-wrap; overflow-wrap: anywhere; }
html:root[data-theme] .conv-template-header { font-weight: 700; margin-bottom: 4px; }
html:root[data-theme] .conv-template-footer { color: var(--ink-3); font-size: 11px; margin-top: 6px; }
html:root[data-theme] .conv-template-media { display: block; width: 100%; max-height: 360px; object-fit: contain; border-radius: 8px; margin-bottom: 8px; }
html:root[data-theme] .conv-template-media-fallback { color: var(--ink-3); font-size: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; }
html:root[data-theme] .conv-template-buttons { display: grid; gap: 4px; border-top: 1px solid var(--line); padding-top: 8px; margin-top: 9px; }
html:root[data-theme] .conv-template-button { display: block; padding: 10px; border: 1px solid var(--line); border-radius: 8px; text-align: center; color: var(--ink-1); text-decoration: none; font-size: 13px; font-weight: 600; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--surface-1); }
html:root[data-theme] .conv-template-document { display: block; padding: 12px; color: var(--ink-1); overflow-wrap: anywhere; }
html:root[data-theme] .conv-template-card + .conv-template-card { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 12px; }
@media (min-width:768px) and (max-width:1199px) {
  html:root[data-theme] #page-conversas .conv-layout { grid-template-columns: 180px minmax(220px,1fr) !important; }
  html:root[data-theme] #page-conversas .conv-layout > #conv-thread { grid-column: 2; grid-row: 1; display: none; }
  html:root[data-theme] #page-conversas.conv-thread-open .conv-layout > #conv-thread { display: flex; }
  html:root[data-theme] #page-conversas.conv-thread-open .conv-listpane { display: none; }
}
@media (max-width:767px) {
  html:root[data-theme] #page-conversas .conv-layout { display: flex !important; flex-direction: column; height: auto !important; min-height: calc(100dvh - 150px); overflow: visible !important; }
  html:root[data-theme] #conv-boxes { display: block !important; width: 100% !important; max-height: 260px; overflow-y: auto; border-bottom: 1px solid var(--line); }
  html:root[data-theme] #conv-boxes .conv-boxes-group:not(#fg-conv-channels) { display: none; }
  html:root[data-theme] #page-conversas .conv-listpane { width: 100% !important; min-height: 300px; flex: 1; }
  html:root[data-theme] #page-conversas .conv-layout > #conv-thread { display: none !important; width: 100% !important; min-height: calc(100dvh - 180px); }
  html:root[data-theme] #page-conversas.conv-thread-open #conv-boxes, html:root[data-theme] #page-conversas.conv-thread-open .conv-listpane { display: none !important; }
  html:root[data-theme] #page-conversas.conv-thread-open .conv-layout > #conv-thread { display: flex !important; }
  html:root[data-theme] #conv-input-wrap { padding-bottom: max(12px,env(safe-area-inset-bottom)); }
}
html:root[data-theme] #page-conversas #conv-boxes { display: block !important; }
html:root[data-theme] #page-conversas .conv-av-ini { background: var(--surface-3) !important; color: var(--ink-1) !important; border: 1px solid var(--line); }
html:root[data-theme] #conv-tpl-banner { border-left-width: 1px !important; }
@media (max-width:767px) {
  html:root[data-theme] #page-conversas.conv-thread-open #conv-boxes { display: none !important; }
  html:root[data-theme] #page-conversas #conv-boxes { flex: 0 0 auto; max-height: 260px !important; overflow-y: auto !important; }
}
@media (max-width:767px) {
  html:root[data-theme] #page-conversas > .conv-topbar { padding: 0 0 16px !important; display: flex; flex-wrap: wrap; gap: 10px; }
  html:root[data-theme] #page-conversas .conv-topbar-spacer { display: none; }
  html:root[data-theme] #page-conversas .conv-title { flex: 1; }
  html:root[data-theme] #page-conversas .conv-search { order: 3; width: auto !important; max-width: none !important; min-width: 0 !important; flex: 1 1 calc(100% - 54px); padding: 8px 10px; }
  html:root[data-theme] #page-conversas .conv-search input { width: 100% !important; min-width: 0; display: block !important; }
  html:root[data-theme] #page-conversas .conv-filter-wrap { order: 4; }
}