/* Shared inbox: conversation controls stay in place while messages arrive. */
.inbox-nav-badge { min-width: 20px; padding: 1px 6px; margin-left: auto; border-radius: 6px; background: #303030; color: #fff; font-size: 10px; text-align: center; }
.main.inbox-page { display: flex; flex-direction: column; height: 100vh; height: var(--inbox-viewport-height, 100dvh); min-height: 0; padding-bottom: 26px; overflow: hidden; }
.inbox-heading { flex: none; align-items: center; margin-bottom: 16px; }
.inbox-availability { display: flex; align-items: center; gap: 7px; flex: none; }
.inbox-availability select { width: 112px; min-height: 34px; border: 0; background: transparent; padding-left: 0; font-size: 12px; }
.availability-dot { width: 7px; height: 7px; border-radius: 50%; background: #29845a; }
.inbox-availability.is-away .availability-dot { background: #b58a36; }
.inbox-error { flex: none; margin-bottom: 12px; }
.inbox-layout { display: grid; grid-template-columns: minmax(260px, 310px) minmax(0, 1fr); flex: 1; min-height: 0; overflow: hidden; }
.inbox-directory { display: flex; flex-direction: column; min-width: 0; min-height: 0; border-right: 1px solid var(--border); }
.inbox-search { flex: none; margin: 16px 14px 12px; }
.inbox-search input { font-size: 12px; }
.inbox-filters { display: flex; gap: 3px; min-height: 44px; flex: none; padding: 0 9px 10px; border-bottom: 1px solid #ebebeb; }
.inbox-filters button { display: flex; align-items: center; justify-content: center; gap: 4px; flex: 1; padding: 7px 5px; border: 0; background: none; font-size: 11px; color: #616161; white-space: nowrap; }
.inbox-filters button[aria-pressed="true"] { background: #eceeed; color: #202020; font-weight: 600; }
.inbox-filters span { font-size: 9px; color: #757575; }
.inbox-conversation-list { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.inbox-conversation { display: flex; align-items: flex-start; gap: 10px; width: 100%; min-width: 0; padding: 17px 14px; border: 0; border-bottom: 1px solid #f0f0f0; border-radius: 0; background: #fff; text-align: left; }
.inbox-conversation:hover { background: #fafafa; }
.inbox-conversation.is-active { background: #f0f4f1; box-shadow: inset 3px 0 #6c8b76; }
.inbox-avatar { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border: 1px solid #e3e6e3; border-radius: 10px; background: #edf0ed; color: #526354; font-size: 10px; font-weight: 600; }
.inbox-preview { flex: 1; min-width: 0; }
.inbox-preview-title { display: flex; gap: 8px; align-items: baseline; justify-content: space-between; min-width: 0; }
.inbox-preview-title strong { overflow: hidden; font-size: 12px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.inbox-preview-title time { flex: none; color: #777; font-size: 9px; }
.inbox-preview-customer { display: block; overflow: hidden; margin: 3px 0 5px; color: #777; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.inbox-preview-message { display: flex; align-items: center; gap: 8px; min-height: 19px; }
.inbox-preview-message > span:first-child { display: block; overflow: hidden; flex: 1; min-width: 0; color: #777; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.inbox-conversation.is-unread .inbox-preview-title strong { font-weight: 700; }
.inbox-conversation.is-unread .inbox-preview-message > span:first-child { color: #303030; }
.inbox-unread { display: grid; place-items: center; flex: none; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 6px; background: #303030; color: white; font-size: 9px; }
.inbox-connection { display: flex; align-items: center; gap: 7px; min-height: 37px; flex: none; padding: 9px 15px; border-top: 1px solid #ebebeb; color: #777; font-size: 10px; }
.inbox-connection::before { content: ''; width: 5px; height: 5px; flex: none; border-radius: 50%; background: #aaa; }
.inbox-connection[hidden] { display: none; }
.inbox-connection[data-connection="error"], .inbox-connection[data-connection="offline"] { color: #9c621c; }
.inbox-empty, .inbox-welcome { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 260px; padding: 35px 22px; text-align: center; }
.inbox-empty h2 { font-size: 13px; }
.inbox-empty p, .inbox-welcome p { max-width: 310px; color: #777; font-size: 12px; line-height: 1.7; }
.inbox-empty .empty-icon { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 2px; border: 1px solid #e5e5e5; border-radius: 12px; color: #7e8b80; }
.inbox-welcome { height: 100%; background: #fdfdfd; }
.inbox-welcome-icon { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 5px; border: 1px solid #e5e9e5; border-radius: 20px; background: #f0f4f0; color: #657c6c; }
.inbox-welcome-icon .icon { width: 28px; height: 28px; }
.inbox-thread { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.inbox-thread-header { display: flex; align-items: center; gap: 12px; flex: none; min-height: 73px; padding: 16px 22px; border-bottom: 1px solid #ebebeb; }
.inbox-thread-person { flex: 1; min-width: 0; }
.inbox-thread-person a { display: block; width: fit-content; max-width: 100%; overflow: hidden; font-size: 14px; font-weight: 650; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.inbox-thread-person a:hover { text-decoration: underline; }
.inbox-thread-person p { overflow: hidden; margin-top: 3px; font-size: 11px; color: #777; text-overflow: ellipsis; white-space: nowrap; }
.inbox-back { display: none; }
.inbox-thread-options { position: relative; flex: none; }
.inbox-thread-options summary { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 8px; cursor: pointer; list-style: none; }
.inbox-thread-options summary::-webkit-details-marker { display: none; }
.inbox-thread-options summary:hover, .inbox-thread-options[open] summary { background: #f1f2f1; }
.inbox-thread-options summary:focus-visible { outline: 2px solid #303030; outline-offset: 2px; }
.inbox-thread-actions { position: absolute; z-index: 5; top: calc(100% + 8px); right: 0; width: min(280px, calc(100vw - 40px)); padding: 16px; border: 1px solid #e1e3e1; border-radius: 10px; background: #fff; box-shadow: 0 8px 28px #00000012; }
.inbox-assignment { display: grid; gap: 8px; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid #eee; }
.inbox-assignment label { color: #616161; font-size: 12px; }
.inbox-assignment select { width: 100%; max-width: 100%; min-height: 40px; padding: 8px 28px 8px 10px; font-size: 12px; }
.inbox-assignment .text-button { min-height: 36px; justify-self: start; font-size: 12px; }
.inbox-thread-actions > .button { width: 100%; min-height: 40px; }
.inbox-thread-notifications { display: none; }
.inbox-message-scroll { flex: 1; min-height: 0; padding: 8px 24px 18px; overflow-y: auto; overscroll-behavior: contain; }
.inbox-older { text-align: center; }
.inbox-older .text-button { font-size: 11px; }
.inbox-messages { display: flex; flex-direction: column; gap: 16px; padding: 0; margin: 0; list-style: none; }
.inbox-day { align-self: center; padding: 10px 0 4px; color: #888; font-size: 10px; }
.inbox-message { align-self: flex-start; max-width: min(88%, 640px); min-width: 100px; }
.inbox-message-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 0 2px 5px; color: #777; font-size: 10px; }
.inbox-message-meta strong { font-weight: 550; color: #616161; }
.inbox-message-meta span { display: inline-flex; align-items: center; gap: 3px; }
.inbox-message-meta .icon { width: 10px; height: 10px; }
.inbox-message-meta time { margin-left: auto; }
.inbox-message-bubble { padding: 11px 14px; border: 1px solid #e9e9e9; border-radius: 3px 12px 12px; background: #f7f7f7; }
.inbox-message-bubble p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.65; }
.inbox-message.from-staff { align-self: flex-end; }
.inbox-message.from-staff .inbox-message-bubble { border-color: #e0e9e2; border-radius: 12px 3px 12px 12px; background: #f0f5f1; }
.inbox-message.automatic-reply { align-self: center; max-width: min(94%, 640px); }
.inbox-message.automatic-reply .inbox-message-bubble { border-color: #e9e5da; border-radius: 10px; background: #faf9f5; color: #615c50; }
.inbox-message.automatic-reply .inbox-message-meta strong { color: #777164; }
.inbox-heading .inbox-service-hours { display: block; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.inbox-message.internal-note { align-self: stretch; max-width: 100%; margin: 0 5%; }
.inbox-message.internal-note .inbox-message-bubble { border-color: #efdfae; border-radius: 8px; background: #fff8e3; }
.inbox-message.internal-note .inbox-message-meta { color: #8f6c22; }
.inbox-message-read { display: block; padding: 4px 2px 0; color: #888; font-size: 9px; text-align: right; }
.inbox-message-empty { padding: 40px 10px; color: #999; font-size: 12px; text-align: center; }
.inbox-attachment { display: flex; align-items: center; gap: 9px; width: 100%; max-width: 100%; margin-top: 7px; padding: 9px 10px; border: 1px solid #00000012; background: #ffffff85; color: #424242; text-align: left; }
.inbox-attachment > span { min-width: 0; overflow-wrap: anywhere; font-size: 11px; }
.inbox-attachment small { display: block; margin-top: 2px; color: #777; font-size: 9px; }
.inbox-attachment:hover { background: #fff; }
.inbox-typing { min-height: 24px; flex: none; padding: 2px 24px 6px; color: #777; font-size: 10px; }
.inbox-composer { flex: none; margin: 0 18px 18px; overflow: hidden; border: 1px solid #d8d8d8; border-radius: 10px; background: #fff; box-shadow: 0 1px 3px #00000003; }
.inbox-composer:focus-within { border-color: #909c92; }
.inbox-composer.is-note { border-color: #dbc78d; background: #fffaeb; }
.inbox-composer-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 11px 0; }
.inbox-composer-heading select { min-height: 28px; padding: 3px 25px 3px 0; border: 0; background: transparent; font-size: 11px; font-weight: 550; }
.inbox-composer-heading > span { display: flex; align-items: center; gap: 4px; color: #8d6d25; font-size: 10px; }
.inbox-composer-heading .icon { width: 12px; height: 12px; }
.inbox-composer textarea { display: block; width: 100%; height: 82px; min-height: 65px; max-height: 180px; padding: 8px 12px; border: 0; border-radius: 0; outline: none; background: transparent; color: #303030; font-size: 13px; line-height: 1.65; resize: vertical; }
.inbox-composer textarea:focus-visible { outline: none; }
.inbox-composer-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px 10px; }
.inbox-composer-footer > div { display: flex; align-items: center; gap: 7px; min-width: 0; }
.inbox-composer-footer .icon-button { width: 30px; height: 30px; border: 0; background: transparent; }
.inbox-composer-footer .icon-button .icon { width: 17px; height: 17px; }
.inbox-composer-footer .primary { min-height: 32px; padding: 6px 11px; font-size: 11px; }
.inbox-composer-footer .primary .icon { width: 14px; height: 14px; }
.inbox-attachment-hint { color: #999; font-size: 9px; }
.inbox-files { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 10px; }
.inbox-file-chip { display: flex; align-items: center; gap: 5px; max-width: 100%; padding: 5px 6px; border: 1px solid #ddd; border-radius: 6px; background: #ffffff8c; font-size: 10px; }
.inbox-file-chip > span { overflow: hidden; max-width: 180px; text-overflow: ellipsis; white-space: nowrap; }
.inbox-file-chip .icon { width: 13px; height: 13px; }
.inbox-file-chip button { display: grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; background: transparent; }
.sales-assignment-body { padding: 18px 20px; }
.sales-assignment-body form { display: grid; gap: 8px; }
.sales-assignment-body label { font-size: 12px; font-weight: 550; }
.sales-assignment-body select { width: 100%; }
.sales-assignment-body .alert { margin-bottom: 13px; }
.sales-assignment-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.sales-assignment-footer > span { display: flex; flex-direction: column; gap: 1px; color: #777; font-size: 11px; }
.sales-assignment-footer strong { color: #424242; font-size: 12px; font-weight: 550; }
@media (min-width: 1600px) { .inbox-layout { grid-template-columns: 340px minmax(0, 1fr); } .inbox-message-scroll { padding-left: 38px; padding-right: 38px; } }
@media (max-width: 1100px) { .inbox-layout { grid-template-columns: 260px minmax(0, 1fr); } .inbox-thread-header { padding-left: 16px; padding-right: 16px; } .inbox-attachment-hint { display: none; } .inbox-thread-header .status { display: none; } }
@media (max-width: 900px) {
  .main.inbox-page { padding: 24px 20px 20px; }
  .inbox-layout { display: block; }
  .inbox-directory { height: 100%; border-right: 0; }
  .inbox-thread { display: none; height: 100%; }
  .inbox-layout.show-thread .inbox-directory { display: none; }
  .inbox-layout.show-thread .inbox-thread { display: flex; }
  .inbox-back { display: grid; flex: none; width: 31px; height: 31px; border: 0; }
  .inbox-filters button { font-size: 12px; }
  .inbox-conversation { padding: 18px; }
  .inbox-preview-title strong { font-size: 13px; }
  .inbox-preview-customer, .inbox-preview-message > span:first-child { font-size: 12px; }
  .inbox-thread-header .status { display: none; }
  .inbox-has-thread .inbox-heading { display: none; }
  .inbox-thread-notifications { display: grid; flex: none; }
  .inbox-back, .inbox-thread-options summary, .inbox-thread-notifications { width: 40px; height: 40px; }
}
@media (max-width: 760px) {
  .main.inbox-page { height: calc(var(--inbox-viewport-height, 100dvh) - 60px); min-height: 0; padding: 18px 12px 12px; }
  .inbox-heading { gap: 12px; margin-bottom: 14px; }
  .inbox-heading h1 { font-size: 24px; }
  .inbox-heading p { display: none; }
  .inbox-availability select { width: 105px; font-size: 12px; }
  .inbox-thread-header { min-height: 64px; gap: 8px; padding: 12px; }
  .inbox-thread-person a { font-size: 13px; }
  .inbox-thread-person p { font-size: 10px; }
  .inbox-thread-header .status { display: none; }
  .inbox-message-scroll { padding: 6px 14px 14px; }
  .inbox-message { max-width: 94%; }
  .inbox-message-bubble { padding: 9px 11px; }
  .inbox-composer { margin: 0 10px 10px; }
  .inbox-composer textarea { font-size: 16px; height: 76px; line-height: 1.45; }
  .inbox-typing { padding-left: 15px; }
  .inbox-message.internal-note { margin: 0; }
  .sales-assignment-body { padding: 16px; }
}
@media (max-width: 380px) { .inbox-thread-header .button { padding: 5px 8px; } .inbox-composer-heading > span { font-size: 9px; } .inbox-composer-heading select { font-size: 10px; } }
@media (prefers-reduced-motion: reduce) { .inbox-layout * { scroll-behavior: auto; } }

@media (max-width: 900px) {
  .inbox-short-viewport:has(.show-thread) .inbox-heading { display: none; }
  .inbox-short-viewport .inbox-thread-header { min-height: 50px; padding-top: 6px; padding-bottom: 6px; }
  .inbox-short-viewport .inbox-composer textarea { min-height: 40px; height: 48px; }
  .inbox-short-viewport .inbox-composer { margin-bottom: 8px; }
  .inbox-short-viewport .inbox-typing { min-height: 20px; padding-bottom: 2px; }
}

.inbox-heading-actions { display: flex; align-items: center; gap: 12px; }
.inbox-heading-actions .icon-button { width: 40px; height: 40px; }
.inbox-results { flex: none; min-height: 29px; padding: 8px 14px; border-bottom: 1px solid #f0f0f0; color: #888; font-size: 9px; }
.inbox-results[hidden] { display: none; }
.inbox-list-more { padding: 15px; text-align: center; }
.inbox-connection > span { flex: 1; }
.inbox-connection .text-button { font-size: 10px; }
.inbox-older { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 4px 0; }
.inbox-activity { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 1px 10px; color: #858585; font-size: 10px; line-height: 1.5; text-align: center; }
.inbox-activity time { color: #a0a0a0; font-size: 9px; }
.inbox-conversation-event { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 4px 12px; align-self: stretch; margin: 4px 0; color: #777; font-size: 11px; line-height: 1.5; text-align: center; }
.inbox-conversation-event > span { grid-column: 2; max-width: 46ch; overflow-wrap: anywhere; }
.inbox-conversation-event time { grid-column: 2; color: #999; font-size: 9px; }
.inbox-conversation-event.is-boundary { margin: 15px 0; }
.inbox-conversation-event.is-boundary::before, .inbox-conversation-event.is-boundary::after { content: ''; height: 1px; background: #e7e7e7; grid-row: 1; }
.inbox-conversation-event.is-boundary::before { grid-column: 1; }
.inbox-conversation-event.is-boundary::after { grid-column: 3; }
.inbox-conversation-event:focus-visible { outline: 2px solid #b4a05b; outline-offset: 4px; }
.inbox-message.is-pending .inbox-message-bubble { border-style: dashed; }
.inbox-pending-file { display: flex; align-items: center; gap: 7px; margin: 7px 0 3px; overflow-wrap: anywhere; font-size: 11px; }
.inbox-pending-file svg { flex: none; width: 15px; }
.inbox-pending-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; padding-top: 5px; color: #777; font-size: 10px; }
.inbox-pending-status > span:first-child { max-width: 100%; overflow-wrap: anywhere; }
.inbox-pending-status > span:last-child { display: inline-flex; gap: 10px; }
.inbox-pending-status button { padding: 2px; font-size: 10px; }
.inbox-pending-status progress { width: 80px; height: 4px; accent-color: #6e8c78; }
@media (max-width: 760px) { .inbox-heading-actions { gap: 8px; } .inbox-heading .inbox-availability select { width: 112px; } .inbox-heading { gap: 8px; } }

/* Authenticated previews never expose a public attachment URL. */
.chat-attachment-preview { width: min(880px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); padding: 0; margin: auto; border: 1px solid #dedede; border-radius: 12px; background: #fff; color: #303030; box-shadow: 0 20px 80px #0003; }
.chat-attachment-preview::backdrop { background: #0008; }
.chat-attachment-preview header, .chat-attachment-preview footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; }
.chat-attachment-preview header { border-bottom: 1px solid #eee; }
.chat-attachment-preview header strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.chat-attachment-preview header button { display: grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 6px; border: 0; border-radius: 6px; background: #f3f3f3; color: #555; }
.chat-preview-content { display: flex; justify-content: center; align-items: center; min-height: 140px; background: #f5f5f5; }
.chat-preview-content img { display: block; max-width: 100%; max-height: calc(100dvh - 170px); object-fit: contain; }
.chat-preview-content iframe { display: block; width: 100%; height: min(680px, calc(100dvh - 170px)); border: 0; }
.chat-attachment-preview footer { border-top: 1px solid #eee; font-size: 11px; }
.chat-attachment-preview footer span { color: #777; }
.chat-attachment-preview footer a { flex: none; padding: 8px 12px; border: 1px solid #ddd; border-radius: 6px; color: #303030; text-decoration: none; font-size: 12px; }

.inbox-preview-message mark { border-radius:2px; background:#f8e9aa; color:#303030; }
.inbox-preview-message:has(mark) > span:first-child { white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; line-height:1.5; }
.inbox-search-note { color:#775f30; font-weight:600; }
.inbox-history-context { display:flex; flex:none; align-items:center; gap:10px; padding:10px 20px; border-bottom:1px solid #e3e7e2; background:#f4f6f3; font-size:11px; }
.inbox-history-context[hidden] { display:none; }
.inbox-history-context > span { flex:1; min-width:0; }
.inbox-history-context button { flex:none; }
.inbox-context-newer { text-align:center; }
.inbox-message.is-highlighted .inbox-message-bubble { outline:2px solid #b4a05b; outline-offset:3px; background:#fff9e8; }
.inbox-message:focus { outline:0; }
[data-chat-delivery] { flex:none; min-height:0; max-height:55%; overflow:auto; margin-bottom:12px; }
[data-chat-delivery][hidden] { display:none; }
@media(max-width:600px) { .inbox-history-context { flex-wrap:wrap; padding:8px 14px; } .inbox-history-context > span { flex-basis:50%; } }

.inbox-heading-actions [data-chat-delivery-toggle] { white-space:nowrap; font-size:11px; }
.inbox-heading-actions [data-chat-delivery-toggle].has-warning { color:#8a560a; }
@media(max-width:760px) {
  .inbox-heading { flex-wrap: wrap; row-gap: 8px; }
  .inbox-heading-actions { margin-left: auto; min-width: 0; }
  .inbox-heading .inbox-availability select { width: 112px; }
}

.chat-notification-help { margin:0 0 16px; padding:12px 14px; border:1px solid var(--border,#ddd); border-radius:10px; font-size:13px; line-height:1.5; background:#fff; }

.chat-notification-test { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 16px; font-size:13px; line-height:1.5; }
.chat-test-button { border:1px solid #d5d5d5; border-radius:8px; padding:8px 12px; background:#fff; color:inherit; font:inherit; cursor:pointer; }
.chat-test-button:disabled { opacity:.6; cursor:default; }
.chat-notification-test span { flex:1; min-width:180px; }

.chat-notification-test[hidden] { display:none; }

/* Product/order context stays separate from editable message text. */
.chat-reference-card { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-start; min-width:0; max-width:100%; padding:12px; border:1px solid #dfe2df; border-radius:10px; background:#f5f6f4; color:#242724; text-align:left; box-sizing:border-box; }
.chat-reference-card.is-draft { flex-wrap:nowrap; margin-bottom:8px; }
.chat-reference-copy { display:flex; flex:1 1 120px; min-width:0; flex-direction:column; gap:4px; overflow-wrap:anywhere; }
.chat-reference-copy strong { font-size:13px; line-height:1.4; font-weight:600; }
.chat-reference-label { color:#686f68; font-size:10px; letter-spacing:.04em; text-transform:uppercase; }
.chat-reference-detail, .chat-reference-copy small { color:#626962; font-size:11px; line-height:1.4; }
.chat-reference-copy small { color:#737b73; font-size:10px; }
.chat-reference-actions { flex:1 0 100%; display:flex; flex-wrap:wrap; gap:8px 16px; }
.chat-reference-actions button { appearance:none; background:none; border:0; padding:4px 0; color:#284b3a; font:inherit; font-size:11px; text-decoration:underline; text-underline-offset:3px; cursor:pointer; text-align:left; }
.chat-reference-remove { flex:0 0 32px; width:32px; height:32px; padding:0; border:0; border-radius:7px; background:transparent; color:#5e665e; font:22px/1 sans-serif; cursor:pointer; }
.chat-reference-remove:hover { background:#e8ece6; }
.chat-reference-card button:focus-visible, .chat-reference-preview button:focus-visible { outline:2px solid #345946; outline-offset:3px; }
.messages-bubble > .chat-reference-card, .inbox-message-bubble > .chat-reference-card { margin-bottom:8px; }
.messages-bubble > .chat-reference-card:last-child, .inbox-message-bubble > .chat-reference-card:last-child { margin-bottom:0; }
.chat-reference-preview { width:min(420px,calc(100vw - 32px)); max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); padding:0; border:1px solid #dfe2df; border-radius:16px; background:white; color:#242724; box-shadow:0 20px 60px #0003; box-sizing:border-box; }
.chat-reference-preview::backdrop { background:#10181066; }
.chat-reference-preview header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid #eee; }
.chat-reference-preview h2 { margin:0; font-size:16px; }
.chat-reference-preview header button { background:transparent; border:0; width:32px; height:32px; font:24px/1 sans-serif; color:inherit; cursor:pointer; }
.chat-reference-preview [data-reference-details] { padding:20px; overflow-wrap:anywhere; }
.chat-reference-title { display:block; line-height:1.4; }
.chat-reference-preview dl { margin:18px 0; }
.chat-reference-preview dl div { display:flex; justify-content:space-between; gap:20px; padding:8px 0; border-bottom:1px solid #f0f0f0; font-size:13px; }
.chat-reference-preview dt { color:#626962; }
.chat-reference-preview dd { margin:0; text-align:right; }
.chat-reference-note { margin:12px 0 0; font-size:12px; color:#626962; line-height:1.5; }
[data-chat-reference][hidden] { display:none; }

.inbox-composer [data-chat-reference] { margin: 4px 10px 0; }
.inbox-short-viewport .chat-reference-card.is-draft { padding: 7px 9px; margin-bottom: 0; }
.inbox-short-viewport .chat-reference-card.is-draft strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.inbox-short-viewport .chat-reference-card.is-draft .chat-reference-detail { display: none; }

/* Preferences are opened deliberately; delivery monitoring remains available in Inbox. */
.inbox-notification-dialog { width: min(420px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 24px; border: 1px solid #dedede; border-radius: 14px; background: #fff; color: #303030; box-shadow: 0 20px 80px #0003; }
.inbox-notification-dialog::backdrop { background: #0005; }
.inbox-notification-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; }
.inbox-notification-dialog .messages-preferences-heading { display: grid; gap: 20px; }
.inbox-notification-dialog h2 { padding-right: 32px; font-size: 18px; }
.inbox-notification-dialog .messages-preferences-heading > .button { justify-self: start; min-height: 40px; }
.inbox-notification-dialog .chat-notification-help, .inbox-notification-dialog .chat-notification-test { margin: 16px 0 0; }
.inbox-notification-dialog .chat-notification-test { padding-top: 16px; border-top: 1px solid #eee; }
.inbox-notification-dialog .chat-notification-test span { color: #777; font-size: 12px; }
.sales-assignment-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sales-assignment-summary h2 { margin: 0 0 6px; font-size: 12px; font-weight: 500; color: #777; }
.sales-assignment-summary p { font-size: 13px; color: #303030; }
.sales-assignment-summary .text-button { min-height: 40px; padding: 8px; }
.sales-assignment-footer { justify-content: flex-end; }
@media (max-width: 760px) {
  .main.inbox-page.inbox-has-thread { padding: 8px; }
  .inbox-thread-header { min-height: 60px; padding: 8px; gap: 4px; }
  .inbox-thread-options summary, .inbox-back, .inbox-thread-notifications { width: 40px; height: 40px; }
  .inbox-assignment select { font-size: 16px; }
}