/* GD4+GD6 PageAgent widget — Gang Viet. Tat ca class tien to gv-pa- de khong ro ri style.
   Che do THU KIN: hien khi URL co ?assistant=1 HOAC da bam phien qua sessionStorage
   (gating nam trong JS). */

/* ===== GD6-UI: nut noi = NHAN VAT logo Gang Viet (mat cu dong + tay vay + bong bong noi) ===== */
.gv-pa-fab {
  position: fixed;
  right: 20px;
  bottom: 90px; /* man rong: tranh de len nut gio hang neu trung vi tri */
  z-index: 99990;
  width: 84px;
  height: 90px;
  border-radius: 14px;
  background: transparent;   /* than nhan vat chinh la logo SVG, khong can nen tron */
  border: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.18s ease;
  font-family: "Barlow", Arial, sans-serif;
  padding: 0;
  overflow: visible;
}
.gv-pa-fab:hover,
.gv-pa-fab:focus-visible {
  outline: none;
  transform: translateY(-3px) scale(1.04);
}
.gv-pa-fab:focus-visible .gv-pa-body-shape {
  stroke: #ffffff;           /* vien trang khi focus ban phim — thay cho outline */
  stroke-width: 4;
}

/* --- Than nhan vat (logo) --- */
.gv-pa-char {
  width: 84px;
  height: 90px;
  overflow: visible;
  /* PIXEL: bong do CUNG (khong blur) thay cho bong mo -> giong sprite game */
  filter: drop-shadow(3px 3px 0 rgba(0, 0, 0, 0.5));
  shape-rendering: crispEdges;   /* vien sac canh, khong lam min -> chat pixel */
}

/* --- Mat PIXEL: trong mat nhay theo TUNG NAC (steps) nhu game 8-bit, khong truot muot --- */
.gv-pa-pupil {
  animation: gv-pa-look 4s steps(1, end) infinite;  /* steps() = nhay nac, chat pixel */
}
@keyframes gv-pa-look {
  0%, 24%   { transform: translate(0, 0); }
  25%, 49%  { transform: translate(4.5px, 0); }   /* nhin phai: nhay TRON 1 o pixel lon */
  50%, 74%  { transform: translate(0, 0); }
  75%, 100% { transform: translate(-4.5px, 0); }  /* nhin trai */
}
/* mi mat pixel: sap xuong DUT KHOAT (khong mo dan) */
.gv-pa-lid {
  transform-box: fill-box;
  transform-origin: center top;
  transform: scaleY(0);
  animation: gv-pa-blink 5.5s steps(1, end) infinite;
}
@keyframes gv-pa-blink {
  0%, 93%, 100% { transform: scaleY(0); }
  94%, 97%      { transform: scaleY(1); }
}
/* re chuot vao: mat nhin thang + mo to hon (trang thai "chu y") */
.gv-pa-fab:hover .gv-pa-pupil,
.gv-pa-fab:focus-visible .gv-pa-pupil {
  animation: none;
  transform: translate(0, 0);
  r: 4.8;
}
.gv-pa-fab:hover .gv-pa-eye-w,
.gv-pa-fab:focus-visible .gv-pa-eye-w {
  rx: 9.4;
  ry: 9.4;
}

/* --- CEO chot 19/07: KHONG dung chi/duoi hinh dong vat tren logo (nguy co lien tuong quoc ky).
   Thay bang: NGOI SAO NUNG SANG nhu thep nong + nhan vat NHUN NHAY khi chao. --- */

