/* PixelCMS Floating Contact Trimode Presets / DEV27
 * Keeps only 3 public styles:
 * - dock         => Icon Bubble Stack (attachments 1-2)
 * - compact      => Rounded 8px Panel (attachment 3)
 * - center-stack => existing glossy center overlay (unchanged)
 */

/* Shared trimode alignment */
.pxth-floating-contact.pxth-float-style-dock,
.pxth-floating-contact.pxth-float-style-compact{align-items:center!important;right:18px!important;bottom:20px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-backdrop,
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-backdrop{display:none!important}

/* ------------------------------------------------------------------
   STYLE 1: Icon Bubble Stack — DEV29 rebuild from exact DEV27
   Direct dock assets only. No nested/pseudo icon scaling.
   ------------------------------------------------------------------ */
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel{
  width:auto!important;max-width:none!important;padding:0!important;border:0!important;
  background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  transform-origin:bottom center!important
}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel-head{display:none!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-list{
  display:flex!important;flex-direction:column!important;align-items:center!important;gap:10px!important;padding:0!important;margin:0!important
}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn{
  width:66px!important;min-width:66px!important;max-width:66px!important;height:66px!important;min-height:66px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;margin:0!important;gap:0!important;
  border:0!important;border-radius:50%!important;clip-path:circle(50% at 50% 50%)!important;overflow:hidden!important;
  box-shadow:0 8px 18px rgba(15,23,42,.22)!important;transform:none!important;color:#fff!important
}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn:focus-visible{transform:translateY(-1px)!important;filter:brightness(1.025)!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-label{display:none!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-icon{
  width:66px!important;height:66px!important;min-width:66px!important;min-height:66px!important;
  display:block!important;border:0!important;border-radius:50%!important;background-color:transparent!important;
  background-repeat:no-repeat!important;background-position:center!important;background-size:32px 32px!important;
  box-shadow:none!important;overflow:hidden!important;color:transparent!important;line-height:0!important
}
/* Hide renderer icon only in Dock; the supplied Dock asset is the single visual owner. */
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-icon > *{display:none!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-phone{background:#ff6a00!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-line{background:#00c300!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-line-oa{background:#00c300!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-whatsapp{background:#20c65a!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-email{background:#3f6cff!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-messenger{background:#118bf5!important}
/* DEV30 — preserve Dock brand surfaces on hover/focus/active; defeat generic white hover. */
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-phone:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-phone:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-phone:active{background:#ff6a00!important}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line:active{background:#00c300!important}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line-oa:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line-oa:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-line-oa:active{background:#00c300!important}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-whatsapp:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-whatsapp:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-whatsapp:active{background:#20c65a!important}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-email:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-email:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-email:active{background:#3f6cff!important}
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-messenger:hover,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-messenger:focus-visible,
html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn.pxth-messenger:active{background:#118bf5!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-phone .pxth-float-icon{background-image:url("../images/floating-contact/dock/phone.svg")!important;background-size:30px 30px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-line .pxth-float-icon{background-image:url("../images/floating-contact/dock/line.svg")!important;background-size:31px 31px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-line-oa .pxth-float-icon{background-image:url("../images/floating-contact/dock/line-oa.webp")!important;background-size:32px 32px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-whatsapp .pxth-float-icon{background-image:url("../images/floating-contact/whatsapp.png")!important;background-size:32px 32px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-email .pxth-float-icon{background-image:url("../images/floating-contact/dock/email.svg")!important;background-size:30px 30px!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-messenger .pxth-float-icon{background-image:url("../images/floating-contact/dock/messenger.svg")!important;background-size:31px 31px!important}

html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle{
  width:66px!important;min-width:66px!important;max-width:66px!important;height:66px!important;min-height:66px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;margin:0!important;gap:0!important;
  border:0!important;border-radius:50%!important;clip-path:circle(50% at 50% 50%)!important;
  background:#1184d8!important;color:#fff!important;box-shadow:0 10px 22px rgba(15,23,42,.24)!important
}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle .pxth-float-label{display:none!important}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle .pxth-float-icon{
  width:66px!important;height:66px!important;min-width:66px!important;min-height:66px!important;
  display:block!important;border-radius:50%!important;background-color:transparent!important;background-repeat:no-repeat!important;
  background-position:center!important;background-size:38px 38px!important;background-image:url("../images/floating-contact/dock/chat.png")!important;
  color:transparent!important;line-height:0!important;overflow:hidden!important
}
.pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle .pxth-float-icon > *{display:none!important}
.pxth-floating-contact.pxth-float-style-dock:not(.is-collapsed) .pxth-contact-toggle .pxth-float-icon{
  background-size:29px 29px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E")!important
}
.pxth-floating-contact.pxth-float-style-dock.is-collapsed .pxth-contact-panel{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(8px) scale(.96)!important}
.pxth-floating-contact.pxth-float-style-dock:not(.is-collapsed) .pxth-contact-panel{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0) scale(1)!important}

/* ------------------------------------------------------------------
   STYLE 2: Rounded 8px Panel (attachment 3)
   ------------------------------------------------------------------ */
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel{
  width:78px!important;max-width:none!important;padding:14px 10px!important;border-radius:22px!important;
  background:rgba(255,255,255,.95)!important;border:1px solid rgba(15,23,42,.05)!important;
  box-shadow:0 14px 34px rgba(15,23,42,.16)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;
  transform-origin:bottom center!important
}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel-head{display:none!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-list{
  display:flex!important;flex-direction:column!important;align-items:center!important;gap:10px!important;padding:0!important;margin:0!important
}
html body .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-btn{
  width:48px!important;min-width:48px!important;max-width:48px!important;height:48px!important;min-height:48px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:0!important;padding:0!important;
  background:transparent!important;border-radius:8px!important;box-shadow:none!important;transform:none!important
}
html body .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-btn:hover{background:rgba(15,23,42,.03)!important;transform:translateY(-1px)!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-label{display:none!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-icon{
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;border-radius:8px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;box-shadow:none!important
}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-icon img{width:24px!important;height:24px!important;display:block!important;object-fit:contain!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-icon svg{width:20px!important;height:20px!important;display:block!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-phone .pxth-float-icon{background:#fff4eb!important;color:#f97316!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-line .pxth-float-icon{background:#eefdf2!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-line-oa .pxth-float-icon{background:#edfdf1!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-whatsapp .pxth-float-icon{background:#effcf3!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-email .pxth-float-icon{background:#eef4ff!important;color:#356ae6!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-messenger .pxth-float-icon{background:#edf7ff!important}

html body .pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle{
  height:48px!important;min-height:48px!important;width:auto!important;min-width:132px!important;max-width:none!important;
  display:grid!important;grid-template-columns:32px auto!important;align-items:center!important;gap:10px!important;
  padding:8px 14px 8px 8px!important;border-radius:8px!important;clip-path:inset(0 round 8px)!important;
  background:#101827!important;color:#fff!important;box-shadow:0 10px 26px rgba(15,23,42,.22)!important
}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle .pxth-float-icon{
  width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;border-radius:8px!important;
  background:rgba(255,255,255,.12)!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important
}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle .pxth-float-icon svg{width:18px!important;height:18px!important;transform:none!important}
.pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle .pxth-float-label{font-size:14px!important;font-weight:600!important;color:#fff!important;-webkit-text-fill-color:#fff!important;white-space:nowrap!important}
.pxth-floating-contact.pxth-float-style-compact.is-collapsed .pxth-contact-panel{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(8px) scale(.96)!important}
.pxth-floating-contact.pxth-float-style-compact:not(.is-collapsed) .pxth-contact-panel{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0) scale(1)!important}

@media(max-width:768px){
  .pxth-floating-contact.pxth-float-style-dock,
  .pxth-floating-contact.pxth-float-style-compact{right:max(10px,env(safe-area-inset-right))!important;bottom:max(12px,env(safe-area-inset-bottom))!important}
  html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-btn,
  html body .pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle{width:62px!important;min-width:62px!important;max-width:62px!important;height:62px!important;min-height:62px!important}
  .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel .pxth-float-icon,
  .pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle .pxth-float-icon{width:62px!important;height:62px!important;min-width:62px!important;min-height:62px!important}
  .pxth-floating-contact.pxth-float-style-dock .pxth-phone .pxth-float-icon,
  .pxth-floating-contact.pxth-float-style-dock .pxth-email .pxth-float-icon{background-size:28px 28px!important}
  .pxth-floating-contact.pxth-float-style-dock .pxth-line .pxth-float-icon,
  .pxth-floating-contact.pxth-float-style-dock .pxth-line-oa .pxth-float-icon,
  .pxth-floating-contact.pxth-float-style-dock .pxth-whatsapp .pxth-float-icon,
  .pxth-floating-contact.pxth-float-style-dock .pxth-messenger .pxth-float-icon{background-size:30px 30px!important}
  .pxth-floating-contact.pxth-float-style-dock .pxth-contact-toggle .pxth-float-icon{background-size:36px 36px!important}

  .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel{width:74px!important;padding:12px 9px!important}
  html body .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-btn{width:46px!important;min-width:46px!important;max-width:46px!important;height:46px!important;min-height:46px!important}
  .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel .pxth-float-icon{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important}
  html body .pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle{height:46px!important;min-height:46px!important;min-width:128px!important;grid-template-columns:30px auto!important;padding:8px 13px 8px 8px!important}
  .pxth-floating-contact.pxth-float-style-compact .pxth-contact-toggle .pxth-float-icon{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important}
}
@media(prefers-reduced-motion:reduce){
  .pxth-floating-contact.pxth-float-style-dock .pxth-contact-panel,
  .pxth-floating-contact.pxth-float-style-compact .pxth-contact-panel,
  .pxth-floating-contact.pxth-float-style-dock .pxth-float-btn,
  .pxth-floating-contact.pxth-float-style-compact .pxth-float-btn{transition:none!important}
}
