.apartly-chat-widget {
  position: fixed;
  z-index: 90;
  right: max(24px, env(safe-area-inset-right));
  bottom: max(24px, env(safe-area-inset-bottom));
  color: var(--apartly-ink);
  font-family: var(--apartly-inter);
  color-scheme: light;
}

.apartly-chat-launcher {
  position: relative;
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  padding: 9px;
  border: 1px solid rgba(67, 217, 255, .5);
  border-radius: 50%;
  background: var(--apartly-midnight);
  box-shadow: 0 18px 46px rgba(7, 21, 43, .3);
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, opacity 120ms ease;
}

.no-js .apartly-chat-widget {
  display: none;
}

.apartly-chat-launcher::before {
  position: absolute;
  inset: -5px;
  border: 1px solid rgba(67, 217, 255, .58);
  border-radius: inherit;
  content: "";
  pointer-events: none;
  animation: apartly-chat-ring-pulse 2.6s ease-in-out infinite;
}

.apartly-chat-launcher::after {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 11px;
  height: 11px;
  border: 2px solid var(--apartly-cloud);
  border-radius: 50%;
  background: var(--apartly-cyan);
  content: "";
  pointer-events: none;
  animation: apartly-chat-status-pulse 2.6s ease-in-out infinite;
}

.apartly-chat-launcher img {
  width: 100%;
  height: 100%;
  display: block;
}

.apartly-chat-launcher:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 54px rgba(7, 21, 43, .36);
}

.apartly-chat-launcher:focus-visible,
.apartly-chat-panel button:focus-visible,
.apartly-chat-panel textarea:focus-visible,
.apartly-chat-booking:focus-visible {
  outline: 3px solid var(--apartly-cyan);
  outline-offset: 3px;
}

.apartly-chat-widget.is-open .apartly-chat-launcher {
  opacity: 0;
  pointer-events: none;
  transform: scale(.9);
}

.apartly-chat-panel {
  position: absolute;
  right: 0;
  bottom: 0;
  width: min(400px, calc(100vw - 32px));
  height: min(660px, calc(100dvh - 40px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto;
  overflow: hidden;
  border: 1px solid #bfd4e3;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(7, 21, 43, .32);
  transform-origin: right bottom;
  animation: apartly-chat-enter 180ms ease-out both;
}

.apartly-chat-panel[hidden] {
  display: none;
}

.apartly-chat-panel__header {
  min-height: 82px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 44px 44px;
  gap: 9px;
  align-items: center;
  padding: 14px 14px 14px 16px;
  background: var(--apartly-midnight);
  color: #fff;
}

.apartly-chat-panel__brand {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 6px;
  border: 1px solid rgba(67, 217, 255, .3);
  border-radius: 13px;
  background: rgba(255, 255, 255, .05);
}

.apartly-chat-panel__brand img {
  width: 100%;
  height: 100%;
  display: block;
}

.apartly-chat-panel__identity {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.apartly-chat-panel__identity strong {
  overflow: hidden;
  font-family: var(--apartly-manrope);
  font-size: .98rem;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.apartly-chat-panel__identity small {
  display: flex;
  gap: 7px;
  align-items: center;
  color: #b9cad9;
  font-size: .7rem;
}

.apartly-chat-panel__identity i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--apartly-cyan);
  box-shadow: 0 0 0 4px rgba(67, 217, 255, .1);
}

.apartly-chat-panel__clear,
.apartly-chat-panel__close {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #dce8f2;
  cursor: pointer;
  font-size: 1.4rem;
  line-height: 1;
}

.apartly-chat-panel__clear:hover,
.apartly-chat-panel__close:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.apartly-chat-messages {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 22px 18px 16px;
  background:
    radial-gradient(circle at 100% 0, rgba(67, 217, 255, .1), transparent 34%),
    var(--apartly-cloud);
  scrollbar-color: #aec4d4 transparent;
  scrollbar-width: thin;
}

.apartly-chat-message {
  max-width: 86%;
  display: grid;
  gap: 5px;
  align-self: flex-start;
}

.apartly-chat-message--user {
  align-self: flex-end;
}

.apartly-chat-message__label {
  padding-inline: 4px;
  color: #5d7187;
  font-size: .64rem;
  font-weight: 750;
  letter-spacing: .04em;
}

.apartly-chat-message--user .apartly-chat-message__label {
  text-align: right;
}

.apartly-chat-message p {
  margin: 0;
  padding: 13px 15px;
  border: 1px solid #ccdeea;
  border-radius: 16px 16px 16px 5px;
  background: #fff;
  color: var(--apartly-ink);
  font-size: .85rem;
  line-height: 1.58;
  white-space: pre-wrap;
}

.apartly-chat-message--user p {
  border-color: var(--apartly-midnight);
  border-radius: 16px 16px 5px 16px;
  background: var(--apartly-midnight);
  color: #fff;
}

.apartly-chat-message--error p {
  border-color: #d8a8a8;
  background: #fff4f4;
  color: #7b2222;
}

.apartly-chat-message--loading p {
  display: flex;
  width: 60px;
  gap: 5px;
  align-items: center;
  justify-content: center;
}

.apartly-chat-message--loading i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--apartly-blue);
  animation: apartly-chat-dot 900ms ease-in-out infinite;
}

