/* Call settings → Phone number (0084): the person's own Twilio account and the number that rings the Primary.
   The same card, field and list language as the voice setup above it (terminal-app.css .call-key-form, .vp-*). */
.call-phone{display:grid;gap:10px;padding-top:16px;border-top:1px solid var(--line)}
.call-phone-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px;align-items:end}
.call-phone-form label{display:grid;gap:6px;min-width:0}
.call-phone-form input{min-width:0;width:100%;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font:inherit}
.call-phone-form .btn{min-height:44px;justify-self:start}
.call-phone-line{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.call-phone-line strong{font-size:1rem;line-height:1.4;overflow-wrap:anywhere}
.call-phone-line small{color:var(--muted);font-size:.85rem;line-height:1.4}
.call-phone-numbers{list-style:none;margin:0;padding:4px;display:grid;gap:2px;max-height:min(40vh,320px);overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:#fff;overscroll-behavior:contain}
.call-phone-number{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 10px;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:start;cursor:pointer}
.call-phone-number:hover,.call-phone-number[aria-pressed="true"]{background:var(--soft)}
.call-phone-number:focus-visible{outline:3px solid #7929c3;outline-offset:2px}
.call-phone-number>svg{margin-inline-start:auto;flex:none;width:18px;height:18px;color:var(--purple)}
.call-phone-number .vp-text small{color:var(--muted)}
/* The ElevenLabs key note above sits inside its form, whose grid put it in the narrow first column on a phone: it spans the row. */
.call-key-form>.call-key-note{grid-column:1/-1}