/* =========================================================
   BP Floating Contact Button – NON-PROPERTY PAGES (FINAL)
   Desktop: white pill, orange envelope + text, hover anthracite
   Mobile : GREEN WhatsApp circle, WHITE WhatsApp icon (NO TEXT)
   ========================================================= */

:root{
  --bp-orange: #E38B0D;
  --bp-anth:   #394041;
  --bp-shadow: 0 10px 24px rgba(0,0,0,.18);
  --wa-green:  #25D366;
}

/* Base button */
.bp-float-contact{
  position: fixed;
  right: 18px;
  bottom: calc(90px + env(safe-area-inset-bottom));
  z-index: 999999;

  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 12px 16px;
  border-radius: 999px;

  background: #ffffff;
  color: var(--bp-orange);
  text-decoration: none;

  box-shadow: var(--bp-shadow);

  /* visible by default, JS may hide */
  opacity: 1;
  transform: none;
  pointer-events: auto;

  transition: color .15s ease, opacity .2s ease, transform .2s ease, background-color .15s ease;
}

/* hide state (JS controlled) */
.bp-float-contact.is-hidden{
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}

/* Hover / focus: anthracite */
.bp-float-contact:hover,
.bp-float-contact:focus,
.bp-float-contact:focus-visible{
  color: var(--bp-anth);
  text-decoration: none;
}

/* Text */
.bp-float-contact__text{
  font-weight: 700;
  letter-spacing: .2px;
  line-height: 1;
}

/* Desktop: show only Request */
.bp-float-contact .bp-text-desktop{ display: inline !important; }
.bp-float-contact .bp-text-mobile{ display: none !important; }

/* Icon – Desktop (Envelope) */
.bp-float-contact__icon{
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;

  font-size: 0;
  color: transparent;

  /* Desktop: ORANGE envelope */
  background-color: var(--bp-orange);
  -webkit-mask: url("/wp-content/uploads/icon/envelope.svg") no-repeat center / 30px 30px;
  mask: url("/wp-content/uploads/icon/envelope.svg") no-repeat center / 30px 30px;

  transition: background-color .15s ease;
}

/* Desktop hover: envelope anthracite */
.bp-float-contact:hover .bp-float-contact__icon,
.bp-float-contact:focus .bp-float-contact__icon,
.bp-float-contact:focus-visible .bp-float-contact__icon{
  background-color: var(--bp-anth);
}

/* =========================================================
   Mobile: WhatsApp – GREEN background, WHITE icon (NO TEXT)
   ========================================================= */

@media (max-width: 768px){

  /* No text on mobile */
  .bp-float-contact .bp-float-contact__text{
    display: none !important;
  }

  /* Round WhatsApp button */
  .bp-float-contact{
    padding: 12px;
    background: var(--wa-green);
    color: #ffffff;
    box-shadow: var(--bp-shadow);
  }

  /* Large WHITE WhatsApp icon */
  .bp-float-contact__icon{
    width: 52px;
    height: 52px;

    background-color: #ffffff; /* WHITE icon */
    -webkit-mask: url("/wp-content/uploads/icon/whatsapp.svg") no-repeat center / 46px 46px;
    mask: url("/wp-content/uploads/icon/whatsapp.svg") no-repeat center / 46px 46px;
  }

  /* Keep stable on touch devices */
  .bp-float-contact:hover,
  .bp-float-contact:focus,
  .bp-float-contact:focus-visible{
    background: var(--wa-green);
    color: #ffffff;
  }

  .bp-float-contact:hover .bp-float-contact__icon,
  .bp-float-contact:focus .bp-float-contact__icon,
  .bp-float-contact:focus-visible .bp-float-contact__icon{
    background-color: #ffffff;
  }
}