/* GHTA Care Companion Widget — Pro UI */
#ghta-cc { position:fixed; bottom:24px; right:24px; z-index:9999; font-family:'Inter',sans-serif; }

/* Toggle FAB */
#ghta-cc-toggle { width:60px; height:60px; border-radius:50%; background:#0E2A3B; border:3px solid #C9A55C; cursor:pointer; box-shadow:0 6px 24px rgba(0,0,0,0.35); display:none; align-items:center; justify-content:center; transition:transform .2s,box-shadow .2s; overflow:hidden; padding:0; }
#ghta-cc-toggle:hover { transform:scale(1.1); box-shadow:0 8px 32px rgba(201,165,92,0.3); }
#ghta-cc-toggle.ghta-cc-closed { display:flex; }
#ghta-cc-toggle img { width:100%; height:100%; object-fit:cover; }

/* Panel container — flex column, fixed height, no overflow leakage */
#ghta-cc-panel { position:absolute; bottom:0; right:0; width:380px; max-width:calc(100vw - 32px); height:580px; max-height:calc(100vh - 48px); background:#ffffff; border-radius:20px; box-shadow:0 12px 48px rgba(0,0,0,0.25),0 0 0 1px rgba(0,0,0,0.04); display:flex; flex-direction:column; overflow:hidden; animation:ghta-slideUp .3s ease; }
#ghta-cc-panel.ghta-cc-hidden { display:none; }

@keyframes ghta-slideUp {
  from { opacity:0; transform:translateY(16px); }
  to { opacity:1; transform:translateY(0); }
}

