/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

.chatwoot-launcher {
  background: var(--color-base-200) !important;
  border: 0;
  border-radius: 100px;
  bottom: 20px;
  box-shadow: 0 8px 24px rgb(0 0 0 / 16%) !important;
  color: var(--color-base-content);
  cursor: pointer;
  height: 64px;
  overflow: hidden;
  padding: 0;
  position: fixed;
  right: 20px;
  transform: translateX(0) scale(1) rotate(0deg);
  transform-origin: center;
  transition: transform 300ms ease, opacity 100ms ease, visibility 0ms linear, bottom 0ms linear;
  user-select: none;
  width: 64px;
  will-change: transform, opacity;
  z-index: 2147483000 !important;
}

.chatwoot-launcher.woot-widget--expanded {
  align-items: center;
  bottom: 24px;
  display: flex;
  height: 48px !important;
  width: auto !important;
}

.chatwoot-launcher.woot--close:hover {
  opacity: 1;
}

.chatwoot-launcher.woot--close::before,
.chatwoot-launcher.woot--close::after {
  background-color: var(--color-base-content) !important;
  content: " ";
  display: inline;
  height: 24px;
  left: 32px;
  position: absolute;
  top: 20px;
  width: 2px;
}

.chatwoot-launcher.woot--close::before {
  transform: rotate(45deg);
}

.chatwoot-launcher.woot--close::after {
  transform: rotate(-45deg);
}

.chatwoot-launcher:not(.woot--close):hover {
  box-shadow: none !important;
  outline: 2px solid var(--color-base-content);
}

.chatwoot-launcher:focus-visible {
  outline: 2px solid AccentColor;
  outline-offset: 2px;
}

.chatwoot-launcher:disabled {
  cursor: wait;
  opacity: 0.8;
}

#cw-bubble-holder {
  display: none !important;
}