/********************************************
 * FLOATING BUTTON – BRANDING UAA
 ********************************************/
#ppmp-floating-btn {
    position: fixed;
    bottom: 22px;
    right: 22px;
    background: #007A80; /* warna utama UAA */
    color: #fff;
    padding: 13px 22px;
    border-radius: 40px;
    font-size: 15px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    box-shadow: 0 6px 22px rgba(0,0,0,0.25);
    z-index: 999999;
    transition: .25s ease;
}
#ppmp-floating-btn:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 28px rgba(0,0,0,0.30);
}
#ppmp-floating-btn .icon {
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml;utf8,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2C6.48 2 2 6.04 2 11c0 2.22.93 4.26 2.48 5.82L2 22l5.35-2.17C8.52 20.6 10.2 21 12 21c5.52 0 10-4.04 10-9s-4.48-10-10-10zm0 16c-1.48 0-2.85-.4-4.03-1.1l-.29-.17-3.17 1.28 1.21-3.33-.18-.29C4.69 13.52 4 12.31 4 11c0-3.86 3.58-7 8-7s8 3.14 8 7-3.58 7-8 7z'/></svg>");
    background-size: cover;
}


/********************************************
 * POPUP UAA STYLE – MINI CARD
 ********************************************/
#ppmp-mini-popup {
    position: fixed;
    bottom: 90px; /* tepat di atas tombol chat */
    right: 22px;

    width: 320px;
    background: #ffffff;
    padding: 18px 20px 20px 18px;

    border-radius: 18px;

    box-shadow: 0 10px 25px rgba(0,0,0,0.20);
    opacity: 0;
    transform: translateY(20px);
    transition: all .35s ease;

    z-index: 999998;
}

/* Accent bar kiri khas UAA */
#ppmp-mini-popup::before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:6px;
    background:#007A80; /* aksen hijau UAA */
    border-radius:18px 0 0 18px;
}

#ppmp-mini-popup.ppmp-visible {
    opacity: 1;
    transform: translateY(0);
}

/********************************************
 * HEADER POPUP
 ********************************************/
#ppmp-popup-header {
    display: flex;
    align-items: center;
    gap: 12px;
}

#ppmp-popup-header img {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    object-fit: cover;
    box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}

#ppmp-mini-title {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    color: #003C3F; /* hijau gelap UAA */
}

#ppmp-mini-sub {
    font-size: 13px;
    color: #4c5a5a;
    margin-top: 4px;
}

/********************************************
 * CLOSE BUTTON
 ********************************************/
#ppmp-mini-popup-close {
    position: absolute;
    right: 12px;
    top: 10px;
    background: transparent;
    border: none;
    font-size: 20px;
    color: #888;
    cursor: pointer;
}


/********************************************
 * CTA BUTTONS
 ********************************************/
#ppmp-mini-actions {
    display: flex;
    gap: 10px;
    margin-top: 16px;
}

.ppmp-mini-btn {
    flex: 1;
    padding: 11px 0;
    border-radius: 40px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
}

/* Main CTA */
#ppmp-mini-wa {
    background: #007A80;
    color: white;
}

/* Secondary CTA */
#ppmp-mini-daftar {
    background: transparent;
    border: 2px solid #007A80;
    color: #007A80;
}


#ppmp-mini-popup {
  position: fixed;
  right: 22px;
  bottom: 90px; /* above button */
  width: 320px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.18);
  padding: 14px;
  z-index: 99998;
  transform: translateY(12px);
  opacity: 0;
  transition: all .32s ease;
  pointer-events: auto;
}
#ppmp-mini-popup.ppmp-visible { transform: translateY(0); opacity: 1; }
#ppmp-popup-header { display:flex; gap:12px; align-items:center; }
#ppmp-popup-header img { width:56px; height:56px; border-radius:10px; object-fit:cover; }
#ppmp-mini-title { font-weight:800; color:#0b2b2b; font-size:15px; line-height:1.2; margin:0; }
#ppmp-mini-sub { font-size:13px; color:#556; margin-top:4px; }
#ppmp-mini-actions { display:flex; gap:10px; margin-top:12px; }
.ppmp-mini-btn { flex:1; padding:10px 12px; border-radius:28px; text-align:center; font-weight:700; text-decoration:none; display:inline-block; }
#ppmp-mini-wa { background:#007a80; color:#fff; }
#ppmp-mini-daftar { border:2px solid #007a80; color:#007a80; background:transparent; }
#ppmp-mini-popup-close { position:absolute; right:8px; top:8px; background:transparent; border:0; font-size:18px; color:#888; cursor:pointer; }
@media (max-width:720px){
  #ppmp-mini-popup { right: 12px; left: 12px; width:auto; bottom: 86px; }
  #ppmp-floating-btn { right: 16px; bottom: 16px; padding:10px 14px; }
}
