
.support-widget{position:fixed;inset:auto 20px 20px auto;margin:0;padding:0;width:390px;max-width:calc(100vw - 28px);height:630px;max-height:calc(100dvh - 30px);border:1px solid #d8e7ef;border-radius:18px;background:#fff;color:#163d55;box-shadow:0 18px 70px #062c4a42;overflow:hidden;font:14px/1.5 Arial,sans-serif}
.support-widget[open]{display:flex;flex-direction:column}.support-widget::backdrop{background:#0b2d4b40}
.support-widget-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:19px 20px;background:#0c4266;color:white;flex-shrink:0}
.support-widget-heading h2{margin:0;font-size:19px;line-height:1.4;color:white;display:inline}.support-widget-heading p{margin:3px 0 0;font-size:12px;color:#d6eaf7}
.support-online-dot{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:#73d7d6}
.support-widget .support-close{position:static;border:0;border-radius:8px;width:34px;height:34px;background:#ffffff15;color:white;font:26px/1 Arial;cursor:pointer;flex-shrink:0}
.support-chat-body{display:flex;flex-direction:column;min-height:0;flex:1;background:#f6f9fc;overflow:hidden}
.support-log{padding:18px;overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1;scrollbar-width:thin}
.support-message{max-width:90%;width:fit-content;margin:0 0 14px;padding:11px 13px;border-radius:13px;border:1px solid #dce6ef;background:#fff;color:#17374e;overflow-wrap:anywhere}
.support-message.support-own{margin-left:auto;background:#e2f4fc;border-color:#c2e8f7;border-bottom-right-radius:3px}.support-message.support-other{border-bottom-left-radius:3px}
.support-message p{margin:6px 0 0;font-size:14px;line-height:1.55;white-space:pre-wrap;color:inherit}.support-message-meta{display:flex;flex-wrap:wrap;gap:3px 12px;align-items:center}.support-message-meta strong{font-size:12px}.support-message-meta time{font-size:10px;color:#526d7e}
.support-empty{padding:28px 18px;text-align:center;color:#607687;font-size:14px}.support-empty strong,.support-empty h2{display:block;font-size:18px;color:#163d55;margin:8px 0}.support-empty p{font-size:14px;margin:8px 0}
.support-composer{flex-shrink:0;margin:0;padding:14px 16px;background:white;border-top:1px solid #dfe8ef}.support-composer label{display:block;font-size:12px;font-weight:600;color:#466077}
.support-composer textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;min-height:70px;max-height:150px;padding:10px 11px;margin:5px 0 10px;border:1px solid #cbdde7;border-radius:8px;font:14px/1.4 Arial,sans-serif;color:#163d55;background:white}
.support-composer textarea:focus,.support-search input:focus{outline:2px solid #28aed4;outline-offset:1px}
.support-compose-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.support-compose-actions small{font-size:11px;color:#708393}
.support-send,.support-search button{border:0;background:#0e8db3;color:#fff;border-radius:7px;padding:10px 16px;font-size:13px;font-weight:600;cursor:pointer}.support-send:disabled{opacity:.5;cursor:wait}
.support-error{font-size:13px;line-height:1.5;color:#ae293a;padding:0 16px;background:#fff3f4;overflow-wrap:anywhere}.support-error:not(:empty){padding-top:10px;padding-bottom:10px}.support-error a{color:#0c678d;text-decoration:underline}
.support-older,.support-latest{align-self:center;flex-shrink:0;border:1px solid #cae0eb;border-radius:20px;padding:6px 12px;margin:9px;background:white;color:#176787;font-size:12px;cursor:pointer}
.support-launcher{position:fixed;right:22px;bottom:22px;z-index:40;width:52px;height:52px;display:grid;place-items:center;border:0;border-radius:17px;background:#249db4;color:#fff;font-size:26px;box-shadow:0 4px 20px #08465d33;cursor:pointer}
.support-launcher-badge{position:absolute;right:-5px;top:-5px;min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;background:#ed5368;color:#fff;border:2px solid white;border-radius:12px;font:bold 10px/16px Arial;text-align:center}
.support-inbox{display:grid;grid-template-columns:300px minmax(0,1fr);height:clamp(480px,calc(100dvh - 230px),760px);min-height:0;border:1px solid #dce6ef;border-radius:12px;background:white;overflow:hidden}.support-inbox-sidebar{display:flex;flex-direction:column;min-height:0;border-right:1px solid #dce6ef;min-width:0;background:#fff}
.support-search{flex-shrink:0;padding:18px;border-bottom:1px solid #e2ebf0}.support-search label{display:block;font-size:12px;font-weight:600;color:#526b7e}.support-search input,.support-search select{width:100%;min-width:0;box-sizing:border-box;padding:9px;border:1px solid #d5e2eb;border-radius:6px;background:#fff;color:#254b64;font-size:13px}.support-search input{margin:6px 0 10px}.support-search>div{display:flex;gap:8px}.support-search button{padding:8px 12px}
#support-inbox-list{min-height:0;flex:1;overflow:auto}.support-inbox-row{display:block;padding:16px 18px;border-bottom:1px solid #edf1f5;text-decoration:none;color:#254b64}.support-inbox-row:hover{background:#f5fafc}.support-inbox-row.selected{background:#eaf7fd;box-shadow:inset 3px 0 #1aabd3}.support-inbox-row>div{display:flex;justify-content:space-between;gap:8px}.support-inbox-row strong{font-size:14px;overflow-wrap:anywhere}.support-inbox-row p{margin:6px 0;color:#607687;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.support-inbox-row small{font-size:11px;color:#758c9a}
.support-unread,.support-admin-badge{display:inline-block;border-radius:12px;background:#168fc0;color:white!important;padding:2px 7px;font-size:11px!important;font-weight:bold;line-height:1.4;margin-left:auto}
.support-inbox-count{padding:7px 12px;font-size:12px;border-radius:20px;background:#e5f5fc;color:#126d95}
.support-inbox-conversation{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%}.support-conversation-heading{padding:17px 22px;border-bottom:1px solid #dce6ef;background:white}.support-conversation-heading h2{margin:0;font-size:18px;overflow-wrap:anywhere}.support-conversation-heading p{margin:3px 0 0;font-size:12px;color:#708495}
.support-pagination{flex-shrink:0;padding:15px;display:flex;gap:14px;flex-wrap:wrap;font-size:12px}.support-pagination a{color:#0e7ba3}.support-list-error{color:#a22a37;font-size:12px;padding:0 16px}.support-list-error:not(:empty){padding:10px 16px}
.support-inbox [hidden],.support-widget [hidden],.support-launcher-badge[hidden],.support-admin-badge[hidden]{display:none!important}
@media(max-width:1100px){.support-inbox{grid-template-columns:250px minmax(0,1fr)}}
@media(max-width:760px){.support-inbox{grid-template-columns:1fr;height:auto}.support-inbox-sidebar{border-right:0;border-bottom:1px solid #dce6ef}#support-inbox-list{max-height:220px}.support-inbox-conversation{height:600px}.support-message{max-width:95%}.support-inbox-count{font-size:11px}}
@media(max-width:440px){.support-widget{inset:auto 10px 10px auto;width:calc(100vw - 20px);max-width:none;height:650px;max-height:calc(100dvh - 20px)}.support-widget-heading{padding:16px}.support-log{padding:12px}.support-compose-actions small{font-size:10px}}

/* Match the public homepage's pink and neutral palette. */
:is(.marketing-site,body[data-surface=customer]) .support-widget{border-color:#e8e2e7;border-radius:20px;color:#29272e;box-shadow:0 20px 65px #30233130}
:is(.marketing-site,body[data-surface=customer]) .support-widget::backdrop{background:#2725302e}
:is(.marketing-site,body[data-surface=customer]) .support-widget-heading{background:linear-gradient(115deg,#e0004b,#c90043);padding:20px}
:is(.marketing-site,body[data-surface=customer]) .support-widget-heading p{color:#fff0f5}
:is(.marketing-site,body[data-surface=customer]) .support-online-dot{background:#fff;box-shadow:0 0 0 4px #ffffff18}
:is(.marketing-site,body[data-surface=customer]) .support-widget .support-close{background:#ffffff20;border-radius:50%;transition:background-color 150ms ease}
:is(.marketing-site,body[data-surface=customer]) .support-widget .support-close:hover{background:#ffffff35}
:is(.marketing-site,body[data-surface=customer]) .support-chat-body{background:#faf8fa}
:is(.marketing-site,body[data-surface=customer]) .support-message{background:white;border-color:#e8e2e7;color:#332c36}
:is(.marketing-site,body[data-surface=customer]) .support-message.support-own{background:#fff0f5;border-color:#f3ccda}
:is(.marketing-site,body[data-surface=customer]) .support-message-meta time{color:#79717e}
:is(.marketing-site,body[data-surface=customer]) .support-empty,:is(.marketing-site,body[data-surface=customer]) .support-compose-actions small{color:#7b7380}
:is(.marketing-site,body[data-surface=customer]) .support-empty strong,:is(.marketing-site,body[data-surface=customer]) .support-empty h2{color:#332c36}
:is(.marketing-site,body[data-surface=customer]) .support-composer{border-color:#e8e2e7;padding:16px}
:is(.marketing-site,body[data-surface=customer]) .support-composer label{color:#514853}
:is(.marketing-site,body[data-surface=customer]) .support-composer textarea{border-color:#ddd5df;color:#332c36;border-radius:10px;background:#fff}
:is(.marketing-site,body[data-surface=customer]) .support-composer textarea::placeholder{color:#8a818d}
:is(.marketing-site,body[data-surface=customer]) .support-composer textarea:focus{outline:2px solid #db0048;outline-offset:2px}
:is(.marketing-site,body[data-surface=customer]) .support-send{background:#db0048;border-radius:999px;padding:11px 19px;transition:background-color 150ms ease}
:is(.marketing-site,body[data-surface=customer]) .support-send:hover:not(:disabled){background:#bc003e}
:is(.marketing-site,body[data-surface=customer]) .support-older,:is(.marketing-site,body[data-surface=customer]) .support-latest{border-color:#ebcfda;color:#c20042}
:is(.marketing-site,body[data-surface=customer]) .support-error a{color:#be0040}
:is(.marketing-site,body[data-surface=customer]) .support-launcher-badge{background:#7028b8}
@media(prefers-reduced-motion:reduce){:is(.marketing-site,body[data-surface=customer]) .support-send,:is(.marketing-site,body[data-surface=customer]) .support-widget .support-close{transition:none}}
@media(max-width:440px){:is(.marketing-site,body[data-surface=customer]) .support-widget{width:calc(100% - 20px);max-width:calc(100% - 20px)}}

.support-attachment{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:10px 0}.support-attach-label{cursor:pointer;font-size:12px!important}.support-attach-label input{display:block;font-size:11px;max-width:230px;margin-top:5px}.support-attachment>small{font-size:10px;color:var(--muted,#888)}.support-image-preview{width:100%;display:flex;gap:12px;align-items:center}.support-image-preview[hidden]{display:none}.support-image-preview img{max-width:140px;max-height:100px;border-radius:8px}.support-image-preview button{font-size:11px}.support-message-image{display:block;max-width:100%;width:auto;max-height:420px;object-fit:contain;border-radius:10px;margin-top:8px}

.support-composer{position:relative}.support-composer>label>textarea{padding-left:48px}.support-attachment .support-attach-label{position:absolute;top:53px;left:27px;width:32px;height:34px;display:grid;place-items:center;color:#8b8179;border-radius:8px;cursor:pointer;overflow:hidden}.support-attach-label svg{width:23px;height:23px;pointer-events:none}.support-attach-label:hover{color:#ff5900;background:#ff59000d}.support-attach-label:focus-within{outline:2px solid #ff5900;outline-offset:2px}.support-attachment .support-attach-label input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.support-attachment{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:7px}.support-image-preview{flex-basis:100%}html[data-theme=dark] .customer-chat-topics{background:#202528}

.support-receipt-attachment{display:flex;align-items:center;gap:12px;padding:12px;margin-top:12px;border:1px solid currentColor;border-radius:10px;color:inherit;text-decoration:none}.support-receipt-attachment>span:first-child{font-size:23px}.support-receipt-attachment>span:nth-child(2){flex:1;min-width:0}.support-receipt-attachment strong{display:block;font-size:12px}.support-receipt-attachment small{display:block;font-size:10px;overflow-wrap:anywhere;margin-top:4px}.support-receipt-attachment>span:last-child{font-size:10px}.support-receipt-attachment:hover{background:#88888810}
.support-receipt-attachment:has(.support-receipt-preview){display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;max-width:440px}
.support-receipt-attachment .support-receipt-preview{grid-column:1 / -1;width:100%;max-width:100%;height:240px;object-fit:contain;background:#fff;border-radius:8px}
