/* The website Inbox mirrors the three-pane public product layout at native width. */
.content:has(.preview-inbox){padding:10px 14px 28px}
.preview-inbox{min-width:0;color:#192b40}
.preview-intro{font-size:12px;color:#64748b;margin:1px 3px 8px}
.preview-filters{position:sticky;top:60px;z-index:5;background:#fff;border:1px solid #e1e7ef;border-radius:10px;padding:8px 10px;box-shadow:0 3px 13px #1829420b;margin-bottom:9px}
.preview-filter-row{display:grid;grid-template-columns:67px minmax(0,1fr);align-items:center;gap:8px;min-width:0}
.preview-filter-row>strong{font-size:12px;color:#6b788a}
.preview-tiles{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;padding:3px 1px}.preview-tiles::-webkit-scrollbar{display:none}
.preview-tile{flex:none;border:1px solid #e2e7ef;border-radius:7px;background:#fff;color:#304258;min-height:34px;padding:5px 10px;font-size:12px;font-weight:650;white-space:nowrap}
.preview-tile.active{background:#1666d8;border-color:#1666d8;color:#fff;box-shadow:0 2px 6px #1666d82b}
.preview-count{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 3px;margin-left:2px;border-radius:9px;background:#e9eef6;color:#54708e;font-size:10px}
.preview-tile.active .preview-count{background:#fff;color:#1666d8}
.preview-workspace{display:grid;grid-template-columns:minmax(225px,.95fr) minmax(310px,1.65fr) minmax(235px,1fr);min-height:620px;border:1px solid #e1e7ef;border-radius:9px;background:#fff;overflow:hidden;box-shadow:0 4px 16px #192b4008}
.preview-list,.preview-conversation,.preview-customer{min-width:0}
.preview-list{border-right:1px solid #e1e7ef;background:#fff}
.preview-list>header{display:flex;align-items:center;justify-content:space-between;gap:5px;min-height:54px;padding:7px 12px;border-bottom:1px solid #e1e7ef}
.preview-list>header>strong{font-size:14px}
.preview-compose-button{min-height:34px;padding:5px 8px;font-size:12px;white-space:nowrap}
.preview-search{padding:8px 10px;border-bottom:1px solid #e1e7ef}.preview-search input{width:100%;min-width:0;min-height:36px;font-size:13px}
.preview-thread-list{max-height:705px;overflow:auto}
.preview-thread{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:start;gap:9px;width:100%;padding:11px 12px;border:0;border-bottom:1px solid #e7ebf1;border-radius:0;background:#fff;text-align:left;box-shadow:none;color:inherit}
.preview-thread:hover,.preview-thread.selected{background:#f3f7fd}.preview-thread.selected{box-shadow:inset 3px 0 #1666d8}
.preview-avatar{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:#e9e8ff;color:#4d4192;font-size:13px;font-weight:700}
.preview-avatar.large{width:48px;height:48px;font-size:17px;margin:12px 0 5px}
.preview-thread-body{display:block;min-width:0}.preview-thread-top{display:flex;flex-direction:column;min-width:0;gap:2px}
.preview-thread-top strong,.preview-subject,.preview-snippet{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preview-thread-top strong{font-size:13px}.preview-thread-top small{align-self:flex-end;font-size:10px;color:#7c8898}
.preview-subject{margin-top:4px;font-size:11px;color:#304258;font-weight:600}
.preview-snippet{margin:5px 0;color:#637186;font-size:12px;font-weight:400}
.preview-thread-bottom{display:flex;align-items:center;gap:5px}.preview-thread-bottom span{background:#eef3f8;color:#506278;border-radius:4px;padding:2px 5px;font-size:10px}
.preview-empty{padding:22px 14px;color:#69798b;font-size:13px}
.preview-conversation{display:flex;flex-direction:column;background:#fff}
.preview-conversation-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:68px;padding:11px 14px;border-bottom:1px solid #e1e7ef}
.preview-title{display:grid;gap:2px;min-width:0;flex:1}.preview-title strong{font-size:15px}.preview-title small{color:#69798b;font-size:11px}
.preview-head-actions{display:flex;gap:5px;flex-wrap:wrap}.preview-head-actions button{min-height:32px;margin:0;padding:5px 8px;font-size:11px}
.preview-messages{display:flex;flex-direction:column;gap:13px;min-height:310px;max-height:480px;overflow:auto;padding:18px;background:#f8fafd}
.preview-message{max-width:90%;border:1px solid #e1e7ef;border-radius:4px 12px 12px 12px;background:#fff;padding:10px 12px;overflow-wrap:anywhere}
.preview-message.outgoing{align-self:flex-end;background:#edf3ff;border-color:#d9e5fa;border-radius:12px 4px 12px 12px}
.preview-message.system{align-self:center;background:#fff8e8;border-color:#eee0bd;max-width:100%}
.preview-message small{font-size:10px;color:#6f7d90}.preview-message p{margin:5px 0 0;font-size:13px;line-height:1.55;white-space:pre-wrap}
.preview-composer{border-top:1px solid #e1e7ef;padding:12px 14px}.preview-composer label{font-size:12px;font-weight:700}.preview-composer textarea{display:block;width:100%;min-height:86px;margin-top:5px;font-size:14px;resize:vertical}
.preview-composer-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;margin-top:7px}.preview-composer-actions button{margin:0;min-height:35px;padding:6px 9px;font-size:12px}
.preview-composer>p{margin:7px 0 0;color:#758398;font-size:11px}
.preview-customer{border-left:1px solid #e1e7ef;padding:15px;overflow:auto}.preview-customer>header{display:grid;justify-items:start}.preview-customer h2{font-size:16px;margin:0}.preview-customer header strong{font-size:15px}.preview-customer header small{color:#6e7b8c;font-size:12px}
.preview-customer dl{margin:18px 0 0}.preview-customer dl>div{border-bottom:1px solid #edf0f4;padding:9px 0}.preview-customer dt{font-size:11px;color:#718095}.preview-customer dd{margin:3px 0 0;font-size:13px;overflow-wrap:anywhere}
.preview-customer-links{display:grid;gap:7px;margin-top:16px}.preview-customer-links a{display:block;border:1px solid #d8e1ee;border-radius:6px;padding:8px;text-align:center;font-size:12px;font-weight:700}
.preview-mobile-back{display:none!important}
@media(max-width:1000px) and (min-width:701px){
  .preview-workspace{grid-template-columns:minmax(225px,.9fr) minmax(0,1.6fr)}
  .preview-workspace>.preview-customer{display:none}
  .preview-workspace[data-mobile-pane=customer]{display:block}
  .preview-workspace[data-mobile-pane=customer]>.preview-list,.preview-workspace[data-mobile-pane=customer]>.preview-conversation{display:none}
  .preview-workspace[data-mobile-pane=customer]>.preview-customer{display:block;border:0}
  .preview-customer .preview-mobile-back{display:inline-flex!important;min-height:36px;margin-bottom:10px}
  .preview-conversation-head{display:grid;grid-template-columns:minmax(0,1fr)}
  .preview-head-actions{grid-column:1}
}
@media(max-width:700px){
  .content:has(.preview-inbox){padding:6px 7px 20px}
  .preview-intro{font-size:11px}.preview-filters{top:54px;padding:5px 6px}.preview-filter-row{grid-template-columns:52px minmax(0,1fr);gap:3px}.preview-filter-row>strong{font-size:11px}.preview-tile{min-height:39px;padding:6px 9px}
  .preview-workspace{display:block;min-height:400px}.preview-thread-list{max-height:none}.preview-list{border:0}.preview-list>header{min-height:50px}
  .preview-workspace[data-mobile-pane=list]>.preview-conversation,.preview-workspace[data-mobile-pane=list]>.preview-customer,.preview-workspace[data-mobile-pane=conversation]>.preview-list,.preview-workspace[data-mobile-pane=conversation]>.preview-customer,.preview-workspace[data-mobile-pane=customer]>.preview-list,.preview-workspace[data-mobile-pane=customer]>.preview-conversation{display:none}
  .preview-mobile-back{display:inline-flex!important;min-height:36px;margin:0 0 5px;padding:5px 8px;font-size:12px}
  .preview-conversation-head{display:grid;min-height:0;padding:11px}.preview-head-actions{grid-column:1}.preview-head-actions button{min-height:39px;font-size:12px}
  .preview-messages{min-height:280px;max-height:none}.preview-composer textarea{font-size:16px}.preview-composer-actions button{min-height:42px}
  .preview-customer{border:0;padding:14px}.preview-customer dl{margin-top:12px}
}
@media(max-width:350px){.preview-compose-button{font-size:11px}.preview-head-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.preview-head-actions button{min-width:0;white-space:normal}.preview-composer-actions button{flex:1}}
