/* Online customer service, local-only DEMO. Scoped to support components. */
.support-admin,.support-chat,.support-editor{min-width:0}.support-admin .btn,.support-chat .btn,.support-editor .btn{min-height:44px;white-space:normal}.support-admin button:focus-visible,.support-chat button:focus-visible,.support-editor button:focus-visible,.support-chat textarea:focus-visible,.support-editor input:focus-visible{outline:3px solid #a2bc6c;outline-offset:3px}.support-chat-heading{display:flex;gap:16px;align-items:center;justify-content:space-between}.support-chat-heading h2{margin:12px 0 16px;font-size:23px;overflow-wrap:anywhere}.support-status{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid #c4d6c8;border-radius:100px;background:#eff6ee;color:#335541;font-size:11px;line-height:1.5;flex-shrink:0;white-space:nowrap}.support-status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.support-status.queued{background:#fff6e9;border-color:#efd3a9;color:#875b28}.support-status.unavailable{background:#f3f1ef;border-color:#d8d0c7;color:#76624f}.support-context{display:flex;flex-wrap:wrap;gap:8px 20px;background:#f2f5ed;border:1px solid var(--line,#dce3d6);border-radius:8px;padding:12px;font-size:12px;line-height:1.7;overflow-wrap:anywhere}.support-context span{max-width:100%}.support-disclaimer{font-size:11px;line-height:1.8;color:var(--muted,#65745e);margin:12px 0}.support-messages{height:clamp(180px,31vh,330px);overflow:auto;overscroll-behavior:contain;background:#f7f8f3;border:1px solid var(--line,#dce3d6);border-radius:10px;padding:14px;margin-top:16px;scrollbar-gutter:stable}.support-message{max-width:90%;width:fit-content;padding:11px 14px;border:1px solid #dce4d7;border-radius:11px 11px 11px 3px;background:#fff;margin:0 0 12px;overflow-wrap:anywhere;word-break:break-word}.support-message.own{margin-left:auto;margin-right:0;background:#e6edda;border-color:#d5dfc9;border-radius:11px 11px 3px 11px}.support-message.other{margin-left:0;margin-right:auto;background:#fff;border-radius:11px 11px 11px 3px}.support-message.system{margin-left:auto;margin-right:auto;max-width:100%;background:transparent;border:0;border-radius:0;text-align:center;color:var(--muted,#65745e)}.support-message.system p{font-size:11px}.support-system-note{clear:both;align-self:stretch}.support-message-meta{font-size:10px;line-height:1.6;color:#687760}.support-message p{font-size:13px;line-height:1.8;margin:5px 0 0;white-space:pre-wrap}.support-response{font-size:10px;color:var(--muted,#65745e);margin:9px 0 15px}.support-compose-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.support-compose-actions small{font-size:10px;color:var(--muted,#65745e)}.support-chat textarea{resize:vertical;min-height:85px;max-height:220px;font-size:14px}.support-chat .field{font-size:12px}.support-request{width:100%;margin-top:14px}.support-agent-panel{border:1px solid var(--line,#dce3d6);border-radius:10px;background:#fcfdf9;margin:20px 0 26px;padding:0 16px}.support-agent-panel summary{font-size:14px;font-weight:650;padding:16px 0;cursor:pointer;min-height:44px}.support-agent-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 0;border-top:1px solid var(--line,#dce3d6)}.support-agent-row>div{min-width:0}.support-agent-row b,.support-agent-row small{overflow-wrap:anywhere}.support-agent-row small{font-size:10px;color:var(--muted,#65745e)}.support-agent-row .help{margin:7px 0}.support-agent-row .inline-actions{justify-content:flex-end;flex-shrink:0;max-width:63%;gap:6px}.support-agent-row .btn{font-size:11px;padding:9px 12px}.support-inbox-title{font-size:17px}.support-inbox{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.support-conversation{display:flex;flex-direction:column;gap:9px;min-width:0;text-align:left;background:#fff;border:1px solid var(--line,#dce3d6);border-radius:9px;padding:17px;color:var(--green,#183f35);font:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s;overflow-wrap:anywhere}.support-conversation:hover{border-color:#96ad7e;box-shadow:0 4px 15px #183f3508}.support-conversation>span{font-size:12px;line-height:1.7}.support-conversation .support-conversation-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.support-conversation .support-conversation-context,.support-conversation small{color:var(--muted,#65745e);font-size:10px}.support-preview{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#4d5f47;min-height:36px}.support-empty{padding:24px 15px;text-align:center;font-size:12px;line-height:1.9;color:var(--muted,#65745e)}.support-inbox>.support-empty{grid-column:1/-1;border:1px dashed #ccd6c4;border-radius:8px}.support-order-summary{padding:16px 0}.support-order-summary>b{font-size:14px;margin-right:10px;overflow-wrap:anywhere}.support-order-summary .support-status{vertical-align:middle}.support-editor .check-row{font-size:12px;min-height:44px;align-items:center;margin:4px 0}.support-editor .check-row input{width:18px;height:18px;margin:0;flex:none}
@media(max-width:760px){.support-inbox{grid-template-columns:1fr}.support-agent-row{flex-direction:column;align-items:stretch;gap:12px}.support-agent-row .inline-actions{justify-content:flex-start;max-width:100%}.support-admin>.section-title{align-items:flex-start;gap:12px;flex-wrap:wrap}.support-chat-heading{align-items:flex-start}.support-chat-heading h2{font-size:21px}.support-chat-heading>.support-status{margin-top:5px}.support-message{max-width:94%}}
@media(max-width:420px){.support-chat-heading{flex-direction:column;gap:0;margin-bottom:12px}.support-chat-heading h2{margin-bottom:8px}.support-messages{padding:10px}.support-context{gap:5px 12px;padding:10px;font-size:11px}.support-compose-actions{align-items:stretch;flex-direction:column;gap:8px}.support-compose-actions .btn{width:100%}.support-conversation{padding:14px}.support-conversation .support-conversation-top{flex-wrap:wrap;gap:6px}.support-agent-panel{padding:0 11px}.support-agent-row .btn{padding:9px 11px}.support-order-summary>.support-status{margin-top:8px}.support-chat textarea{font-size:16px}}

/* Keep the composer reachable; only the support dialog gets this bounded layout. */
.dialog:has(.support-chat){position:relative;display:flex;flex-direction:column;width:min(640px,100%);height:min(760px,calc(100vh - 32px));height:min(760px,calc(100dvh - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);min-height:0;overflow:hidden;padding:20px}
.dialog:has(.support-chat)>.dialog-close{position:absolute;top:8px;right:8px;float:none;display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;z-index:1;border-radius:8px}
.support-chat{display:flex;flex:1 1 0;flex-direction:column;gap:10px;min-height:0;overflow:hidden}
.support-chat>.support-chat-heading{flex:0 0 auto;gap:12px;padding-right:42px}
.support-chat-heading h2{margin:6px 0 8px}
.support-chat-body{display:flex;flex:1 1 0;flex-direction:column;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.support-chat-body>.support-context,.support-chat-body>.support-disclaimer,.support-chat-body>.notice,.support-chat-body>.support-response{flex-shrink:0}
.support-chat-body>.support-disclaimer{margin:8px 0;line-height:1.6}
.support-chat-body>.notice{margin-bottom:8px;padding:8px 10px}
.support-chat .support-messages{height:auto;min-height:0;flex:1 0 96px;margin-top:0}
.support-chat-body>.support-response{margin:7px 0 0;line-height:1.5}
.support-chat-compose{flex:0 0 auto;min-width:0;padding-top:10px;border-top:1px solid var(--line,#dce3d6);background:var(--bg,#f5f6f1)}
.support-chat-compose .field{margin-bottom:8px;gap:6px}
.support-chat-compose textarea{min-height:72px;height:72px;max-height:110px;resize:none}
.support-chat-compose .support-request{margin-top:8px}
@media(max-width:420px){.dialog:has(.support-chat){padding:14px;height:calc(100vh - 24px);height:calc(100dvh - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}.support-chat>.support-chat-heading{flex-direction:row;gap:8px;margin-bottom:0;align-items:center}.support-chat-heading h2{font-size:20px;margin:5px 0}.support-chat-heading>.support-status{margin-top:0;padding:5px 8px;font-size:10px}.support-chat .support-compose-actions{flex-direction:row;align-items:center;gap:8px}.support-compose-actions small{flex:1;line-height:1.5}.support-chat .support-compose-actions .btn{width:auto;min-width:96px;flex-shrink:0}.support-chat-compose textarea{min-height:64px;height:64px;max-height:90px}.support-chat .support-context{padding:8px;gap:3px 10px}.support-chat .support-messages{flex-basis:80px;padding:10px}}
@media(max-height:500px){.dialog:has(.support-chat){padding:12px}.support-chat{gap:6px}.support-chat-heading .tag{display:none}.support-chat-heading h2{margin:2px 0;font-size:20px}.support-chat-compose{padding-top:6px}.support-chat-compose textarea{min-height:44px;height:44px;max-height:60px}.support-chat-compose .support-request{margin-top:5px}.support-chat .support-messages{flex-basis:64px}.support-chat-compose .field{gap:3px;margin-bottom:5px}}