/* Calls menu, picker and sheets share the same native/web controls. */
html:root.native-mobile body #overlay[data-panel="calls"] #mobile-call-options {top:68px;left:20px;min-width:min(250px,calc(100vw - 40px));padding:8px;border-radius:26px;}
html:root.native-mobile body #overlay[data-panel="calls"] #mobile-call-options button {display:flex;align-items:center;gap:16px;min-height:50px;font-size:17px;}
html:root.native-mobile body #overlay[data-panel="calls"] #mobile-call-options svg {width:21px;height:21px;}
html:root.native-mobile body #overlay[data-panel="calls"] #calls-page-more.is-editing {background:var(--page-ink);color:var(--page-bg);}
html:root.native-mobile body #overlay[data-panel="calls"] [data-call-history-edit] {display:none;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-menu-page {min-height:100%;padding-bottom:24px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-menu-page > header {display:flex;align-items:center;gap:16px;margin-bottom:24px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-menu-page > header h2 {margin:0;font-size:24px;font-weight:650;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-menu-page > header button {display:grid;place-items:center;width:44px;height:44px;border-radius:50%;padding:0;background:var(--page-soft);color:var(--page-ink);}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-new-contact {display:flex;align-items:center;gap:14px;min-height:60px;width:100%;padding:12px 0;color:var(--page-ink);background:transparent;font-size:17px;}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact {display:flex;align-items:center;gap:12px;min-height:72px;border-bottom:1px solid var(--page-line);}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact > span:nth-child(2) {flex:1;min-width:0;display:grid;gap:4px;}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact strong {font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact small {font-size:12px;color:var(--page-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact > div {display:flex;gap:2px;}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact button {display:grid;place-items:center;width:44px;height:44px;padding:0;background:transparent;color:var(--page-ink);}
html:root.native-mobile body #overlay[data-panel="calls"] .new-call-contact button:disabled {opacity:.35;}
html:root.native-mobile body #overlay[data-panel="calls"] .call-avatar {overflow:hidden;flex-shrink:0;}
html:root.native-mobile body #overlay[data-panel="calls"] .call-avatar img {width:100%;height:100%;object-fit:cover;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-primary {display:flex;justify-content:center;align-items:center;gap:10px;min-height:48px;width:100%;padding:12px;border-radius:24px;background:var(--page-ink);color:var(--page-bg);font-size:16px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-inline-error {color:#bd2243;font-size:14px;line-height:1.5;}
html:root.native-mobile body #overlay[data-panel="calls"] #calls-menu-schedule label {display:grid;gap:8px;margin:16px 0;color:var(--page-muted);font-size:14px;}
html:root.native-mobile body #overlay[data-panel="calls"] #calls-menu-schedule :is(input,select,textarea),html:root.native-mobile body #overlay[data-panel="calls"] #calls-menu-number {box-sizing:border-box;width:100%;min-height:48px;padding:12px;border:1px solid var(--page-line);border-radius:12px;background:var(--page-soft);color:var(--page-ink);font-size:16px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-scheduled-card {margin-top:18px;padding:18px;border:1px solid var(--page-line);border-radius:22px;background:var(--page-soft);}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-scheduled-card h3 {margin:0 0 8px;font-size:20px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-scheduled-card :is(p,time) {font-size:14px;color:var(--page-muted);overflow-wrap:anywhere;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-scheduled-card > div {display:flex;flex-wrap:wrap;gap:8px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-scheduled-card button {display:flex;align-items:center;gap:6px;min-height:44px;padding:8px 12px;border-radius:20px;background:var(--page-bg);color:var(--page-ink);}
html:root.native-mobile body #overlay[data-panel="calls"] .danger {color:#e6003d!important;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-backdrop {position:fixed;inset:0;z-index:150;background:#0005;display:flex;align-items:flex-end;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet {width:100%;box-sizing:border-box;padding:20px 16px calc(24px + env(safe-area-inset-bottom));border-radius:30px 30px 0 0;background:var(--page-soft);color:var(--page-ink);}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > header {display:flex;align-items:center;gap:12px;margin:0 0 18px;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet h2 {flex:1;min-width:0;font-size:20px;overflow-wrap:anywhere;margin:0;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > header button {display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--page-line);border-radius:50%;background:var(--page-bg);color:var(--page-ink);}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > div {border-radius:22px;background:var(--page-bg);overflow:hidden;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > div button {display:flex;align-items:center;gap:16px;width:100%;min-height:62px;padding:14px 18px;background:transparent;color:var(--page-ink);font-size:18px;text-align:left;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > div button+button {border-top:1px solid var(--page-line);}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-more-sheet > div svg {width:26px;height:26px;flex-shrink:0;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-history-toolbar {display:flex;gap:8px;flex-wrap:wrap;}
html:root.native-mobile body #overlay[data-panel="calls"] .calls-history-toolbar button {min-height:44px;padding:8px 12px;}
html:root.native-mobile[data-theme="dark"] body #overlay[data-panel="calls"] .calls-inline-error {color:#ff809a;}

html:root.native-mobile.calls-more-open body #overlay[data-panel="calls"] {z-index:151!important;}
