/* ==========================================================================
   Argos assistant — floating chat button + panel
   Inherits the site palette and fonts from styles.css (:root tokens).
   Self-contained: nothing else on the page needs to change.
   ========================================================================== */

.argos-chat{
  --chat-w: 380px;
  --chat-h: 560px;
  position:fixed; right:22px; bottom:22px; z-index:90;
  font-family:var(--sans, 'Archivo', system-ui, sans-serif);
}

/* ------------------------------ launcher ------------------------------ */
.chat-fab{
  position:relative;
  width:62px; height:62px; border-radius:50%;
  border:1px solid rgba(193,161,90,.55);
  background:var(--green-800,#12291F);
  display:grid; place-items:center; cursor:pointer; padding:0;
  box-shadow:0 10px 30px rgba(12,29,21,.34), 0 2px 6px rgba(12,29,21,.2);
  transition:transform .22s cubic-bezier(.22,.61,.36,1), box-shadow .22s ease;
}
.chat-fab:hover{ transform:translateY(-3px) scale(1.04); box-shadow:0 16px 36px rgba(12,29,21,.42) }
.chat-fab:active{ transform:translateY(-1px) scale(1.01) }

/* the logo image, or the built-in fallback mark */
.chat-fab__logo{ width:34px; height:34px; object-fit:contain; display:block; border-radius:6px }
.chat-fab__mark{
  width:24px; height:24px; background:var(--gold,#C1A15A); border-radius:5px;
  transform:rotate(45deg); display:grid; place-items:center;
}
.chat-fab__mark::after{
  content:''; width:11px; height:11px; border-radius:50%;
  background:var(--green-800,#12291F);
  box-shadow:inset 0 0 0 3px var(--green-800,#12291F);
}

/* the X that replaces the logo while the panel is open */
.chat-fab__close{ position:absolute; inset:0; display:none; place-items:center }
.chat-fab__close::before,.chat-fab__close::after{
  content:''; position:absolute; width:20px; height:2px; border-radius:2px;
  background:var(--gold,#C1A15A);
}
.chat-fab__close::before{ transform:rotate(45deg) }
.chat-fab__close::after{ transform:rotate(-45deg) }
.argos-chat.is-open .chat-fab__close{ display:grid }
.argos-chat.is-open .chat-fab__logo,
.argos-chat.is-open .chat-fab__mark{ visibility:hidden }

/* a small nudge, shown once until dismissed or opened */
.chat-nudge{
  position:absolute; right:74px; bottom:14px; white-space:nowrap;
  background:var(--white,#fff); color:var(--ink,#1B211D);
  border:1px solid var(--line,#E2E0D6); border-radius:100px;
  padding:9px 16px; font-size:13.5px; font-weight:500;
  box-shadow:0 6px 20px rgba(27,33,29,.14);
  animation:chatNudge .5s .9s ease-out both;
}
.chat-nudge::after{
  content:''; position:absolute; right:-5px; bottom:15px;
  width:9px; height:9px; background:var(--white,#fff);
  border-right:1px solid var(--line,#E2E0D6);
  border-top:1px solid var(--line,#E2E0D6);
  transform:rotate(45deg);
}
@keyframes chatNudge{ from{opacity:0; transform:translateX(10px)} to{opacity:1; transform:none} }
.argos-chat.is-open .chat-nudge,
.argos-chat.nudge-done .chat-nudge{ display:none }

/* ------------------------------- panel ------------------------------- */
.chat-panel{
  position:absolute; right:0; bottom:78px;
  width:var(--chat-w); height:var(--chat-h);
  max-height:calc(100vh - 120px);
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--cream,#F6F5F0);
  border:1px solid rgba(12,29,21,.14); border-radius:16px;
  box-shadow:0 24px 60px rgba(12,29,21,.28), 0 4px 12px rgba(12,29,21,.14);
  opacity:0; visibility:hidden; transform:translateY(12px) scale(.98); pointer-events:none;
  transition:opacity .22s ease, transform .22s cubic-bezier(.22,.61,.36,1),
             visibility 0s linear .22s;
}
.argos-chat.is-open .chat-panel{
  opacity:1; visibility:visible; transform:none; pointer-events:auto;
  transition:opacity .22s ease, transform .22s cubic-bezier(.22,.61,.36,1),
             visibility 0s linear 0s;
}

.chat-head{
  display:flex; align-items:center; gap:11px;
  padding:15px 18px; background:var(--green-800,#12291F);
  border-bottom:1px solid rgba(246,245,240,.1); flex-shrink:0;
}
.chat-head__mark{
  width:19px; height:19px; background:var(--gold,#C1A15A); border-radius:4px;
  transform:rotate(45deg); flex-shrink:0;
}
.chat-head__logo{ width:24px; height:24px; object-fit:contain; border-radius:4px; flex-shrink:0 }
.chat-head__title{
  font-family:var(--display,'Space Grotesk',sans-serif);
  font-size:13px; font-weight:700; letter-spacing:.07em;
  color:var(--cream,#F6F5F0);
}
.chat-head__sub{
  font-family:var(--mono,monospace); font-size:10px; letter-spacing:.1em;
  color:var(--gold,#C1A15A); margin-top:2px;
}

.chat-log{
  flex:1; overflow-y:auto; padding:18px;
  display:flex; flex-direction:column; gap:12px;
  scrollbar-width:thin; scrollbar-color:var(--gold,#C1A15A) transparent;
  overscroll-behavior:contain;
}
.chat-log::-webkit-scrollbar{ width:7px }
.chat-log::-webkit-scrollbar-thumb{ background:rgba(193,161,90,.5); border-radius:4px }

.msg{
  max-width:86%; padding:11px 14px; border-radius:13px;
  font-size:14.5px; line-height:1.6; white-space:pre-wrap; word-wrap:break-word;
}
.msg--bot{
  align-self:flex-start; background:var(--white,#fff); color:var(--ink,#1B211D);
  border:1px solid var(--line,#E2E0D6); border-bottom-left-radius:4px;
}
.msg--me{
  align-self:flex-end; background:var(--green-800,#12291F); color:var(--cream,#F6F5F0);
  border-bottom-right-radius:4px;
}
.msg--err{ background:#FDF3F2; border-color:#E8C9C6; color:#7C3A34 }
.msg a{ color:var(--green-600,#1C3B2E); text-decoration:underline }
.msg--me a{ color:var(--gold,#C1A15A) }

/* typing dots */
.msg--typing{ display:flex; gap:5px; padding:15px 16px }
.msg--typing i{
  width:6px; height:6px; border-radius:50%; background:var(--gold-dark,#8A7B4F);
  animation:chatDot 1.1s infinite ease-in-out;
}
.msg--typing i:nth-child(2){ animation-delay:.16s }
.msg--typing i:nth-child(3){ animation-delay:.32s }
@keyframes chatDot{ 0%,60%,100%{opacity:.28; transform:translateY(0)} 30%{opacity:1; transform:translateY(-3px)} }

/* starter chips */
.chat-chips{ display:flex; flex-wrap:wrap; gap:7px; margin-top:2px }
.chat-chip{
  font-family:var(--sans,sans-serif); font-size:12.5px; cursor:pointer;
  padding:7px 12px; border-radius:100px;
  background:transparent; color:var(--green-600,#1C3B2E);
  border:1px solid rgba(28,59,46,.28);
  transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.chat-chip:hover{ background:var(--green-800,#12291F); border-color:var(--green-800,#12291F); color:var(--cream,#F6F5F0) }

.chat-foot{
  flex-shrink:0; border-top:1px solid var(--line,#E2E0D6);
  background:var(--cream-2,#EDEBE2); padding:11px 12px;
}
.chat-form{ display:flex; gap:9px; align-items:flex-end }
.chat-input{
  flex:1; resize:none; max-height:110px;
  font-family:var(--sans,sans-serif); font-size:14.5px; line-height:1.45;
  padding:11px 13px; border-radius:10px; outline:none;
  border:1px solid var(--line,#E2E0D6); background:var(--white,#fff); color:var(--ink,#1B211D);
}
.chat-input:focus{ border-color:var(--gold,#C1A15A) }
.chat-input::placeholder{ color:var(--muted,#5A625C) }
.chat-send{
  width:42px; height:42px; flex-shrink:0; border:none; cursor:pointer;
  border-radius:10px; background:var(--gold,#C1A15A); color:var(--green-800,#12291F);
  display:grid; place-items:center; transition:background .18s ease, opacity .18s ease;
}
.chat-send:hover{ background:var(--green-800,#12291F); color:var(--gold,#C1A15A) }
.chat-send:disabled{ opacity:.45; cursor:default }
.chat-send svg{ width:19px; height:19px; display:block }

.chat-legal{
  margin-top:8px; text-align:center;
  font-size:11px; color:var(--muted,#5A625C);
}
.chat-legal a{ color:var(--muted,#5A625C); text-decoration:underline }

/* ------------------------------ mobile ------------------------------ */
@media (max-width:560px){
  .argos-chat{ right:16px; bottom:16px }
  .chat-fab{ width:56px; height:56px }
  .chat-nudge{ display:none }
  .chat-panel{
    position:fixed; right:0; left:0; bottom:0; top:0;
    width:auto; height:auto; max-height:none; border-radius:0; border:none;
    transform:translateY(100%);
  }
  .argos-chat.is-open .chat-panel{ transform:none }
  .chat-head{ padding-top:max(15px, env(safe-area-inset-top)) }
  .chat-foot{ padding-bottom:max(11px, env(safe-area-inset-bottom)) }
  /* the launcher turns into the close button, floating over the panel */
  .argos-chat.is-open .chat-fab{ position:fixed; right:14px; top:12px; bottom:auto;
    width:40px; height:40px; background:transparent; border-color:transparent; box-shadow:none; z-index:2 }
}

@media (prefers-reduced-motion:reduce){
  .chat-fab,.chat-panel,.chat-nudge,.msg--typing i{ transition:none; animation:none }
}