/* Ngoi sao phat sang xuyen qua lo sao khoet thung — nhip tho nhe nhu thep dang nguoi */
.gv-pa-star-glow {
  opacity: 0.55;
  animation: gv-pa-ember 3.4s ease-in-out infinite;
}
@keyframes gv-pa-ember {
  0%, 100% { opacity: 0.42; fill: #F59331; }
  50%      { opacity: 0.85; fill: #FFC24D; }
}
/* Re chuot vao / luc chao: sao sang RUC nhu thep vua ra lo */
.gv-pa-fab:hover .gv-pa-star-glow,
.gv-pa-fab:focus-visible .gv-pa-star-glow,
.gv-pa-teasing .gv-pa-star-glow {
  animation: gv-pa-ember-hot 0.5s steps(1, end) infinite;  /* nhap nhay nac kieu 8-bit */
}
/* PIXEL: nhay giua 2 muc sang DUT KHOAT (steps) — nhu den bao trong game, khong chuyen muot */
@keyframes gv-pa-ember-hot {
  0%, 49%   { opacity: 0.7; fill: #FFB020; }
  50%, 100% { opacity: 1;   fill: #FFF0B8; }
}

/* --- Bong bong noi tren dau --- */
.gv-pa-bubble {
  position: absolute;
  bottom: 96px;    /* than 90px + chua cho cu nhay cao 42px -> khong bi dau dam vao bong bong */
  right: 4px;
  min-width: 34px;
  max-width: 196px;   /* thong diep dai hon (gioi thieu nang luc tro ly) -> cho rong hon */
  padding: 6px 10px;
  background: #ffffff;
  color: #1c1c1c;
  /* PIXEL: goc vuong, vien den day, bong do cung (khong blur) — chat hop thoai game 8-bit */
  border-radius: 0;
  border: 4px solid #1c1c1c;     /* PIXEL TO: vien day hon */
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.3px;
  line-height: 1.35;
  white-space: normal;   /* cho phep xuong dong voi cau dai */
  text-align: center;
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.5);   /* bong cung, to */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  animation: gv-pa-float 2.6s ease-in-out infinite;
  pointer-events: none;
}
.gv-pa-bubble::after {   /* duoi bong bong chi xuong dau nhan vat */
  content: "";
  position: absolute;
  bottom: -6px;
  right: 18px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #ffffff;
}
@keyframes gv-pa-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}
/* Khi dang nhay: bong bong DUNG YEN de mat bat duoc cu nhay (2 thu cung nhun nhay se roi mat) */
.gv-pa-teasing .gv-pa-bubble,
.gv-pa-hop-once .gv-pa-bubble { animation: none; }

.gv-pa-bubble-txt:empty { display: none; }
.gv-pa-bubble-txt { margin-right: 2px; }

/* 3 cham nhap nhay tuan tu nhu dang go chu */
.gv-pa-dots { display: inline-flex; gap: 3px; align-items: center; }
.gv-pa-dots i {
  width: 8px;                    /* PIXEL TO: cham vuong lon, tho */
  height: 8px;
  border-radius: 0;              /* PIXEL: cham VUONG, khong tron */
  background: #E05C14;
  display: block;
  animation: gv-pa-dot 1.2s steps(1, end) infinite;  /* nhay nac kieu 8-bit */
}
.gv-pa-dots i:nth-child(2) { animation-delay: 0.22s; }
.gv-pa-dots i:nth-child(3) { animation-delay: 0.44s; }
@keyframes gv-pa-dot {
  0%, 60%, 100% { opacity: 0.25; transform: translateY(0); }
  30%           { opacity: 1;    transform: translateY(-3px); }
}
/* dang chat -> an bong bong cho do roi; teaser -> hien chu + an 3 cham */
.gv-pa-chat-open .gv-pa-bubble { display: none; }
.gv-pa-teasing .gv-pa-dots { display: none; }
/* === CU NHAY KIEU GAME PIXEL (CEO 19/07: "nhu con bot trong Minecraft") ===
   Chuoi chuyen dong co SUC NANG: nhun lay da (bep xuong) -> bat len (keo dai nguoi)
   -> roi xuong -> TIEP DAT bep manh -> nay len lai (nho hon) -> dung yen.
   transform-origin duoi day de bien dang nhu vat the co trong luong dat tren mat dat. */
.gv-pa-fab { transform-origin: 50% 100%; }
.gv-pa-teasing .gv-pa-fab { animation: gv-pa-hop 1.15s cubic-bezier(0.34, 1.3, 0.64, 1) 3; }
/* Nhay MOT PHAT sau moi lan tro ly tu van xong (CEO 19/07) */
.gv-pa-hop-once .gv-pa-fab { animation: gv-pa-hop 1.15s cubic-bezier(0.34, 1.3, 0.64, 1) 1; }
/* sao loe sang trong luc nhay -> nhu vua "nung" xong cau tra loi */
.gv-pa-hop-once .gv-pa-star-glow { animation: gv-pa-ember-hot 0.5s steps(1, end) 2; }
/* CEO 19/07 "ko thay nhay": bien do cu nho (20px) so voi than 90px -> mat thuong kho thay.
   NANG bien do len 42px + nhun sau hon + tiep dat bep manh hon cho DAP VAO MAT. */
@keyframes gv-pa-hop {
  0%    { transform: translateY(0)     scale(1, 1); }
  9%    { transform: translateY(6px)   scale(1.22, 0.78); }  /* nhun SAU xuong lay da */
  15%   { transform: translateY(-6px)  scale(0.9, 1.14); }   /* bat manh: keo dai nguoi */
  32%   { transform: translateY(-42px) scale(0.86, 1.18); }  /* LEN CAO (42px), than thon dai */
  44%   { transform: translateY(-30px) scale(1, 1); }        /* lo lung, tro ve hinh */
  58%   { transform: translateY(0)     scale(1.26, 0.76); }  /* TIEP DAT: bep manh */
  70%   { transform: translateY(-18px) scale(0.93, 1.09); }  /* nay len lan 2 */
  82%   { transform: translateY(0)     scale(1.14, 0.88); }  /* tiep dat lan 2 */
  91%   { transform: translateY(-5px)  scale(0.98, 1.03); }  /* rung nhe */
  100%  { transform: translateY(0)     scale(1, 1); }        /* dung yen */
}

/* --- Ton trong nguoi dung tat hieu ung chuyen dong (chuan kha dung) --- */
@media (prefers-reduced-motion: reduce) {
  .gv-pa-pupil,
  .gv-pa-lid,
  .gv-pa-star-glow,
  .gv-pa-bubble,
  .gv-pa-dots i,
  .gv-pa-teasing .gv-pa-fab,
  .gv-pa-hop-once .gv-pa-fab,
  .gv-pa-fab:hover .gv-pa-star-glow,
  .gv-pa-teasing .gv-pa-star-glow,
  .gv-pa-hop-once .gv-pa-star-glow {
    animation: none !important;
  }
  .gv-pa-fab:hover { transform: none; }
}

.gv-pa-panel {
  position: fixed;
  right: 20px;
  bottom: 156px;
  z-index: 99991;
  width: 360px;
  max-width: 92vw;
  max-height: 70vh;
  background: #1c1c1c;
  color: #f5f5f5;
  border-radius: 14px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.5);
  display: none;
  flex-direction: column;
  overflow: hidden;
  font-family: "Barlow", Arial, sans-serif;
  border: 1px solid #333333;
}
.gv-pa-panel.gv-pa-open {
  display: flex;
}

.gv-pa-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: #232323;
  border-bottom: 1px solid #333333;
  flex: 0 0 auto;
}
.gv-pa-title {
  font-weight: 600;
  font-size: 15px;
  color: #f5f5f5;
  margin: 0;
}
.gv-pa-header-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.gv-pa-close {
  background: transparent;
  border: none;
  color: #f5f5f5;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  padding: 4px;
  border-radius: 6px;
}
.gv-pa-close:hover,
.gv-pa-close:focus-visible {
  border: 2px solid #ffffff;
  outline: none;
}

