/* ============================================================
   ZYORA — Desktop layer (loads after ios-ui.css)
   Top navigation, round avatars, wider content on large screens.
   ============================================================ */

/* ---------- Round avatars everywhere ---------- */
.avatar, .avatar--sm, .avatar--lg, .avatar--squircle,
.topbar .avatar { border-radius: 50% !important; overflow: hidden; }

/* ---------- Desktop top navigation ---------- */
.topnav { display: none; }

@media (min-width: 900px) {
  .topnav {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: var(--sp-6);
  }
  .topnav__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 14px;
    border-radius: var(--r-pill);
    color: var(--text-soft);
    font-size: 13.5px;
    font-weight: var(--fw-semibold);
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
  }
  .topnav__link svg { width: 17px; height: 17px; stroke-width: 1.9; }
  .topnav__link:hover { background: var(--surface-2); color: var(--text); }
  .topnav__link.is-active { background: var(--accent); color: var(--on-accent); }

  .topbar { height: 64px; }
  .topbar .avatar { width: 38px !important; height: 38px !important; }
  .topbar .icon-btn { width: 38px !important; height: 38px !important; border-radius: 50% !important; }
  .topbar__balance { min-height: 38px !important; padding: 0 14px !important; font-size: 12.5px !important; }

  .app-main { max-width: 1120px; }
}

/* ---------- Send buttons: always visible in light and dark ---------- */
.send-btn { background: var(--text) !important; color: var(--bg) !important; }
.send-btn svg { stroke: currentColor !important; }