/* Chat-only layout overrides, loaded after the site's CSS bundle. */
#cpbchat .cpbchat-panel {
  width: 400px;
  height: 600px;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  border-radius: 20px;
  box-shadow: 0 16px 56px rgba(15, 23, 42, .2);
}
#cpbchat .cpbchat-head { flex-shrink: 0; gap: 10px; padding: 16px 14px; }
#cpbchat .cpbchat-avatars { flex: 0 0 38px; }
#cpbchat .cpbchat-who { gap: 4px; }
#cpbchat .cpbchat-who > span { white-space: normal; line-height: 1.35; }
#cpbchat .cpbchat-online { flex: 0 0 8px; }
#cpbchat .cpbchat-head-btn,
#cpbchat .cpbchat-close { min-width: 32px; min-height: 36px; }
#cpbchat .cpbchat-msgs {
  min-height: 0;
  padding: 18px 16px;
  gap: 14px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
#cpbchat .cpbchat-msg {
  max-width: 90%;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
#cpbchat .cpbchat-msg a { text-decoration: underline; text-underline-offset: 3px; }
#cpbchat .cpbchat-time { font-size: 10px; margin-top: 6px; }
#cpbchat .cpbchat-chips {
  flex-shrink: 0;
  padding: 12px;
  gap: 8px;
  max-height: 112px;
  overflow-y: auto;
}
#cpbchat .cpbchat-chips button { min-height: 36px; padding: 8px 12px; font-size: 12px; }
#cpbchat[data-skin="mono"] .cpbchat-chips .cpbchat-chip-link {
  background: #111827;
  color: #fff;
  font-weight: 700;
}
#cpbchat[data-skin="mono"] .cpbchat-chips .cpbchat-chip-link:hover { background: #263247; color: #fff; }
#cpbchat .cpbchat-form { flex-shrink: 0; align-items: center; gap: 8px; padding: 12px; }
#cpbchat .cpbchat-form input[type="text"] {
  flex: 1 1 0;
  width: 0;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  font-size: 16px;
}
#cpbchat .cpbchat-form button { flex: 0 0 44px; width: 44px; height: 44px; }
#cpbchat .cpbchat-dets { width: 100%; max-width: 100%; }
#cpbchat .cpbchat-dets input { min-height: 44px; font-size: 16px; }
#cpbchat .cpbchat-dets button { min-height: 44px; }
#cpbchat .cpbchat-menu-pop { top: 78px; max-width: calc(100% - 24px); }
#cpbchat .cpbchat-menu-pop button,
#cpbchat .cpbchat-menu-pop a { min-height: 44px; }
#cpbchat :is(button, a, input):focus-visible { outline: 3px solid #4885d7; outline-offset: 2px; }
#cpbchat .cpbchat-panel--min { height: auto; width: 320px; }
/* Retain the decorative space used by the optional Sky skin. */
#cpbchat[data-skin="sky"] .cpbchat-head { padding-bottom: 36px; }
#cpbchat[data-skin="sky"] .cpbchat-panel--min .cpbchat-head { padding-bottom: 16px; }
@media (max-width: 699px) {
  #cpbchat .cpbchat-panel {
    right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    height: 70vh;
    height: 78dvh;
    max-height: calc(100dvh - 24px - env(safe-area-inset-bottom, 0px));
    border-radius: 18px;
  }
  .single-cpb_product #cpbchat .cpbchat-panel {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px));
    max-height: calc(100dvh - 96px - env(safe-area-inset-bottom, 0px));
  }
  #cpbchat .cpbchat-head { padding: 12px; gap: 8px; }
  #cpbchat .cpbchat-avatars { display: none; }
  #cpbchat .cpbchat-who strong { font-size: 15px; }
  #cpbchat .cpbchat-head-btn,
  #cpbchat .cpbchat-close,
  #cpbchat .cpbchat-head-wa { min-width: 36px; min-height: 40px; }
  #cpbchat .cpbchat-msgs { padding: 14px 12px; }
  #cpbchat .cpbchat-menu-pop { top: 66px; }
  #cpbchat .cpbchat-panel--min { height: auto; width: 304px; }
}
@media (prefers-reduced-motion: reduce) {
  #cpbchat *, #cpbchat *::before, #cpbchat *::after { animation: none !important; transition: none !important; }
}