.apartly-chat-message--loading i:nth-child(2) { animation-delay: 120ms; }
.apartly-chat-message--loading i:nth-child(3) { animation-delay: 240ms; }

.apartly-chat-booking {
  min-height: 44px;
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 9px;
  margin-top: 3px;
  padding: 10px 14px;
  border-radius: 10px;
  background: var(--apartly-blue);
  color: #fff;
  font-family: var(--apartly-manrope);
  font-size: .78rem;
  font-weight: 750;
  text-decoration: none;
}

.apartly-chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  gap: 8px;
  align-items: end;
  padding: 13px 14px 8px;
  border-top: 1px solid #d7e4ed;
  background: #fff;
}

.apartly-chat-composer textarea {
  min-height: 46px;
  max-height: 116px;
  resize: none;
  overflow-y: auto;
  padding: 12px 13px;
  border: 1px solid #bdcedb;
  border-radius: 12px;
  background: #fff;
  color: var(--apartly-ink);
  font: 400 .84rem/1.5 var(--apartly-inter);
}

.apartly-chat-composer textarea::placeholder {
  color: #718397;
}

.apartly-chat-composer button {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: var(--apartly-blue);
  color: #fff;
  cursor: pointer;
  font-size: 1.3rem;
  font-weight: 750;
}

.apartly-chat-composer button:disabled {
  cursor: wait;
  opacity: .55;
}

.apartly-chat-privacy {
  margin: 0;
  padding: 0 16px 12px;
  background: #fff;
  color: #6a7c8e;
  font-size: .61rem;
  line-height: 1.45;
  text-align: center;
}

@keyframes apartly-chat-enter {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes apartly-chat-dot {
  0%, 70%, 100% { opacity: .35; transform: translateY(0); }
  35% { opacity: 1; transform: translateY(-3px); }
}

@keyframes apartly-chat-ring-pulse {
  0%, 100% { opacity: .42; transform: scale(.97); }
  50% { opacity: .82; transform: scale(1.06); }
}

@keyframes apartly-chat-status-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(67, 217, 255, .28);
  }
  50% {
    transform: scale(1.12);
    box-shadow: 0 0 0 6px rgba(67, 217, 255, 0);
  }
}

@media (max-width: 620px) {
  html.apartly-chat-open,
  body.apartly-chat-open {
    overflow: hidden;
    overscroll-behavior: none;
  }

  .apartly-chat-widget {
    inset: 0;
    pointer-events: none;
  }

  .apartly-chat-launcher {
    position: absolute;
    right: max(18px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    pointer-events: auto;
  }

  .apartly-chat-panel {
    position: fixed;
    inset: auto;
    top: var(--apartly-chat-viewport-top, 0px);
    left: var(--apartly-chat-viewport-left, 0px);
    width: var(--apartly-chat-viewport-width, 100%);
    height: var(--apartly-chat-viewport-height, 100dvh);
    max-height: none;
    border: 0;
    border-radius: 0;
    pointer-events: auto;
  }

  .apartly-chat-panel__header {
    padding-top: max(14px, env(safe-area-inset-top));
  }

  .apartly-chat-privacy {
    padding-bottom: max(10px, env(safe-area-inset-bottom));
  }

  .apartly-chat-messages {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    touch-action: pan-y;
  }

  .apartly-chat-composer textarea {
    /* Prevent iOS Safari from magnifying the page when the field receives focus. */
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .apartly-chat-launcher,
  .apartly-chat-launcher::before,
  .apartly-chat-launcher::after,
  .apartly-chat-panel,
  .apartly-chat-message--loading i {
    animation: none;
    transition: none;
  }

  .apartly-chat-launcher:hover {
    transform: none;
  }
}