/* Header */
.ghta-cc-header { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:linear-gradient(135deg,#0E2A3B 0%,#163a52 100%); color:#fff; flex-shrink:0; }
.ghta-cc-header-left { display:flex; align-items:center; gap:10px; }
.ghta-cc-header-left img { border-radius:50%; border:2px solid rgba(201,165,92,0.4); }
.ghta-cc-header-left span { font-weight:700; font-size:0.88rem; letter-spacing:-0.01em; }
.ghta-cc-header-right { display:flex; align-items:center; gap:6px; }
.ghta-cc-header-right button { background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15); color:#fff; width:30px; height:30px; border-radius:8px; cursor:pointer; font-size:0.75rem; font-weight:700; transition:background .2s; }
.ghta-cc-header-right button:hover { background:rgba(255,255,255,0.2); }
#ghta-cc-close { font-size:1.3rem; line-height:1; }

/* Tabs */
.ghta-cc-tabs { display:flex; border-bottom:1px solid #e5e7eb; background:#f8fafc; flex-shrink:0; }
.ghta-tab { flex:1; padding:11px 4px; border:none; background:none; font-size:0.73rem; font-weight:500; color:#64748b; cursor:pointer; transition:all .2s; position:relative; }
.ghta-tab.active { color:#0E2A3B; font-weight:700; }
.ghta-tab.active::after { content:''; position:absolute; bottom:0; left:20%; right:20%; height:2.5px; background:#C9A55C; border-radius:2px; }

/* Body — scrollable area, takes remaining space */
.ghta-cc-body { flex:1; overflow-y:auto; padding:16px; min-height:0; }
.ghta-cc-body::-webkit-scrollbar { width:4px; }
.ghta-cc-body::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:4px; }
.ghta-cc-messages { display:flex; flex-direction:column; gap:10px; }

/* Messages */
.ghta-msg { max-width:86%; padding:11px 14px; border-radius:14px; font-size:0.8rem; line-height:1.65; word-wrap:break-word; animation:ghta-fadeIn .2s ease; }
@keyframes ghta-fadeIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:translateY(0)} }
.ghta-msg-bot { background:#f1f5f9; color:#1e293b; align-self:flex-start; border-bottom-left-radius:4px; }
.ghta-msg-user { background:linear-gradient(135deg,#0E2A3B,#1a3f5c); color:#fff; align-self:flex-end; border-bottom-right-radius:4px; box-shadow:0 2px 8px rgba(14,42,59,0.2); }

/* Input bar — always at bottom, never hidden */
.ghta-cc-input { display:flex; padding:12px 14px; border-top:1px solid #e5e7eb; gap:8px; background:#fff; flex-shrink:0; }
.ghta-cc-input input { flex:1; padding:11px 14px; border:1.5px solid #e2e8f0; border-radius:10px; font-size:0.8rem; outline:none; background:#f8fafc; transition:border-color .2s,box-shadow .2s; }
.ghta-cc-input input:focus { border-color:#0E2A3B; box-shadow:0 0 0 3px rgba(14,42,59,0.08); background:#fff; }
.ghta-cc-input button { padding:11px 18px; background:linear-gradient(135deg,#0E2A3B,#163a52); color:#fff; border:none; border-radius:10px; font-size:0.78rem; font-weight:700; cursor:pointer; transition:transform .15s,box-shadow .15s; }
.ghta-cc-input button:hover { transform:scale(1.03); box-shadow:0 4px 12px rgba(14,42,59,0.3); }
.ghta-cc-input button:active { transform:scale(0.97); }

/* Quick actions */
.ghta-quick-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.ghta-qa-btn { padding:9px 16px; background:#fff; border:1.5px solid #e2e8f0; border-radius:22px; font-size:0.74rem; font-weight:500; cursor:pointer; color:#334155; transition:all .2s; box-shadow:0 1px 3px rgba(0,0,0,0.04); }
.ghta-qa-btn:hover { background:#0E2A3B; color:#fff; border-color:#0E2A3B; box-shadow:0 4px 12px rgba(14,42,59,0.2); transform:translateY(-1px); }

/* Hospital cards */
.ghta-hospital-cards { display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.ghta-h-card { padding:14px; border:1px solid #e5e7eb; border-radius:12px; background:#fff; transition:box-shadow .2s; }
.ghta-h-card:hover { box-shadow:0 4px 16px rgba(0,0,0,0.06); }
.ghta-h-pickable { transition:all .2s; border:1.5px solid #e2e8f0; }
.ghta-h-pickable:hover { border-color:#C9A55C; box-shadow:0 4px 16px rgba(201,165,92,0.15); transform:translateY(-1px); }
.ghta-h-name { font-weight:700; font-size:0.82rem; color:#0E2A3B; }
.ghta-h-city { font-size:0.72rem; color:#64748b; margin-top:3px; }
.ghta-h-coe { font-size:0.7rem; color:#C9A55C; margin-top:5px; font-weight:600; }
.ghta-h-wa { display:inline-flex; align-items:center; gap:4px; margin-top:8px; padding:7px 14px; background:#25D366; color:#fff; border-radius:8px; font-size:0.72rem; font-weight:700; text-decoration:none; transition:background .2s; }
.ghta-h-wa:hover { background:#1da851; }

/* Search & Booking forms */
.ghta-search-form, .ghta-booking-form { display:flex; flex-direction:column; gap:10px; }
.ghta-search-form h4, .ghta-booking-form h4 { font-size:0.88rem; margin:0 0 4px; color:#0E2A3B; font-weight:700; }
.ghta-search-form select, .ghta-booking-form input, .ghta-booking-form textarea { padding:11px 12px; border:1.5px solid #e2e8f0; border-radius:10px; font-size:0.8rem; font-family:inherit; background:#f8fafc; transition:border-color .2s; }
.ghta-search-form select:focus, .ghta-booking-form input:focus, .ghta-booking-form textarea:focus { border-color:#0E2A3B; outline:none; }
.ghta-booking-form textarea { resize:none; min-height:80px; }

/* FAQ */
.ghta-faq-list { display:flex; flex-direction:column; gap:8px; }
.ghta-faq-item { border:1px solid #e5e7eb; border-radius:10px; overflow:hidden; }
.ghta-faq-item summary { padding:12px 14px; cursor:pointer; font-size:0.8rem; font-weight:600; color:#0E2A3B; background:#f8fafc; transition:background .2s; }
.ghta-faq-item summary:hover { background:#f1f5f9; }
.ghta-faq-item p { padding:10px 14px; font-size:0.78rem; color:#475569; line-height:1.65; margin:0; background:#fff; }

/* Language selector */
.ghta-lang-selector { display:flex; flex-wrap:wrap; gap:8px; }
.ghta-lang-selector h4 { width:100%; font-size:0.88rem; margin:0 0 8px; font-weight:700; color:#0E2A3B; }
.ghta-lang-btn { padding:9px 14px; border:1.5px solid #e2e8f0; border-radius:10px; background:#fff; font-size:0.76rem; cursor:pointer; transition:all .2s; }
.ghta-lang-btn.active { background:#0E2A3B; color:#fff; border-color:#0E2A3B; }
.ghta-lang-btn:hover { border-color:#0E2A3B; background:#f1f5f9; }

/* Mobile responsive */
@media(max-width:480px) {
  #ghta-cc { bottom:12px; right:12px; left:12px; }
  #ghta-cc-panel { width:100%; max-width:none; height:calc(100vh - 24px); max-height:calc(100vh - 24px); bottom:0; right:0; border-radius:16px; }
  #ghta-cc-toggle { width:52px; height:52px; }
}