/* Panel fade-in on mount */
.haiv2__panel{ opacity:0; transform:translateY(6px); transition:opacity .25s ease, transform .25s ease; }
.haiv2__panel.haiv2--mounted{ opacity:1; transform:none; }

/* Core v2 look */
.haiv2__panel{ position:relative; margin-top:10px; border:1px solid #e7e7e9; border-radius:12px; background:#fff; box-shadow:0 8px 20px rgba(0,0,0,.06); overflow:hidden; font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial; }
.haiv2__header{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #eef2f7; padding-right:44px; }
.haiv2__title{ font-weight:700; }
.haiv2__bubbles{ display:flex; gap:10px; flex-wrap:wrap; padding:12px 16px; border-bottom:1px solid #f3f4f6; }
.haiv2__bubble{ padding:8px 14px; border-radius:999px; border:1px solid #dbeafe; background:#eff6ff; color:#073b61; cursor:pointer; transition: background-color .18s ease, color .18s ease, border-color .18s ease; }
.haiv2__bubble.active{ background:#073b61; color:#fff; border-color:#073b61; }
.haiv2__body{ padding:16px; }
.haiv2__answer{ display:none; }
.haiv2__answer.is-revealed .haiv2__answerContent{ animation:haiv2FadeIn .24s ease-out; }
@keyframes haiv2FadeIn { from { opacity:0; transform: translateY(4px);} to { opacity:1; transform:none;} }
.haiv2__purpose{ margin-top:14px; padding:12px; background:#f7fbff; border-left:4px solid #0a8f5b; border-radius:6px; font-weight:600; color:#0a3f2b; }

/* Hide price in header for panel */
.haiv2__price{ display:none !important; }

/* Close (top-right); hide when answers are closed */
.haiv2__close{ position:absolute !important; top:10px; right:12px; background:transparent; border:none; font-size:18px; line-height:1; cursor:pointer; color:#666; }
.haiv2__close:hover{ color:#000; }
.haiv2--answers-closed .haiv2__close{ display:none; }

/* Typing indicator */
.haiv2__typing{ display:flex; gap:6px; align-items:center; padding:6px 2px; margin:4px 0 10px; }
.haiv2__typing-dot{ width:6px; height:6px; border-radius:50%; background:#9ca3af; opacity:.6; animation:haiv2Dot 1s infinite ease-in-out; }
.haiv2__typing-dot:nth-child(2){ animation-delay:.15s; }
.haiv2__typing-dot:nth-child(3){ animation-delay:.30s; }
@keyframes haiv2Dot{ 0%,80%,100%{ transform:translateY(0); opacity:.6;} 40%{ transform:translateY(-4px); opacity:1;} }

/* Service styling */
.haiv2__service_user{ margin-bottom:8px; }
.haiv2__service_note{ margin-top:6px; padding:10px 12px; background:#f9fafb; border-left:4px solid #94a3b8; border-radius:6px; color:#111827; font-size:14px; }

/* Similar carousel */
.haiv2__carousel{ position:relative; }
.haiv2__car_track{ display:flex; gap:10px; overflow-x:auto; scroll-behavior:smooth; padding:4px; }
.haiv2__card{ min-width:160px; max-width:180px; border:1px solid #f1f5f9; background:#fafafa; border-radius:10px; padding:8px; text-decoration:none; color:inherit; }
.haiv2__card img{ width:100%; border-radius:8px; display:block; }
.haiv2__card_t{ font-weight:600; margin-top:6px; font-size:13px; min-height:32px; }
.haiv2__car_btn{ position:absolute; top:40%; transform:translateY(-50%); border:none; background:#fff; border:1px solid #e5e7eb; border-radius:999px; width:28px; height:28px; cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.06); }
.haiv2__car_btn.prev{ left:-8px; } .haiv2__car_btn.next{ right:-8px; }

/* FBT block */
.haiv2__fbt_wrap{ margin:16px 0; border:1px solid #e7e7e9; border-radius:12px; background:#fff; box-shadow:0 8px 20px rgba(0,0,0,0.06); padding:12px; }
.haiv2__fbt_head{ text-align:center; font-weight:700; }
.haiv2__fbt_sub{ text-align:center; color:#6b7280; font-size:12px; margin-bottom:10px; }
.haiv2__fbt_list{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; justify-content:center; flex-wrap:wrap; }
.haiv2__fbt_card{ width:150px; border:1px solid #f1f5f9; border-radius:10px; padding:8px; background:#fafafa; text-align:center; }
.haiv2__fbt_title{ font-size:13px; margin-top:6px; min-height:32px; }
.haiv2__fbt_summary{ display:flex; justify-content:center; align-items:center; margin-top:8px; gap:10px; flex-wrap:wrap; }
.haiv2__fbt_add{ background:#0a8f5b; color:#fff; border:none; border-radius:10px; padding:10px 14px; cursor:pointer; width:20pc; }
.haiv2__fbt_pricing .haiv2__fbt_disc{ color:#065f46; }

@media (max-width:782px){
  .haiv2__bubbles{ overflow-x:auto; padding-bottom:8px; }
  .haiv2__bubble{ white-space:nowrap; }
}