/* TINH NANG D — nut "Doi vai" nho, kin dao o header */
.gv-pa-role-btn {
  background: transparent;
  border: 1px solid transparent;
  color: #bdbdbd;
  cursor: pointer;
  font-size: 11.5px;
  font-family: inherit;
  padding: 3px 8px;
  border-radius: 6px;
  white-space: nowrap;
}
.gv-pa-role-btn:hover,
.gv-pa-role-btn:focus-visible {
  color: #f5f5f5;
  border-color: #555555;
  outline: none;
}

.gv-pa-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.gv-pa-msg {
  max-width: 90%;
  padding: 9px 12px;
  border-radius: 10px;
  font-size: 13.5px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}
.gv-pa-msg-user {
  align-self: flex-end;
  background: #333333;
  color: #f5f5f5;
}
.gv-pa-msg-bot {
  align-self: flex-start;
  background: #262626;
  color: #f5f5f5;
  border: 1px solid #333333;
}
.gv-pa-msg-status {
  align-self: flex-start;
  color: #bdbdbd;
  font-size: 12.5px;
  font-style: italic;
}
.gv-pa-msg-error {
  align-self: flex-start;
  background: #3a2323;
  color: #f5c6c6;
  border: 1px solid #5a3a3a;
  font-size: 13px;
}

