.call-button{cursor:pointer;color:inherit;background:0 0;border:none;border-radius:8px;align-items:center;gap:6px;padding:8px 12px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.call-button:hover:not(:disabled){background:#ffffff1a}.call-button.online{color:#25d366}.call-button.online:hover:not(:disabled){background:#25d3661a}.call-button.offline{color:#999;cursor:not-allowed;opacity:.6}.call-button.in-call{color:#dc3545;cursor:not-allowed}.call-icon{font-size:16px}.call-text{font-size:12px}@media (max-width:640px){.call-button{border-radius:999px;gap:0;padding:10px}.call-icon{font-size:18px}.call-text{display:none}}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0b12208c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.incoming-call-modal{text-align:center;color:#fff;background:linear-gradient(135deg,#0f172af0 0%,#1e293be6 100%);border:1px solid #ffffff24;border-radius:16px;min-width:360px;padding:32px;animation:.3s ease-out slideUp;box-shadow:0 20px 40px #0000004d}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header h2{color:#fff;margin:0 0 24px;font-size:24px;font-weight:600}.caller-info{flex-direction:column;align-items:center;margin-bottom:32px;display:flex}.caller-avatar{margin-bottom:16px}.avatar-placeholder{background:linear-gradient(135deg,#334155e6 0%,#475569d9 100%);border:3px solid #25d3664d;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;font-size:32px;display:flex}.caller-details h3{color:#fff;margin:0 0 8px;font-size:20px;font-weight:600}.call-status{color:#999;margin:0;font-size:14px}.call-animation{width:120px;height:120px;margin:0 auto 32px;position:relative}.pulse-ring{border:3px solid #25d366;border-radius:50%;width:60px;height:60px;animation:1.5s ease-out infinite pulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pulse-ring:nth-child(2){animation-delay:.5s}.pulse-ring:nth-child(3){animation-delay:1s}@keyframes pulse{0%{opacity:1;transform:translate(-50%,-50%)scale(.8)}to{opacity:0;transform:translate(-50%,-50%)scale(1.5)}}.call-controls{justify-content:center;gap:16px;display:flex}.call-controls button{cursor:pointer;border:none;border-radius:12px;flex-direction:column;align-items:center;gap:8px;min-width:100px;padding:16px 24px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.accept-button{color:#fff;background:linear-gradient(135deg,#25d366 0%,#128c7e 100%)}.accept-button:hover{transform:translateY(-2px);box-shadow:0 8px 16px #25d3664d}.reject-button{color:#fff;background:linear-gradient(135deg,#dc3545 0%,#c82333 100%)}.reject-button:hover{transform:translateY(-2px);box-shadow:0 8px 16px #dc35454d}.button-icon{font-size:24px}.button-text{text-transform:uppercase;letter-spacing:.5px;font-size:12px}.active-call{color:#fff;z-index:999;background:#0f172af0;border:1px solid #ffffff1f;border-radius:16px;flex-direction:column;width:320px;min-width:320px;max-height:85vh;padding:0;animation:.3s ease-out slideInRight;display:flex;position:fixed;bottom:20px;right:20px;overflow:hidden;box-shadow:0 10px 30px #00000080}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.active-call.minimized{justify-content:space-between;align-items:center;min-width:200px;padding:12px 16px;display:flex}.minimized-call-info{cursor:pointer;flex:1;align-items:center;gap:8px;display:flex}.minimized-controls{gap:8px;display:flex}.minimized-controls button{color:#fff;cursor:pointer;background:#ffffff1a;border:none;border-radius:6px;padding:6px 8px;font-size:14px}.call-header{justify-content:space-between;align-items:flex-start;margin-bottom:16px;display:flex}.call-info h3{margin:0 0 8px;font-size:18px;font-weight:600;line-height:1.2}.call-meta{align-items:center;gap:12px;display:flex}.call-duration{color:#25d366;font-size:14px;font-weight:500}.call-status{background:#ffffff1a;border-radius:12px;padding:2px 8px;font-size:12px}.call-status.status-connected{color:#25d366;background:#25d36633}.call-status.status-calling,.call-status.status-ringing{color:#ffc107;background:#ffc10733}.minimize-button{color:#999;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px;font-size:16px;transition:all .2s}.minimize-button:hover{color:#fff;background:#ffffff1a}.call-content{flex:1;margin-bottom:20px;overflow:auto}.screen-share-panel{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:16px;display:grid}.screen-share-panel.zoomed{grid-template-columns:1fr}.screen-share-tile{background:#ffffff0f;border:1px solid #ffffff1f;border-radius:12px;flex-direction:column;align-items:center;gap:6px;padding:8px;display:flex}.screen-share-tile video{background:#000;border-radius:8px;width:100%;max-height:240px}.screen-share-tile.zoomed video{object-fit:contain;max-height:70vh}.screen-share-label{color:#bbb;font-size:12px}.audio-visualization{justify-content:space-around;align-items:center;padding:20px 0;display:flex}.audio-level{text-align:center;border-radius:12px;flex-direction:column;align-items:center;gap:8px;min-width:100px;padding:16px;display:flex}.audio-level.active{background:#25d3661a;border:1px solid #25d3664d}.audio-level.inactive{background:#ffffff0d;border:1px solid #ffffff1a}.audio-level.muted{background:#dc35451a;border:1px solid #dc35454d}.audio-icon{font-size:24px}.audio-label{color:#999;font-size:12px}.active-call .call-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.active-call .call-controls button{cursor:pointer;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.mute-button{color:#fff;background:#ffffff1a}.mute-button:hover{background:#fff3}.mute-button.muted{color:#dc3545;background:#dc354533}.end-call-button{color:#fff;background:linear-gradient(135deg,#dc3545 0%,#c82333 100%)}.end-call-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #dc35454d}.screen-share-button{color:#fff;background:#ffffff1a}.screen-share-button:hover:not(:disabled){background:#fff3}.screen-share-button.active{color:#25d366;background:#25d36633}.screen-share-button:disabled{opacity:.5;cursor:not-allowed}.screen-tool-button{color:#fff;background:#ffffff1a;flex:none;min-width:44px;padding:10px 12px}.screen-tool-button:hover:not(:disabled){background:#fff3}.screen-tool-button.active{color:#60a5fa;background:#3b82f633}.screen-tool-button:disabled{opacity:.5;cursor:not-allowed}.active-call .call-controls .icon-only{gap:0;min-width:44px;padding:10px 12px}.screen-share-button{flex:none;min-width:44px;padding:10px 12px}.participant-video{background:#000;border-radius:10px;width:100%;margin-top:10px}.participant-video.zoomed{object-fit:contain;max-height:70vh}.group-grid.zoomed{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}@media (max-width:768px){.incoming-call-modal{min-width:300px;margin:20px;padding:24px}.active-call{min-width:auto;max-width:none;bottom:10px;left:10px;right:10px}.call-controls{flex-direction:column;gap:12px}.call-controls button{width:100%}.audio-visualization{flex-direction:column;gap:16px}}@media (prefers-color-scheme:dark){.incoming-call-modal{background:linear-gradient(135deg,#0f0f0f 0%,#1a1a1a 100%)}.active-call{background:#2b2d31}}.call-button:focus,.call-controls button:focus{outline-offset:2px;outline:2px solid #25d366}.call-button:disabled{opacity:.5;cursor:not-allowed}@media (prefers-contrast:high){.call-button{border:1px solid}.incoming-call-modal,.active-call{border:2px solid #fff}}
