/* RawStore v6.3 — Live Customer Activity responsive UI */
#lcap-popup{
  --lcap-width:420px;
  position:fixed;
  z-index:999999;
  width:min(var(--lcap-width),calc(100vw - 32px));
  max-width:calc(100vw - 32px);
  background:#fff;
  color:#111827;
  border:1px solid rgba(15,23,42,.10);
  border-radius:16px;
  box-shadow:0 16px 44px rgba(15,23,42,.20);
  overflow:hidden;
  font-family:inherit;
  font-size:14px;
  text-align:left;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(0,18px,0);
  transition:opacity .28s ease,transform .28s ease,visibility .28s ease;
  contain:layout paint style;
}
#lcap-popup.lcap-show{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(0,0,0)}
.lcap-bottom-left{left:20px;bottom:20px}.lcap-bottom-right{right:20px;bottom:20px}
.lcap-top-left{left:20px;top:20px}.lcap-top-right{right:20px;top:20px}
.lcap-center-left{left:20px;top:50%;transform:translate3d(0,-50%,0)}
.lcap-center-right{right:20px;top:50%;transform:translate3d(0,-50%,0)}
.lcap-center-left.lcap-show,.lcap-center-right.lcap-show{transform:translate3d(0,-50%,0)}
.lcap-inner{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:13px 38px 13px 13px;min-height:98px}
.lcap-image{display:block;width:72px;height:72px;max-width:none;object-fit:cover;object-position:center;flex:none;background:#f1f5f9;border:0;margin:0}
.lcap-image.rounded{border-radius:12px}.lcap-image.circle{border-radius:50%}.lcap-image.square{border-radius:0}
.lcap-content{min-width:0;max-width:100%;line-height:1.3}
.lcap-name,.lcap-product{display:block;max-width:100%;white-space:normal;overflow-wrap:anywhere;word-break:normal}
.lcap-name{margin:0 0 2px;font-size:14px;font-weight:800;line-height:1.3;color:#111827}
.lcap-area,.lcap-time{font-size:11px;line-height:1.35;color:#64748b}
.lcap-area:empty{display:none}
.lcap-product{margin:3px 0 2px;font-size:13px;font-weight:700;line-height:1.35;color:#0f172a;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.lcap-action{display:inline;font-size:11px;color:#475569}.lcap-time{display:inline;margin-left:5px}
.lcap-sold{display:none!important}
.lcap-close{position:absolute;z-index:2;right:8px;top:8px;display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:#f1f5f9;color:#475569;font:700 20px/1 Arial,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent}
.lcap-close:hover{background:#e2e8f0;color:#0f172a}.lcap-close:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.lcap-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#e11d48;transform-origin:left center}
.lcap-zoom{transform:scale(.94)}.lcap-scale{transform:scale(.96)}.lcap-flip{transform:perspective(600px) rotateX(-8deg)}
.lcap-bounce.lcap-show{animation:lcapBounce .4s ease-out}@keyframes lcapBounce{0%{transform:scale(.92)}70%{transform:scale(1.015)}100%{transform:scale(1)}}
#lcap-popup img{display:block}

/* Mobile: keep popup above RawStore fixed bottom navigation */
@media(max-width:767px){
  #lcap-popup{
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(76px + env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    max-width:none!important;
    border-radius:14px;
    box-shadow:0 12px 34px rgba(15,23,42,.22);
  }
  .lcap-inner{grid-template-columns:58px minmax(0,1fr);gap:10px;min-height:82px;padding:11px 36px 11px 11px}
  .lcap-image{width:58px;height:58px;border-radius:10px}
  .lcap-name{font-size:13px}.lcap-product{font-size:12.5px;margin-top:2px}.lcap-area,.lcap-time,.lcap-action{font-size:10.5px}
  .lcap-close{right:6px;top:6px;width:27px;height:27px}
}
@media(max-width:359px){
  #lcap-popup{left:8px!important;right:8px!important}
  .lcap-inner{grid-template-columns:52px minmax(0,1fr);padding-left:9px;gap:8px}
  .lcap-image{width:52px;height:52px}
}
@media(min-width:768px) and (max-width:1024px){#lcap-popup{max-width:calc(100vw - 40px)}}
@media(prefers-reduced-motion:reduce){#lcap-popup,#lcap-popup *{animation:none!important;transition:none!important}}
