/* ===== Bermúdez DJ — Chat flotante de WhatsApp (widget propio, independiente del theme) ===== */
:root{
  --pt-wa-bg: #050509;
  --pt-wa-panel: #0c0c14;
  --pt-wa-orange: #ff9f1c;
  --pt-wa-orange-2: #ff6a1c;
  --pt-wa-text: #f5f0e8;
  --pt-wa-muted: #9c96a8;
}

.pt-wa{
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 999999;
  font-family: inherit;
  isolation: isolate;
  pointer-events: auto;
  --tilt: 0deg;
}

.pt-wa__fab{
  position: relative;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 32% 28%, #ffc873, var(--pt-wa-orange) 45%, var(--pt-wa-orange-2) 100%);
  color: #1a0f00;
  box-shadow:
    0 10px 24px rgba(255, 106, 28, .45),
    0 2px 0 rgba(255,255,255,.25) inset,
    0 -6px 14px rgba(0,0,0,.25) inset;
  transform-style: preserve-3d;
  transform: perspective(600px) rotateX(0deg) rotateY(0deg) scale(1);
  transition: transform .35s cubic-bezier(.2,.9,.3,1.4), box-shadow .35s ease;
}
.pt-wa__fab:hover{
  transform: perspective(600px) rotateX(-8deg) rotateY(10deg) scale(1.08);
  box-shadow:
    0 16px 34px rgba(255, 106, 28, .55),
    0 2px 0 rgba(255,255,255,.3) inset,
    0 -6px 14px rgba(0,0,0,.25) inset;
}
.pt-wa__fab:active{ transform: perspective(600px) scale(.94); }

.pt-wa__fab-ring{
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid rgba(255,159,28,.55);
  opacity: 0;
  animation: pt-wa-pulse 2.6s ease-out infinite;
}
.pt-wa__fab-ring--2{ animation-delay: 1.3s; }
@keyframes pt-wa-pulse{
  0%{ transform: scale(.85); opacity: .55; }
  100%{ transform: scale(1.55); opacity: 0; }
}

.pt-wa__ico{ width: 28px; height: 28px; position: relative; transition: opacity .2s ease, transform .3s ease; }
.pt-wa__ico--close{ position: absolute; opacity: 0; transform: rotate(-45deg) scale(.6); }
.pt-wa.is-open .pt-wa__ico--chat{ opacity: 0; transform: rotate(45deg) scale(.6); }
.pt-wa.is-open .pt-wa__ico--close{ opacity: 1; transform: rotate(0) scale(1); }

.pt-wa__fab--ping{ animation: pt-wa-attn 1.3s ease-in-out 2; }
@keyframes pt-wa-attn{
  0%,100%{ transform: perspective(600px) scale(1) rotateZ(0); }
  20%{ transform: perspective(600px) scale(1.1) rotateZ(-8deg); }
  40%{ transform: perspective(600px) scale(1.1) rotateZ(8deg); }
  60%{ transform: perspective(600px) scale(1.05) rotateZ(-4deg); }
}

.pt-wa__panel{
  position: absolute;
  right: 0;
  bottom: 80px;
  width: 340px;
  max-width: calc(100vw - 32px);
  max-height: 70vh;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, var(--pt-wa-panel), var(--pt-wa-bg) 70%);
  border: 1px solid rgba(255,159,28,.25);
  border-radius: 20px;
  box-shadow:
    0 30px 60px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,159,28,.06),
    0 0 40px rgba(255,106,28,.12);
  overflow: hidden;
  transform-origin: bottom right;
  transform: perspective(900px) rotateX(-12deg) rotateY(8deg) translateY(16px) scale(.85);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: transform .38s cubic-bezier(.2,.9,.25,1.2), opacity .28s ease, visibility 0s linear .38s;
}
.pt-wa.is-open .pt-wa__panel{
  transform: perspective(900px) rotateX(0) rotateY(0) translateY(0) scale(1);
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transition: transform .38s cubic-bezier(.2,.9,.25,1.2), opacity .28s ease, visibility 0s linear 0s;
}

