/* PACO chat, Panama Private Club styling.
   Launcher sits in the corner, the WhatsApp button moves up above it. The
   panel opens above the launcher on desktop and takes the whole screen on a
   phone. Colours follow the site: deep navy, gold, Outfit. */
.has-paco .wa-float { bottom: calc(2rem + 68px); }
.paco-open .wa-float { display: none; }

.paco-launch, .paco-bubble, .paco { font-family: 'Outfit', system-ui, sans-serif; }

.paco-launch {
  position: fixed;
  right: 2rem; bottom: 2rem;
  z-index: 210;
  height: 56px;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0 1.3rem 0 0.5rem;
  border: 1px solid rgba(201, 168, 76, 0.45);
  border-radius: 999px;
  background: #0d1230;
  color: #e8d5a3;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.paco-launch:hover { transform: translateY(-2px); border-color: #c9a84c; }
.paco-launch:focus-visible { outline: 2px solid #c9a84c; outline-offset: 3px; }
.paco-launch__icon {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: #c9a84c;
  color: #07091a;
  display: grid;
  place-items: center;
  flex: none;
}
.paco-launch__icon svg { width: 21px; height: 21px; }

.paco-bubble {
  position: fixed;
  right: 2rem; bottom: calc(2rem + 136px);
  z-index: 205;
  width: min(300px, calc(100vw - 4rem));
  display: flex;
  align-items: flex-start;
  gap: 0.25rem;
  padding: 0.9rem 0.6rem 0.9rem 1rem;
  background: #151d3b;
  border: 1px solid rgba(201, 168, 76, 0.3);
  border-radius: 12px 12px 3px 12px;
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.5);
  animation: paco-rise 0.35s ease both;
}
.paco-bubble[hidden] { display: none; }
.paco-bubble__text {
  flex: 1;
  min-width: 0;
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  color: #e8e6e0;
  font: inherit;
  font-size: 0.88rem;
  line-height: 1.55;
  cursor: pointer;
}
.paco-bubble__x, .paco__close {
  flex: none;
  width: 28px; height: 28px;
  border: 0;
  border-radius: 50%;
  background: none;
  color: #8a8a9a;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.paco-bubble__x:hover, .paco__close:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.paco-bubble__x svg, .paco__close svg { width: 16px; height: 16px; }

.paco {
  position: fixed;
  right: 2rem; bottom: calc(2rem + 68px);
  z-index: 220;
  width: 390px;
  max-width: calc(100vw - 4rem);
  height: min(600px, calc(100vh - 140px));
  height: min(600px, calc(100dvh - 140px));
  display: flex;
  flex-direction: column;
  background: #0d1230;
  border: 1px solid rgba(201, 168, 76, 0.3);
  border-radius: 14px;
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.6);
  overflow: hidden;
  animation: paco-rise 0.25s ease both;
}
.paco[hidden] { display: none; }

.paco__head {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.9rem 0.75rem 0.9rem 1rem;
  background: #07091a;
  border-bottom: 1px solid rgba(201, 168, 76, 0.18);
}
.paco__who { display: flex; align-items: center; gap: 0.7rem; min-width: 0; }
.paco__face {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: #c9a84c;
  color: #07091a;
  display: grid;
  place-items: center;
  flex: none;
}
.paco__face svg { width: 20px; height: 20px; }
.paco__names { display: flex; flex-direction: column; min-width: 0; }
.paco__name { font-family: 'Fraunces', Georgia, serif; font-weight: 400; font-size: 1.1rem; line-height: 1.2; color: #fff; }
.paco__sub { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: #c9a84c; }

.paco__log {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.paco__msg {
  max-width: 85%;
  padding: 0.7rem 0.95rem;
  border-radius: 12px;
  font-size: 0.88rem;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.paco__msg--assistant {
  align-self: flex-start;
  background: #151d3b;
  color: #e8e6e0;
  border: 1px solid rgba(201, 168, 76, 0.12);
  border-bottom-left-radius: 3px;
}
.paco__msg--assistant a { color: #e8d5a3; }
.paco__msg--user {
  align-self: flex-end;
  background: #c9a84c;
  color: #07091a;
  border-bottom-right-radius: 3px;
}
.paco__msg--note {
  align-self: center;
  max-width: 100%;
  padding: 0.3rem 0.7rem;
  color: #8a8a9a;
  font-size: 0.78rem;
  text-align: center;
}
.paco__wa {
  align-self: flex-start;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  background: #25D366;
  color: #07091a;
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none;
}

.paco__typing { display: inline-flex; gap: 4px; padding: 0.85rem 0.95rem; }
.paco__typing span {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #c9a84c;
  animation: paco-dot 1.1s infinite ease-in-out;
}
.paco__typing span:nth-child(2) { animation-delay: 0.15s; }
.paco__typing span:nth-child(3) { animation-delay: 0.3s; }

.paco__quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding-top: 0.2rem;
}
.paco__chip {
  border: 1px solid rgba(201, 168, 76, 0.45);
  border-radius: 999px;
  background: none;
  color: #e8d5a3;
  padding: 0.42rem 0.8rem;
  font: inherit;
  font-size: 0.78rem;
  cursor: pointer;
}
.paco__chip:hover { background: rgba(201, 168, 76, 0.12); }

.paco__form {
  flex: none;
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  padding: 0.75rem 0.75rem 0.5rem 1rem;
  border-top: 1px solid rgba(201, 168, 76, 0.18);
}
.paco__input {
  flex: 1;
  min-width: 0;
  resize: none;
  border: 1px solid rgba(201, 168, 76, 0.25);
  border-radius: 10px;
  background: #07091a;
  padding: 0.6rem 0.8rem;
  font: inherit;
  font-size: 16px; /* 16px stops iOS zooming into the field */
  line-height: 1.4;
  color: #e8e6e0;
  max-height: 120px;
  overflow-y: hidden;
  /* the site styles every textarea as a 100px form field */
  min-height: 0;
  width: auto;
}
.paco__input::placeholder { color: #8a8a9a; }
.paco__input:focus { outline: none; border-color: #c9a84c; }
.paco__send {
  flex: none;
  width: 42px; height: 42px;
  border: 0;
  border-radius: 50%;
  background: #c9a84c;
  color: #07091a;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.paco__send:disabled { opacity: 0.5; cursor: default; }
.paco__send svg { width: 19px; height: 19px; }

.paco__notice {
  flex: none;
  margin: 0;
  padding: 0 1rem 0.75rem;
  color: #8a8a9a;
  font-size: 0.7rem;
  line-height: 1.5;
}
.paco__notice a { color: inherit; }

@keyframes paco-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes paco-dot { 0%, 80%, 100% { opacity: 0.3; transform: none; } 40% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) {
  .paco, .paco-bubble { animation: none; }
  .paco__typing span { animation: none; }
}

@media (max-width: 600px) {
  .paco-launch { right: 1.25rem; bottom: 1.25rem; width: 56px; padding: 0; justify-content: center; }
  .paco-launch__text { display: none; }
  .paco-launch__icon { width: 56px; height: 56px; }
  .paco-launch__icon svg { width: 25px; height: 25px; }
  .has-paco .wa-float { right: 1.25rem; bottom: calc(1.25rem + 68px); }
  .paco-bubble { right: 1.25rem; bottom: calc(1.25rem + 136px); width: min(300px, calc(100vw - 2.5rem)); }
  /* a window over the lower part of the page, the site stays visible and scrollable above it */
  .paco {
    left: 10px; right: 10px;
    bottom: calc(10px + var(--paco-kb, 0px));
    width: auto; max-width: none;
    height: min(520px, 66vh);
    height: min(520px, 66dvh);
    max-height: calc(var(--paco-vh, 100dvh) - 20px);
    border-radius: 14px;
  }
  .paco-open .paco-launch, .paco-open .paco-bubble { display: none; }
}

@media print {
  .paco-launch, .paco-bubble, .paco { display: none !important; }
}