/* Telegram page (#/telegram): connection card, recipients, message log, simulator chat. */
.tg-bot-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tg-bot-ic { width: 46px; height: 46px; border-radius: 50%; background: #229ed9; display: grid; place-items: center; flex: none; }
.tg-bot-ic .icon { stroke: #fff; width: 24px; height: 24px; } .tg-bot-ic.off { background: var(--surface-3); } .tg-bot-ic.off .icon { stroke: var(--text-3); }
.tg-list li { display: flex; align-items: center; gap: 12px; padding: 12px 18px; flex-wrap: wrap; }
.tg-qr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px; align-items: start; }
.tg-qr .qr { width: 220px; height: 220px; image-rendering: pixelated; }
@media (max-width: 640px) { .tg-qr { grid-template-columns: 1fr; justify-items: center; } }
.sim { display: flex; flex-direction: column; height: min(62vh, 560px); }
.sim-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 8px; background: var(--surface-2); }
.sim-msg { max-width: 82%; padding: 9px 12px; border-radius: 14px; font-size: var(--fs-sm); line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; box-shadow: var(--shadow-sm); }
.sim-msg.in { align-self: flex-end; background: var(--primary); color: var(--on-primary); border-bottom-right-radius: 4px; }
.sim-msg.out { align-self: flex-start; background: var(--surface); border: 1px solid var(--border); border-bottom-left-radius: 4px; }
.sim-btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; } .sim-btns .btn { height: 30px; font-size: 12px; }
.sim-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--border); }
.tg-inv { flex: 1 1 280px; justify-content: flex-end; min-width: 0; } .tg-inv-sel { flex: 1 1 200px; min-width: 0; max-width: 320px; }