.pt-wa__header{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  background: linear-gradient(120deg, rgba(255,159,28,.16), rgba(255,106,28,.04));
  border-bottom: 1px solid rgba(255,159,28,.16);
}
.pt-wa__avatar{
  width: 40px; height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex: none;
  background: var(--pt-wa-orange);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 10px rgba(255,106,28,.35);
}
.pt-wa__avatar img{ width: 100%; height: 100%; object-fit: cover; }
.pt-wa__headinfo{ display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pt-wa__headinfo strong{ color: var(--pt-wa-text); font-size: 14.5px; line-height: 1.2; }
.pt-wa__status{ display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--pt-wa-muted); }
.pt-wa__status i{ width: 7px; height: 7px; border-radius: 50%; background: #35d16a; box-shadow: 0 0 8px #35d16a; display: inline-block; }

.pt-wa__body{
  padding: 16px 18px;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pt-wa__bubble{
  background: #16151f;
  border: 1px solid rgba(255,255,255,.06);
  color: var(--pt-wa-text);
  font-size: 13.5px;
  line-height: 1.5;
  padding: 12px 14px;
  border-radius: 4px 16px 16px 16px;
  box-shadow: 0 6px 14px rgba(0,0,0,.35);
}
.pt-wa__quick{ display: flex; flex-wrap: wrap; gap: 8px; }
.pt-wa__chip{
  border: 1px solid rgba(255,159,28,.4);
  background: rgba(255,159,28,.08);
  color: var(--pt-wa-orange);
  font-size: 12.5px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.pt-wa__chip:hover{
  background: var(--pt-wa-orange);
  color: #1a0f00;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(255,159,28,.3);
}

.pt-wa__footer{
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid rgba(255,159,28,.14);
  background: #0a0a10;
}
.pt-wa__input{
  flex: 1;
  resize: none;
  background: #16151f;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  color: var(--pt-wa-text);
  font-size: 13px;
  padding: 10px 12px;
  max-height: 96px;
  font-family: inherit;
}
.pt-wa__input:focus{ outline: none; border-color: rgba(255,159,28,.55); }
.pt-wa__input::placeholder{ color: var(--pt-wa-muted); }

.pt-wa__send{
  flex: none;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  color: #1a0f00;
  background: linear-gradient(145deg, #ffc873, var(--pt-wa-orange));
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 16px rgba(255,106,28,.4);
  transition: transform .2s cubic-bezier(.2,.9,.3,1.4);
}
.pt-wa__send svg{ width: 18px; height: 18px; }
.pt-wa__send:hover{ transform: translateY(-2px) scale(1.06) rotate(-4deg); }
.pt-wa__send:active{ transform: scale(.92); }

@media (max-width: 480px){
  .pt-wa{ right: 14px; bottom: 14px; }
  .pt-wa__panel{ width: calc(100vw - 28px); bottom: 76px; }
  .pt-wa__fab{ width: 58px; height: 58px; }
}

/* Producción: el tema no puede bloquear los controles del chat. */
.pt-wa, .pt-wa *{box-sizing:border-box}
.pt-wa__fab,.pt-wa__panel,.pt-wa__chip,.pt-wa__send,.pt-wa__input{pointer-events:auto!important}

/* El chat no compite visualmente con el menú de pantalla completa. */
html.bdj-menu-open .pt-wa{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* ===== PRODUCCIÓN 3: logo y cierre robustos ===== */
.pt-wa{z-index:2147482500!important}
.pt-wa__header{position:relative}
.pt-wa__avatar{background:#17121b!important;padding:2px!important}
.pt-wa__avatar img{display:none;width:100%!important;height:100%!important;object-fit:cover!important}
.pt-wa__avatar.has-image img{display:block!important}
.pt-wa__avatar span{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:800;font-size:11px;color:#fff}
.pt-wa__avatar.has-image span{display:none}
.pt-wa__panel-close{appearance:none;-webkit-appearance:none;margin-left:auto;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,159,28,.3);border-radius:50%;background:rgba(255,159,28,.08);color:#ffb34e;font-size:24px;line-height:1;cursor:pointer;touch-action:manipulation;pointer-events:auto!important}
.pt-wa__panel-close:hover,.pt-wa__panel-close:focus-visible{background:#ff9f1c;color:#160b00;outline:none}
.pt-wa__fab{-webkit-tap-highlight-color:transparent!important;touch-action:manipulation!important;user-select:none!important}
