/* LOCA Realtime Header styles (v1.5.7) */
.loca-rth-header {
  position: fixed;
  inset: auto auto auto auto;
  transform: translateX(0);
  width: min(var(--loca-rth-max, 600px), calc(100vw - 20px));
  z-index: 999999;
  pointer-events: none;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  opacity: 1;
  transition: opacity .25s ease;
}
.loca-rth-header.is-hidden{ opacity:0; pointer-events:none; }
.loca-rth-left, .loca-rth-right { pointer-events: auto; }
.loca-rth-right { display:flex; align-items:center; gap:8px; }

.loca-rth-pill {
  display:flex; align-items:center; gap:10px;
  background: rgba(20,20,20,.72);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border:1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding:6px 6px;
  color:#fff; font-weight:600; line-height:1.15;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.loca-rth-pill-left { gap:10px; }
.loca-rth-meta { display:flex; flex-direction:column; gap:2px; }
.loca-rth-meta .brand{ font-weight:800; letter-spacing:.2px; opacity:.98; font-size: 13px; }

.loca-rth-pill .avatar { width: var(--loca-rth-avatar, 32px); height: var(--loca-rth-avatar, 32px);
  border-radius:999px; overflow:hidden; flex: 0 0 var(--loca-rth-avatar, 32px);
  box-shadow: 0 0 0 2px rgba(255,255,255,.12) inset; }
.loca-rth-pill .avatar img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:999px; }

.loca-rth-love { display:flex; align-items:center; gap:6px; font-weight:400; font-size: 12px; opacity:.95; color:#fff; }
.loca-rth-love .icon { font-size: 11px; opacity:.9; transform: translateY(-.5px); }
.loca-rth-love .num  { min-width: 0; font-size:12px; font-weight:400; text-align:left; color:#fff; }

.loca-rth-stat { display:flex; align-items:center; gap:2px; font-weight:400; }
.loca-rth-stat .icon { display:inline-flex; align-items:center; color:#fff; }
.loca-rth-stat .num  { min-width: 0; font-size:12px; font-weight:400; color:#fff; }
.loca-rth-pill .dot { width:6px; height:6px; border-radius:999px; background:#3ddc84; margin-left:0; }

/* Order pill */
.loca-rth-orderpill {
  display:flex; align-items:center; gap:6px;
  background: rgba(255,140,0,.6);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border:1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding:6px 8px;
  color:#fff; line-height:1.15;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
  font-size:12px; font-weight:400;
  width: var(--loca-order-w, 160px);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  opacity: 0; transform: translateY(-6px);
  transition: opacity .25s ease, transform .25s ease;
}
.loca-rth-orderpill.is-show{ opacity:1; transform: translateY(0); }
.loca-rth-orderpill .icon{ font-size: inherit; line-height:1; display:inline-flex; align-items:center; }
.loca-rth-orderpill .fallback-bag{ width:1em; height:1em; display:inline-block; vertical-align:middle; fill: currentColor; }
.loca-rth-orderpill .text{ overflow:hidden; text-overflow:ellipsis; }
.loca-rth-orderpill .trk{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; will-change: transform; }
.loca-rth-orderpill .icon [data-fa]{ display:none; }
.loca-rth-orderpill.has-fa .icon [data-fa]{ display:inline-block; }
.loca-rth-orderpill.has-fa .fallback-bag{ display:none; }

/* Heart button */
.loca-heart-btn{
  position: fixed; right:16px; bottom:84px;
  width: 48px; height: 48px; border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(20,20,20,.8); color:#fff; border:1px solid rgba(255,255,255,.2);
  box-shadow: 0 8px 24px rgba(0,0,0,.2); cursor:pointer;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); z-index: 999999;
}
.loca-heart-btn .glyph{ font-size:20px; line-height:1; transform:translateY(-1px); }
.loca-heart-btn:active{ transform: scale(.98); }
@media (hover:hover){ .loca-heart-btn:hover{ box-shadow: 0 12px 36px rgba(0,0,0,.28); } }