/* ============================================================
   CALLS — מסך שיחה מלא. משותף לצ'אט ולפאנל.
   ============================================================ */
.call{position:fixed;inset:0;z-index:300;background:#07040d;display:none;
  flex-direction:column;align-items:center;justify-content:center}
.call.on{display:flex}

.call-remote{position:absolute;inset:0;display:grid;place-items:center;background:#07040d}
.call-remote video{width:100%;height:100%;object-fit:contain;background:#07040d;
  opacity:0;transition:none}
/* ⚠️ הווידאו המרוחק מוסתר עד שיש חיבור — אחרת רואים מלבן שחור
   ריק במקום מסך "מצלצל" ונראה כאילו השיחה נתקעה. */
.call.live .call-remote video{opacity:1}
.call.live .call-wait{display:none}

.call-wait{position:relative;z-index:2;display:grid;justify-items:center;gap:10px;
  color:#f2ecf6;text-align:center;padding:20px}
.call-av{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;
  font-size:40px;background:linear-gradient(135deg,#2a1038,#150c22);
  border:2px solid rgba(232,199,102,.5);color:#e8c766}
.call-wait b{font-size:22px}
.call-wait span{color:#9a8bb0;font-size:14px}

#c-local{position:absolute;inset-inline-end:16px;top:16px;width:132px;
  border-radius:12px;background:#150f24;z-index:3;object-fit:cover;
  border:1px solid rgba(255,255,255,.14)}

.call-bar{position:absolute;bottom:34px;left:0;right:0;z-index:4;
  display:flex;gap:16px;justify-content:center}
.call-btn{width:60px;height:60px;border-radius:50%;border:0;font-size:23px;
  background:#241a3c;color:#f2ecf6;cursor:pointer;transition:.15s;
  display:grid;place-items:center}
.call-btn:hover{transform:translateY(-2px)}
.call-btn.off{background:#4a3f6b;opacity:.75}
.call-btn.end{background:#c02c4e}
.call-btn.ok{background:#1e9e5a}

.call-dur{position:absolute;top:18px;inset-inline-start:18px;z-index:4;
  color:#fff;background:rgba(0,0,0,.45);padding:5px 12px;border-radius:999px;
  font-size:13px;font-variant-numeric:tabular-nums}

.call-actions{display:inline-flex;gap:6px}

@media(max-width:520px){
  #c-local{width:96px}
  .call-btn{width:54px;height:54px;font-size:20px}
  .call-bar{bottom:24px;gap:12px}
}
