/* "Telefon bağlantısı" window; builds on apps/mobile/src/style.css (copied to dist/mobile/). */
.switch { display:flex; align-items:center; gap:10px; margin:22px 0; font-size:1.1rem; cursor:pointer }
.switch input { width:26px; height:26px; margin:0; flex:none }
.warning { border-left:3px solid var(--danger); background:var(--surface); padding:10px 14px; margin:16px 0 }
.warning p { color:var(--text); margin:4px 0 }
.code { font-family:ui-monospace,Consolas,monospace; font-size:2.6rem; font-weight:750; letter-spacing:.12em; color:var(--text); text-align:center; margin:10px 0; user-select:all }
.countdown { text-align:center; color:var(--text); font-weight:600 }
.hint { text-align:center }
#pair-qr { display:block; margin:14px auto; border-radius:8px; width:260px; height:260px }
#pair-live p { text-align:center }
.device { display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--stroke); border-radius:8px; padding:10px 14px; margin:10px 0 }
.device strong { color:var(--text); display:block; overflow-wrap:anywhere }
.device small { display:block }
.device button { flex:none; margin:0 }
footer { margin-top:34px }
button.link { background:none; color:var(--accent); min-height:0; padding:0; margin:0; font-weight:600; text-decoration:underline }
.status-row { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 12px; border-bottom:1px solid var(--stroke); padding:10px 0 }
.status-row strong { color:var(--text); overflow-wrap:anywhere }
.status-row strong::before { content:''; display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:8px; background:var(--stroke) }
.status-row strong[data-state=connected]::before { background:var(--accent) }
.status-row strong[data-state=failed]::before { background:var(--danger) }
.status-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:12px 0 }
.status-actions button { margin:0; min-height:44px }
.security { font-family:ui-monospace,Consolas,monospace; color:var(--text); overflow-wrap:anywhere }
footer { display:flex; flex-wrap:wrap; gap:8px 20px }
footer button.link { min-height:44px }
#pair-republish { display:block; min-height:44px; margin:0 auto; padding:0 12px }