.support-chat[hidden], .support-chat-panel[hidden] { display: none !important; }
.support-chat { position: fixed; z-index: 945; left: 22px; bottom: 18px; color: #183a56; font-family: Manrope, ui-sans-serif, system-ui, sans-serif; }
.support-chat-launcher { position: relative; display: flex; align-items: center; gap: 11px; min-height: 64px; padding: 9px 16px 9px 10px; border: 1px solid #d7e9dc; border-radius: 22px; background: #fff; color: #173a56; box-shadow: 0 12px 34px #12365124; cursor: pointer; text-align: left; transition: transform .2s,box-shadow .2s,border-color .2s; }
.support-chat-launcher:hover { transform: translateY(-2px); border-color: #a9d7b0; box-shadow: 0 15px 38px #1236512b; }
.support-chat-launcher:focus-visible, .support-chat-close:focus-visible, .support-chat-panel .support-chat-compose button:focus-visible, .support-admin-compose button:focus-visible { outline: 3px solid #35ad4d55; outline-offset: 3px; }
.support-chat-launcher-icon, .support-chat-panel .support-chat-mark { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; border: 1px solid #d8edda; border-radius: 15px; background: linear-gradient(145deg,#f1faef,#edf7fb); color: #2ea44a; }
.support-chat-launcher-icon svg, .support-chat-panel .support-chat-mark svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.support-chat-launcher-copy { display: grid; gap: 2px; }
.support-chat-launcher-copy strong { font-size: 12px; font-weight: 800; }
.support-chat-launcher-copy small { color: #7790a1; font-size: 10px; font-weight: 600; }
.support-chat-unread { position: absolute; top: -5px; left: 43px; display: grid; min-width: 19px; height: 19px; place-items: center; padding: 0 5px; border: 2px solid white; border-radius: 99px; background: #e35d50; color: #fff; font-size: 9px; font-style: normal; font-weight: 800; }
.support-chat-unread[hidden] { display: none; }
.support-chat-panel { position: absolute; left: 0; bottom: 78px; display: flex; width: min(370px,calc(100vw - 32px)); height: min(570px,calc(100dvh - 115px)); min-height: 370px; flex-direction: column; overflow: hidden; border: 1px solid #dce8ed; border-radius: 24px; background: #fff; box-shadow: 0 24px 68px #102f4a33; transform-origin: bottom left; animation: support-chat-enter .22s cubic-bezier(.2,.75,.25,1) both; }
.support-chat-panel .support-chat-head { display: flex; align-items: center; gap: 11px; min-height: 74px; padding: 14px 17px; border-bottom: 1px solid #e8eff2; background: linear-gradient(115deg,#f5faf6,#fff); }
.support-chat-panel .support-chat-head > span:nth-child(2) { display: grid; min-width: 0; gap: 4px; }
.support-chat-panel .support-chat-head > span:nth-child(2) strong { color: #163955; font-size: 13px; font-weight: 800; }
.support-chat-panel .support-chat-head > span:nth-child(2) small { overflow: hidden; color: #728b9d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.support-chat-panel .support-chat-head > span:nth-child(2) small i, .support-admin-live i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #35b454; box-shadow: 0 0 0 3px #35b4541a; }
.support-chat-close { display: grid; flex: 0 0 32px; width: 32px; height: 32px; margin-left: auto; place-items: center; border: 1px solid #dce7ec; border-radius: 50%; background: #fff; color: #688196; font-size: 20px; cursor: pointer; }
.support-chat-identity { display: flex; align-items: center; gap: 10px; margin: 13px 15px 0; padding: 10px 12px; border: 1px solid #e0ebee; border-radius: 14px; background: #f8fbfb; }
.support-chat-identity-avatar, .support-inbox-avatar { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; border: 1px solid #d2e9d4; border-radius: 13px; background: #edf7ec; color: #278b40; font-size: 11px; font-weight: 850; }
.support-chat-identity > span:last-child { display: grid; min-width: 0; gap: 3px; }
.support-chat-identity strong { overflow: hidden; color: #31536c; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.support-chat-identity small { overflow: hidden; color: #8196a4; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.support-chat-messages { display: flex; flex: 1; min-height: 0; flex-direction: column; gap: 11px; overflow: auto; padding: 17px 15px; overscroll-behavior: contain; scroll-behavior: smooth; }
.support-chat-message { align-self: flex-start; max-width: 83%; padding: 10px 12px 8px; border: 1px solid #e2ebef; border-radius: 5px 16px 16px 16px; background: #f6f9fa; box-shadow: 0 4px 12px #173a5508; }
.support-chat-message.is-own { align-self: flex-end; border-color: #cde9cb; border-radius: 16px 5px 16px 16px; background: #eff8ed; }
.support-chat-message > span { display: block; margin-bottom: 4px; color: #328d49; font-size: 9px; font-weight: 800; }
.support-chat-message p { margin: 0; color: #355970; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.support-chat-message time { display: block; margin-top: 5px; color: #92a3ae; font-size: 8px; text-align: right; }
.support-chat-welcome { display: grid; align-content: center; justify-items: center; flex: 1; padding: 20px; text-align: center; }
.support-chat-welcome > span, .support-chat-login-icon { display: grid; width: 43px; height: 43px; margin-bottom: 11px; place-items: center; border-radius: 15px; background: #edf7ec; color: #36a950; font-size: 21px; }
.support-chat-welcome strong { color: #173a56; font-size: 15px; }
.support-chat-welcome p { max-width: 240px; margin: 5px 0 0; color: #7a91a0; font-size: 11px; line-height: 1.55; }
.support-chat-panel .support-chat-compose, .support-admin-compose { display: flex; align-items: end; gap: 9px; padding: 12px 14px; border-top: 1px solid #e8eff2; background: #fff; }
.support-chat-panel .support-chat-compose textarea, .support-admin-compose textarea { flex: 1; min-width: 0; min-height: 43px; max-height: 112px; resize: vertical; padding: 12px 13px; border: 1px solid #dce7ec; border-radius: 15px; outline: none; background: #fafcfc; color: #234962; font: 500 12px/1.4 Manrope,ui-sans-serif,system-ui,sans-serif; }
.support-chat-panel .support-chat-compose textarea:focus, .support-admin-compose textarea:focus { border-color: #43b453; box-shadow: 0 0 0 3px #43b4531a; }
.support-chat-panel .support-chat-compose button { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border: 0; border-radius: 15px; background: #31ad4b; color: #fff; cursor: pointer; transition: background .18s,transform .18s; }
.support-chat-panel .support-chat-compose button:hover { transform: translateY(-1px); background: #258c3d; }
.support-chat-panel .support-chat-compose button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.support-chat-foot { padding: 0 15px 12px; color: #91a2ad; font-size: 9px; line-height: 1.45; text-align: center; }
.support-chat-login { display: grid; align-content: center; justify-items: center; flex: 1; padding: 24px; text-align: center; }
.support-chat-login h3 { margin: 0; color: #173a56; font-size: 16px; }
.support-chat-login p { max-width: 285px; margin: 8px 0 17px; color: #71899a; font-size: 11px; line-height: 1.6; }
.support-chat-login > small { margin-top: 12px; color: #95a5af; font-size: 9px; }
.support-chat-primary { min-height: 42px; padding: 0 18px; border: 0; border-radius: 999px; background: #31ad4b; color: #fff; font: 800 11px Manrope,ui-sans-serif,system-ui,sans-serif; box-shadow: 0 8px 18px #31ad4b2a; cursor: pointer; }
.support-chat-primary:hover { background: #258c3d; }
.support-chat-primary span { margin-left: 7px; }
.support-chat-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
@keyframes support-chat-enter { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* Administrator support inbox */
.support-admin-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 19px; padding-bottom: 18px; border-bottom: 1px solid #dfe8ee; }
.support-admin-head .eyebrow { color: #278c47; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.support-admin-head h2 { margin: 6px 0 4px; color: #153650; font-size: 27px; letter-spacing: -.04em; }
.support-admin-head p { max-width: 690px; margin: 0; color: #6e8497; font-size: 13px; line-height: 1.55; }
.support-admin-live { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 9px 12px; border: 1px solid #dcebe0; border-radius: 999px; background: #f5faf4; color: #38854a; font-size: 10px; font-weight: 800; }
.support-admin-nav-badge { display: grid; min-width: 19px; height: 19px; margin-left: auto; place-items: center; padding: 0 5px; border-radius: 999px; background: #35ae4d; color: #fff; font-size: 9px; line-height: 1; }
.support-admin-nav-badge[hidden] { display: none; }
.support-admin-shell { display: grid; grid-template-columns: minmax(270px,340px) minmax(0,1fr); min-height: 610px; overflow: hidden; border: 1px solid #dce7ed; border-radius: 20px; background: #fff; box-shadow: 0 9px 28px #18364e0a; }
.support-inbox { display: flex; min-width: 0; flex-direction: column; border-right: 1px solid #e5edf0; background: #fbfdfd; }
.support-inbox-top { display: grid; gap: 12px; padding: 15px; border-bottom: 1px solid #e6eef1; }
.support-inbox-search { display: flex; align-items: center; gap: 8px; height: 41px; padding: 0 11px; border: 1px solid #dce7ec; border-radius: 12px; background: #fff; color: #7d95a4; }
.support-inbox-search svg { flex: 0 0 17px; width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.support-inbox-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: #274d66; background: transparent; font: 500 11px Manrope,ui-sans-serif,system-ui,sans-serif; }
.support-inbox-filters { display: flex; gap: 6px; }
.support-inbox-filters button { min-height: 30px; padding: 0 12px; border: 1px solid transparent; border-radius: 999px; background: transparent; color: #7890a0; font: 750 10px Manrope,ui-sans-serif,system-ui,sans-serif; cursor: pointer; }
.support-inbox-filters button.active { border-color: #d5e9d5; background: #eff8ed; color: #23853c; }
.support-inbox-list { display: grid; align-content: start; flex: 1; max-height: 650px; overflow: auto; }
.support-inbox-item { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 10px; min-width: 0; padding: 13px 12px; border: 0; border-bottom: 1px solid #eaf0f2; background: transparent; color: inherit; cursor: pointer; text-align: left; transition: background .16s; }
.support-inbox-item:hover { background: #f4f9f5; }
.support-inbox-item.selected { background: #eef8ed; box-shadow: inset 3px 0 #33b04e; }
.support-inbox-item .support-inbox-avatar, .support-thread-head .support-inbox-avatar { flex-basis: 38px; width: 38px; height: 38px; }
.support-inbox-copy { display: grid; min-width: 0; gap: 3px; }
.support-inbox-copy strong { overflow: hidden; color: #254a64; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.support-inbox-copy small { overflow: hidden; color: #8296a4; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.support-inbox-copy > span { overflow: hidden; color: #71899a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.support-inbox-meta { display: grid; align-self: stretch; justify-items: end; gap: 8px; }
.support-inbox-meta time { color: #8ea0ac; font-size: 8px; white-space: nowrap; }
.support-inbox-meta i { display: grid; min-width: 18px; height: 18px; place-items: center; padding: 0 4px; border-radius: 999px; background: #31ad4b; color: #fff; font-size: 8px; font-style: normal; font-weight: 800; }
.support-inbox-empty { display: grid; align-content: center; justify-items: center; gap: 6px; min-height: 180px; padding: 22px; color: #8297a5; text-align: center; }
.support-inbox-empty > span { color: #35aa4d; font-size: 22px; }
.support-inbox-empty strong { color: #45657b; font-size: 12px; }
.support-inbox-empty small { max-width: 210px; font-size: 10px; line-height: 1.5; }
.support-thread { display: flex; min-width: 0; min-height: 610px; flex-direction: column; background: #fff; }
.support-thread-head { display: flex; align-items: center; gap: 11px; min-height: 68px; padding: 12px 16px; border-bottom: 1px solid #e6eef1; }
.support-thread-head > span:nth-child(2) { display: grid; min-width: 0; gap: 4px; }
.support-thread-head > span:nth-child(2) strong { overflow: hidden; color: #234863; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.support-thread-head > span:nth-child(2) small { overflow: hidden; color: #8194a1; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.support-thread-status { margin-left: auto; padding: 6px 9px; border-radius: 999px; background: #eef8ed; color: #278a40; font-size: 9px; font-weight: 800; white-space: nowrap; }
.support-thread-status.resolved { background: #f0f3f5; color: #718390; }
.support-resolve-button { min-height: 33px; padding: 0 10px; border: 1px solid #dbe7ed; border-radius: 999px; background: #fff; color: #607b8e; font: 750 9px Manrope,ui-sans-serif,system-ui,sans-serif; cursor: pointer; white-space: nowrap; }
.support-resolve-button:hover { border-color: #b8dbbc; background: #f3faf2; color: #288941; }
.support-thread-details { display: grid; grid-template-columns: 1fr 1.35fr 1fr; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #edf2f4; background: #fbfdfd; }
.support-thread-details span { display: grid; min-width: 0; gap: 4px; }
.support-thread-details small { color: #92a2ac; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.support-thread-details strong { overflow: hidden; color: #48687e; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.support-thread-messages { display: flex; flex: 1; min-height: 250px; flex-direction: column; gap: 12px; overflow: auto; padding: 20px; background: linear-gradient(#fff,#fbfdfd); }
.support-admin-compose button { flex: 0 0 auto; min-height: 43px; padding: 0 15px; border: 0; border-radius: 13px; background: #31ad4b; color: #fff; font: 800 10px Manrope,ui-sans-serif,system-ui,sans-serif; cursor: pointer; }
.support-admin-compose button:hover { background: #258c3d; }
.support-admin-compose button span { margin-left: 6px; font-size: 13px; }
.support-thread-placeholder, .support-admin-empty { display: grid; align-content: center; justify-items: center; flex: 1; min-height: 350px; padding: 30px; text-align: center; }
.support-thread-placeholder > span { display: grid; width: 58px; height: 58px; margin-bottom: 15px; place-items: center; border: 1px solid #d7ead9; border-radius: 20px; background: #f0f8ef; color: #36a74e; }
.support-thread-placeholder svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.support-thread-placeholder strong, .support-admin-empty strong { color: #244962; font-size: 15px; }
.support-thread-placeholder p, .support-admin-empty p { max-width: 350px; margin: 7px 0 0; color: #7d91a0; font-size: 11px; line-height: 1.6; }
.support-admin-note { margin: 10px 2px 0; color: #8599a6; font-size: 10px; line-height: 1.55; }

@media (max-width: 760px) {
  .support-admin-shell { grid-template-columns: minmax(220px, .8fr) minmax(0,1.2fr); min-height: 560px; }
  .support-thread { min-height: 560px; }
  .support-thread-head { flex-wrap: wrap; }
  .support-thread-details { grid-template-columns: 1fr; }
  .support-thread-details span:not(:first-child) { display: none; }
}
@media (max-width: 560px) {
  .support-chat { left: 10px; bottom: 24px; }
  .support-chat-launcher { display: grid; width: 56px; min-width: 56px; min-height: 56px; place-items: center; gap: 0; padding: 0; border-radius: 19px; }
  .support-chat-launcher-icon { flex: 0 0 auto; width: 44px; height: 44px; border: 0; border-radius: 14px; background: transparent; }
  .support-chat-launcher-icon svg { width: 25px; height: 25px; }
  .support-chat-launcher-copy { display: none; }
  .support-chat-unread { right: -4px; left: auto; }
  .support-chat-panel { position: fixed; left: 10px; bottom: 90px; width: calc(100vw - 20px); height: min(610px,calc(100dvh - 112px)); min-height: min(370px,calc(100dvh - 112px)); border-radius: 21px; }
  .support-admin-head { align-items: flex-start; flex-direction: column; }
  .support-admin-head h2 { font-size: 23px; }
  .support-admin-shell { grid-template-columns: 1fr; min-height: 0; }
  .support-inbox { border-right: 0; border-bottom: 1px solid #e5edf0; }
  .support-inbox-list { max-height: 235px; }
  .support-thread { min-height: 500px; }
  .support-thread-head { flex-wrap: wrap; }
  .support-thread-status { margin-left: auto; }
  .support-thread-details { display: none; }
  .support-thread-messages { min-height: 275px; padding: 14px; }
  .support-admin-compose { align-items: stretch; flex-direction: column; }
  .support-admin-compose button { align-self: flex-end; }
}
@media (prefers-reduced-motion: reduce) { .support-chat *, .support-chat *::before, .support-chat *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }