/* Floating WhatsApp bubble — same markup/styles as firstaidmadeeasy.com.pk.
   Rendered by partials/wa-float.php when Settings → Website → Footer →
   "WhatsApp Number" is set. */
.fame-wa-float {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 10000;
    width: 60px;
    height: 60px;
    text-decoration: none;
}
.fame-wa-float .bubble {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #25D366;
    display: grid;
    place-items: center;
    box-shadow: 0 14px 34px -8px rgba(37, 211, 102, .7);
    transition: transform .25s;
    z-index: 2;
}
.fame-wa-float:hover .bubble { transform: scale(1.06); }
.fame-wa-float .bubble::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #25D366;
    opacity: .5;
    animation: fame-wa-pulse 2s ease-out infinite;
    z-index: -1;
}
.fame-wa-float .bubble svg { width: 32px; height: 32px; fill: #fff; }
.fame-wa-float .label {
    position: absolute;
    top: 50%;
    right: 46px;
    transform: translateY(-50%);
    z-index: 1;
    background: #fff;
    border: 1px solid #e7e9f6;
    border-radius: 999px;
    padding: 9px 26px 9px 20px;
    box-shadow: 0 10px 26px -12px rgba(13, 27, 62, .4);
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: max-width .35s ease, opacity .3s, padding .35s;
}
.fame-wa-float:hover .label { max-width: 260px; opacity: 1; }
.fame-wa-float .label .l1 { font-size: 11px; color: #54608a; font-weight: 600; line-height: 1; display: block; }
.fame-wa-float .label .l2 { font-size: 14px; color: #0d1b3e; font-weight: 800; line-height: 1.3; display: block; }
@keyframes fame-wa-pulse {
    0%   { transform: scale(1);   opacity: .6; }
    100% { transform: scale(1.6); opacity: 0;  }
}
/* Keep clear of the theme's #to-top button (also bottom-right). */
#to-top { bottom: 96px; }