/* Deep Forest Emerald: semantic colors only; layout stays in theme.css.
   Explicit dark roots opt out. No dark-mode implementation existed at this change. */
:root:not([data-theme="dark"]):not([data-color-mode="dark"]):not(.dark) {
  --nav-header-bg: #063F32;
  --nav-sidebar-bg: #0B503E;
  --nav-active-bg: #032D24;
  --nav-text: #FFFFFF;
  --app-bg: #D8E2DA;
  --conversation-list-bg: #DCE5DF;
  --chat-area-bg: #CEDBD1;
  --customer-panel-bg: #E5EBE6;
  --border-default: #B6C8BB;
  --text-primary: #20382B;
  --text-secondary: #536B5B;
  --surface-bg: #F3F6F3;
  --conversation-read-bg: #DCE5DF;
  --conversation-read-text: #294536;
  --conversation-read-preview: #62766A;
  --conversation-unread-bg: #145C43;
  --conversation-unread-text: #FFFFFF;
  --conversation-unread-preview: #E2F1E7;
  --conversation-unread-time: #D1E5D8;
  --conversation-selected-bg: #247E5A;
  --conversation-selected-text: #FFFFFF;
  --accent-champagne: #E8C77D;
  --unread-badge-bg: #E8C77D;
  --unread-badge-text: #273C2F;
  --conversation-read-hover-bg: #CADBD0;
  --conversation-unread-hover-bg: #0F4C37;
  --message-customer-bg: #F3F6F3;
  --message-customer-text: #20382B;
  --message-sale-bg: #A9D1B7;
  --message-sale-text: #173D29;
  --message-border: #B6C8BB;
  --message-time: #536B5B;
  --composer-bg: #F3F6F3;
  --composer-text: #20382B;
  --composer-border: #B6C8BB;
  --action-primary-bg: #0B6047;
  --action-primary-hover-bg: #074A36;
  --crm-stage-new-bg: #E8C77D;
  --crm-content-bg: #FFFFFF;
  --crm-content-muted: #F8FAF9;
  --crm-border-color: #E3E9E5;
  --crm-table-head-bg: #EBEFEC;
  --crm-active-bg: #18774F;
  --crm-active-text: #FFFFFF;
  --crm-inactive-bg: #FBEDEF;
  --crm-inactive-text: #913748;
  --crm-stage-new-text: #273C2F;
  --crm-stage-qualified-bg: #DCEADF;
  --crm-stage-qualified-text: #28533A;
  --crm-stage-customer-bg: #A9D1B7;
  --crm-stage-customer-text: #173D29;
  --crm-stage-inactive-bg: #E7EAE7;
  --crm-stage-inactive-text: #536B5B;
  /* AA variants for compact copy: requested preview/time colors fall below
     4.5:1 on read-hover, chat and app backgrounds. See forest-contrast-report. */
  --text-compact-aa: #4B6253;
  --text-error: #8F302B;
  --focus-on-light: #0B6047;
  --focus-on-dark: #E8C77D;
  --sapphire: var(--action-primary-bg);
  --sapphire-dark: var(--action-primary-hover-bg);
  --sapphire-soft: var(--conversation-read-hover-bg);
  --line: var(--border-default);
  --blue: var(--action-primary-bg);
  --blue-soft: var(--conversation-read-hover-bg);
  --green: var(--action-primary-bg);
  --navy: var(--text-primary);
  --muted: var(--text-compact-aa);
  --panel: var(--surface-bg);
  color-scheme: light;
  background: var(--app-bg);
  color: var(--text-primary);

  & body { background: var(--app-bg); color: var(--text-primary); }
  & .app-shell { background: var(--app-bg); border-color: var(--border-default); box-shadow: none; }
  & .workspace { background: var(--app-bg); }
  & .topbar { background: var(--nav-header-bg); }
  & .channel-rail, & .rail { background: var(--nav-sidebar-bg); }
  & .topbar :is(.brand-name, .brand-name span, .module-tab, .profile-button, .icon-button, .chevron, .sync-state),
  & .channel-rail :is(.rail-condition-filters button, .source-rail-filters summary) { color: var(--nav-text); }
  & .brand-mark { background: var(--nav-sidebar-bg); border-color: var(--border-default); color: var(--nav-text); box-shadow: none; }
  & .module-tab.active, & .module-tab:hover,
  & .rail-condition-filters button.selected, & .rail-condition-filters button:hover,
  & .source-rail-filters[open] summary, & .source-rail-filters summary:hover,
  & .page-rail-button:hover, & .page-rail-button.has-page-filter { background: var(--nav-active-bg); color: var(--nav-text); box-shadow: none; }
  & .nav-count { background: var(--nav-active-bg); color: var(--nav-text); }
  & .topbar .icon-button { background: var(--nav-sidebar-bg); }
  & .page-rail-button { background: var(--nav-sidebar-bg); border-color: var(--border-default); }
  & .page-rail-button > i { background: var(--accent-champagne); border-color: var(--nav-sidebar-bg); }
  & .page-filter-sliders i::after { border-color: var(--nav-sidebar-bg); }
  & :is(.brand-mark, .avatar, .avatar-customer, .avatar-agent, .channel-dot, .page-filter-channel) { background-image: none; }
  & :is(.avatar, .avatar-customer, .avatar-agent, .message-avatar, .connected-page-avatar) { background: var(--customer-panel-bg); color: var(--text-primary); }
  & :is(.channel-dot, .page-filter-channel) { background: var(--nav-sidebar-bg); color: var(--nav-text); }
  & :is(.group-mosaic, .page-rail-mosaic) { background: var(--conversation-list-bg); }
  & :is(.group-mosaic b, .page-rail-mosaic b) { background: var(--customer-panel-bg); color: var(--text-primary); }
  & :is(.group-mosaic .mosaic-instagram, .page-rail-mosaic .mosaic-instagram) { background: var(--message-sale-bg); color: var(--message-sale-text); }

  & .conversation-list, & .conversation-items { background: var(--conversation-list-bg); border-color: var(--border-default); }
  & .conversation-list .search-box { background: var(--conversation-list-bg); border-color: var(--border-default); color: var(--text-compact-aa); }
  & .search-box input { color: var(--text-primary); }
  & .search-box span, & .search-box input::placeholder { color: var(--text-compact-aa); opacity: 1; }
  & .conversation-item { background: var(--conversation-read-bg); color: var(--conversation-read-text); border-color: var(--border-default); box-shadow: none; }
  & .conversation-item .conversation-topline strong { color: var(--conversation-read-text); }
  & .conversation-item :is(.conversation-preview, .conversation-time) { color: var(--text-compact-aa); }
  & .conversation-item .conversation-preview { display: block; }
  & .conversation-items { overflow-x: hidden; }
  & .conversation-item .avatar { background: var(--surface-bg); color: var(--conversation-read-text); box-shadow: none; }
  & .conversation-item:hover { background: var(--conversation-read-hover-bg); }
  & .conversation-item.is-unread { background: var(--conversation-unread-bg); color: var(--conversation-unread-text); }
  & .conversation-item.is-unread .conversation-topline strong { color: var(--conversation-unread-text); }
  & .conversation-item.is-unread .conversation-preview { color: var(--conversation-unread-preview); padding-right: 32px; }
  & .conversation-item.is-unread .conversation-time { color: var(--conversation-unread-time); }
  & .conversation-item.is-unread .avatar { background: var(--nav-header-bg); color: var(--nav-text); }
  & .conversation-item.is-unread:hover { background: var(--conversation-unread-hover-bg); }
  & .conversation-item.active, & .conversation-item.active:hover { background: var(--conversation-selected-bg); color: var(--conversation-selected-text); box-shadow: none; }
  & .conversation-item.active :is(.conversation-topline strong, .conversation-preview, .conversation-time) { color: var(--conversation-selected-text); }
  & .conversation-item.active::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent-champagne); }
  & .conversation-unread-badge { position: absolute; right: 14px; bottom: 12px; min-width: 18px; height: 18px; padding: 0 5px; display: grid; place-items: center; border-radius: 10px; background: var(--unread-badge-bg); color: var(--unread-badge-text); font: 700 10px var(--ui-font); }
  & .conversation-item:focus-visible { outline: 2px solid var(--accent-champagne); outline-offset: -3px; }
  & .conversation-item:not(.is-unread):not(.active):focus-visible { outline-color: var(--focus-on-light); }
  & :is(.conversation-pagination, .list-footer) { background: var(--conversation-list-bg); color: var(--text-compact-aa); border-color: var(--border-default); }
  & :is(.conversation-pagination button, .list-footer button) { background: var(--surface-bg); color: var(--text-secondary); border-color: var(--border-default); }
  & :is(.live-dot, .sync-state i, .unread-dot) { background: var(--accent-champagne); box-shadow: none; }

  & .thread-panel, & .messages { background: var(--chat-area-bg); border-color: var(--border-default); }
  & :is(.thread-header, .thread-meta, .reply-tools) { background: var(--surface-bg); border-color: var(--border-default); }
  & .thread-person h2 { color: var(--text-primary); }
  & :is(.thread-person p, .status-label, .header-separator, .thread-actions .icon-button, .thread-actions .secondary-button, .add-tag) { color: var(--text-secondary); }
  & .secondary-button { background: var(--customer-panel-bg); border-color: var(--border-default); }
  & :is(.tag, .resolve-button, .item-tag, .stage-dot, .task-icon) { background: var(--conversation-list-bg); color: var(--text-primary); border-color: var(--border-default); }
  & .message-bubble { background: var(--message-customer-bg); color: var(--message-customer-text); outline: 1px solid var(--message-border); }
  & .message-row.outgoing .message-bubble { background: var(--message-sale-bg); color: var(--message-sale-text); outline-color: var(--message-border); }
  & .message-row.outgoing .message-avatar { background: var(--message-sale-bg); color: var(--message-sale-text); }
  & :is(.message-meta, .day-divider) { color: var(--text-compact-aa); }
  & .day-divider::before, & .day-divider::after { background: var(--border-default); }
  & .reply-tools-label { color: var(--text-secondary); }
  & .quick-reply { background: var(--surface-bg); color: var(--text-secondary); border-color: var(--border-default); }
  & .quick-reply:hover { background: var(--conversation-read-hover-bg); color: var(--text-primary); border-color: var(--action-primary-bg); }
  & .composer { background: var(--composer-bg); color: var(--composer-text); border-color: var(--composer-border); }
  & .composer textarea { background: var(--composer-bg); color: var(--composer-text); }
  & .composer textarea::placeholder { color: var(--text-secondary); opacity: 1; }
  & :is(.composer-tools button, .send-hint) { color: var(--text-secondary); }
  & :is(.send-button, .channel-primary, .workflow-save, .small-primary, .create-order-button, .return-inbox) { background: var(--action-primary-bg); color: var(--nav-text); border-color: var(--action-primary-bg); box-shadow: none; }
  & :is(.send-button, .channel-primary, .workflow-save, .small-primary, .create-order-button, .return-inbox):hover { background: var(--action-primary-hover-bg); border-color: var(--action-primary-hover-bg); }

  & .customer-panel, & .panel-content, & .panel-tabs, & .panel-tab { background: var(--customer-panel-bg); border-color: var(--border-default); }
  & .panel-tab { color: var(--text-secondary); }
  & .panel-tab.active { color: var(--text-primary); }
  & .panel-tab.active::after { background: var(--action-primary-bg); }
  & .customer-card { border-color: var(--border-default); }
  & :is(.section-title h3, .customer-name-row strong, .order-title h3, .order-customer strong, .customer-name-row, .customer-tags) { color: var(--text-primary); }
  & :is(.section-icon, .green-icon, .orange-icon, .purple-icon) { background: var(--conversation-list-bg); color: var(--text-secondary); }
  & :is(.detail-list dt, .detail-list dd, .customer-id, .activity-count, .customer-card p, .customer-card .text-link, .customer-card .icon-button, .lead-stage strong, .lead-stage span, .next-task strong, .next-task span, .empty-order strong, .empty-order span, .note-card p, .activities-status) { color: var(--text-secondary); }
  & :is(.lead-stage, .next-task, .activity-entry, .followup-entry, .order-customer, .product-row, .order-summary, .shipment-quote) { background: var(--conversation-list-bg); border-color: var(--border-default); color: var(--text-primary); }
  & :is(.order-customer span, .order-total span, .empty-lines, .money-input span, .product-search span, .product-picker span, .order-line small, .product-info span, .remove-line) { color: var(--text-compact-aa); }
  & :is(.order-total strong, .order-total .grand-total, .grand-label, .order-line strong, .product-info strong) { color: var(--text-primary); }
  & :is(.product-search, .product-picker, .product-picker select, .money-input, .money-input input, .order-line, .quantity-control button, .quantity-control span) { background: var(--surface-bg); border-color: var(--border-default); color: var(--text-primary); }
  & :is(.order-total, .order-total .grand-label, .order-total .grand-total, .recipient-form) { border-color: var(--border-default); }
  & :is(.activity-entry strong, .activity-entry time, .activity-entry p, .activity-entry small, .activity-entry > span, .followup-entry-copy strong, .followup-entry-copy span, .followup-entry-copy small) { color: var(--text-secondary); }

  & :is(.channels-view, .placeholder-view) { background: var(--app-bg); color: var(--text-primary); }
  & .placeholder-card p:not(.eyebrow) { color: var(--text-secondary); }
  & .placeholder-icon { background: var(--customer-panel-bg); color: var(--text-primary); }
  & :is(.channel-section, .workflow-dialog, .placeholder-card, .page-filter-popover, .source-filter-popover, .advanced-filter-content) { background: var(--surface-bg); color: var(--text-primary); border-color: var(--border-default); }
  & :is(.channel-editor, .chat-group-card, .connected-pages article, .group-member-choice) { background: var(--customer-panel-bg); border-color: var(--border-default); }
  & :is(.channels-heading h1, .channel-section h2, .chat-group-copy h3, .connected-platform h3, .connected-pages strong, .group-member-heading, .group-member-choice strong, .workflow-dialog h2, .placeholder-card h2, .order-title h3) { color: var(--text-primary); }
  & :is(.eyebrow, .channels-heading p:not(.eyebrow), .channel-storage-status, .channel-section-note, .channel-section-heading > span, .chat-group-copy p, .chat-group-copy small, .connected-platform h3 small, .connected-pages small, .channel-editor form > label, .group-member-heading span, .group-member-choice small, .channel-manager-empty, .channel-picker-empty, .page-filter-copy small, .merged-channel-option small, .workflow-help, .region-help, .demo-note) { color: var(--text-compact-aa); }
  & :is(.chat-group-card-actions, .connected-platform, .group-filter-options, .source-picker-options) { border-color: var(--border-default); }
  & :is(.chat-group-card-actions button, .connected-pages button, .text-link, .copy-button, .edit-link) { color: var(--action-primary-bg); }
  & :is(.page-filter-heading, .page-filter-copy strong, .page-filter-group-title, .merged-channel-option, .source-filter-popover strong, .advanced-filter-heading) { color: var(--text-primary); }
  & .page-filter-heading button { color: var(--text-secondary); }
  & .page-filter-heading button:hover { background: var(--conversation-read-hover-bg); color: var(--text-compact-aa); }
  & .message-attachment { background: var(--customer-panel-bg); color: var(--text-primary); }
  & :is(.page-filter-option, .merged-channel-option) { background: var(--surface-bg); }
  & :is(.page-filter-option:hover, .page-filter-option.selected, .merged-channel-option:hover, .merged-channel-option.selected, .group-member-choice:has(input:checked)) { background: var(--conversation-read-hover-bg); }
  & :is(.channel-secondary, .page-filter-clear, .page-filter-manage, .workflow-cancel, .advanced-filter-heading button, .channel-section h2 > span) { background: var(--conversation-list-bg); color: var(--text-primary); border-color: var(--border-default); }
  & :is(.page-filter-clear, .page-filter-manage, .channel-secondary, .workflow-cancel):hover { background: var(--conversation-read-hover-bg); color: var(--text-primary); }
  & .source-picker-options .channel-rail-button { background: var(--surface-bg); color: var(--text-secondary); border-color: var(--border-default); }
  & .source-picker-options .channel-rail-button.selected { background: var(--nav-sidebar-bg); color: var(--nav-text); border-color: var(--nav-sidebar-bg); }
  & :is(.page-filter-check, .merged-channel-option i) { color: var(--action-primary-bg); }
  & :is(.page-filter-search, .advanced-filter-content .select-field, .source-filter-popover .select-field, .channel-editor input:not([type=checkbox]), .channel-editor select, .select-field, .text-field, .note-input, .workflow-select, .custom-date-range input) { background: var(--surface-bg); color: var(--text-primary); border-color: var(--border-default); outline-color: var(--focus-on-light); }
  & :is(input, textarea)::placeholder { color: var(--text-secondary); opacity: 1; }
  & :is(.filter-field > span, .custom-date-range label > span, .field-label, .filter-check-grid label, .filter-hint, .page-filter-search) { color: var(--text-secondary); }
  & input[type=checkbox] { accent-color: var(--action-primary-bg); }
  & :is(.group-form-error, .workflow-error) { color: var(--text-error); }
  & .toast { background: var(--nav-header-bg); color: var(--nav-text); }
  & :is(.icon-button.light, .label-choice) { background: var(--conversation-list-bg); color: var(--text-secondary); border-color: var(--border-default); }
  & :is(button, input, textarea, select, a, summary):focus-visible { outline: 2px solid var(--focus-on-light); outline-offset: 2px; }
  & :is(.topbar, .rail) :is(button, a, summary):focus-visible { outline-color: var(--focus-on-dark); }
  & ::selection { background: var(--accent-champagne); color: var(--unread-badge-text); }
}
/* Compact Pancake-inspired conversation search and filter popover. */
.conversation-list{position:relative;z-index:12;overflow:visible}
.conversation-toolbar{position:relative;z-index:14;display:flex;align-items:center;gap:8px;margin:0 12px 10px}
.conversation-toolbar .search-box{height:42px;min-width:0;flex:1;margin:0;padding:0 11px;border:1px solid #dbe5de;border-radius:8px;background:#f1f5f2;color:#70867a}
.conversation-toolbar .search-box>span{font-size:20px;line-height:1}
.conversation-toolbar .search-box input{min-width:0;height:100%;font-size:12px;color:#294536}
.conversation-toolbar .search-box input::placeholder{color:#8a9a90}
.conversation-filter-trigger{height:42px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:1px solid #dbe5de;border-radius:8px;background:#f1f5f2;color:#536b5b;font:600 11px var(--ui-font);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.conversation-filter-trigger svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.conversation-filter-trigger:hover,.conversation-filter-trigger[aria-expanded=true]{border-color:#a8c7b4;background:#e5efe8;color:#0b6047}
.conversation-filter-trigger.has-active{border-color:#8bb89b;background:#e8f2eb;color:#0b6047}
.conversation-filter-trigger b{display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#0b6047;color:#fff;font-size:9px}
.conversation-filter-popover{position:absolute;top:calc(100% + 5px);left:0;z-index:30;width:min(570px,calc(100vw - 390px));min-width:430px;max-height:min(68vh,560px);overflow:hidden;border:1px solid #dfe8e2;border-radius:12px;background:#fff;box-shadow:0 16px 42px #173d2928;color:#294536}
.conversation-filter-heading{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #edf2ee;color:#294536;font-size:12px}
.conversation-filter-heading button{width:25px;height:25px;border:0;border-radius:6px;background:#eef4ef;color:#6e8576;font-size:18px;line-height:1;cursor:pointer}
.conversation-filter-layout{display:grid;grid-template-columns:205px minmax(0,1fr);min-height:270px;max-height:calc(min(68vh,560px) - 83px)}
.conversation-filter-nav{padding:12px 8px;border-right:1px solid #edf2ee;background:#f8faf8;overflow:auto}
.conversation-filter-caption{display:block;margin:4px 8px 6px;color:#6f8176;font-size:10px;font-weight:700}
.conversation-filter-caption:not(:first-child){margin-top:17px}
.conversation-filter-nav-item{width:100%;height:39px;display:flex;align-items:center;gap:9px;padding:0 9px;border:0;border-radius:7px;background:transparent;color:#536b5b;text-align:left;font:500 11px var(--ui-font);cursor:pointer}
.conversation-filter-nav-item>span{width:18px;color:#758a7b;font-size:15px;text-align:center}
.conversation-filter-nav-item i{margin-left:auto;color:#84958a;font-size:18px;font-style:normal}
.conversation-filter-nav-item:hover,.conversation-filter-nav-item.active{background:#e6eee8;color:#20382b}
.conversation-filter-nav-item.active{font-weight:650}
.conversation-filter-nav-item.active>span{color:#0b6047}
.conversation-filter-panel{min-width:0;padding:13px 14px;overflow:auto}
.conversation-filter-section{display:grid;align-content:start;gap:10px}
.conversation-filter-panel-title{display:grid;gap:4px;margin-bottom:1px}
.conversation-filter-panel-title strong{font-size:12px;color:#294536}
.conversation-filter-panel-title span{font-size:10px;color:#718579}
.conversation-tag-condition{display:flex;align-items:center;gap:3px;width:max-content;padding:3px;border:1px solid #e3ebe5;border-radius:7px;background:#f5f8f5}
.conversation-tag-condition button{height:25px;padding:0 10px;border:0;border-radius:5px;background:transparent;color:#728479;font:500 10px var(--ui-font);cursor:pointer}
.conversation-tag-condition button.active{background:#fff;color:#0b6047;box-shadow:0 1px 3px #173d2918;font-weight:650}
.conversation-tag-search{height:36px;display:flex;align-items:center;gap:7px;padding:0 9px;border:1px solid #e3ebe5;border-radius:7px;background:#fff;color:#8a9a90}
.conversation-tag-search span{font-size:17px}
.conversation-tag-search input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#294536;font:11px var(--ui-font)}
.conversation-tag-search input::placeholder{color:#9aa99f}
.conversation-tag-choices{display:grid;align-content:start;gap:4px;max-height:230px;overflow:auto;padding-right:2px}
.conversation-tag-choice{min-height:34px;display:flex;align-items:center;gap:9px;padding:4px 7px;border-radius:6px;cursor:pointer}
.conversation-tag-choice:hover{background:#f5f8f5}
.conversation-tag-choice input{width:16px;height:16px;margin:0;accent-color:#0b6047;flex:0 0 auto}
.conversation-tag-chip{display:inline-flex;align-items:center;min-height:26px;max-width:100%;padding:3px 10px;border:1px solid #dfe8e2;border-radius:999px;background:#f8faf8;color:#435e4a;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conversation-filter-empty{margin:6px 0;padding:12px 5px;color:#84958a;font-size:10px}
.conversation-filter-footer{min-height:38px;display:flex;align-items:center;gap:10px;padding:0 14px;border-top:1px solid #edf2ee;background:#fbfcfb}
.conversation-filter-footer button{padding:5px 0;border:0;background:transparent;color:#0b6047;font:600 10px var(--ui-font);cursor:pointer}
.conversation-filter-footer span{margin-left:auto;color:#84958a;font-size:9px}
.conversation-filter-section .conversation-order-filter{height:39px;margin:2px 0 0;padding:0 10px;border-color:#dfe8e2;border-radius:7px;background:#f8faf8}
.conversation-filter-section .conversation-order-filter select{font-size:11px;color:#435e4a}
@media(max-width:1250px){.conversation-filter-popover{width:min(540px,calc(100vw - 330px));min-width:390px}.conversation-filter-layout{grid-template-columns:175px minmax(0,1fr)}}
@media(max-width:700px){.conversation-toolbar{gap:5px;margin:0 7px 8px}.conversation-toolbar .search-box{height:38px;padding:0 7px}.conversation-toolbar .search-box input{font-size:10px}.conversation-filter-trigger{height:38px;gap:5px;padding:0 7px;font-size:9px}.conversation-filter-trigger svg{width:15px;height:15px}.conversation-filter-popover{position:fixed;top:72px;left:50%;transform:translateX(-50%);width:min(560px,calc(100vw - 20px));min-width:0;max-height:calc(100dvh - 92px)}.conversation-filter-layout{grid-template-columns:minmax(125px,38%) minmax(0,1fr);max-height:calc(100dvh - 175px)}.conversation-filter-nav-item{gap:5px;padding:0 6px;font-size:10px}.conversation-filter-panel{padding:11px 9px}}
/* The filter takes over the chat content area without covering the list or messages. */
.conversation-list{z-index:auto;overflow:hidden}
.chat-filter-workspace{flex:1;min-height:0;display:flex;justify-content:center;align-items:stretch;overflow:auto;padding:16px;background:var(--chat-area-bg,#CEDBD1)}
.thread-panel.filter-workspace-open .messages,.thread-panel.filter-workspace-open .reply-tools,.thread-panel.filter-workspace-open .composer{display:none}
#chatFilterWorkspace .conversation-filter-popover{position:static;top:auto;left:auto;transform:none;width:min(780px,100%);min-width:0;height:min(640px,100%);max-height:100%;margin:auto;display:flex;flex-direction:column;box-shadow:0 12px 32px #173d2922}
#chatFilterWorkspace .conversation-filter-layout{flex:1;min-height:0;max-height:none;grid-template-columns:220px minmax(0,1fr)}
#chatFilterWorkspace .conversation-filter-nav,#chatFilterWorkspace .conversation-filter-panel{min-height:0}
#chatFilterWorkspace .conversation-filter-panel{overflow:auto}
.conversation-filter-heading{background:#0B503E;color:#fff;border-bottom:0}
.conversation-filter-heading strong{color:#fff}
.conversation-filter-heading button{background:#ffffff1f;color:#fff}
.conversation-filter-heading button:hover{background:#ffffff34;color:#E8C77D}
.conversation-filter-nav{background:#EDF3EE;border-color:#D2DFD5}
.conversation-filter-nav-item{border-left:3px solid transparent}
.conversation-filter-nav-item.active,.conversation-filter-nav-item.active:hover{background:#0B6047;color:#fff;border-left-color:#E8C77D}
.conversation-filter-nav-item.active>span,.conversation-filter-nav-item.active i{color:#fff}
.conversation-filter-nav-item[data-filter-section="exclude"]>span{color:#A8782A}
.conversation-filter-nav-item[data-filter-section="orders"]>span{color:#0B8060}
.conversation-tag-condition{border-color:#CAD9CE;background:#EAF1EB}
.conversation-tag-condition button.active{background:#0B6047;color:#fff;box-shadow:0 2px 5px #0B503E32}
.conversation-tag-search{border-color:#CAD9CE;background:#F8FAF8}
.conversation-tag-search:focus-within{border-color:#0B8060;box-shadow:0 0 0 2px #0B806018}
.conversation-tag-choice:nth-child(4n+1) .conversation-tag-chip{background:#E7F4EB;border-color:#BDDCC7;color:#17603E}
.conversation-tag-choice:nth-child(4n+2) .conversation-tag-chip{background:#EAF2FB;border-color:#C8DBEE;color:#315C86}
.conversation-tag-choice:nth-child(4n+3) .conversation-tag-chip{background:#FFF4D8;border-color:#E9D69C;color:#755D1D}
.conversation-tag-choice:nth-child(4n) .conversation-tag-chip{background:#F2EBFA;border-color:#DCCBEC;color:#674B83}
.conversation-tag-choice:has(input:checked){background:#DDEDE2}
.conversation-tag-choice:has(input:checked) .conversation-tag-chip{background:#0B6047;border-color:#0B6047;color:#fff}
.conversation-filter-footer{background:#F3F7F4;border-top-color:#DCE7DF}
.conversation-filter-footer button{color:#0B6047}
.conversation-filter-footer span{padding:4px 8px;border-radius:999px;background:#E8F1EA;color:#405E49}
.conversation-filter-section .conversation-order-filter{background:#F2F7F3;border-color:#C8D8CC}
.conversation-filter-section .conversation-order-filter>span:first-child{color:#0B6047}
.conversation-filter-section .conversation-order-filter:focus-within{border-color:#0B8060;box-shadow:0 0 0 2px #0B806018}
.conversation-filter-trigger.has-active b{background:#E8C77D;color:#273C2F}
.avatar.avatar-has-image,.message-avatar.avatar-has-image{overflow:hidden;padding:0;background:#E5EEE8}
.avatar-photo{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.avatar-has-image .avatar-fallback{display:none}
@media(max-width:1250px){#chatFilterWorkspace .conversation-filter-layout{grid-template-columns:190px minmax(0,1fr)}}
@media(max-width:700px){.chat-filter-workspace{padding:8px}#chatFilterWorkspace .conversation-filter-popover{width:100%;height:100%;min-height:0}#chatFilterWorkspace .conversation-filter-layout{grid-template-columns:minmax(105px,38%) minmax(0,1fr)}#chatFilterWorkspace .conversation-filter-nav{padding:9px 5px}#chatFilterWorkspace .conversation-filter-nav-item{gap:4px;padding:0 5px;font-size:9px}#chatFilterWorkspace .conversation-filter-panel{padding:10px 8px}}