
/* Live chat final responsive layer. Loaded after storefront styles. */
.chat-widget{z-index:1500}
.chat-window{isolation:isolate}
.chat-window-body{min-height:0;display:flex;flex-direction:column}
.chat-welcome{flex:0 0 auto}
.chat-messages{min-height:0;overflow-wrap:anywhere}
.chat-compose{flex:0 0 auto}
.chat-compose textarea{min-height:42px;max-width:100%;box-sizing:border-box}
.chat-quick-actions{scrollbar-width:thin}
@media (max-width:760px){
  .chat-widget{right:10px;bottom:calc(72px + env(safe-area-inset-bottom));}
  .chat-window{
    left:8px;right:8px;
    bottom:calc(68px + env(safe-area-inset-bottom));
    width:auto;
    height:calc(100dvh - 84px - env(safe-area-inset-bottom));
    max-height:620px;
    min-height:360px;
    border-radius:16px;
  }
  .chat-window-head{flex:0 0 auto}
  .chat-window-body{padding:10px}
  .chat-compose{padding:8px;gap:6px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .chat-compose textarea{font-size:16px!important;min-height:42px}
  .chat-send{flex:0 0 44px}
}
@media (max-width:480px){
  .chat-window{left:4px;right:4px;bottom:calc(64px + env(safe-area-inset-bottom));min-height:340px}
  .chat-window-head{padding:10px 11px}
  .chat-head-avatar{width:34px;height:34px;font-size:16px}
  .chat-head-text strong{font-size:13px}
  .chat-head-text small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat-window-body{padding:8px}
  .chat-quick-actions{max-height:120px;justify-content:flex-start}
  .chat-quick-btn{font-size:10.5px;padding:6px 8px}
  .chat-bubble{max-width:92%;font-size:13px}
}
@media (max-width:360px){
  .chat-window{left:2px;right:2px;min-height:320px}
  .chat-window-body{padding:7px}
  .chat-quick-actions{max-height:100px}
}
@media (max-height:520px) and (max-width:900px){
  .chat-window{height:calc(100dvh - 18px);bottom:8px;max-height:none}
  .chat-quick-actions{max-height:75px}
}
@media (prefers-reduced-motion:reduce){
  .chat-window,.chat-fab{transition:none!important}
}

@media (max-width:760px){.chat-window{max-height:calc(var(--chat-viewport-height,100dvh) - 84px - env(safe-area-inset-bottom));}}

/* Final viewport/keyboard hardening */
.chat-widget{max-width:100vw}
.chat-window,.chat-window *{box-sizing:border-box}
.chat-messages{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.chat-compose{position:relative}
@media (max-width:760px){
  .chat-widget{right:max(8px,env(safe-area-inset-right));}
  .chat-fab{width:50px;height:50px}
  .chat-window{
    top:max(8px,env(safe-area-inset-top));
    height:calc(var(--chat-viewport-height,100dvh) - 84px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height:none;
  }
  .chat-window-body{overflow:hidden}
  .chat-messages{flex:1 1 auto;min-height:0;overflow-y:auto}
  .chat-compose textarea{width:100%;resize:none}
}
@media (max-width:420px){
  .chat-window{left:2px;right:2px;border-radius:13px}
  .chat-window-head{min-height:52px}
  .chat-compose{padding-left:7px;padding-right:7px}
}
@media (max-height:520px) and (max-width:900px){
  .chat-window{
    top:4px;
    bottom:4px;
    height:calc(var(--chat-viewport-height,100dvh) - 8px);
  }
}
