/* ============================================================
   CHATBOT CSS — sellocalahome.com
   Forest Green (#1B3A2D) + Gold (#C9A84C)
   ============================================================ */

#fred-launcher {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9998;
  display: flex;
  align-items: center;
  gap: .55rem;
  background: linear-gradient(135deg, #1B3A2D 0%, #24503c 100%);
  color: #F5F1EA;
  border: 2px solid rgba(201,168,76,0.4);
  border-radius: 999px;
  padding: .7rem 1.2rem .7rem .85rem;
  font-size: .9rem;
  font-weight: 700;
  font-family: 'Barlow', 'Inter', sans-serif;
  cursor: pointer;
  box-shadow: 0 4px 24px rgba(27,58,45,.45);
  transition: transform .2s, box-shadow .2s;
  white-space: nowrap;
}
#fred-launcher:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(27,58,45,.55); }
#fred-launcher .fl-dot { width: 8px; height: 8px; background: #4ade80; border-radius: 50%; border: 2px solid rgba(255,255,255,.5); flex-shrink: 0; }
#fred-launcher .fl-icon { font-size: 1.15rem; line-height: 1; }
#fred-launcher .fl-text { line-height: 1.1; }
#fred-launcher .fl-text span { display: block; font-size: .68rem; font-weight: 500; opacity: .8; }

#fred-overlay {
  position: fixed;
  bottom: 5.25rem;
  right: 1.5rem;
  z-index: 9999;
  width: 370px;
  max-width: calc(100vw - 2rem);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .22s ease, transform .22s ease;
}
#fred-overlay.fred-open { opacity: 1; pointer-events: all; transform: translateY(0); }

#fred-window {
  background: #F5F1EA;
  border-radius: 12px;
  width: 100%;
  height: 520px;
  max-height: calc(100vh - 6.5rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(27,58,45,.35);
  border: 1px solid rgba(201,168,76,0.3);
}

#fred-window .fw-header { background: linear-gradient(135deg, #1B3A2D 0%, #24503c 100%); padding: .875rem 1rem; display: flex; align-items: center; gap: .65rem; flex-shrink: 0; border-bottom: 2px solid #C9A84C; }
#fred-window .fw-avatar { width: 40px; height: 40px; background: rgba(201,168,76,.18); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0; border: 2px solid #C9A84C; overflow: hidden; }
#fred-window .fw-info { flex: 1; }
#fred-window .fw-name { color: #F5F1EA; font-weight: 700; font-size: .9375rem; font-family: 'Playfair Display', 'Barlow', serif; }
#fred-window .fw-status { color: rgba(245,241,234,.75); font-size: .7rem; display: flex; align-items: center; gap: .3rem; margin-top: .1rem; font-family: 'Barlow Condensed', sans-serif; letter-spacing: .03em; }
#fred-window .fw-status-dot { width: 6px; height: 6px; background: #4ade80; border-radius: 50%; }
#fred-window .fw-close { background: rgba(245,241,234,.15); border: none; color: #F5F1EA; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 1rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .2s; }
#fred-window .fw-close:hover { background: rgba(245,241,234,.3); }

#fred-window .fw-messages { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .5rem; scroll-behavior: smooth; background: #F5F1EA; }
#fred-window .fw-messages::-webkit-scrollbar { width: 4px; }
#fred-window .fw-messages::-webkit-scrollbar-track { background: transparent; }
#fred-window .fw-messages::-webkit-scrollbar-thumb { background: rgba(201,168,76,0.3); border-radius: 2px; }
#fred-window .fw-msg { max-width: 87%; padding: .55rem .85rem; border-radius: 15px; font-size: .875rem; line-height: 1.55; word-wrap: break-word; font-family: 'Barlow', sans-serif; }
#fred-window .fw-msg--bot { background: #1B3A2D; color: #F5F1EA; border-bottom-left-radius: 3px; align-self: flex-start; }
#fred-window .fw-msg--bot a { color: #DFC06E; font-weight: 600; }
#fred-window .fw-msg--bot strong { color: #DFC06E; }
#fred-window .fw-msg--user { background: #C9A84C; color: #1B3A2D; border-bottom-right-radius: 3px; align-self: flex-end; font-weight: 500; }

#fred-window .fw-typing { display: flex; gap: 4px; align-items: center; padding: .55rem .85rem; background: #1B3A2D; border-radius: 15px; border-bottom-left-radius: 3px; align-self: flex-start; }
#fred-window .fw-typing span { width: 7px; height: 7px; background: #C9A84C; border-radius: 50%; animation: fw-bounce 1.2s ease-in-out infinite; }
#fred-window .fw-typing span:nth-child(2) { animation-delay: .2s; }
#fred-window .fw-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes fw-bounce { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-6px); } }