.gv-pa-apply-btn {
  align-self: flex-start;
  margin-top: 4px;
  background: #E05C14;
  color: #ffffff;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.gv-pa-apply-btn:hover,
.gv-pa-apply-btn:focus-visible {
  border-color: #ffffff;
  outline: none;
}

/* TINH NANG C — chip goi y san pham */
.gv-pa-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-self: flex-start;
  max-width: 100%;
}
.gv-pa-chip {
  background: #2a2a2a;
  color: #f5f5f5;
  border: 1px solid #555555;
  border-radius: 14px;
  padding: 6px 12px;
  font-size: 12.5px;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
}
.gv-pa-chip:hover,
.gv-pa-chip:focus-visible {
  border-color: #E05C14;
  outline: none;
}
.gv-pa-chip:focus-visible {
  border-color: #ffffff;
}

/* TINH NANG D — man chao phan vai */
.gv-pa-greeting {
  align-self: stretch;
  color: #f5f5f5;
  padding: 9px 12px;
  font-size: 13.5px;
  line-height: 1.5;
}
.gv-pa-persona-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-self: stretch;
}
.gv-pa-persona-btn {
  width: 100%;
  min-height: 40px;
  background: #E05C14;
  color: #ffffff;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  text-align: center;
}
.gv-pa-persona-btn:hover,
.gv-pa-persona-btn:focus-visible {
  border-color: #ffffff;
  outline: none;
}

/* nut lien ket CTA (contact / tuyen-dung) — giong nut ap bo loc */
.gv-pa-link-btn {
  align-self: flex-start;
  margin-top: 4px;
  background: #E05C14;
  color: #ffffff;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.gv-pa-link-btn:hover,
.gv-pa-link-btn:focus-visible {
  border-color: #ffffff;
  outline: none;
}

/* GD5 19/07 — form xin thong tin khach vang lai (Ho ten/SDT/Email/Nhu cau + nut Gui) */
.gv-pa-lead-form {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #202020;
  border: 1px solid #333333;
  border-radius: 10px;
  padding: 10px 12px;
}
.gv-pa-lead-lab {
  color: #bdbdbd;
  font-size: 11.5px;
  margin-top: 4px;
}
.gv-pa-lead-inp {
  background: #2a2a2a;
  color: #f5f5f5;
  border: 1px solid #3d3d3d;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  font-family: inherit;
}
.gv-pa-lead-inp:focus {
  outline: none;
  border-color: #E05C14;
}
select.gv-pa-lead-inp {
  appearance: auto;
}

.gv-pa-footer {
  flex: 0 0 auto;
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid #333333;
  background: #202020;
}
.gv-pa-input {
  flex: 1 1 auto;
  min-width: 0;
  background: #2a2a2a;
  color: #f5f5f5;
  border: 1px solid #3d3d3d;
  border-radius: 8px;
  padding: 9px 11px;
  font-size: 13.5px;
  font-family: inherit;
}
.gv-pa-input::placeholder {
  color: #8f8f8f;
}
.gv-pa-input:focus {
  outline: none;
  border-color: #E05C14;
}
.gv-pa-send {
  flex: 0 0 auto;
  background: #E05C14;
  color: #ffffff;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.gv-pa-send:hover,
.gv-pa-send:focus-visible {
  border-color: #ffffff;
  outline: none;
}
.gv-pa-send:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 480px) {
  .gv-pa-panel {
    right: 4vw;
    bottom: 150px;
    width: 92vw;
  }
  .gv-pa-fab {
    right: 16px;
    bottom: 150px;
  }
}
