/* ═══════════════════════════════════════════════
   Guest AI Chat — gac-* namespace — Design v1.3
   ═══════════════════════════════════════════════ */

/* Scroll area */
.gac-wrap { display:flex; flex-direction:column; height:100%; overflow:hidden; background:#F7F4F1; }
.gac-scroll-outer { flex:1; overflow:hidden; display:flex; flex-direction:column; }
.gac-scroll { flex:1; overflow-y:auto; padding:24px 24px 0; scroll-behavior:smooth; }
.gac-scroll::-webkit-scrollbar { width:6px; }
.gac-scroll::-webkit-scrollbar-track { background:transparent; }
.gac-scroll::-webkit-scrollbar-thumb { background:#E8E0D8; border-radius:9999px; }
.gac-msgs { max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:20px; min-height:100%; }

/* Empty state — vertically centered */
.gac-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; flex:1; padding:40px 24px; }
.gac-avatar { width:64px; height:64px; border-radius:9999px; background:#FDF3EB; box-shadow:0 4px 16px rgba(213,108,41,0.15); display:flex; align-items:center; justify-content:center; margin-bottom:20px; overflow:hidden; padding:10px; box-sizing:border-box; flex-shrink:0; }
.gac-avatar img { max-width:44px; max-height:44px; width:auto; height:auto; object-fit:contain; }
.gac-h { font-size:26px; font-weight:700; color:#0A3451; margin:0 0 10px; }
.gac-sub { font-size:15px; color:#4A6580; line-height:1.65; margin:0 0 28px; max-width:440px; }
.gac-pills { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.gac-pill { background:#FDF3EB; color:#D56C29; border:none; border-radius:9999px; height:36px; padding:0 16px; font-size:13px; font-weight:500; cursor:pointer; font-family:inherit; transition:background 0.12s; }
.gac-pill:hover { background:#FAE2CC; }

/* User message (right-aligned) */
.gac-user-row { display:flex; justify-content:flex-end; width:100%; }
.gac-user-msg { max-width:65%; }
.gac-user-bubble { background:#EFEEEC; color:#0A3451; border-radius:18px; padding:12px 16px; font-size:15px; line-height:1.6; font-weight:500; word-break:break-word; }
.gac-user-ts { font-size:11px; color:#8A9DB0; text-align:right; margin-top:4px; }

/* AI message (left, no bubble) */
.gac-ai-row { display:flex; flex-direction:column; align-items:flex-start; }
.gac-ai-text { background:none; border:none; padding:0; font-size:15px; color:#0A3451; line-height:1.7; width:100%; font-weight:400; }

/* Dot bounce */
.gac-dots { display:flex; gap:5px; align-items:center; padding:4px 0; }
.gac-dot { width:8px; height:8px; border-radius:9999px; background:#C8BAB0; display:inline-block; animation:gac-bounce 1.2s infinite; }
.gac-dot:nth-child(2){animation-delay:.15s;} .gac-dot:nth-child(3){animation-delay:.30s;}
@keyframes gac-bounce{0%,80%,100%{transform:scale(.7);opacity:.5;}40%{transform:scale(1);opacity:1;}}

/* Input area */
.gac-input-wrap { padding:12px 24px 20px; flex-shrink:0; background:#F7F4F1; }
.gac-input-inner { max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:10px; }

/* Upsell card */
.gac-upsell { background:#FDFBF9; border:1px solid #E8E0D8; border-radius:12px; padding:12px 16px; display:flex; align-items:center; gap:12px; }
.gac-upsell-icon { width:36px; height:36px; border-radius:8px; background:#FDF3EB; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#D56C29; }
.gac-upsell-body { flex:1; min-width:0; }
.gac-upsell-title { font-size:14px; font-weight:600; color:#0A3451; }
.gac-upsell-sub { font-size:12px; color:#8A9DB0; margin-top:2px; }
.gac-upsell-link { font-size:13px; font-weight:600; color:#D56C29; text-decoration:none; white-space:nowrap; flex-shrink:0; transition:color 0.12s; }
.gac-upsell-link:hover { color:#B85A1F; }

/* Input card */
.gac-card { background:#FDFBF9; border:1.5px solid #E8E0D8; border-radius:14px; box-shadow:0 4px 16px rgba(10,52,81,0.06); transition:border-color 0.15s; }
.gac-card:focus-within { border-color:#D56C29; box-shadow:0 4px 16px rgba(213,108,41,0.10); }
.gac-textarea { width:100%; padding:14px 16px 8px; background:none; border:none; outline:none; resize:none; font-size:15px; color:#0A3451; font-family:inherit; min-height:44px; max-height:160px; box-sizing:border-box; line-height:1.6; }
.gac-textarea::placeholder { color:#8A9DB0; }
.gac-toolbar { padding:8px 12px 10px; display:flex; align-items:center; gap:6px; }
.gac-tool-btn { width:28px; height:28px; border-radius:9999px; background:#F0EBE5; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; color:#4A6580; flex-shrink:0; transition:background 0.12s, color 0.12s; text-decoration:none; }
.gac-tool-btn:hover { background:#FDF3EB; color:#D56C29; }
.gac-tool-btn.recording { background:#FDEDEC; color:#C0392B; }
.gac-model-pill { background:#F0EBE5; border-radius:9999px; height:30px; padding:0 10px; display:inline-flex; align-items:center; gap:5px; border:none; font-family:inherit; font-size:12px; font-weight:500; color:#4A6580; }
.gac-send { width:28px; height:28px; border-radius:9999px; background:#D56C29; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; color:#FDFBF9; box-shadow:0 3px 8px rgba(213,108,41,0.35); flex-shrink:0; transition:background 0.12s; }
.gac-send:hover:not(:disabled) { background:#B85A1F; }
.gac-send:disabled { background:#E8E0D8; box-shadow:none; cursor:not-allowed; color:#8A9DB0; }

/* Disclaimer */
.gac-disclaimer { font-size:12px; color:#8A9DB0; text-align:center; margin:0; line-height:1.5; }

/* Mobile responsiveness */
@media (max-width: 640px) {
   .gac-scroll { padding: 16px 12px 0; }
   .gac-input-wrap { padding: 10px 12px 16px; }
   .gac-empty { padding: 24px 8px; }
   .gac-h { font-size: 22px; }
   .gac-sub { font-size: 14px; margin: 0 0 20px; }
   .gac-pills { gap: 8px; }
   .gac-pill { height: 34px; padding: 0 12px; font-size: 12px; }
   .gac-user-msg { max-width: 85%; }
   .gac-upsell { flex-wrap: wrap; padding: 12px; gap: 10px; }
   .gac-upsell-link { width: 100%; }
   .gac-card { border-radius: 12px; }
   .gac-textarea { padding: 12px 14px 8px; }
   .gac-toolbar { padding: 8px 10px 10px; gap: 4px; }
   .gac-model-pill { height: 28px; padding: 0 8px; font-size: 11px; }
}