#fred-window .fw-replies { display: flex; flex-wrap: wrap; gap: .35rem; padding: .5rem 1rem; flex-shrink: 0; background: #F5F1EA; }
#fred-window .fw-qr { background: transparent; border: 1.5px solid #1B3A2D; color: #1B3A2D; border-radius: 999px; padding: .325rem .8rem; font-size: .78rem; font-weight: 600; cursor: pointer; white-space: nowrap; font-family: 'Barlow Condensed', 'Barlow', sans-serif; letter-spacing: .03em; transition: background .15s, color .15s; }
#fred-window .fw-qr:hover { background: #1B3A2D; color: #F5F1EA; }

#fred-window .fw-input-bar { display: flex; align-items: center; gap: .5rem; padding: .65rem 1rem; border-top: 1px solid rgba(201,168,76,0.25); flex-shrink: 0; background: #EDE9E0; }
#fred-window .fw-input { flex: 1; border: 1.5px solid rgba(201,168,76,0.35); border-radius: 999px; padding: .45rem .875rem; font-size: .875rem; outline: none; font-family: 'Barlow', sans-serif; transition: border-color .2s; background: #F5F1EA; color: #1B3A2D; }
#fred-window .fw-input::placeholder { color: rgba(27,58,45,0.4); }
#fred-window .fw-input:focus { border-color: #C9A84C; }
#fred-window .fw-send { width: 36px; height: 36px; background: #C9A84C; border: none; border-radius: 50%; color: #1B3A2D; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: .85rem; flex-shrink: 0; transition: transform .15s, background .15s; }
#fred-window .fw-send:hover { transform: scale(1.1); background: #DFC06E; }
#fred-window .fw-powered { text-align: center; font-size: .65rem; color: rgba(27,58,45,0.4); padding: .15rem 0 .45rem; background: #EDE9E0; font-family: 'Barlow Condensed', sans-serif; letter-spacing: .04em; }

.fw-guide-card { display: flex; align-items: center; gap: .5rem; background: rgba(201,168,76,0.08); border: 1.5px solid rgba(201,168,76,0.3); border-radius: 10px; padding: .625rem .875rem; text-decoration: none; cursor: pointer; margin-top: .375rem; transition: background .15s; }
.fw-guide-card:hover { background: rgba(201,168,76,0.18); }
.fw-guide-card--inline { align-self: flex-start; }
.fw-guide-icon { font-size: 1.3rem; flex-shrink: 0; }
.fw-guide-info { flex: 1; min-width: 0; }
.fw-guide-name { display: block; font-size: .825rem; font-weight: 700; color: #1B3A2D; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fw-guide-sub { display: block; font-size: .7rem; color: rgba(27,58,45,0.55); }
.fw-guide-dl { font-size: .75rem; font-weight: 700; color: #C9A84C; white-space: nowrap; flex-shrink: 0; }
.fw-guide-list-msg { display: flex; flex-direction: column; gap: .35rem; align-self: flex-start; max-width: 97%; padding: 0; background: transparent; }

.fw-capture-msg { background: rgba(201,168,76,0.08); border: 1.5px solid rgba(201,168,76,0.3); border-radius: 15px; padding: 1rem; align-self: flex-start; max-width: 97%; }
.fw-cap-header { font-weight: 800; color: #1B3A2D; font-size: .9rem; margin-bottom: .3rem; font-family: 'Barlow', sans-serif; }
.fw-cap-sub { font-size: .8rem; color: rgba(27,58,45,0.7); margin-bottom: .75rem; line-height: 1.45; }
.fw-cap-fields { display: flex; flex-direction: column; gap: .4rem; margin-bottom: .625rem; }
.fw-cap-input { border: 1.5px solid rgba(201,168,76,0.3); border-radius: 8px; padding: .45rem .75rem; font-size: .85rem; font-family: 'Barlow', sans-serif; outline: none; width: 100%; box-sizing: border-box; transition: border-color .2s; background: #F5F1EA; color: #1B3A2D; }
.fw-cap-input:focus { border-color: #C9A84C; }
.fw-cap-btn { width: 100%; background: #C9A84C; color: #1B3A2D; border: none; border-radius: 8px; padding: .55rem; font-size: .875rem; font-weight: 700; font-family: 'Barlow', sans-serif; cursor: pointer; transition: background .15s; }
.fw-cap-btn:hover { background: #DFC06E; }
.fw-cap-btn:disabled { opacity: .55; cursor: not-allowed; }
.fw-cap-error { color: #ef4444; font-size: .78rem; margin-top: .35rem; }
.fw-cap-success { color: #2a6b45; font-size: .875rem; font-weight: 600; }

@media (max-width: 480px) {
  #fred-overlay { right: .75rem; width: calc(100vw - 1.5rem); }
  #fred-launcher { right: .75rem; bottom: 1rem; }
}
