/* Shih Tzu Puppies For Home - chat-style enquiry widget */

.pfh-chat{
  position:fixed; right:20px; bottom:20px; z-index:99990;
  font-family:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
}

.pfh-chat__launcher{
  width:58px; height:58px; border-radius:50%; border:0; cursor:pointer;
  background:#B635BD; color:#fff;
  box-shadow:0 6px 18px rgba(22,22,63,.28);
  display:flex; align-items:center; justify-content:center;
  transition:transform .18s cubic-bezier(.2,.8,.3,1), box-shadow .18s ease, background-color .18s ease;
  position:relative; margin-left:auto;
}
.pfh-chat__launcher:hover{ background:#9E2BA4; transform:translateY(-2px); box-shadow:0 10px 24px rgba(22,22,63,.34); }
.pfh-chat__launcher:focus-visible{ outline:3px solid #16163F; outline-offset:3px; }
.pfh-chat__ico{ width:26px; height:26px; fill:currentColor; position:absolute; transition:opacity .16s ease, transform .16s ease; }
.pfh-chat__ico--x{ opacity:0; transform:rotate(-45deg) scale(.7); }
.pfh-chat.is-open .pfh-chat__ico--chat{ opacity:0; transform:rotate(45deg) scale(.7); }
.pfh-chat.is-open .pfh-chat__ico--x{ opacity:1; transform:none; }

.pfh-chat__panel{
  position:absolute; right:0; bottom:72px;
  width:min(348px, calc(100vw - 32px));
  background:#fff; border:1px solid #E6DCD0; border-radius:14px; overflow:hidden;
  box-shadow:0 18px 44px rgba(22,22,63,.20);
  transform-origin:bottom right;
}
.pfh-chat__panel[hidden]{ display:none; }
.pfh-chat__panel.is-in{ animation:pfhChatIn .22s cubic-bezier(.2,.8,.3,1) both; }
@keyframes pfhChatIn{ from{ opacity:0; transform:translateY(10px) scale(.97); } to{ opacity:1; transform:none; } }

.pfh-chat__head{
  background:#B635BD; color:#fff; padding:14px 16px;
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
}
.pfh-chat__title{ margin:0; font-size:15px; font-weight:600; line-height:1.2; }
.pfh-chat__sub{ margin:3px 0 0; font-size:12px; opacity:.92; }
.pfh-chat__x{ background:none; border:0; color:#fff; cursor:pointer; padding:4px; border-radius:6px; line-height:0; flex:0 0 auto; }
.pfh-chat__x svg{ width:16px; height:16px; fill:currentColor; }
.pfh-chat__x:hover{ background:rgba(255,255,255,.16); }
.pfh-chat__x:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

.pfh-chat__body{ padding:14px 16px 4px; max-height:min(64vh,460px); overflow-y:auto; }

.pfh-chat__bubble{
  background:#F3ECE3; border-radius:12px 12px 12px 4px; padding:11px 13px; margin:0 0 14px;
}
.pfh-chat__bubble p{ margin:0; font-size:13px; line-height:1.55; color:#2E2E2E; }

.pfh-chat__ctx{ margin:0 0 10px; font-size:12px; color:#B635BD; font-weight:600; }

.pfh-chat__label{ display:block; font-size:12px; font-weight:600; color:#16163F; margin:0 0 4px; }
.pfh-chat__label span{ font-weight:400; color:#6B6B6B; }

.pfh-chat__input{
  width:100%; box-sizing:border-box; margin:0 0 11px;
  padding:9px 11px; font:inherit; font-size:13px; color:#2E2E2E;
  background:#fff; border:1px solid #DCD3C6; border-radius:8px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.pfh-chat__input::placeholder{ color:#8A8A8A; }
.pfh-chat__input:focus{ outline:none; border-color:#B635BD; box-shadow:0 0 0 3px rgba(182,53,189,.16); }
.pfh-chat__input[aria-invalid="true"]{ border-color:#B32D2E; box-shadow:0 0 0 3px rgba(179,45,46,.14); }
.pfh-chat__ta{ resize:vertical; min-height:74px; }

.pfh-chat__hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.pfh-chat__send{
  width:100%; padding:11px 14px; border:0; border-radius:8px; cursor:pointer;
  background:#B635BD; color:#fff; font:inherit; font-size:13.5px; font-weight:600;
  transition:background-color .15s ease, transform .12s ease;
}
.pfh-chat__send:hover:not(:disabled){ background:#9E2BA4; }
.pfh-chat__send:active:not(:disabled){ transform:translateY(1px); }
.pfh-chat__send:focus-visible{ outline:3px solid #16163F; outline-offset:2px; }
.pfh-chat__send:disabled{ opacity:.6; cursor:default; }

.pfh-chat__status{ margin:9px 0 4px; font-size:12.5px; line-height:1.5; min-height:1em; }
.pfh-chat__status.is-err{ color:#B32D2E; }
.pfh-chat__status.is-ok{ color:#2F6B3A; }

.pfh-chat__foot{
  margin:0; padding:10px 16px 13px; border-top:1px solid #F0E9E0;
  font-size:11.5px; color:#6B6B6B; text-align:center; background:#FCFAF7;
}
.pfh-chat__foot a{ color:#B635BD; }

.pfh-chat__done{ text-align:center; padding:8px 0 16px; }
.pfh-chat__done h3{ margin:0 0 6px; font-size:15px; color:#16163F; font-weight:600; }
.pfh-chat__done p{ margin:0; font-size:13px; color:#2E2E2E; line-height:1.55; }

@media (max-width:640px){
  .pfh-chat{ right:14px; bottom:14px; }
  .pfh-chat__panel{ bottom:68px; width:calc(100vw - 28px); }
  .pfh-chat__body{ max-height:58vh; }
}

@media (prefers-reduced-motion:reduce){
  .pfh-chat__panel.is-in{ animation:none; }
  .pfh-chat__launcher, .pfh-chat__ico, .pfh-chat__send, .pfh-chat__input{ transition:none; }
}
