.askAiButton{
  display:inline-flex!important;
  margin-top:16px;
  min-height:72px;
  align-items:center;
  justify-content:center;
  width:min(76vw,460px);
  border:1px solid rgba(255,255,255,.34)!important;
  border-radius:999px;
  background:rgba(255,255,255,.04)!important;
  color:rgba(255,255,255,.76)!important;
  font-size:clamp(16px,3.8vw,26px);
  font-weight:400;
}
.askAiButton:hover{color:#fff!important;text-shadow:0 0 16px rgba(143,246,255,.9)}
.aiChat{position:fixed;z-index:1600;inset:0;background:rgba(0,0,0,.54);backdrop-filter:blur(10px);opacity:0;visibility:hidden;transition:.28s ease;display:grid;place-items:end center;padding:18px}
.aiChat.is-open{opacity:1;visibility:visible}
.aiChat__panel{width:min(520px,100%);max-height:min(760px,88svh);display:flex;flex-direction:column;border:1px solid rgba(180,255,246,.28);border-radius:28px;background:linear-gradient(180deg,rgba(8,12,18,.94),rgba(0,0,0,.94));box-shadow:0 30px 120px rgba(0,0,0,.55),0 0 48px rgba(143,246,255,.14);overflow:hidden;color:#fff;font-family:"Segoe UI",Roboto,Arial,sans-serif}
.aiChat__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 18px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.aiChat__head b{display:block;font-size:18px}.aiChat__head span{display:block;color:rgba(255,255,255,.6);font-size:12px;margin-top:3px}.aiChat__head button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#fff;font-size:24px}
.aiChat__messages{padding:16px;overflow:auto;display:flex;flex-direction:column;gap:10px;min-height:360px;max-height:58svh}
.msg{max-width:88%;padding:11px 13px;border-radius:16px;line-height:1.45;font-size:14px;white-space:pre-wrap}
.msg--bot{align-self:flex-start;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.msg--user{align-self:flex-end;background:linear-gradient(135deg,#8ff6ff,#b99cff);color:#061010}
.msg--wait{opacity:.68}
.aiChat__form{display:flex;gap:10px;padding:0 16px 16px}
.aiChat__form textarea{flex:1;resize:none;min-height:46px;max-height:120px;border-radius:16px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;padding:13px 14px;outline:none;font-family:inherit}
.aiChat__form button{min-width:78px;border:0;border-radius:16px;background:#fff;color:#050505;font-weight:800}
@media(max-width:620px){.aiChat{place-items:end center;padding:10px}.aiChat__panel{border-radius:24px;max-height:90svh}.aiChat__messages{min-height:340px;max-height:62svh}.msg{font-size:13.5px}}


/* V25 iPhone Safari chat composer fix */
.aiChat{
  padding:max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
}
.aiChat__panel{
  max-width:100%;
  min-width:0;
}
.aiChat__messages{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.aiChat__form{
  width:100%;
  box-sizing:border-box;
  align-items:flex-end;
  padding:0 16px calc(16px + env(safe-area-inset-bottom));
}
.aiChat__form textarea{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  font-size:16px;
  line-height:1.4;
  -webkit-appearance:none;
  appearance:none;
}
.aiChat__form button{
  flex:0 0 88px;
  min-width:88px;
  height:52px;
  white-space:nowrap;
}
@supports (-webkit-touch-callout:none){
  .aiChat__panel{max-height:min(760px,85dvh);}
  .aiChat__messages{max-height:52dvh;}
}
@media(max-width:480px){
  .aiChat{place-items:end center;padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));}
  .aiChat__panel{border-radius:22px;}
  .aiChat__head{padding:16px 14px 12px;}
  .aiChat__messages{padding:14px;min-height:300px;max-height:54dvh;}
  .aiChat__form{gap:8px;padding:0 14px calc(14px + env(safe-area-inset-bottom));}
  .aiChat__form textarea{padding:12px 13px;border-radius:14px;}
  .aiChat__form button{flex:0 0 82px;min-width:82px;height:50px;border-radius:14px;}
}


/* V27 chat scroll fix: kéo lên/xuống xem nội dung chat trên mobile/iPhone */
html.chat-open-lock,
body.chat-open-lock{
  overflow:hidden!important;
  position:fixed!important;
  width:100%!important;
  left:0!important;
  right:0!important;
}

.aiChat.is-open{
  touch-action:none;
}

.aiChat__panel{
  height:min(760px, calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)))!important;
  max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

.aiChat__head{
  flex:0 0 auto!important;
}

.aiChat__messages{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  height:auto!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
  padding-bottom:18px!important;
}

.aiChat__form{
  flex:0 0 auto!important;
  position:relative!important;
  z-index:4!important;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.92) 18%,rgba(0,0,0,.96))!important;
  padding-top:14px!important;
  border-top:1px solid rgba(255,255,255,.07)!important;
}

.msg{
  overflow-wrap:anywhere;
  word-break:normal;
}

@supports (-webkit-touch-callout:none){
  .aiChat__panel{
    height:min(760px, calc(100dvh - 18px - env(safe-area-inset-top) - env(safe-area-inset-bottom)))!important;
    max-height:calc(100dvh - 18px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  }
  .aiChat__messages{
    transform:translateZ(0);
    will-change:scroll-position;
  }
}

@media(max-width:480px){
  .aiChat__panel{
    height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  }
  .aiChat__messages{
    min-height:0!important;
    max-height:none!important;
  }
}
