/* =========================================================
   Shahrukh WhatsApp Popup — scoped styles (shk-wa- prefix)
   ========================================================= */
.shk-wa{
  --shk-wa-fab-bg:#25D366;
  --shk-wa-fab-icon:#ffffff;
  --shk-wa-fab-size:60px;
  --shk-wa-header:#075E54;
  --shk-wa-htext:#ffffff;
  --shk-wa-body:#ECE5DD;
  --shk-wa-bubble:#ffffff;
  --shk-wa-msgtext:#333333;
  --shk-wa-btnbg:#25D366;
  --shk-wa-btntext:#ffffff;
  position:fixed;bottom:24px;z-index:99990;font-family:inherit;box-sizing:border-box;
}
.shk-wa *{box-sizing:border-box;}
.shk-wa--left{left:24px;}
.shk-wa--right{right:24px;}

/* Floating button */
.shk-wa-fab{
  width:var(--shk-wa-fab-size);height:var(--shk-wa-fab-size);border-radius:50%;
  background:var(--shk-wa-fab-bg);color:var(--shk-wa-fab-icon);border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:calc(var(--shk-wa-fab-size) * .5);
  box-shadow:0 6px 20px rgba(0,0,0,.22);transition:transform .2s ease,box-shadow .2s ease;
  position:relative;overflow:hidden;padding:0;
  animation:shk-wa-pulse 2.4s infinite;
}
.shk-wa-fab:hover{transform:scale(1.06);box-shadow:0 10px 28px rgba(0,0,0,.3);}
.shk-wa-fab img{width:100%;height:100%;object-fit:cover;}
.shk-wa-fab svg{width:1em;height:1em;}
.shk-wa-fab-close{display:none;font-size:calc(var(--shk-wa-fab-size) * .55);line-height:1;font-weight:300;}
/* when popup open, FAB shows a close (×) */
.shk-wa.is-open .shk-wa-fab{animation:none;}
.shk-wa.is-open .shk-wa-fab svg,
.shk-wa.is-open .shk-wa-fab img{display:none;}
.shk-wa.is-open .shk-wa-fab-close{display:block;}

@keyframes shk-wa-pulse{
  0%{box-shadow:0 6px 20px rgba(0,0,0,.22),0 0 0 0 rgba(37,211,102,.5);}
  70%{box-shadow:0 6px 20px rgba(0,0,0,.22),0 0 0 14px rgba(37,211,102,0);}
  100%{box-shadow:0 6px 20px rgba(0,0,0,.22),0 0 0 0 rgba(37,211,102,0);}
}

/* Popup card */
.shk-wa-popup{
  position:absolute;bottom:calc(var(--shk-wa-fab-size) + 16px);
  width:300px;max-width:calc(100vw - 48px);
  background:var(--shk-wa-body);border-radius:16px;overflow:hidden;
  box-shadow:0 12px 40px rgba(0,0,0,.25);
  opacity:0;visibility:hidden;transform:translateY(12px) scale(.96);transform-origin:bottom left;
  transition:opacity .25s ease,transform .25s ease,visibility .25s;
}
.shk-wa--left .shk-wa-popup{left:0;transform-origin:bottom left;}
.shk-wa--right .shk-wa-popup{right:0;transform-origin:bottom right;}
.shk-wa.is-open .shk-wa-popup{opacity:1;visibility:visible;transform:translateY(0) scale(1);}

/* header */
.shk-wa-head{display:flex;align-items:center;gap:11px;padding:14px 14px;background:var(--shk-wa-header);color:var(--shk-wa-htext);}
.shk-wa-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:0 0 42px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;}
.shk-wa-avatar--icon{font-size:24px;color:#fff;}
.shk-wa-avatar--icon svg{width:1em;height:1em;}
.shk-wa-head-txt{display:flex;flex-direction:column;flex:1;min-width:0;}
.shk-wa-title{font-size:15px;font-weight:700;line-height:1.2;}
.shk-wa-sub{font-size:12px;opacity:.85;line-height:1.3;margin-top:2px;}
.shk-wa-close{background:none;border:0;color:var(--shk-wa-htext);font-size:22px;line-height:1;cursor:pointer;opacity:.8;padding:0 2px;}
.shk-wa-close:hover{opacity:1;}

/* body */
.shk-wa-bodywrap{padding:18px 14px;background:var(--shk-wa-body);}
.shk-wa-bubble{
  background:var(--shk-wa-bubble);color:var(--shk-wa-msgtext);font-size:14px;line-height:1.5;
  padding:11px 13px;border-radius:0 12px 12px 12px;box-shadow:0 1px 2px rgba(0,0,0,.12);
  position:relative;max-width:92%;
}

/* button */
.shk-wa-btn{
  display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--shk-wa-btnbg);color:var(--shk-wa-btntext);
  text-decoration:none;font-size:15px;font-weight:700;padding:14px;
  transition:filter .2s ease;
}
.shk-wa-btn:hover{filter:brightness(1.06);}
.shk-wa-btn svg{width:1.15em;height:1.15em;}

/* Mobile */
@media(max-width:480px){
  .shk-wa{bottom:16px;}
  .shk-wa--left{left:16px;}
  .shk-wa--right{right:16px;}
  .shk-wa-popup{width:calc(100vw - 32px);}
}
@media(prefers-reduced-motion:reduce){
  .shk-wa-fab{animation:none;}
  .shk-wa-popup{transition:opacity .2s ease;}
}
