/* Customer service: readable conversation, quiet metadata, clear order context. */
#messagesWorkspace { --conversation-seller: #193d50; }
#messagesWorkspace .messages-hero { border: 0; background: transparent; padding: 4px 2px 10px; }
#messagesWorkspace .messages-hero h2 { font-size: 21px; letter-spacing: -.5px; }
#messagesWorkspace .messages-summary { gap: 12px; }
#messagesWorkspace .messages-summary button { border-radius: 14px; padding: 11px 14px; box-shadow: 0 2px 5px #102a4305; }
#messagesWorkspace .messages-summary strong { font-size: 23px; letter-spacing: -.5px; }
#messagesWorkspace .messages-source-tabs { border-radius: 14px; padding: 5px; }
#messagesWorkspace .messages-source-tabs button { border-radius: 10px; padding: 11px 8px; }
#messagesWorkspace .messages-toolbar { border-radius: 14px; }
#messagesWorkspace .messages-layout { grid-template-columns: minmax(265px, .7fr) minmax(0, 1.5fr); gap: 18px; }
#messagesWorkspace .messages-case-list { padding: 5px; background: transparent; border: none; gap: 8px; }
#messagesWorkspace .message-case { padding: 16px; border-radius: 14px; border-left-width: 3px; box-shadow: 0 2px 5px #102a4305; transition: border-color .15s, background .15s; }
#messagesWorkspace .message-case:hover { background: color-mix(in srgb, var(--accent) 6%, var(--paper)); }
#messagesWorkspace .message-case.active { background: color-mix(in srgb, var(--accent) 7%, var(--paper)); box-shadow: 0 0 0 1px var(--accent); }
#messagesWorkspace .message-case-heading { align-items: baseline; }
#messagesWorkspace .message-case-heading strong { font-size: 14px; }
#messagesWorkspace .message-case-heading time { font-size: 10px; }
#messagesWorkspace .message-case p { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; font-size: 12px; line-height: 1.55; }
#messagesWorkspace .message-case-meta span { font-size: 10px; font-weight: 600; }
#messagesWorkspace .messages-thread { border-radius: 18px; min-width: 0; box-shadow: 0 6px 26px #102a4307; }
#messagesWorkspace .messages-thread-header { padding: 20px; align-items: center; background: var(--paper); flex-wrap: wrap; }
#messagesWorkspace .messages-thread-header h3 { font-size: 19px; letter-spacing: -.3px; }
#messagesWorkspace .messages-thread-header p { font-size: 12px; line-height: 1.6; }
#messagesWorkspace .messages-thread-actions .button,
#messagesWorkspace .messages-thread-actions .action-button { font-size: 11px; padding: 8px 10px; border-radius: 9px; }
#messagesWorkspace .messages-conversation { padding: 22px; gap: 15px; background: color-mix(in srgb, var(--paper) 75%, var(--soft)); max-height: min(58vh, 680px); overscroll-behavior: contain; }
#messagesWorkspace .message-bubble { width: fit-content; max-width: 87%; min-width: 90px; padding: 15px 17px 10px; background: var(--conversation-seller); color: #fff; border-radius: 16px 16px 4px 16px; box-shadow: 0 2px 5px #102a4306; overflow-wrap: anywhere; }
#messagesWorkspace .message-bubble.incoming { background: var(--paper); color: var(--ink); border: 1px solid var(--line); border-radius: 16px 16px 16px 4px; }
#messagesWorkspace .message-bubble.from-allegro { background: color-mix(in srgb, #ff6900 8%, var(--paper)); border-color: color-mix(in srgb, #ff6900 25%, var(--line)); }
#messagesWorkspace .message-bubble p { font-size: 14px; line-height: 1.7; }
#messagesWorkspace .message-bubble p a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
#messagesWorkspace .message-bubble footer { color: #d4e4eb; font-size: 10px; line-height: 1.4; margin-top: 9px; flex-wrap: wrap; }
#messagesWorkspace .message-bubble.incoming footer { color: var(--muted); }
.customer-message-author { font-size: 11px; font-weight: 700; margin-bottom: 8px; opacity: .85; }
.customer-day { display: flex; align-items: center; gap: 14px; color: var(--muted); font-size: 11px; margin: 10px 0 0; justify-self: stretch; }
.customer-day::before, .customer-day::after { content: ""; height: 1px; background: var(--line); flex: 1; }
.customer-context { margin: 12px 18px; padding: 14px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); border-radius: 12px; min-width: 0; }
.customer-context.compact { margin: 0 0 12px; padding: 12px; background: color-mix(in srgb, var(--soft) 75%, var(--paper)); box-shadow: none; }
.customer-context-heading { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 11px; font-weight: 700; }
.customer-context-heading > span { color: var(--muted); }
.customer-context a { color: var(--accent); text-underline-offset: 3px; }
.customer-order-id { font-size: 10px; color: var(--muted); overflow-wrap: anywhere; margin-top: 6px; }
.customer-product { display: grid; grid-template-columns: 54px minmax(0,1fr); align-items: center; gap: 12px; margin-top: 12px; }
.customer-product img, .customer-product-placeholder { width: 54px; height: 62px; object-fit: contain; background: white; border-radius: 8px; }
.customer-product-placeholder { display: grid; place-content: center; color: #a4b2bc; font-size: 25px; }
.customer-product-title { font-size: 12px; font-weight: 650; line-height: 1.5; display: block; }
.customer-product small { display: block; font-size: 10px; line-height: 1.5; color: var(--muted); margin-top: 5px; }
.customer-product b { color: var(--ink); }
.customer-context-more { display: block; color: var(--muted); font-size: 11px; margin-top: 9px; }
#messagesWorkspace .messages-composer { padding: 16px 20px 20px; gap: 12px; background: var(--paper); }
#messagesWorkspace .messages-composer textarea { font-size: 14px; line-height: 1.6; min-height: 100px; border-radius: 12px; padding: 14px; }
.customer-composer-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.customer-composer-tools .button { padding: 8px 11px; font-size: 12px; border-radius: 9px; min-height: 36px; }
.customer-composer-tools small { font-size: 10px; color: var(--muted); }
.customer-add-file { position: relative; overflow: hidden; cursor: pointer; }
.customer-file-input { position: absolute; opacity: 0; inset: 0; width: 100%; cursor: pointer; }
.customer-file-previews { display: grid; gap: 6px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.customer-file-previews:empty { display: none; }
.customer-file-preview { display: flex; gap: 9px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; align-items: center; min-width: 0; }
.customer-file-preview img, .customer-file-icon { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.customer-file-icon { display: grid; place-content: center; background: var(--soft); color: var(--muted); }
.customer-file-preview > span:not(.customer-file-icon) { min-width: 0; flex: 1; }
.customer-file-preview b { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-file-preview small { font-size: 10px; color: var(--muted); }
.customer-file-preview button { border: 0; background: transparent; color: var(--muted); font-size: 22px; cursor: pointer; }
#messagesWorkspace .messages-composer-actions .button { min-height: 42px; border-radius: 10px; padding-inline: 16px; font-size: 12px; }
#messagesWorkspace .issue-facts { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 14px 18px; gap: 10px; }
#messagesWorkspace .issue-facts strong { font-size: 12px; }
#messagesWorkspace .issue-facts a { color: var(--accent); }
#messagesWorkspace .issue-composer-fields { grid-template-columns: 1fr; }
#messagesWorkspace .claim-return-panel { margin: 12px 18px; }
.customer-reply-library { color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 20px; padding: 24px; width: min(900px,calc(100vw - 32px)); max-height: 88dvh; box-sizing: border-box; }
.customer-reply-library::backdrop { background: #102a4380; backdrop-filter: blur(3px); }
.customer-reply-library > header { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 22px; }
.customer-reply-library header small { font-size: 10px; font-weight: 750; letter-spacing: .7px; color: var(--accent); }
.customer-reply-library header h3 { font-size: 23px; margin: 7px 0; }
.customer-reply-library header p { color: var(--muted); font-size: 12px; margin: 0; }
.customer-reply-library [data-library-close] { color: var(--muted); font-size: 25px; border: 0; background: transparent; align-self: flex-start; cursor: pointer; }
.reply-library-layout { display: grid; grid-template-columns: minmax(200px,.8fr) minmax(0,1.2fr); gap: 24px; }
.reply-library-layout > section { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.reply-library-list { display: grid; gap: 8px; align-content: start; max-height: 45vh; overflow-y: auto; }
.reply-library-list > button { border: 1px solid var(--line); border-radius: 10px; padding: 12px; display: grid; gap: 6px; text-align: left; cursor: pointer; background: var(--paper); color: var(--ink); }
.reply-library-list > button:hover { border-color: var(--accent); background: var(--soft); }
.reply-library-list strong { font-size: 12px; }
.reply-library-list span { font-size: 11px; line-height: 1.5; color: var(--muted); overflow-wrap: anywhere; }
.reply-library-editor { display: grid; gap: 12px; min-width: 0; align-content: start; }
.reply-library-editor h4 { margin: 0; }
.reply-library-editor label { display: grid; gap: 6px; font-size: 12px; font-weight: 650; }
.customer-reply-library input, .customer-reply-library textarea { width: 100%; box-sizing: border-box; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--ink); font: inherit; font-size: 13px; }
.reply-library-editor textarea { line-height: 1.65; resize: vertical; }
.reply-library-editor small, .reply-library-feedback { color: var(--muted); font-size: 11px; line-height: 1.5; }
.reply-library-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
.reply-library-buttons .button { font-size: 11px; }
@media(max-width:1050px) {
  #messagesWorkspace .messages-layout { grid-template-columns: minmax(230px,.7fr) minmax(0,1.3fr); gap: 12px; }
  #messagesWorkspace .message-bubble { max-width: 94%; }
  #messagesWorkspace .messages-thread-header { padding: 16px; }
}
@media(max-width:760px) {
  #messagesWorkspace .messages-layout { grid-template-columns: minmax(0,1fr); }
  #messagesWorkspace .messages-case-list { max-height: 32vh; overflow-y: auto; }
  #messagesWorkspace .messages-thread { position: static; }
  #messagesWorkspace .messages-summary { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  #messagesWorkspace .messages-summary button { padding: 12px; }
  #messagesWorkspace .messages-conversation { padding: 14px 10px; max-height: 58dvh; }
  #messagesWorkspace .message-bubble { padding: 12px; max-width: 94%; }
  #messagesWorkspace .messages-composer { padding: 13px; }
  #messagesWorkspace .messages-composer textarea { font-size: 16px; }
  .customer-composer-tools small { flex-basis: 100%; }
  .customer-context { margin: 10px; padding: 11px; }
  .customer-context.compact { margin: 0 0 10px; }
  .customer-file-previews { grid-template-columns: minmax(0,1fr); }
  .customer-reply-library { padding: 16px; width: calc(100vw - 20px); }
  .customer-reply-library header h3 { font-size: 19px; }
  .reply-library-layout { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .reply-library-list { max-height: 22vh; }
  .customer-reply-library input, .customer-reply-library textarea { font-size: 16px; }
}

#messagesWorkspace { gap: 12px; }
#messagesWorkspace .messages-hero { align-items: center; }
#messagesWorkspace .messages-hero p { font-size: 12px; }
#messagesWorkspace .messages-status-line { background: transparent; padding: 0 2px; font-size: 10px; }
#messagesWorkspace .messages-summary small { display: none; }
#messagesWorkspace .messages-toolbar { padding: 11px 14px; }
#messagesWorkspace .issue-state-filters { padding: 11px 14px; border-radius: 14px; }
.customer-queue-help { margin-top: 9px; color: var(--muted); font-size: 10px; }
.customer-queue-help summary { cursor: pointer; }
#messagesWorkspace .customer-queue-help p { font-size: 11px; line-height: 1.6; max-width: 950px; }
.customer-reply-library header small, .customer-context a { color: color-mix(in srgb, var(--accent) 75%, var(--ink)); }
@media(max-width:760px) {
  #messagesWorkspace .messages-hero { align-items: stretch; }
  #messagesWorkspace .messages-summary button { padding: 10px; }
  #messagesWorkspace .messages-source-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

body.theme-dark .customer-context a, body.theme-dark .customer-reply-library header small,
body.theme-dark #messagesWorkspace .issue-facts a { color: #8fcdf2; }

/* One set of source tabs; the summary buttons also select the source. */
#messagesWorkspace .messages-source-tabs { display: none; }
#messagesWorkspace .messages-hero { padding: 0; }
#messagesWorkspace .messages-hero h2 { font-size: 17px; }
#messagesWorkspace .messages-hero p { display: none; }
#messagesWorkspace .issue-state-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
#messagesWorkspace .customer-queue-help { margin-top: 0; margin-left: auto; }
#messagesWorkspace .customer-queue-help[open] { flex-basis: 100%; }
#messagesWorkspace .messages-summary { gap: 7px; }
#messagesWorkspace .messages-summary button { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; border-radius: 10px; }
#messagesWorkspace .messages-summary button > span { font-size: 12px; text-transform: none; }
#messagesWorkspace .messages-summary strong { font-size: 17px; }
#messagesWorkspace .messages-layout { grid-template-columns: minmax(235px,.58fr) minmax(0,1.5fr); gap: 12px; align-items: start; }
#messagesWorkspace .message-case { padding: 12px; border-radius: 10px; }
#messagesWorkspace .message-case p { margin: 6px 0; line-height: 1.45; }
#messagesWorkspace .message-case-meta { gap: 4px; }
#messagesWorkspace .message-case-meta .issue-lifecycle { display: none; }
#messagesWorkspace .messages-thread { border-radius: 12px; }
#messagesWorkspace .messages-thread-header { padding: 13px 16px; gap: 10px; }
#messagesWorkspace .messages-thread-header h3 { font-size: 17px; }
#messagesWorkspace .messages-thread-header p { margin-top: 4px; font-size: 11px; }
#messagesWorkspace .messages-conversation { padding: 16px; gap: 10px; }
#messagesWorkspace .message-bubble { padding: 12px 14px 9px; border-radius: 12px; }
#messagesWorkspace .message-bubble p { font-size: 13px; line-height: 1.6; }
#messagesWorkspace .messages-composer { padding: 12px 16px; gap: 9px; }
#messagesWorkspace .messages-composer textarea { min-height: 78px; padding: 11px; font-size: 13px; }
#messagesWorkspace .issue-composer-fields { grid-template-columns: minmax(0,1fr); }
#messagesWorkspace .issue-composer-fields label { display: flex; align-items: center; gap: 10px; }
#messagesWorkspace .issue-composer-fields label > span { white-space: nowrap; font-size: 11px; }
#messagesWorkspace .issue-composer-fields select { padding: 8px; font-size: 12px; }
.claim-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 10px 16px 0; font-size: 11px; color: var(--muted); }
.claim-meta a { margin-left: auto; color: color-mix(in srgb, var(--accent) 65%, var(--ink)); font-weight: 650; }
.claim-meta b { font-weight: 500; color: var(--ink); }
.issue-thread > .customer-context { margin: 12px 16px; padding: 11px; }
.claim-details { margin: 0 16px 12px; border: 1px solid var(--line); border-radius: 9px; font-size: 12px; }
.claim-details > summary { cursor: pointer; padding: 11px 12px; color: var(--ink); font-weight: 650; }
.claim-details > summary small { color: var(--muted); font-weight: 400; margin-left: 14px; }
.claim-details-body { padding: 0 12px 12px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.75fr); gap: 16px; }
.claim-details h4 { margin: 12px 0 6px; font-size: 11px; }
.claim-details p { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.6; margin: 0; }
#messagesWorkspace .claim-details .claim-evidence { padding: 0; border: 0; margin: 0; }
.claim-details .customer-attachments { grid-template-columns: repeat(auto-fit,minmax(65px,1fr)); }
.claim-details .customer-attachment img { height: 74px; }
.claim-workflow { margin: 0 16px 12px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.claim-step { padding: 14px; background: var(--paper); }
.claim-step + .claim-step { border-top: 1px solid var(--line); }
.claim-step > header { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.claim-step-number { display: grid; place-content: center; width: 23px; height: 23px; flex-shrink: 0; border-radius: 50%; background: var(--soft); color: var(--accent); font-size: 11px; font-weight: 750; }
.claim-step h4 { margin: 0; font-size: 13px; }
.claim-state { font-size: 10px; color: var(--muted); margin-left: auto; }
.claim-state.complete { color: color-mix(in srgb, #238763 60%, var(--ink)); }
.claim-step-number { color: color-mix(in srgb, var(--accent) 65%, var(--ink)); }
.claim-step > p { margin: 8px 0 0 31px; font-size: 11px; line-height: 1.5; color: var(--muted); }
.claim-step > .claim-deadline { color: var(--ink); }
.claim-step-actions { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.claim-step-actions .button { font-size: 11px; border-radius: 7px; padding: 9px 12px; min-height: 36px; }
.claim-step-actions details { flex: 1; }
.claim-step-actions summary { width: fit-content; cursor: pointer; display: list-item; list-style-position: inside; }
.claim-return-options { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 10px; }
.claim-return-options a { color: color-mix(in srgb, var(--accent) 65%, var(--ink)); font-size: 12px; }
.claim-return-options small { flex-basis: 100%; font-size: 11px; color: var(--muted); line-height: 1.5; }
#messagesWorkspace .claim-step .issue-decision-panel { margin: 12px 0 0; padding: 12px; border: 1px solid var(--line); background: var(--soft); border-radius: 9px; }
#messagesWorkspace .issue-decision-panel label { font-size: 11px; }
#messagesWorkspace .issue-decision-panel input, #messagesWorkspace .issue-decision-panel select, #messagesWorkspace .issue-decision-panel textarea { font-size: 13px; padding: 9px; }
.customer-chat-heading { border-top: 1px solid var(--line); padding: 12px 16px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.customer-chat-heading h4 { margin: 0; font-size: 12px; }
.customer-chat-heading > span { color: var(--muted); font-size: 10px; margin-left: auto; }
@media(max-width:760px) {
  #messagesWorkspace .customer-queue-help { margin-left: 0; }
  #messagesWorkspace .messages-layout { grid-template-columns: minmax(0,1fr); }
  #messagesWorkspace .messages-summary button { padding: 10px; }
  #messagesWorkspace .messages-thread-header, #messagesWorkspace .messages-composer { padding: 12px; }
  #messagesWorkspace .messages-composer textarea, #messagesWorkspace .issue-composer-fields select,
  #messagesWorkspace .issue-decision-panel input, #messagesWorkspace .issue-decision-panel textarea, #messagesWorkspace .issue-decision-panel select { font-size: 16px; }
  .claim-workflow, .claim-details { margin-inline: 10px; }
  .claim-step { padding: 12px; }
  .claim-details-body { grid-template-columns: minmax(0,1fr); }
  .claim-step-actions .button { min-height: 42px; }
  .claim-step-actions details { flex-basis: 100%; }
  .claim-meta { padding-inline: 12px; }
  .claim-meta a { margin-left: 0; }
  .claim-state { margin-left: 31px; flex-basis: 100%; }
  #messagesWorkspace .issue-composer-fields label { display: grid; }
}
.customer-new-message { width: min(760px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow: auto; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); color: var(--ink); }
.customer-new-message::backdrop { background: rgba(15,25,40,.48); }
.customer-new-message > header { display: flex; justify-content: space-between; gap: 16px; }
.customer-new-message h2 { margin: 4px 0; }
.customer-new-message > header p { color: var(--muted); }
.customer-new-message [data-new-close] { align-self: flex-start; border: 0; background: var(--soft); color: var(--ink); border-radius: 8px; font-size: 24px; cursor: pointer; }
.customer-recipient-search { display: flex; align-items: end; gap: 8px; margin: 14px 0; }
.customer-recipient-search label { display: grid; flex: 1; min-width: 0; gap: 5px; font-size: 12px; font-weight: 700; }
.customer-recipient-search input { width: 100%; min-width: 0; }
.customer-new-message input[type="search"], .customer-new-message textarea { padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--paper); font: inherit; }
.customer-new-message textarea { min-height: 125px; resize: vertical; }
.customer-new-message input:focus, .customer-new-message textarea:focus { outline: 2px solid #558cca; outline-offset: 1px; }
.customer-recipient-results { display: grid; gap: 6px; max-height: 230px; overflow: auto; }
.customer-recipient-results button { display: grid; text-align: left; gap: 4px; padding: 10px; background: var(--soft); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; overflow-wrap: anywhere; }
.customer-recipient-results button:hover { border-color: #558cca; }
.customer-recipient-results span, .customer-recipient-results small { color: var(--muted); font-size: 12px; }
.customer-new-message .messages-composer { border-radius: 12px; margin-top: 14px; }
.customer-new-message .messages-composer textarea { width: 100%; }
.customer-new-feedback { font-size: 13px; line-height: 1.6; }
@media(max-width: 520px) { .customer-new-message { padding: 14px; } .customer-recipient-search { flex-wrap: wrap; } }
.customer-translation { margin-top: -5px !important; border-top: 1px dashed var(--line); padding-top: 7px; color: var(--ink); }
.customer-translation small { display: block; margin-bottom: 4px; color: var(--accent); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.customer-translation-state { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 8px 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--soft); font-size: 12px; line-height: 1.5; }
.customer-translation-state > span { flex: 1 1 240px; }
.customer-translation-language { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.customer-translation-language select { max-width: 180px; padding: 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: var(--paper); }
@media(max-width:760px) { .customer-translation-language select { font-size: 16px; } }