/* Variables */
:root{ --pfwf-color:#0ea5e9; }

#pfwf-root { position: relative; z-index: 999998; }

/* wrapper anchors button + popover */
.pfwf-wrapper{ pointer-events:none; }
.pfwf-wrapper *{ box-sizing:border-box; }
.pfwf-wrapper[data-side="left"] .pfwf-popover{ left:0; right:auto; }
.pfwf-wrapper[data-side="right"] .pfwf-popover{ right:0; left:auto; }

/* Floating button */
.pfwf-btn{
  pointer-events:auto;
  width:var(--pfwf-btn-size); height:var(--pfwf-btn-size);
  border-radius:999px; border:none; cursor:pointer;
  background:var(--pfwf-btn-bg);
  box-shadow: var(--pfwf-shadow, 0 6px 24px rgba(0,0,0,.2));
  position:relative;
  background-repeat:no-repeat;background-position:center;background-size:58%;
  transition: background .15s ease, transform .12s ease;
}
.pfwf-btn:hover{ transform:translateY(-1px); background: var(--pfwf-btn-hover, var(--pfwf-btn-bg)); }
.pfwf-dot{
  position:absolute; top:-2px; right:-2px; width:12px; height:12px; border-radius:999px; background:#ff2d2d; border:2px solid white;
}

/* Shadows */
.pfwf-wrapper[data-shadow="none"] .pfwf-card{ box-shadow:none; }
.pfwf-wrapper[data-shadow="sm"]   .pfwf-card{ box-shadow:0 6px 16px rgba(0,0,0,.12); }
.pfwf-wrapper[data-shadow="md"]   .pfwf-card{ box-shadow:0 10px 28px rgba(0,0,0,.18); }
.pfwf-wrapper[data-shadow="lg"]   .pfwf-card{ box-shadow:0 14px 40px rgba(0,0,0,.24); }

/* Popover card above the button */
.pfwf-popover{
  pointer-events:auto;
  position:absolute;
  bottom: calc(var(--pfwf-btn-size) + 12px);
  min-width: 280px;
  width: var(--pfwf-card-w, 380px);
  opacity:0; transform: translateY(8px) scale(.98);
  transition: opacity .18s ease, transform .18s ease;
}
.pfwf-wrapper.pfwf-open .pfwf-popover{ opacity:1; transform: translateY(0) scale(1); }
.pfwf-card{
  background: var(--pfwf-card-bg, #fff);
  border-radius: var(--pfwf-radius, 12px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: var(--pfwf-card-h, 520px);
}
.pfwf-arrow{
  position:absolute; bottom: -8px;
  border: 8px solid transparent;
  border-top-color: var(--pfwf-card-bg, #fff);
  right: 16px;
}
.pfwf-wrapper[data-side="left"] .pfwf-arrow{ left:16px; right:auto; }

/* Header */
.pfwf-head{ display:flex; align-items:center; gap:12px; background:var(--pfwf-header-bg,#075e54); color:#fff; padding:14px 16px; }
.pfwf-photo{ width:40px; height:40px; border-radius:8px; object-fit:cover; }
.pfwf-title{ font-weight:700; }
.pfwf-status{ font-size:.85rem; opacity:.9; }

.pfwf-intro{ padding:12px 16px; background:rgba(255,255,255,.8); color:var(--pfwf-text,#111); }

.pfwf-form{ padding:12px 16px 16px; color:var(--pfwf-text,#111); overflow:auto; }
.pfwf-label{ display:block; font-weight:600; font-size:.9rem; margin:8px 0 6px; }
.pfwf-label input{
  display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid #e5e7eb; border-radius:8px;
  background:#fff; color:#111;
}
/* Stronger specificity + !important to beat themes */
#pfwf-root .pfwf-submit{
  width:100%; margin-top:12px; padding:12px; border:0; border-radius:10px; cursor:pointer;
  background:var(--pfwf-cta-bg,#0ea5e9) !important; color:#fff; font-weight:700;
  transition: background .15s ease;
}
#pfwf-root .pfwf-submit:hover{
  background: var(--pfwf-cta-hover, var(--pfwf-cta-bg,#0ea5e9)) !important;
}
.pfwf-status-text{ margin-top:8px; font-size:.9rem; }