/* An unread message must remain apparent even when the mobile copy is hidden. */
.support-launcher { position: relative; }
.support-launcher > .support-unread {
  position: absolute; top: 7px; left: 45px; z-index: 2;
  display: grid; place-items: center; min-width: 23px; height: 23px;
  padding: 0 6px; border: 2px solid #192333; border-radius: 20px;
  background: #f2ce82; color: #272011; font-weight: 700; font-size: 12px; line-height: 1;
  box-shadow: 0 3px 12px #0005;
}
.support-launcher > .support-unread[hidden] { display: none; }
.support-launcher.has-unread {
  border-color: #c9af76;
  animation: instore-chat-unread 2.2s ease-in-out infinite;
}
.support-launcher.has-unread .chat-orb-art {
  filter: drop-shadow(0 0 9px #efd79e75);
}
.support-launcher-large > .support-unread { left: calc(50% + 21px); top: 22px; }
dialog #support-float { position: fixed; right: 20px; bottom: 20px; z-index: 30; }
.checkout-chat-note {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 4px 0 0; padding: 12px 14px; border-radius: 16px;
  background: #a8c9e809; color: #a9bad1; font-size: 13px; line-height: 1.6;
}
.checkout-chat-note > span { color: #c7d9ed; }
@keyframes instore-chat-unread {
  0%,100% { box-shadow: 0 5px 28px #0004, 0 0 0 0 #e8c37500; }
  50% { box-shadow: 0 5px 28px #0004, 0 0 0 7px #e8c37522, 0 0 30px #e8c37520; }
}
@media(max-width: 640px) {
  dialog #support-float { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); }
  .support-launcher > .support-unread { left: 40px; top: 4px; }
  .support-launcher-large > .support-unread { left: calc(50% + 18px); top: 18px; }
}
@media(prefers-reduced-motion: reduce) {
  .support-launcher.has-unread { animation: none; box-shadow: 0 0 0 3px #e8c37555; }
}
html[data-color-mode="light"] .checkout-chat-note { background: #6386a710; color: #425771; }
